Fix sort order of thread comments

package.json

@@ -52,18 +52,17 @@
     "@types/qrcode": "^1.5.5",
     "@vite-pwa/assets-generator": "^0.2.6",
     "@vite-pwa/sveltekit": "^0.6.6",
-    "@welshman/app": "^0.3.4",
-    "@welshman/content": "^0.3.4",
-    "@welshman/dvm": "^0.3.4",
-    "@welshman/editor": "^0.3.4",
-    "@welshman/feeds": "^0.3.4",
-    "@welshman/lib": "^0.3.4",
-    "@welshman/net": "^0.3.4",
-    "@welshman/relay": "^0.3.4",
-    "@welshman/router": "^0.3.4",
-    "@welshman/signer": "^0.3.4",
-    "@welshman/store": "^0.3.4",
-    "@welshman/util": "^0.3.4",
+    "@welshman/app": "^0.3.5",
+    "@welshman/content": "^0.3.5",
+    "@welshman/editor": "^0.3.5",
+    "@welshman/feeds": "^0.3.5",
+    "@welshman/lib": "^0.3.5",
+    "@welshman/net": "^0.3.5",
+    "@welshman/relay": "^0.3.5",
+    "@welshman/router": "^0.3.5",
+    "@welshman/signer": "^0.3.5",
+    "@welshman/store": "^0.3.5",
+    "@welshman/util": "^0.3.5",
     "compressorjs": "^1.2.1",
     "daisyui": "^4.12.10",
     "date-picker-svelte": "^2.13.0",

src/app/components/CommentActions.svelte

@@ -0,0 +1,35 @@
+<script lang="ts">
+  import type {TrustedEvent, EventContent} from "@welshman/util"
+  import ReactionSummary from "@app/components/ReactionSummary.svelte"
+  import ThunkStatusOrDeleted from "@app/components/ThunkStatusOrDeleted.svelte"
+  import EventActivity from "@app/components/EventActivity.svelte"
+  import EventActions from "@app/components/EventActions.svelte"
+  import {publishDelete, publishReaction} from "@app/commands"
+  import {makeThreadPath} from "@app/routes"
+
+  interface Props {
+    url: any
+    event: any
+    showActivity?: boolean
+  }
+
+  const {url, event, showActivity = false}: Props = $props()
+
+  const path = makeThreadPath(url, event.id)
+
+  const deleteReaction = (event: TrustedEvent) => publishDelete({relays: [url], event})
+
+  const createReaction = (template: EventContent) =>
+    publishReaction({...template, event, relays: [url]})
+</script>
+
+<div class="flex flex-wrap items-center justify-between gap-2">
+  <div class="flex flex-grow flex-wrap justify-end gap-2">
+    <ReactionSummary {url} {event} {deleteReaction} {createReaction} reactionClass="tooltip-left" />
+    <ThunkStatusOrDeleted {event} />
+    {#if showActivity}
+      <EventActivity {url} {path} {event} />
+    {/if}
+    <EventActions {url} {event} noun="Comment" />
+  </div>
+</div>

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

@@ -15,6 +15,7 @@
   import NoteCard from "@app/components/NoteCard.svelte"
   import MenuSpaceButton from "@app/components/MenuSpaceButton.svelte"
   import ThreadActions from "@app/components/ThreadActions.svelte"
+  import CommentActions from "@app/components/CommentActions.svelte"
   import EventReply from "@app/components/EventReply.svelte"
   import {deriveEvent, decodeRelay} from "@app/state"
   import {setChecked} from "@app/notifications"
@@ -90,11 +91,11 @@
           </Button>
         </div>
       {/if}
-      {#each sortBy(e => -e.created_at, $replies).slice(0, showAll ? undefined : 4) as reply (reply.id)}
+      {#each sortBy(e => e.created_at, $replies).slice(0, showAll ? undefined : 4) as reply (reply.id)}
         <NoteCard event={reply} {url} class="card2 bg-alt z-feature w-full">
           <div class="col-3 ml-12">
             <Content showEntire event={reply} {url} />
-            <ThreadActions event={reply} {url} />
+            <CommentActions event={reply} {url} />
           </div>
         </NoteCard>
       {/each}