Track shards separately, upgrade deps

src/app/components/ContentLinkBlockImage.svelte

@@ -56,7 +56,7 @@
         const ciphertext = new Uint8Array(await response.arrayBuffer())
         const decryptedData = await decryptFile({ciphertext, key, nonce, algorithm})
 
-        src = URL.createObjectURL(new Blob([decryptedData]))
+        src = URL.createObjectURL(new Blob([new Uint8Array(decryptedData)]))
       }
     } else {
       src = url

src/app/core/commands.ts

@@ -744,7 +744,7 @@ export const uploadFile = async (file: File, options: UploadFileOptions = {}) =>
         ["encryption-algorithm", algorithm],
       )
 
-      file = new File([new Blob([ciphertext])], name, {
+      file = new File([new Uint8Array(ciphertext)], name, {
         type: "application/octet-stream",
       })
     }

src/app/util/routes.ts

@@ -64,7 +64,7 @@ export const getPrimaryNavItemIndex = ($page: Page) => {
     case "discover":
       return urls.length + 2
     case "spaces": {
-      const routeUrl = decodeRelay($page.params.relay)
+      const routeUrl = decodeRelay($page.params.relay || "")
 
       return urls.findIndex(url => url === routeUrl) + 1
     }

src/lib/components/PageBar.svelte

@@ -13,7 +13,7 @@
 
 <div data-component="PageBar" class="cw top-sai fixed z-feature p-2">
   <div
-    class="flex min-h-12 items-center justify-between gap-4 rounded-xl rounded-xl bg-base-100 px-4 shadow-xl">
+    class="flex min-h-12 items-center justify-between gap-4 rounded-xl bg-base-100 px-4 shadow-xl">
     <div class="ellipsize flex items-center gap-4 whitespace-nowrap">
       {@render props.icon?.()}
       {@render props.title?.()}

src/lib/storage.ts

@@ -1,4 +1,4 @@
-import {flatten, identity, groupBy} from "@welshman/lib"
+import {flatten, noop, identity, groupBy} from "@welshman/lib"
 import {type StorageProvider} from "@welshman/store"
 import {Preferences} from "@capacitor/preferences"
 import {Encoding, Filesystem, Directory} from "@capacitor/filesystem"
@@ -38,7 +38,7 @@ export type CollectionOptions<T> = {
 }
 
 export class Collection<T> {
-  p = Promise.resolve()
+  #promises = new Map<string, Promise<any>>()
 
   constructor(readonly options: CollectionOptions<T>) {}
 
@@ -58,36 +58,38 @@ export class Collection<T> {
     )
   }
 
-  #then = async (f: () => Promise<void>) => {
-    this.p = this.p.then(f).catch(e => {
-      console.error(e)
-    })
+  #then = <R>(shard: string, f: () => Promise<R>) => {
+    const oldPromise = this.#promises.get(shard) || Promise.resolve()
+    const newPromise = oldPromise.then(f)
 
-    await this.p
+    this.#promises.set(shard, newPromise)
+
+    return newPromise
   }
 
   #path = (shard: string) => `collection_${this.options.table}_${shard}.json`
 
-  getShard = async (shard: string): Promise<T[]> => {
-    try {
-      const file = await Filesystem.readFile({
-        path: this.#path(shard),
-        directory: Directory.Data,
-        encoding: Encoding.UTF8,
-      })
+  getShard = (shard: string): Promise<T[]> =>
+    this.#then(shard, async () => {
+      try {
+        const file = await Filesystem.readFile({
+          path: this.#path(shard),
+          directory: Directory.Data,
+          encoding: Encoding.UTF8,
+        })
 
-      // Speed things up by parsing only once
-      return JSON.parse("[" + file.data.toString().split("\n").filter(identity).join(",") + "]")
-    } catch (err) {
-      // file doesn't exist, or isn't valid json
-      return []
-    }
-  }
+        // Speed things up by parsing only once
+        return JSON.parse("[" + file.data.toString().split("\n").filter(identity).join(",") + "]")
+      } catch (err) {
+        // file doesn't exist, or isn't valid json
+        return []
+      }
+    })
 
   get = async (): Promise<T[]> => flatten(await Promise.all(this.options.shards.map(this.getShard)))
 
   setShard = (shard: string, items: T[]) =>
-    this.#then(async () => {
+    this.#then(shard, async () => {
       await Filesystem.writeFile({
         path: this.#path(shard),
         directory: Directory.Data,
@@ -104,7 +106,7 @@ export class Collection<T> {
     )
 
   addToShard = (shard: string, items: T[]) =>
-    this.#then(async () => {
+    this.#then(shard, async () => {
       await Filesystem.appendFile({
         path: this.#path(shard),
         directory: Directory.Data,

src/routes/[bech32]/+page.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import {onMount} from "svelte"
   import * as nip19 from "nostr-tools/nip19"
+  import type {MakeNonOptional} from "@welshman/lib"
   import type {TrustedEvent} from "@welshman/util"
   import {Address, getIdFilters} from "@welshman/util"
   import {LOCAL_RELAY_URL} from "@welshman/relay"
@@ -10,7 +11,7 @@
   import Spinner from "@lib/components/Spinner.svelte"
   import {goToEvent} from "@app/util/routes"
 
-  const {bech32} = $page.params
+  const {bech32} = $page.params as MakeNonOptional<typeof $page.params>
 
   const attemptToNavigate = async () => {
     const {type, data} = nip19.decode(bech32) as any

src/routes/chat/[chat]/+page.svelte

@@ -1,8 +1,11 @@
 <script lang="ts">
   import {page} from "$app/stores"
+  import type {MakeNonOptional} from '@welshman/lib'
   import Chat from "@app/components/Chat.svelte"
   import {notifications, setChecked} from "@app/util/notifications"
 
+  const {chat} = $page.params as MakeNonOptional<typeof $page.params>
+
   // We have to watch this one, since on mobile the badge will be visible when active
   $effect(() => {
     if ($notifications.has($page.url.pathname)) {
@@ -11,4 +14,4 @@
   })
 </script>
 
-<Chat id={$page.params.chat} />
+<Chat id={chat} />

src/routes/spaces/[relay]/+layout.svelte

@@ -31,7 +31,7 @@
 
   const {children}: Props = $props()
 
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
 
   const rooms = Array.from($userRoomsByUrl.get(url) || [])
 

src/routes/spaces/[relay]/+page.svelte

@@ -26,7 +26,7 @@
   import {makeChatPath} from "@app/util/routes"
   import {pushModal} from "@app/util/modal"
 
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
   const relay = deriveRelay(url)
   const joinSpace = () => pushModal(SpaceJoin, {url})
 

src/routes/spaces/[relay]/[room]/+page.svelte

@@ -5,6 +5,7 @@
   import {page} from "$app/stores"
   import type {Readable} from "svelte/store"
   import {now, formatTimestampAsDate} from "@welshman/lib"
+  import type {MakeNonOptional} from "@welshman/lib"
   import {request} from "@welshman/net"
   import type {TrustedEvent, EventContent} from "@welshman/util"
   import {
@@ -57,10 +58,10 @@
   import {popKey} from "@lib/implicit"
   import {pushToast} from "@app/util/toast"
 
-  const {room} = $page.params
+  const {room, relay} = $page.params as MakeNonOptional<typeof $page.params>
   const mounted = now()
   const lastChecked = $checked[$page.url.pathname]
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay(relay)
   const channel = deriveChannel(url, room)
   const filter = {kinds: [MESSAGE], "#h": [room]}
   const isFavorite = $derived($userRoomsByUrl.get(url)?.has(room))

src/routes/spaces/[relay]/calendar/+page.svelte

@@ -23,7 +23,7 @@
   import {makeCalendarFeed} from "@app/core/requests"
   import {setChecked} from "@app/util/notifications"
 
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
 
   const makeEvent = () => pushModal(CalendarEventCreate, {url})
 

src/routes/spaces/[relay]/calendar/[id]/+page.svelte

@@ -2,6 +2,7 @@
   import {onMount} from "svelte"
   import {page} from "$app/stores"
   import {sortBy, sleep} from "@welshman/lib"
+  import type {MakeNonOptional} from "@welshman/lib"
   import {COMMENT, getTagValue} from "@welshman/util"
   import {request} from "@welshman/net"
   import {repository} from "@welshman/app"
@@ -25,7 +26,7 @@
   import {deriveEvent, decodeRelay} from "@app/core/state"
   import {setChecked} from "@app/util/notifications"
 
-  const {relay, id} = $page.params
+  const {relay, id} = $page.params as MakeNonOptional<typeof $page.params>
   const url = decodeRelay(relay)
   const event = deriveEvent(id)
   const filters = [{kinds: [COMMENT], "#E": [id]}]

src/routes/spaces/[relay]/chat/+page.svelte

@@ -36,7 +36,7 @@
 
   const mounted = now()
   const lastChecked = $checked[$page.url.pathname]
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
   const filter = {kinds: [MESSAGE]}
   const shouldProtect = canEnforceNip70(url)
 

src/routes/spaces/[relay]/goals/+page.svelte

@@ -20,7 +20,7 @@
   import {makeFeed} from "@app/core/requests"
   import {pushModal} from "@app/util/modal"
 
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
   const mutedPubkeys = getPubkeyTagValues(getListTags($userMutes))
   const goals: TrustedEvent[] = $state([])
   const comments: TrustedEvent[] = $state([])

src/routes/spaces/[relay]/goals/[id]/+page.svelte

@@ -2,6 +2,7 @@
   import {onMount} from "svelte"
   import {page} from "$app/stores"
   import {sortBy, sleep} from "@welshman/lib"
+  import type {MakeNonOptional} from "@welshman/lib"
   import {COMMENT, getTagValue} from "@welshman/util"
   import {repository} from "@welshman/app"
   import {request} from "@welshman/net"
@@ -24,7 +25,7 @@
   import {deriveEvent, decodeRelay} from "@app/core/state"
   import {setChecked} from "@app/util/notifications"
 
-  const {relay, id} = $page.params
+  const {relay, id} = $page.params as MakeNonOptional<typeof $page.params>
   const url = decodeRelay(relay)
   const event = deriveEvent(id)
   const filters = [{kinds: [COMMENT], "#E": [id]}]

src/routes/spaces/[relay]/threads/+page.svelte

@@ -21,7 +21,7 @@
   import {makeFeed} from "@app/core/requests"
   import {pushModal} from "@app/util/modal"
 
-  const url = decodeRelay($page.params.relay)
+  const url = decodeRelay($page.params.relay!)
   const mutedPubkeys = getPubkeyTagValues(getListTags($userMutes))
   const threads: TrustedEvent[] = $state([])
   const comments: TrustedEvent[] = $state([])

src/routes/spaces/[relay]/threads/[id]/+page.svelte

@@ -2,6 +2,7 @@
   import {onMount} from "svelte"
   import {page} from "$app/stores"
   import {sortBy, sleep} from "@welshman/lib"
+  import type {MakeNonOptional} from "@welshman/lib"
   import {COMMENT, getTagValue} from "@welshman/util"
   import {repository} from "@welshman/app"
   import {request} from "@welshman/net"
@@ -23,7 +24,7 @@
   import {deriveEvent, decodeRelay} from "@app/core/state"
   import {setChecked} from "@app/util/notifications"
 
-  const {relay, id} = $page.params
+  const {relay, id} = $page.params as MakeNonOptional<typeof $page.params>
   const url = decodeRelay(relay)
   const event = deriveEvent(id)
   const filters = [{kinds: [COMMENT], "#E": [id]}]