Fix channel loading

src/routes/home/+layout.svelte

@@ -25,12 +25,10 @@
 
   onMount(() => {
     const filter = {kinds: [WRAP], "#p": [$pubkey!]}
-    const sub = subscribe({filters: [{...filter, since: ago(30)}]})
+    const relays = ctx.app.router.InboxRelays().getUrls()
+    const sub = subscribe({filters: [{...filter, since: ago(30)}], relays})
 
-    pullConservatively({
-      filters: [filter],
-      relays: ctx.app.router.InboxRelays().getUrls(),
-    })
+    pullConservatively({filters: [filter], relays})
 
     return () => sub.close()
   })
@@ -68,11 +66,13 @@
     <Icon icon="magnifer" />
     <input bind:value={term} class="grow" type="text" />
   </label>
-  <div class="overflow-auto">
-    {#each chats as { id, pubkeys, messages } (id)}
-      <ChatItem {id} {pubkeys} {messages} />
-    {/each}
-  </div>
+  {#key $page.params.chat}
+    <div class="overflow-auto">
+      {#each chats as { id, pubkeys, messages } (id)}
+        <ChatItem {id} {pubkeys} {messages} />
+      {/each}
+    </div>
+  {/key}
 </SecondaryNav>
 
 <Page>

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

@@ -11,7 +11,7 @@
   import {onMount} from "svelte"
   import {page} from "$app/stores"
   import {derived} from "svelte/store"
-  import {sortBy, remove} from "@welshman/lib"
+  import {ctx, sortBy, now, remove} from "@welshman/lib"
   import type {TrustedEvent, EventContent} from "@welshman/util"
   import {createEvent, DIRECT_MESSAGE} from "@welshman/util"
   import {
@@ -91,10 +91,8 @@
     elements.reverse()
   }
 
-  onMount(() => {
-    for (const pk of others) {
-      loadInboxRelaySelections(pk)
-    }
+  onMount(async () => {
+    await Promise.all(others.map(pk => loadInboxRelaySelections(pk)))
   })
 
   setTimeout(() => {