Handle deleted threads

src/app/components/Chat.svelte

@@ -100,7 +100,7 @@
 
   setTimeout(() => {
     loading = false
-  }, 3000)
+  }, 5000)
 </script>
 
 <div class="relative flex h-full w-full flex-col">

src/app/components/MenuSettings.svelte

@@ -11,28 +11,28 @@
 </script>
 
 <div class="column menu gap-2">
-  <Link href="/settings/profile">
+  <Link replaceState href="/settings/profile">
     <CardButton>
       <div slot="icon"><Icon icon="user-rounded" size={7} /></div>
       <div slot="title">Profile</div>
       <div slot="info">Customize your user profile</div>
     </CardButton>
   </Link>
-  <Link href="/settings/relays">
+  <Link replaceState href="/settings/relays">
     <CardButton>
       <div slot="icon"><Icon icon="server" size={7} /></div>
       <div slot="title">Relays</div>
       <div slot="info">Control how {PLATFORM_NAME} talks to the network</div>
     </CardButton>
   </Link>
-  <Link href="/settings">
+  <Link replaceState href="/settings">
     <CardButton>
       <div slot="icon"><Icon icon="settings" size={7} /></div>
       <div slot="title">Settings</div>
       <div slot="info">Get into the details about how {PLATFORM_NAME} works</div>
     </CardButton>
   </Link>
-  <Link href="/settings/about">
+  <Link replaceState href="/settings/about">
     <CardButton>
       <div slot="icon"><Icon icon="code-2" size={7} /></div>
       <div slot="title">About</div>

src/app/components/MenuSpaces.svelte

@@ -17,7 +17,7 @@
 
 <div class="column menu gap-2">
   {#if PLATFORM_RELAY}
-    <Link href={makeSpacePath(PLATFORM_RELAY)}>
+    <Link replaceState href={makeSpacePath(PLATFORM_RELAY)}>
       <CardButton>
         <div slot="icon"><SpaceAvatar url={PLATFORM_RELAY} /></div>
         <div slot="title"><RelayName url={PLATFORM_RELAY} /></div>
@@ -27,7 +27,7 @@
     <Divider />
   {:else if getMembershipUrls($userMembership).length > 0}
     {#each getMembershipUrls($userMembership) as url (url)}
-      <Link href={makeSpacePath(url)}>
+      <Link replaceState href={makeSpacePath(url)}>
         <CardButton>
           <div slot="icon"><SpaceAvatar {url} /></div>
           <div slot="title"><RelayName {url} /></div>

src/app/components/ThreadActions.svelte

@@ -2,7 +2,7 @@
   import {type Instance} from "tippy.js"
   import type {NativeEmoji} from "emoji-picker-element/shared"
   import {max} from "@welshman/lib"
-  import {deriveEvents} from "@welshman/store"
+  import {deriveEvents, deriveIsDeleted} from "@welshman/store"
   import type {TrustedEvent} from "@welshman/util"
   import {pubkey, repository, formatTimestampRelative} from "@welshman/app"
   import Icon from "@lib/components/Icon.svelte"
@@ -18,6 +18,8 @@
   export let event
   export let showActivity = false
 
+  const deleted = deriveIsDeleted(repository, event)
+
   const replies = deriveEvents(repository, {filters: [{kinds: [REPLY], "#E": [event.id]}]})
 
   const showPopover = () => popover.show()
@@ -47,6 +49,11 @@
     <ReactionSummary {event} {onReactionClick} />
   </Button>
   <div class="flex flex-grow justify-end gap-2">
+    {#if $deleted}
+      <div class="btn btn-error btn-xs rounded-full">
+        Deleted
+      </div>
+    {/if}
     {#if showActivity}
       <div class="flex-inline btn btn-neutral btn-xs gap-1 rounded-full">
         <Icon icon="reply" />