Web client: replies, reactions, threads and spaces

- Replies: Reply on a message puts it above the composer; the reply
  quotes it (sender and first line), and the quote goes to the message.
  Sent without the quoted fallback (Matrix 1.13); the fallback in older
  replies is not shown.
- Reactions: the six quick ones of the Android app or any other emoji,
  chips under the message with counts, yours highlighted; a chip adds
  yours or takes it back.
- Threads: matrix-js-sdk's thread support is on. Reply in thread opens
  the thread beside the room with its own composer; the root shows
  "N replies" and the last reply; Threads in the header lists them.
  Receipts are per thread (MSC3771): the room is marked read with its
  read marker and a separate receipt for "main", since /read_markers'
  receipt has no thread_id and would read every thread. Unread counts
  per thread (MSC3773) and a dot on unread threads.
  Two SDK quirks worked around: the thread view creates the thread
  object when a thread starts here (else the first reply's remote echo
  is dropped until reload), and the reply count is re-read from the
  root's bundled count after replies arrive (the SDK can count one
  twice).
- Spaces: kept out of the room list; a picker narrows the list to a
  space's rooms and its subspaces'. A space's page (/hierarchy) lists
  its rooms with Open or Join; admins add existing rooms, create new
  ones in it and take rooms out. New space in the + menu and picker.
- The room composer moved into RoomComposer.vue, shared by the room
  and the thread pane. New thread and space icons in apps/ui.
- Dev server: the Rust crypto's .wasm was lost to vite's pre-bundling,
  so E2EE never started under `pnpm web:dev`; the package is now served
  as it is in dev.

Server: /versions lists v1.1 to v1.14. matrix-js-sdk checks for the
exact version a feature came in, and with only v1.13 and v1.14 it kept
threads, per-thread unread counts, recursive relations and intentional
mentions off.

Tested in the browser against a local server: replies, reactions,
threads (new and existing, in plain and encrypted rooms, receipts
checked on the server) and spaces.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/components/ThreadPane.vue

@@ -0,0 +1,55 @@
+<script setup lang="ts">
+import type { Room } from 'matrix-js-sdk'
+import { computed, shallowRef } from 'vue'
+import { WIconButton } from '@warp/ui'
+import RoomComposer from '@/components/RoomComposer.vue'
+import RoomTimeline from '@/components/RoomTimeline.vue'
+import { threadCount, threadRoot, type MessageItem } from '@/matrix/timeline'
+import { useChat } from '@/stores/chat'
+
+// One thread beside its room: the root, its replies, and a composer that
+// writes into it. On a phone it covers the room.
+
+const props = defineProps<{ room: Room; threadId: string; isDirect: boolean }>()
+const emit = defineEmits<{ close: []; back: [] }>()
+
+const chat = useChat()
+const replyTo = shallowRef<MessageItem | null>(null)
+
+// A thread starting here has no thread object yet, and the SDK only files
+// a reply's remote echo into one that exists: without this the first
+// reply would vanish until the next reload. Element's thread view does
+// the same.
+if (!props.room.getThread(props.threadId)) {
+  const root = threadRoot(props.room, props.threadId)
+  if (root) props.room.createThread(props.threadId, root, [], true)
+}
+
+const count = computed(() => {
+  void chat.version
+  return threadCount(props.room, props.threadId)
+})
+</script>
+
+<template>
+  <aside
+    class="fixed inset-0 z-30 flex flex-col bg-surface-sunken md:static md:z-auto md:w-[400px] md:shrink-0 md:border-l md:border-line"
+    aria-label="Thread"
+    @keydown.esc="emit('close')"
+  >
+    <div class="flex h-16 shrink-0 items-center gap-2 border-b border-line bg-surface px-2 md:px-4">
+      <WIconButton icon="chevron-left" label="All threads" @click="emit('back')" />
+      <div class="min-w-0 flex-1">
+        <h2 class="subheading m-0">Thread</h2>
+        <p class="caption m-0 truncate text-ink-muted">{{ room.name }} · {{ count === 1 ? '1 reply' : `${count} replies` }}</p>
+      </div>
+      <WIconButton icon="close" label="Close thread" @click="emit('close')" />
+    </div>
+
+    <RoomTimeline :key="threadId" :room="room" :is-direct="isDirect" :thread-id="threadId" @reply="(item) => (replyTo = item)" />
+
+    <div class="shrink-0 px-4 pt-2 pb-4">
+      <RoomComposer v-model:reply-to="replyTo" :room="room" :thread-id="threadId" placeholder="Reply in thread" />
+    </div>
+  </aside>
+</template>