make notification clickable to open chat

src/View/chatPage.tsx

@@ -40,7 +40,7 @@ export function ChatPage(chatViewModel: ChatViewModel) {
             const value = chatViewModel.notificationViewModel.marquee.value;
             if (value == undefined) return <span></span>;
             return (
-                <span>
+                <span on:click={chatViewModel.notificationViewModel.openNotification}>
                     <b>{value.sender}</b>
                     <span class="secondary">{value.chat}: </span>
                     <span>{value.body}</span>

src/ViewModel/Chat/chatListViewModel.ts

@@ -9,7 +9,6 @@ import SettingsViewModel from "../Global/settingsViewModel";
 import StorageModel from "../../Model/Global/storageModel";
 import ConnectionViewModel from "../Global/connectionViewModel";
 import NotificationViewModel from "../Global/notificationViewModel";
-import NotificationModel from "../../Model/Global/notificationModel";
 
 export default class ChatListViewModel {
     storageModel: StorageModel;
@@ -82,6 +81,7 @@ export default class ChatListViewModel {
     // view
     openChat = (chatViewModel: ChatViewModel): void => {
         this.selectedChat.value = chatViewModel;
+        this.notificationViewModel.skipLoop();
     };
 
     closeChat = (): void => {

src/ViewModel/Global/notificationViewModel.ts

@@ -17,13 +17,27 @@ export default class NotificationViewModel {
         const notification = NotificationViewModel.createNotification(message);
         if (this.seenMessageIds.has(message.id)) return;
 
-        const currentChat = this.chatListViewModel.selectedChat.value.chatModel.info.primaryChannel;
+        const currentChat =
+            this.chatListViewModel.selectedChat.value.chatModel.info
+                .primaryChannel;
         if (notification.chat == currentChat) return;
 
         this.messagesInMarquee.push(notification);
         this.startLoop();
     };
 
+    openNotification = () => {
+        const notification = this.marquee.value;
+        if (notification == undefined) return;
+
+        const chat = [
+            ...this.chatListViewModel.chatViewModels.value.values(),
+        ].find(
+            (chat) => chat.chatModel.info.primaryChannel == notification.chat,
+        );
+        chat.open();
+    };
+
     // loop
     loop = () => {
         if (this.messagesInMarquee.length == 0) {
@@ -50,6 +64,11 @@ export default class NotificationViewModel {
         this.interval = undefined;
     };
 
+    skipLoop = () => {
+        this.stopLoop();
+        this.startLoop();
+    }
+
     // init
     constructor(chatListViewModel: ChatListViewModel) {
         this.chatListViewModel = chatListViewModel;