feat(VcNarrator): add `{{DISPLAY_NAME}}` as placeholder (#1642)

Co-authored-by: V <vendicated@riseup.net>

1 files changed, 11 insertions, 8 deletions

diff --git a/src/plugins/vcNarrator/index.tsx b/src/plugins/vcNarrator/index.tsx
index 4447e08..39dabfc 100644
--- a/src/plugins/vcNarrator/index.tsx
+++ b/src/plugins/vcNarrator/index.tsx
@@ -70,10 +70,11 @@ function clean(str: string) {
         .trim();
 }
 
-function formatText(str: string, user: string, channel: string) {
+function formatText(str: string, user: string, channel: string, displayName: string) {
     return str
         .replaceAll("{{USER}}", clean(user) || (user ? "Someone" : ""))
-        .replaceAll("{{CHANNEL}}", clean(channel) || "channel");
+        .replaceAll("{{CHANNEL}}", clean(channel) || "channel")
+        .replaceAll("{{DISPLAY_NAME}}", clean(displayName) || (displayName ? "Someone" : ""));
 }
 
 /*
@@ -143,8 +144,9 @@ function updateStatuses(type: string, { deaf, mute, selfDeaf, selfMute, userId,
 
 function playSample(tempSettings: any, type: string) {
     const settings = Object.assign({}, Settings.plugins.VcNarrator, tempSettings);
+    const currentUser = UserStore.getCurrentUser();
 
-    speak(formatText(settings[type + "Message"], UserStore.getCurrentUser().username, "general"), settings);
+    speak(formatText(settings[type + "Message"], currentUser.username, "general", (currentUser as any).globalName ?? currentUser.username), settings);
 }
 
 export default definePlugin({
@@ -172,9 +174,10 @@ export default definePlugin({
 
                 const template = Settings.plugins.VcNarrator[type + "Message"];
                 const user = isMe && !Settings.plugins.VcNarrator.sayOwnName ? "" : UserStore.getUser(userId).username;
+                const displayName = user && ((UserStore.getUser(userId) as any).globalName ?? user);
                 const channel = ChannelStore.getChannel(id).name;
 
-                speak(formatText(template, user, channel));
+                speak(formatText(template, user, channel, displayName));
 
                 // updateStatuses(type, state, isMe);
             }
@@ -186,7 +189,7 @@ export default definePlugin({
             if (!s) return;
 
             const event = s.mute || s.selfMute ? "unmute" : "mute";
-            speak(formatText(Settings.plugins.VcNarrator[event + "Message"], "", ChannelStore.getChannel(chanId).name));
+            speak(formatText(Settings.plugins.VcNarrator[event + "Message"], "", ChannelStore.getChannel(chanId).name, ""));
         },
 
         AUDIO_TOGGLE_SELF_DEAF() {
@@ -195,7 +198,7 @@ export default definePlugin({
             if (!s) return;
 
             const event = s.deaf || s.selfDeaf ? "undeafen" : "deafen";
-            speak(formatText(Settings.plugins.VcNarrator[event + "Message"], "", ChannelStore.getChannel(chanId).name));
+            speak(formatText(Settings.plugins.VcNarrator[event + "Message"], "", ChannelStore.getChannel(chanId).name, ""));
         }
     },
 
@@ -312,8 +315,8 @@ export default definePlugin({
                     You can customise the spoken messages below. You can disable specific messages by setting them to nothing
                 </Forms.FormText>
                 <Forms.FormText>
-                    The special placeholders <code>{"{{USER}}"}</code> and <code>{"{{CHANNEL}}"}</code>{" "}
-                    will be replaced with the user's name (nothing if it's yourself) and the channel's name respectively
+                    The special placeholders <code>{"{{USER}}"}</code>, <code>{"{{DISPLAY_NAME}}"}</code> and <code>{"{{CHANNEL}}"}</code>{" "}
+                    will be replaced with the user's name (nothing if it's yourself), the user's display name and the channel's name respectively
                 </Forms.FormText>
                 {hasEnglishVoices && (
                     <>