Boot the client by consuming events.

We use the same event processing glue that the client has for keeping up with live events, which means that a significant chunk of state management code goes away entirely.

4 files changed, 11 insertions, 40 deletions

diff --git a/ui/lib/state/remote/channels.svelte.js b/ui/lib/state/remote/channels.svelte.js
index b2888cb..1e40075 100644
--- a/ui/lib/state/remote/channels.svelte.js
+++ b/ui/lib/state/remote/channels.svelte.js
@@ -19,15 +19,6 @@ class Channel {
 export class Channels {
   all = $state([]);
 
-  static boot(channels) {
-    const all = channels.map((channel) => Channel.boot(channel));
-    return new Channels({ all });
-  }
-
-  constructor({ all }) {
-    this.all = all;
-  }
-
   add({ at, id, name }) {
     this.all.push(Channel.boot({ at, id, name }));
   }
diff --git a/ui/lib/state/remote/messages.svelte.js b/ui/lib/state/remote/messages.svelte.js
index 7ce28b4..1be001b 100644
--- a/ui/lib/state/remote/messages.svelte.js
+++ b/ui/lib/state/remote/messages.svelte.js
@@ -26,15 +26,6 @@ class Message {
 export class Messages {
   all = $state([]);
 
-  static boot(messages) {
-    const all = messages.map(Message.boot);
-    return new Messages({ all });
-  }
-
-  constructor({ all }) {
-    this.all = all;
-  }
-
   add({ id, at, channel, sender, body }) {
     const message = Message.boot({ id, at, channel, sender, body });
     this.all.push(message);
diff --git a/ui/lib/state/remote/state.svelte.js b/ui/lib/state/remote/state.svelte.js
index a30e0fe..fb46489 100644
--- a/ui/lib/state/remote/state.svelte.js
+++ b/ui/lib/state/remote/state.svelte.js
@@ -4,27 +4,25 @@ import { Messages } from './messages.svelte.js';
 
 export class State {
   currentUser = $state();
-  users = $state();
-  channels = $state();
-  messages = $state();
+  users = $state(new Users());
+  channels = $state(new Channels());
+  messages = $state(new Messages());
 
-  static boot({ currentUser, heartbeat, users, channels, messages, resumePoint }) {
-    return new State({
+  static boot({ currentUser, heartbeat, resumePoint, events }) {
+    const state = new State({
       currentUser: User.boot(currentUser),
       heartbeat,
-      users: Users.boot(users),
-      channels: Channels.boot(channels),
-      messages: Messages.boot(messages),
       resumePoint,
     });
+    for (const event of events) {
+      state.onEvent(event);
+    }
+    return state;
   }
 
-  constructor({ currentUser, heartbeat, users, channels, messages, resumePoint }) {
+  constructor({ currentUser, heartbeat, resumePoint }) {
     this.currentUser = currentUser;
     this.heartbeat = heartbeat;
-    this.users = users;
-    this.channels = channels;
-    this.messages = messages;
     this.resumePoint = resumePoint;
   }
 
diff --git a/ui/lib/state/remote/users.svelte.js b/ui/lib/state/remote/users.svelte.js
index a15d1da..391ab3a 100644
--- a/ui/lib/state/remote/users.svelte.js
+++ b/ui/lib/state/remote/users.svelte.js
@@ -16,16 +16,7 @@ export class User {
 }
 
 export class Users {
-  all = $state();
-
-  static boot(users) {
-    const all = new SvelteMap(users.map((user) => [user.id, User.boot(user)]));
-    return new Users({ all });
-  }
-
-  constructor({ all }) {
-    this.all = all;
-  }
+  all = $state(new SvelteMap());
 
   add({ id, name }) {
     this.all.set(id, new User(id, name));