Tweak modal, reduce storage on mobile

src/app/util/notifications.ts

@@ -173,9 +173,7 @@ export const notifications = derived(
       if (hasNip29($relaysByUrl.get(url))) {
         for (const h of getSpaceRoomsFromGroupSelections(url, $userGroupSelections)) {
           const roomPath = makeRoomPath(url, h)
-          const latestEvent = allMessages.find(
+          const latestEvent = messages.find(e => e.tags.some(spec(["h", h])))
-            e => $getUrlsForEvent(e.id).includes(url) && e.tags.find(spec(["h", h])),
-          )
 
           if (hasNotification(roomPath, latestEvent)) {
             paths.add(spacePathMobile)

src/app/util/storage.ts

@@ -1,11 +1,6 @@
 import {prop, call, on, throttle, fromPairs, batch} from "@welshman/lib"
 import {throttled, freshness} from "@welshman/store"
 import {
-  ALERT_ANDROID,
-  ALERT_EMAIL,
-  ALERT_IOS,
-  ALERT_STATUS,
-  ALERT_WEB,
   APP_DATA,
   BLOSSOM_SERVERS,
   DIRECT_MESSAGE_FILE,
@@ -50,6 +45,7 @@ import {
   wrapManager,
 } from "@welshman/app"
 import {Collection} from "@lib/storage"
+import {isMobile} from "@lib/html"
 
 const syncEvents = async () => {
   const collection = new Collection<TrustedEvent>({table: "events", getId: prop("id")})
@@ -73,7 +69,6 @@ const syncEvents = async () => {
     APP_DATA,
     ROOMS,
   ]
-  const alertKinds = [ALERT_STATUS, ALERT_EMAIL, ALERT_WEB, ALERT_IOS, ALERT_ANDROID]
   const spaceKinds = [RELAY_ADD_MEMBER, RELAY_REMOVE_MEMBER, RELAY_MEMBERS, RELAY_JOIN, RELAY_LEAVE]
   const roomKinds = [
     ROOM_META,
@@ -88,10 +83,9 @@ const syncEvents = async () => {
 
   const rankEvent = (event: TrustedEvent) => {
     if (metaKinds.includes(event.kind)) return 9
-    if (alertKinds.includes(event.kind)) return 8
+    if (spaceKinds.includes(event.kind)) return 8
-    if (spaceKinds.includes(event.kind)) return 7
+    if (roomKinds.includes(event.kind)) return 7
-    if (roomKinds.includes(event.kind)) return 6
+    if (!isMobile && contentKinds.includes(event.kind)) return 6
-    if (contentKinds.includes(event.kind)) return 5
     return 0
   }
 
@@ -240,17 +234,21 @@ const syncWrapManager = async () => {
 }
 
 export const syncDataStores = async () => {
-  const unsubscribers = await Promise.all([
+  const promises = [
     syncEvents(),
     syncTracker(),
     syncRelays(),
-    syncRelayStats(),
     syncHandles(),
     syncZappers(),
-    syncFreshness(),
     syncPlaintext(),
     syncWrapManager(),
-  ])
+  ]
+
+  if (!isMobile) {
+    promises.push(syncFreshness(), syncRelayStats())
+  }
+
+  const unsubscribers = await Promise.all(promises)
 
   return () => unsubscribers.forEach(call)
 }

src/lib/components/Dialog.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import cx from "classnames"
   import {noop} from "@welshman/lib"
   import {fade, fly} from "@lib/transition"
 
@@ -12,7 +13,11 @@
 
   const extraClass = $derived(
     !fullscreen &&
-      "card2 bg-alt max-h-[90vh] w-[90vw] overflow-auto text-base-content sm:w-[520px] shadow-xl",
+      cx(
+        "bg-alt text-base-content overflow-auto text-base-content shadow-xl",
+        "px-2 py-6 bottom-0 left-0 right-0 top-20 rounded-t-box absolute",
+        "sm:p-6 sm:max-h-[90vh] sm:w-[520px] sm:rounded-box sm:relative sm:top-0",
+      ),
   )
 </script>
 
@@ -23,7 +28,7 @@
     transition:fade={{duration: 300}}
     onclick={onClose}>
   </button>
-  <div class="scroll-container relative {extraClass}" transition:fly={{duration: 300}}>
+  <div class="scroll-container {extraClass}" transition:fly={{duration: 300}}>
     {@render children?.()}
   </div>
 </div>