Move from topic to room using tilde

src/app/components/ChatCompose.svelte

@@ -11,10 +11,10 @@
   import Button from "@lib/components/Button.svelte"
   import {makeMention, makeIMeta} from "@app/commands"
   import {getChatEditorOptions, addFile} from "@app/editor"
-  import {MESSAGE} from "@app/state"
+  import {ROOM, MESSAGE, GENERAL} from "@app/state"
 
   export let url
-  export let topic = ""
+  export let room = GENERAL
 
   const uploading = writable(false)
 
@@ -22,7 +22,6 @@
 
   const sendMessage = () => {
     const json = $editor.getJSON()
-    const topicTags = topic ? [["t", topic]] : []
     const mentionTags = findNodes(NProfileExtension.name, json).map(m =>
       makeMention(m.attrs!.pubkey, m.attrs!.relays),
     )
@@ -32,7 +31,7 @@
 
     const event = createEvent(MESSAGE, {
       content: $editor.getText(),
-      tags: [["-"], ...topicTags, ...mentionTags, ...imetaTags],
+      tags: [[ROOM, room], ...mentionTags, ...imetaTags],
     })
 
     publishThunk(makeThunk({event, relays: [url]}))

src/app/components/ChatMessage.svelte

@@ -16,7 +16,6 @@
   } from "@welshman/app"
   import type {PublishStatusData} from "@welshman/app"
   import {
-    GROUP_REPLY,
     REACTION,
     ZAP_RESPONSE,
     displayRelayUrl,
@@ -27,7 +26,7 @@
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import Avatar from "@lib/components/Avatar.svelte"
-  import {deriveEvent, displayReaction} from "@app/state"
+  import {REPLY, deriveEvent, displayReaction} from "@app/state"
   import {getChatViewOptions} from "@app/editor"
 
   export let event: TrustedEvent
@@ -85,7 +84,7 @@
 </script>
 
 <div in:fly class="group relative flex flex-col gap-1 p-2 transition-colors hover:bg-base-300">
-  {#if event.kind === GROUP_REPLY}
+  {#if event.kind === REPLY}
     <div class="flex items-center gap-1 pl-12 text-xs">
       <Icon icon="arrow-right" />
       <Avatar src={$parentProfile?.picture} size={4} />

src/app/components/EventCreate.svelte

@@ -52,7 +52,6 @@
     const event = createEvent(kind, {
       content: $editor.getText(),
       tags: [
-        ["-"],
         ["d", randomId()],
         ["title", title],
         ["location", location],

src/app/components/PrimaryNav.svelte

@@ -51,7 +51,7 @@
           class="!h-10 !w-10 border border-solid border-base-300"
           size={7} />
       </PrimaryNavItem>
-      {#each $userMembership?.topicsByUrl.keys() || [] as url (url)}
+      {#each $userMembership?.roomsByUrl.keys() || [] as url (url)}
         <PrimaryNavItem title={displayRelayUrl(url)} href={makeSpacePath(url)}>
           <SpaceAvatar {url} />
         </PrimaryNavItem>

src/app/components/RoomCreate.svelte

@@ -13,9 +13,9 @@
   const back = () => history.back()
 
   const tryCreate = async () => {
-    await addRoomMembership(url, topic)
+    await addRoomMembership(url, room)
 
-    goto(makeSpacePath(url, topic))
+    goto(makeSpacePath(url, room))
   }
 
   const create = async () => {
@@ -28,7 +28,7 @@
     }
   }
 
-  let topic = ""
+  let room = ""
   let loading = false
 </script>
 
@@ -41,7 +41,7 @@
     <p slot="label">Room Name</p>
     <label class="input input-bordered flex w-full items-center gap-2" slot="input">
       <Icon icon="hashtag" />
-      <input bind:value={topic} class="grow" type="text" />
+      <input bind:value={room} class="grow" type="text" />
     </label>
   </Field>
   <div class="flex flex-row items-center justify-between gap-4">
@@ -49,7 +49,7 @@
       <Icon icon="alt-arrow-left" />
       Go back
     </Button>
-    <Button type="submit" class="btn btn-primary" disabled={!topic || loading}>
+    <Button type="submit" class="btn btn-primary" disabled={!room || loading}>
       <Spinner {loading}>Create Room</Spinner>
       <Icon icon="alt-arrow-right" />
     </Button>