Further refine notifications

src/app/components/MenuSpacesItem.svelte

@@ -5,7 +5,7 @@
   import RelayName from "@app/components/RelayName.svelte"
   import RelayDescription from "@app/components/RelayDescription.svelte"
   import {makeSpacePath} from "@app/routes"
-  import {inactiveNotifications} from "@app/notifications"
+  import {notifications} from "@app/notifications"
 
   export let url
 
@@ -17,7 +17,7 @@
     <div slot="icon"><SpaceAvatar {url} /></div>
     <div slot="title" class="flex gap-1">
       <RelayName {url} />
-      {#if $inactiveNotifications.has(path)}
+      {#if $notifications.has(path)}
         <div class="relative top-1 h-2 w-2 rounded-full bg-primary" />
       {/if}
     </div>

src/app/components/PrimaryNav.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import {page} from "$app/stores"
   import {goto} from "$app/navigation"
   import {userProfile} from "@welshman/app"
   import Avatar from "@lib/components/Avatar.svelte"
@@ -18,7 +19,7 @@
   } from "@app/state"
   import {pushModal} from "@app/modal"
   import {makeSpacePath} from "@app/routes"
-  import {notifications, inactiveNotifications} from "@app/notifications"
+  import {notifications} from "@app/notifications"
 
   const addSpace = () => pushModal(SpaceAdd)
 
@@ -32,7 +33,9 @@
 
   $: spaceUrls = getMembershipUrls($userMembership)
   $: spacePaths = spaceUrls.map(url => makeSpacePath(url))
-  $: anySpaceNotifications = spacePaths.some(path => $inactiveNotifications.has(path))
+  $: anySpaceNotifications = spacePaths.some(
+    path => !$page.url.pathname.startsWith(path) && $notifications.has(path),
+  )
 </script>
 
 <div class="relative z-nav hidden w-14 flex-shrink-0 bg-base-200 pt-4 md:block">

src/app/notifications.ts

@@ -1,7 +1,6 @@
 import {writable, derived} from "svelte/store"
-import {page} from "$app/stores"
 import {pubkey} from "@welshman/app"
-import {prop, max, sortBy, now} from "@welshman/lib"
+import {prop, sortBy, now} from "@welshman/lib"
 import type {TrustedEvent} from "@welshman/util"
 import {MESSAGE} from "@welshman/util"
 import {makeSpacePath, makeChatPath, makeThreadPath, makeRoomPath} from "@app/routes"
@@ -20,8 +19,7 @@ export const checked = writable<Record<string, number>>({})
 
 export const deriveChecked = (key: string) => derived(checked, prop(key))
 
-export const setChecked = (key: string) =>
-  checked.update(state => ({...state, [key]: now()}))
+export const setChecked = (key: string) => checked.update(state => ({...state, [key]: now()}))
 
 // Derived notifications state
 
@@ -35,15 +33,15 @@ export const notifications = derived(
         return false
       }
 
-      let checkPath = ""
-      let lastChecked = $checked["*"]
+      for (const [entryPath, ts] of Object.entries($checked)) {
+        const isMatch = entryPath === "*" || entryPath.startsWith(path)
 
-      for (const segment of path.slice(1).split("/")) {
-        checkPath += "/" + segment
-        lastChecked = max([lastChecked, $checked[checkPath]])
+        if (isMatch && ts > latestEvent.created_at) {
+          return false
+        }
       }
 
-      return lastChecked < latestEvent.created_at
+      return true
     }
 
     const paths = new Set<string>()
@@ -83,9 +81,3 @@ export const notifications = derived(
     return paths
   },
 )
-
-export const inactiveNotifications = derived(
-  [page, notifications],
-  ([$page, $notifications]) =>
-    new Set(Array.from($notifications).filter(path => !$page.url.pathname.startsWith(path))),
-)

src/app/requests.ts

@@ -1,6 +1,6 @@
 import type {Unsubscriber} from "svelte/store"
 import {sleep, partition, assoc, now} from "@welshman/lib"
-import {MESSAGE, DELETE, THREAD, COMMENT} from "@welshman/util"
+import {MESSAGE, REACTION, DELETE, THREAD, COMMENT} from "@welshman/util"
 import type {SubscribeRequestWithHandlers, Subscription} from "@welshman/net"
 import {SubscriptionEvent} from "@welshman/net"
 import type {AppSyncOpts} from "@welshman/app"
@@ -93,14 +93,15 @@ export const listenForNotifications = () => {
 export const listenForChannelMessages = (url: string, room: string) => {
   const since = now()
   const relays = [url]
+  const kinds = [MESSAGE, REACTION, DELETE]
   const legacyRoom = room === GENERAL ? "general" : room
 
   // Load legacy immediate so our request doesn't get rejected by nip29 relays
   load({relays, filters: [{kinds: [LEGACY_MESSAGE], "#~": [legacyRoom]}], delay: 0})
 
   // Load historical state with negentropy if available
-  pullConservatively({relays, filters: [{kinds: [MESSAGE, DELETE], "#h": [room]}]})
+  pullConservatively({relays, filters: [{kinds, "#h": [room]}]})
 
   // Listen for new messages
-  return subscribePersistent({relays, filters: [{kinds: [MESSAGE, DELETE], "#h": [room], since}]})
+  return subscribePersistent({relays, filters: [{kinds, "#h": [room], since}]})
 }