link chat unread status to message page being open

src/View/Components/chatViewToggleButton.tsx

@@ -21,5 +21,12 @@ export function ChatViewToggleButton(
         () => chatViewModel.selectedPage.value == page,
     );
 
-    return RibbonButton(label, icon, isSelected, select);
+    const isHighlighted = new React.State(false);
+    if (page == ChatPageType.Messages) {
+        chatViewModel.hasUnreadMessages.subscribe(
+            (hasUnreadMessages) => (isHighlighted.value = hasUnreadMessages),
+        );
+    }
+
+    return RibbonButton(label, icon, isSelected, select, isHighlighted);
 }

src/View/Components/ribbonButton.tsx

@@ -9,12 +9,14 @@ export function RibbonButton(
     icon: string,
     isSelected: React.State<boolean>,
     select: () => void,
+    isHighlighted: React.State<boolean> = new React.State(false),
 ) {
     return (
         <button
             class="ribbon-button"
             aria-label={label}
             toggle:selected={isSelected}
+            toggle:highlight={isHighlighted}
             on:click={select}
         >
             <span class="icon">{icon}</span>