Add mark all read

src/app/components/ChatMenuMobile.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  import Icon from "@lib/components/Icon.svelte"
+  import Button from "@lib/components/Button.svelte"
+  import ChatStart from "@app/components/ChatStart.svelte"
+  import {setChecked} from "@app/notifications"
+  import {pushModal} from "@app/modal"
+
+  const startChat = () => pushModal(ChatStart, {}, {replaceState: true})
+
+  const markAsRead = () => {
+    setChecked("/chat/*")
+    history.back()
+  }
+</script>
+
+<div class="col-2">
+  <Button class="btn btn-primary" on:click={startChat}>
+    <Icon size={4} icon="add-circle" />
+    Start chat
+  </Button>
+  <Button class="btn btn-neutral" on:click={markAsRead}>
+    <Icon size={4} icon="check-circle" />
+    Mark all read
+  </Button>
+</div>

src/app/notifications.ts

@@ -36,7 +36,10 @@ export const notifications = derived(
       }
 
       for (const [entryPath, ts] of Object.entries($checked)) {
-        const isMatch = entryPath === "*" || entryPath.startsWith(path)
+        const isMatch =
+          entryPath === "*" ||
+          entryPath.startsWith(path) ||
+          (entryPath === "/chat/*" && path.startsWith("/chat/"))
 
         if (isMatch && ts > latestEvent.created_at) {
           return false