Tweak unmute user UX

web/static/js/BareRTC.js

@@ -333,6 +333,11 @@ const app = Vue.createApp({
             this.dial();
         },
 
+        // Normalize a DM channel name into a username (remove the @ prefix)
+        normalizeUsername(channel) {
+            return channel.replace(/^@+/, '');
+        },
+
         /**
          * Chat API Methods (WebSocket packets sent/received)
          */
@@ -417,6 +422,7 @@ const app = Vue.createApp({
 
         // Mute or unmute a user.
         muteUser(username) {
+            username = this.normalizeUsername(username);
             let mute = this.muted[username] == undefined;
             if (mute) {
                 this.muted[username] = true;
@@ -442,7 +448,7 @@ const app = Vue.createApp({
             }));
         },
         isMutedUser(username) {
-            return this.muted[username] != undefined;
+            return this.muted[this.normalizeUsername(username)] != undefined;
         },
 
         // Send a video request to access a user's camera.

web/templates/chat.html

@@ -853,6 +853,14 @@
 
                     </div>
 
+                    <!-- If this is a DM with a muted user, offer to unmute. -->
+                    <div v-if="isDM && isMutedUser(channel)" class="has-text-danger">
+                        <i class="fa fa-comment-slash"></i>
+                        <strong>[[channel]]</strong> is currently <strong>muted</strong> so you have not been seeing their recent
+                        chat messages or DMs.
+                        <a href="#" v-on:click.prevent="muteUser(channel)">Unmute them?</a>
+                    </div>
+
                 </div>
             </div>
         </div>