frontend: save selected channel

frontend/src/debuggingapi.js

@@ -0,0 +1,22 @@
+import gateway from './gateway';
+import { getItem, init, setItem, removeItem } from './storage';
+import { allStores } from './stores';
+import { authWithToken, logOut } from './auth';
+
+export function useDebuggingApi() {
+    window.__waffle = {
+        gateway,
+        storage: {
+            getItem,
+            setItem,
+            removeItem,
+            init
+        },
+        auth: {
+            authWithToken,
+            logOut
+        },
+        stores: allStores,
+        app: null
+    };
+}

frontend/src/main.js

@@ -1,14 +1,10 @@
 import Main from './components/Main.svelte';
-import gateway from './gateway';
+import { getItem } from './storage';
-import { getItem, init } from './storage';
 import { authWithToken, useAuthHandlers } from './auth';
 import { initResponsiveHandlers } from './responsive';
+import { useDebuggingApi } from './debuggingapi';
 
-window.__waffle = {
+useDebuggingApi();
-	gateway
-};
-
-init();
 initResponsiveHandlers();
 useAuthHandlers();
 authWithToken(getItem("auth:token"));
@@ -22,5 +18,6 @@ if (loadingElement) {
 const app = new Main({
 	target: document.body
 });
+window.__waffle.app = app;
 
 export default app;

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");
@@ -295,3 +302,18 @@ export const gatewayStatus = new GatewayStatusStore();
 export const messagesStoreProvider = new MessagesStoreProvider();
 export const userInfoStore = new UserInfoStore();
 export const overlayStore = new OverlayStore();
+export const allStores = {
+    selectedChannel,
+    showSidebar,
+    showChannelView,
+    smallViewport,
+    channels,
+    gatewayStatus,
+    messagesStoreProvider,
+    userInfoStore,
+    overlayStore,
+};
+
+selectedChannel.subscribe((newSelectedChannel) => {
+    setItem("app:cache:openChannelId", newSelectedChannel.id);
+});