From 9b38cb1a62ede4900fde4ba47a7b065db329e994 Mon Sep 17 00:00:00 2001
From: Owen Jacobson <owen@grimoire.ca>
Date: Tue, 1 Jul 2025 15:40:11 -0400
Subject: Rename "channel" to "conversation" throughout the client.

Existing client state, stored in local storage, is migrated to new keys (that mention "conversation" instead of "channel" where appropriate) the first time the client loads.
---
 ui/routes/(app)/+layout.svelte | 46 ++++++++++++++++++++++++------------------
 1 file changed, 26 insertions(+), 20 deletions(-)

(limited to 'ui/routes/(app)/+layout.svelte')

diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte
index e3272bc..658d966 100644
--- a/ui/routes/(app)/+layout.svelte
+++ b/ui/routes/(app)/+layout.svelte
@@ -7,9 +7,8 @@
 
   import TinyGesture from 'tinygesture';
 
-  import * as api from '$lib/apiServer.js';
-  import ChannelList from '$lib/components/ChannelList.svelte';
-  import CreateChannelForm from '$lib/components/CreateChannelForm.svelte';
+  import ConversationList from '$lib/components/ConversationList.svelte';
+  import CreateConversationForm from '$lib/components/CreateConversationForm.svelte';
 
   let gesture = null;
 
@@ -20,9 +19,9 @@
   onDestroy(session.end.bind(session));
 
   let pageContext = getContext('page');
-  let channel = $derived(page.params.conversation);
+  let conversationId = $derived(page.params.conversation);
 
-  let channels = $derived(session.channels);
+  let conversations = $derived(session.conversations);
 
   function setUpGestures() {
     if (!browser) {
@@ -46,28 +45,35 @@
     }
   });
 
-  const STORE_KEY_LAST_ACTIVE = 'pilcrow:lastActiveChannel';
+  // Automatically migrate last-active-channel info now that we call them "conversations."
+  const STORE_KEY_LAST_ACTIVE = 'pilcrow:lastActiveConversation';
+  const STORE_KEY_LAST_ACTIVE_CHANNEL = 'pilcrow:lastActiveChannel';
 
-  function getLastActiveChannel() {
-    return browser && JSON.parse(localStorage.getItem(STORE_KEY_LAST_ACTIVE));
+  function getLastActiveConversation() {
+    const stored =
+      localStorage.getItem(STORE_KEY_LAST_ACTIVE) ??
+      localStorage.getItem(STORE_KEY_LAST_ACTIVE_CHANNEL);
+    return JSON.parse(stored);
   }
 
-  function setLastActiveChannel(channelId) {
-    browser && localStorage.setItem(STORE_KEY_LAST_ACTIVE, JSON.stringify(channelId));
+  function setLastActiveConversation(conversationId) {
+    localStorage.setItem(STORE_KEY_LAST_ACTIVE, JSON.stringify(conversationId));
+    // Once we've saved to the new key, we no longer need the old one. Clean it up.
+    localStorage.removeItem(STORE_KEY_LAST_ACTIVE_CHANNEL);
   }
 
   afterNavigate(() => {
-    const lastActiveChannel = getLastActiveChannel();
+    const conversationId = getLastActiveConversation();
     const inRoot = page.url.pathname === '/';
-    if (inRoot && lastActiveChannel) {
-      goto(`/c/${lastActiveChannel}`);
-    } else if (channel) {
-      setLastActiveChannel(channel || null);
+    if (inRoot && conversationId) {
+      goto(`/c/${conversationId}`);
+    } else if (conversationId) {
+      setLastActiveConversation(conversationId || null);
     }
   });
 
-  async function createChannel(name) {
-    outbox.createChannel(name);
+  async function createConversation(name) {
+    outbox.createConversation(name);
   }
 
   function onbeforeunload(event) {
@@ -114,9 +120,9 @@
 
 <div id="interface">
   <nav id="sidebar" data-expanded={pageContext.showMenu}>
-    <ChannelList active={channel} {channels} />
-    <div class="create-channel">
-      <CreateChannelForm {createChannel} />
+    <ConversationList active={conversationId} {conversations} />
+    <div class="create-conversation">
+      <CreateConversationForm {createConversation} />
     </div>
   </nav>
   <main>
-- 
cgit v1.2.3

