5 files changed, 33 insertions, 32 deletions

diff --git a/hi-ui/src/apiServer.js b/hi-ui/src/apiServer.js
index 6273576..f4a89a4 100644
--- a/hi-ui/src/apiServer.js
+++ b/hi-ui/src/apiServer.js
@@ -21,10 +21,6 @@ export async function logOut() {
   return apiServer.post('/auth/logout', {});
 }
 
-export async function listChannels() {
-  return apiServer.get('/channels');
-}
-
 export async function createChannel(name) {
   return apiServer.post('/channels', { name });
 }
@@ -37,8 +33,10 @@ export async function deleteMessage(messageId) {
   // TODO
 }
 
-export function subscribeToEvents() {
-  const evtSource = new EventSource("/api/events");
+export function subscribeToEvents(resume_point) {
+  const eventsUrl = new URL('/api/events', window.location);
+  eventsUrl.searchParams.append('resume_point', resume_point);
+  const evtSource = new EventSource(eventsUrl.toString());
   // TODO: this should process all incoming events and store them.
   // TODO: eventually we'll need to handle expiring old info, so as not to use
   //       infinite browser memory.
@@ -58,6 +56,7 @@ export function subscribeToEvents() {
 
     switch (data.type) {
       case 'created':
+        channelsList.update((value) => value.addChannel(data.channel))
         break;
       case 'message':
         messages.update((value) => value.addMessage(data));
diff --git a/hi-ui/src/lib/ChannelList.svelte b/hi-ui/src/lib/ChannelList.svelte
index 5577d94..ba48e5d 100644
--- a/hi-ui/src/lib/ChannelList.svelte
+++ b/hi-ui/src/lib/ChannelList.svelte
@@ -1,32 +1,18 @@
 <script>
-	import { onMount } from 'svelte';
-
-    import { listChannels } from '../apiServer';
     import { channelsList } from '../store';
     import Channel from './Channel.svelte';
 
     let channels;
-    let loading = true;
 
     channelsList.subscribe((value) => {
         channels = value.channels;
     });
-
-	onMount(async () => {
-        let channels = await listChannels();
-        channelsList.update((value) => value.setChannels(channels.data));
-        loading = false;
-    });
 </script>
 
 <ul class="select-none">
-    {#if loading}
-        <li><em>loading channels&hellip;</em></li>
-    {:else}
-        {#each channels as channel}
-            <Channel {...channel} />
-        {/each}
-    {/if}
+    {#each channels as channel}
+        <Channel {...channel} />
+    {/each}
 </ul>
 
 <style>
diff --git a/hi-ui/src/lib/CreateChannelForm.svelte b/hi-ui/src/lib/CreateChannelForm.svelte
index aa415fd..c08430b 100644
--- a/hi-ui/src/lib/CreateChannelForm.svelte
+++ b/hi-ui/src/lib/CreateChannelForm.svelte
@@ -1,8 +1,6 @@
 <script>
     import { createChannel } from '../apiServer';
 
-    import { channelsList } from '../store';
-
     let name = '';
     let disabled = false;
 
@@ -10,7 +8,6 @@
         disabled = true;
         const response = await createChannel(name);
         if (200 <= response.status && response.status < 300) {
-            channelsList.update((value) => value.addChannel(response.data));
             name = '';
         }
         disabled = false;
diff --git a/hi-ui/src/routes/+page.svelte b/hi-ui/src/routes/+page.svelte
index 66b4f8d..1a61b3e 100644
--- a/hi-ui/src/routes/+page.svelte
+++ b/hi-ui/src/routes/+page.svelte
@@ -2,7 +2,7 @@
 	import { onMount } from 'svelte';
 
 	import { boot, subscribeToEvents } from '../apiServer';
-	import { currentUser } from '../store';
+	import { currentUser, channelsList, messages } from '../store';
 
     import ActiveChannel from '../lib/ActiveChannel.svelte';
     import ChannelList from '../lib/ChannelList.svelte';
@@ -18,16 +18,29 @@
         user = value;
     });
 
+    function onBooted(boot) {
+        currentUser.update(() => ({
+            id: boot.login.id,
+            username: boot.login.name,
+        }));
+        let channels = boot.channels.map((channel) => ({
+            id: channel.id,
+            name: channel.name,
+        }));
+        channelsList.update((value) => value.setChannels(channels));
+        let bootMessages = boot.channels.map((channel) => [channel.id, channel.messages]);
+        for (let [channel, channelMessages] of bootMessages) {
+            messages.update((value) => value.addMessages(channel, channelMessages));
+        }
+    }
+
 	onMount(async () => {
         try {
             let response = await boot();
             switch (response.status) {
                 case 200:
-                    currentUser.update(() => ({
-                        username: response.data.login.name,
-                        id: response.data.login.id,
-                    }));
-                    subscribeToEvents();
+                    onBooted(response.data);
+                    subscribeToEvents(response.data.resume_point);
                     break;
                 case 401:
                     currentUser.update(() => null);
diff --git a/hi-ui/src/store/messages.js b/hi-ui/src/store/messages.js
index d1f19d3..560b9e1 100644
--- a/hi-ui/src/store/messages.js
+++ b/hi-ui/src/store/messages.js
@@ -17,6 +17,12 @@ export class Messages {
 		return this;
 	}
 
+	addMessages(channel, payloads) {
+		this.updateChannel(channel, (messages) => [...messages, ...payloads]);
+		return this;
+	}
+
+
 	deleteMessage(channel, message) {
 		let messages = this.messages(channel).filter((msg) => msg.message.id != message);
 		this.channels[channel] = messages;