Add moderator icon to join messagegek/activity-pub-1

1 files changed, 12 insertions, 2 deletions

diff --git a/webroot/js/components/chat/message.js b/webroot/js/components/chat/message.js
index 691173d26..6018df119 100644
--- a/webroot/js/components/chat/message.js
+++ b/webroot/js/components/chat/message.js
@@ -102,8 +102,18 @@ export default function Message(props) {
     return html`<${SystemMessage} contents=${contents} />`;
   } else if (type === SOCKET_MESSAGE_TYPES.USER_JOINED) {
     const { displayName } = user;
-    const contents = html`<span class="font-bold">${displayName}</span> joined
-      the chat.`;
+    const isAuthorModerator = checkIsModerator(message);
+    const messageAuthorFlair = isAuthorModerator
+      ? html`<img
+          title="Moderator"
+          class="inline-block mr-1 w-3 h-3"
+          src="/img/moderator-nobackground.svg"
+        />`
+      : null;
+    const contents = html`<div>
+      <span class="font-bold">${messageAuthorFlair}${displayName}</span>
+      ${' '}joined the chat.
+    </div>`;
     return html`<${SystemMessage} contents=${contents} />`;
   } else if (type === SOCKET_MESSAGE_TYPES.CHAT_ACTION) {
     const contents = html`<span