Refactor synchronization logic

src/app/components/MenuSpace.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
   import {onMount} from "svelte"
+  import {derived} from "svelte/store"
   import {displayRelayUrl, getTagValue, EVENT_TIME, ZAP_GOAL, THREAD} from "@welshman/util"
-  import {deriveRelay, repository} from "@welshman/app"
+  import {deriveRelay} from "@welshman/app"
   import {fly} from "@lib/transition"
   import AltArrowDown from "@assets/icons/alt-arrow-down.svg?dataurl"
   import RemoteControllerMinimalistic from "@assets/icons/remote-controller-minimalistic.svg?dataurl"
@@ -36,12 +37,13 @@
   import MenuSpaceRoomItem from "@app/components/MenuSpaceRoomItem.svelte"
   import {
     ENABLE_ZAPS,
+    MESSAGE_FILTER,
     userRoomsByUrl,
     hasMembershipUrl,
     memberships,
+    deriveEventsForUrl,
     deriveUserRooms,
     deriveOtherRooms,
-    trackerStore,
     hasNip29,
     alerts,
     deriveUserCanCreateRoom,
@@ -62,16 +64,9 @@
   const owner = $derived($relay?.profile?.pubkey)
   const hasAlerts = $derived($alerts.some(a => getTagValue("feed", a.tags)?.includes(url)))
 
-  const spaceKinds = $derived(
-    Array.from($trackerStore.getIds(url)).reduce((kinds, id) => {
-      const event = repository.getEvent(id)
-
-      if (event) {
-        kinds.add(event.kind)
-      }
-
-      return kinds
-    }, new Set()),
+  const spaceKinds = derived(
+    deriveEventsForUrl(url, [MESSAGE_FILTER]),
+    $events => new Set($events.map(e => e.kind)),
   )
 
   const openMenu = () => {
@@ -196,7 +191,7 @@
           <Icon icon={ChatRound} /> Chat
         </SecondaryNavItem>
       {/if}
-      {#if ENABLE_ZAPS && spaceKinds.has(ZAP_GOAL)}
+      {#if ENABLE_ZAPS && $spaceKinds.has(ZAP_GOAL)}
         <SecondaryNavItem
           {replaceState}
           href={goalsPath}
@@ -204,7 +199,7 @@
           <Icon icon={StarFallMinimalistic} /> Goals
         </SecondaryNavItem>
       {/if}
-      {#if spaceKinds.has(THREAD)}
+      {#if $spaceKinds.has(THREAD)}
         <SecondaryNavItem
           {replaceState}
           href={threadsPath}
@@ -212,7 +207,7 @@
           <Icon icon={NotesMinimalistic} /> Threads
         </SecondaryNavItem>
       {/if}
-      {#if spaceKinds.has(EVENT_TIME)}
+      {#if $spaceKinds.has(EVENT_TIME)}
         <SecondaryNavItem
           {replaceState}
           href={calendarPath}

src/app/components/MenuSpaceButton.svelte

@@ -9,7 +9,7 @@
 
   const {url} = $props()
 
-  const path = makeSpacePath(url)
+  const path = makeSpacePath(url) + ":mobile"
 
   const openMenu = () => pushDrawer(MenuSpace, {url})
 </script>

src/app/components/NewNotificationSound.svelte

@@ -14,11 +14,12 @@
       enabled = false
     }
   })
+
   let notificationCount = $state($notifications.size)
 
   const playSound = () => {
     if (enabled && $userSettingsValues.play_notification_sound) {
-      audioElement.play()
+      audioElement?.play()
     }
   }
 

src/app/components/ProfileBadges.svelte

@@ -5,11 +5,11 @@
   import type {Filter} from "@welshman/util"
   import {deriveEvents} from "@welshman/store"
   import {formatTimestampRelative} from "@welshman/lib"
-  import {NOTE, ROOMS, MESSAGE, THREAD, COMMENT, getRelayTags, getListTags} from "@welshman/util"
+  import {NOTE, ROOMS, COMMENT, getRelayTags, getListTags} from "@welshman/util"
   import {repository, loadRelaySelections} from "@welshman/app"
   import Button from "@lib/components/Button.svelte"
   import ProfileSpaces from "@app/components/ProfileSpaces.svelte"
-  import {membershipsByPubkey} from "@app/core/state"
+  import {membershipsByPubkey, MESSAGE_KINDS} from "@app/core/state"
   import {goToEvent} from "@app/util/routes"
   import {pushModal} from "@app/util/modal"
 
@@ -36,7 +36,7 @@
     load({
       filters: [
         {authors: [pubkey], kinds: [ROOMS]},
-        {authors: [pubkey], limit: 1, kinds: [NOTE, MESSAGE, THREAD, COMMENT]},
+        {authors: [pubkey], limit: 1, kinds: [NOTE, COMMENT, ...MESSAGE_KINDS]},
       ],
       relays: Router.get().FromPubkeys([pubkey]).getUrls(),
     })

src/app/components/ReactionSummary.svelte

@@ -3,6 +3,7 @@
   import type {Snippet} from "svelte"
   import {groupBy, sum, uniq, uniqBy, batch, displayList} from "@welshman/lib"
   import {
+    REPORT,
     REACTION,
     ZAP_RESPONSE,
     getReplyFilters,
@@ -10,7 +11,6 @@
     getEmojiTag,
     fromMsats,
     getTag,
-    REPORT,
     DELETE,
   } from "@welshman/util"
   import type {TrustedEvent, EventContent, Zap} from "@welshman/util"
@@ -96,7 +96,7 @@
       load({
         relays: [url],
         signal: controller.signal,
-        filters: getReplyFilters([event], {kinds: [REPORT, DELETE, ...REACTION_KINDS]}),
+        filters: getReplyFilters([event], {kinds: REACTION_KINDS}),
         onEvent: batch(300, (events: TrustedEvent[]) => {
           load({
             relays: [url],

src/app/components/SpaceJoinConfirm.svelte

@@ -1,8 +1,6 @@
 <script module lang="ts">
   import {goto} from "$app/navigation"
   import {dissoc} from "@welshman/lib"
-  import {ROOM_META} from "@welshman/util"
-  import {load} from "@welshman/net"
   import {pushToast} from "@app/util/toast"
   import {makeSpacePath} from "@app/util/routes"
   import {addSpaceMembership, broadcastUserData} from "@app/core/commands"
@@ -11,17 +9,8 @@
   export const confirmSpaceJoin = async (url: string) => {
     await addSpaceMembership(url)
 
-    const path = makeSpacePath(url)
-
-    if (window.location.pathname === path) {
-      load({
-        relays: [url],
-        filters: [{kinds: [ROOM_META]}],
-      })
-    }
-
     broadcastUserData([url])
-    goto(path, {replaceState: true})
+    goto(makeSpacePath(url), {replaceState: true})
     relaysMostlyRestricted.update(dissoc(url))
     pushToast({message: "Welcome to the space!"})
   }