Clean up report item design, bad/restore user actions, space description input, add feed to home page

src/app/components/ReportMenu.svelte

@@ -1,26 +1,32 @@
 <script lang="ts">
   import {getTag, ManagementMethod} from "@welshman/util"
   import type {TrustedEvent} from "@welshman/util"
-  import {manageRelay, repository, displayProfileByPubkey} from "@welshman/app"
+  import {pubkey, manageRelay, repository, displayProfileByPubkey} from "@welshman/app"
   import InboxOut from "@assets/icons/inbox-out.svg?dataurl"
   import MenuDots from "@assets/icons/menu-dots.svg?dataurl"
   import MinusCircle from "@assets/icons/minus-circle.svg?dataurl"
   import TrashBin2 from "@assets/icons/trash-bin-2.svg?dataurl"
+  import Close from "@assets/icons/close.svg?dataurl"
   import {fly} from "@lib/transition"
   import Icon from "@lib/components/Icon.svelte"
   import Popover from "@lib/components/Popover.svelte"
   import Button from "@lib/components/Button.svelte"
   import Confirm from "@lib/components/Confirm.svelte"
+  import {deriveUserIsSpaceAdmin} from "@app/core/state"
+  import {publishDelete, canEnforceNip70} from "@app/core/commands"
   import {pushToast} from "@app/util/toast"
   import {pushModal} from "@app/util/modal"
 
   type Props = {
     url: string
     event: TrustedEvent
+    onDelete?: () => void
   }
 
-  const {url, event}: Props = $props()
+  const {url, event, onDelete}: Props = $props()
 
+  const shouldProtect = canEnforceNip70(url)
+  const userIsAdmin = deriveUserIsSpaceAdmin(url)
   const etag = getTag("e", event.tags)
   const ptag = getTag("p", event.tags)
 
@@ -32,6 +38,11 @@
     isOpen = false
   }
 
+  const deleteReport = async () => {
+    publishDelete({event, relays: [url], protect: await shouldProtect})
+    onDelete?.()
+  }
+
   const dismissReport = async () => {
     const {error} = await manageRelay(url, {
       method: ManagementMethod.BanEvent,
@@ -43,7 +54,7 @@
     } else {
       pushToast({message: "Content has successfully been deleted!"})
       repository.removeEvent(event.id)
-      history.back()
+      onDelete?.()
     }
   }
 
@@ -51,7 +62,7 @@
     const [_, id, reason = ""] = etag!
 
     pushModal(Confirm, {
-      title: `Delete Content`,
+      title: `Remove Content`,
       message: `Are you sure you want to delete this content from the space?`,
       confirm: async () => {
         const {error} = await manageRelay(url, {
@@ -63,15 +74,17 @@
           pushToast({theme: "error", message: error})
         } else {
           pushToast({message: "Content has successfully been deleted!"})
+          repository.removeEvent(event.id)
           repository.removeEvent(id)
           history.back()
+          setTimeout(() => onDelete?.())
         }
       },
     })
   }
 
   const banMember = () => {
-    const [pubkey, reason = ""] = ptag!
+    const [_, pubkey, reason = ""] = ptag!
 
     pushModal(Confirm, {
       title: "Ban User",
@@ -86,7 +99,9 @@
           pushToast({theme: "error", message: error})
         } else {
           pushToast({message: "User has successfully been banned!"})
+          repository.removeEvent(event.id)
           history.back()
+          setTimeout(() => onDelete?.())
         }
       },
     })
@@ -104,27 +119,37 @@
       <ul
         transition:fly
         class="menu absolute right-0 z-popover mt-2 w-48 gap-1 rounded-box bg-base-100 p-2 shadow-md">
-        <li>
-          <Button onclick={dismissReport}>
-            <Icon icon={InboxOut} />
-            Dismiss Report
-          </Button>
-        </li>
-        {#if etag}
+        {#if event.pubkey === $pubkey}
           <li>
-            <Button class="text-error" onclick={banContent}>
-              <Icon icon={TrashBin2} />
-              Remove Content
+            <Button onclick={deleteReport}>
+              <Icon icon={Close} />
+              Delete Report
             </Button>
           </li>
         {/if}
-        {#if ptag}
+        {#if $userIsAdmin}
           <li>
-            <Button class="text-error" onclick={banMember}>
-              <Icon icon={MinusCircle} />
-              Ban User
+            <Button onclick={dismissReport}>
+              <Icon icon={InboxOut} />
+              Dismiss Report
             </Button>
           </li>
+          {#if etag}
+            <li>
+              <Button class="text-error" onclick={banContent}>
+                <Icon icon={TrashBin2} />
+                Remove Content
+              </Button>
+            </li>
+          {/if}
+          {#if ptag}
+            <li>
+              <Button class="text-error" onclick={banMember}>
+                <Icon icon={MinusCircle} />
+                Ban User
+              </Button>
+            </li>
+          {/if}
         {/if}
       </ul>
     </Popover>