frontend: save selected channel

frontend/src/main.js

@@ -1,10 +1,9 @@
 import Main from './components/Main.svelte';
-import { getItem, init } from './storage';
+import { getItem } from './storage';
 import { authWithToken, useAuthHandlers } from './auth';
 import { initResponsiveHandlers } from './responsive';
 import { useDebuggingApi } from './debuggingapi';
 
-init();
 useDebuggingApi();
 initResponsiveHandlers();
 useAuthHandlers();

frontend/src/storage.js

@@ -3,11 +3,13 @@ const defaults = {
     "server:gatewayBase": `${location.protocol === "https:" ? "wss" : "ws"}://${location.host}/gateway`,
     "auth:token": "",
     "app:behavior:doAnimations": true,
+    "app:cache:openChannelId": -1,
     "loggingSink:Gateway": false,
     "loggingSink:Store": false
 };
 const store = new Map(Object.entries(defaults));
 const persistentProvider = localStorage;
+let didCacheProvider = false;
 
 export function setItem(key, value) {
     store.set(key, value);
@@ -17,6 +19,9 @@ export function setItem(key, value) {
 }
 
 export function getItem(key) {
+    if (!didCacheProvider) {
+        init();
+    }
     return store.get(key);
 }
 
@@ -42,6 +47,8 @@ export function init() {
             }
         }
     });
+
+    didCacheProvider = true;
 }
 
 export function apiRoute(fragment) {

frontend/src/stores.js

@@ -1,7 +1,7 @@
 import gateway, { GatewayEventType } from "./gateway";
 import logger from "./logging";
 import request from "./request";
-import { apiRoute } from "./storage";
+import { apiRoute, getItem, setItem } from "./storage";
 
 const storeLog = logger("Store");
 
@@ -42,7 +42,14 @@ class ChannelsStore extends Store {
         gateway.subscribe(GatewayEventType.Ready, ({ channels }) => {
             this.value = channels;
             if (channels.length >= 1) {
+                if (!selectedChannel.value || selectedChannel.value.id === -1) {
                     selectedChannel.set(channels[0]);
+                } else {
+                    // if a channel id is already selected, we'll populate it with the data we just got from the gateway
+                    const index = this.value.findIndex(e => e.id === selectedChannel.value.id);
+                    if (index !== -1)
+                        selectedChannel.set(this.value[index]);
+                }
             }
             this.updated();
         });
@@ -286,7 +293,7 @@ class OverlayStore extends Store {
     }
 }
 
-export const selectedChannel = new Store({ id: -1, name: "none", creator_id: -1 }, "selectedChannel");
+export const selectedChannel = new Store({ id: getItem("app:cache:openChannelId"), name: "none", creator_id: -1 }, "selectedChannel");
 export const showSidebar = new Store(false, "showSidebar");
 export const showChannelView = new Store(true, "showChannelView");
 export const smallViewport = new Store(false, "smallViewport");
@@ -306,3 +313,7 @@ export const allStores = {
     userInfoStore,
     overlayStore,
 };
+
+selectedChannel.subscribe((newSelectedChannel) => {
+    setItem("app:cache:openChannelId", newSelectedChannel.id);
+});