Add profile detail and notes to self

src/routes/home/+layout.svelte

@@ -52,11 +52,16 @@
       </SecondaryNavItem>
     </div>
     <div in:fly={{delay: 100}}>
+      <SecondaryNavItem href="/home/network">
+        <Icon icon="share-circle" /> Network
+      </SecondaryNavItem>
+    </div>
+    <div in:fly={{delay: 150}}>
       <SecondaryNavItem href="/home/notes">
         <Icon icon="notes-minimalistic" /> Notes
       </SecondaryNavItem>
     </div>
-    <div in:fly={{delay: 150}}>
+    <div in:fly={{delay: 200}}>
       <SecondaryNavHeader>
         Chats
         <Button on:click={startChat}>
@@ -67,7 +72,7 @@
   </SecondaryNavSection>
   <label
     class="input input-sm input-bordered mx-6 -mt-4 flex items-center gap-2 mb-2"
-    in:fly={{delay: 200}}>
+    in:fly={{delay: 250}}>
     <Icon icon="magnifer" />
     <input bind:value={term} class="grow" type="text" />
   </label>

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

@@ -32,7 +32,7 @@
   import {deriveChat, splitChatId} from "@app/state"
   import {sendWrapped} from "@app/commands"
 
-  const {chat: id} = $page.params
+  const id = $page.params.chat === 'notes' ? $pubkey! : $page.params.chat
   const chat = deriveChat(id)
   const pubkeys = splitChatId(id)
   const others = remove($pubkey, pubkeys)
@@ -87,7 +87,9 @@
     <div
       class="flex min-h-12 items-center justify-between gap-4 rounded-xl bg-base-100 px-4 shadow-xl">
       <div class="flex items-center gap-2">
-        {#if others.length === 1}
+        {#if others.length === 0}
+          Your notes
+        {:else if others.length === 1}
           <ProfileCircle pubkey={others[0]} size={5} />
           <Name pubkey={others[0]} />
         {:else}

src/routes/home/network/+page.svelte

@@ -53,7 +53,7 @@
   }
 
   onMount(() => {
-    load({filters: [notesFilter, reactionsFilter]})
+    load({filters: [notesFilter, reactionsFilter], timeout: 30_000})
 
     const scroller = createScroller({
       element: element.closest(".max-h-screen")!,
@@ -75,12 +75,12 @@
 <div class="content column gap-4" bind:this={element}>
   {#await loading}
     <div class="center my-20">
-      <Spinner loading>Loading notes...</Spinner>
+      <Spinner loading>Loading posts from people you follow...</Spinner>
     </div>
   {:then}
     <div class="flex flex-col gap-2">
       {#each events as event (event.id)}
-        <NoteCard {event} class="card2 w-full">
+        <NoteCard {event} class="card2 bg-alt w-full">
           <div class="ml-12">
             <Content {event} />
           </div>

src/routes/settings/profile/+page.svelte

@@ -9,7 +9,7 @@
     createProfile,
     isPublishedProfile,
   } from "@welshman/util"
-  import {pubkey, profilesByPubkey, makeThunk, publishThunk} from "@welshman/app"
+  import {pubkey, profilesByPubkey, makeThunk, publishThunk, displayNip05} from "@welshman/app"
   import {slide} from "@lib/transition"
   import Icon from "@lib/components/Icon.svelte"
   import Field from "@lib/components/Field.svelte"
@@ -23,8 +23,6 @@
 
   const pubkeyDisplay = displayPubkey($pubkey!)
 
-  const displayNip05 = (nip05: string) => (nip05?.startsWith("_@") ? last(nip05.split("@")) : nip05)
-
   const cloneProfile = () => ({...($profilesByPubkey.get($pubkey!) || makeProfile())})
 
   const toggleEdit = () => {