get session list, switch to default session

src/main.tsx

@@ -7,8 +7,8 @@ import dayjs from 'dayjs'
 import {If, For, When, Otherwise, Choose} from "tsx-control-statements/components";
 import cn from "classnames"
 import {TermWrap} from "./term";
-import {getCurrentSession, getLineId, Session, initSession, newSession} from "./session";
-import type {LineType, CmdDataType, RemoteType} from "./session";
+import {getCurrentSession, getLineId, Session, newSession, getAllSessions, getCurrentSessionId} from "./session";
+import type {SessionType, LineType, CmdDataType, RemoteType} from "./session";
 import localizedFormat from 'dayjs/plugin/localizedFormat';
 
 dayjs.extend(localizedFormat)
@@ -403,8 +403,15 @@ class MainSideBar extends React.Component<{}, {}> {
             this.collapsed.set(!this.collapsed.get());
         })();
     }
+
+    handleSessionClick(sessionId : string) {
+        console.log("click session", sessionId);
+    }
     
     render() {
+        let curSessionId = getCurrentSessionId();
+        let sessions = getAllSessions();
+        let session : SessionType = null;
         return (
             <div className={cn("main-sidebar", {"collapsed": this.collapsed.get()})}>
                 <div className="collapse-container">
@@ -418,7 +425,9 @@ class MainSideBar extends React.Component<{}, {}> {
                         Private Sessions
                     </p>
                     <ul className="menu-list">
-                        <li><a className="is-active">#default</a></li>
+                        <For each="session" of={sessions}>
+                            <li key={session.sessionid}><a className={cn({"is-active": curSessionId == session.sessionid})} onClick={() => this.handleSessionClick(session.sessionid)}>#{session.name}</a></li>
+                        </For>
                         <li className="new-session"><a className="new-session"><i className="fa fa-plus"/> New Session</a></li>
                     </ul>
                     <p className="menu-label">

src/session.ts

@@ -11,6 +11,11 @@ function makeTermKey(sessionId : string, cmdId : string, windowId : string, line
     return sprintf("%s/%s/%s/%s", sessionId, cmdId, windowId, lineid);
 }
 
+type SessionType = {
+    sessionid : string,
+    name : string,
+};
+
 type LineType = {
     sessionid : string,
     windowid : string,
@@ -139,7 +144,7 @@ class Session {
     termMap : Record<string, TermWrap> = {};
     termMapById : Record<string, TermWrap> = {};
     history : HistoryItem[] = [];
-    loading : mobx.IObservableValue<boolean> = mobx.observable.box(false);
+    loading : mobx.IObservableValue<boolean> = mobx.observable.box(true);
     remotes : RemoteInstanceType[] = [];
     globalRemotes : RemoteType[];
     cmds : CmdDataType[];
@@ -387,10 +392,12 @@ class Session {
     }
 }
 
+var SessionList : mobx.IObservableArray<SessionType> = mobx.observable.array([]);
 var CurrentSession : Session = new Session();
+var CurrentSessionId : mobx.IObservableValue<string> = mobx.observable.box(null);
 
-function initSession(name : string) {
-    if (CurrentSession.loading.get()) {
+function initSession(sessionId : string, force : boolean) {
+    if (CurrentSession.loading.get() && !force) {
         return;
     }
     let remotesLoaded = false;
@@ -408,7 +415,7 @@ function initSession(name : string) {
         console.log("error calling get-remotes", err)
     });
     
-    let usp = new URLSearchParams({name: name});
+    let usp = new URLSearchParams({sessionid: sessionId});
     let url = new URL(sprintf("http://localhost:8080/api/get-session?") + usp.toString());
     fetch(url).then((resp) => handleJsonFetchResponse(url, resp)).then((data) => {
         mobx.action(() => {
@@ -453,7 +460,42 @@ function newSession() {
     
 }
 
-(window as any).getCurrentSession = getCurrentSession;
+function loadSessionList(init : boolean) {
+    let url = new URL("http://localhost:8080/api/get-all-sessions");
+    fetch(url).then((resp) => handleJsonFetchResponse(url, resp)).then((data) => {
+        mobx.action(() => {
+            SessionList.replace(data.data || []);
+            if (init) {
+                for (let i=0; i<SessionList.length; i++) {
+                    if (SessionList[i].name == "default") {
+                        setCurrentSessionId(SessionList[i].sessionid);
+                    }
+                }
+            }
+        })();
+        
+    }).catch((err) => {
+        console.log("error getting session list");
+    });
+}
 
-export {Session, getCurrentSession, getLineId, initSession, newSession};
-export type {LineType, WindowType, CmdDataType, RemoteType};
+function getAllSessions() : mobx.IObservableArray<SessionType> {
+    return SessionList;
+}
+
+function setCurrentSessionId(sessionId : string) {
+    if (CurrentSessionId.get() == sessionId) {
+        return;
+    }
+    mobx.action(() => {
+        CurrentSessionId.set(sessionId);
+        initSession(sessionId, true);
+    })();
+}
+
+function getCurrentSessionId() : string {
+    return CurrentSessionId.get();
+}
+
+export {Session, getCurrentSession, getLineId, newSession, loadSessionList, getAllSessions, getCurrentSessionId};
+export type {LineType, WindowType, CmdDataType, RemoteType, SessionType};

src/sh2.ts

@@ -5,7 +5,7 @@ import {Terminal} from 'xterm';
 import {Main} from "./main";
 import {GlobalWS} from "./ws";
 import {v4 as uuidv4} from "uuid";
-import {initSession} from "./session";
+import {loadSessionList} from "./session";
 
 // @ts-ignore
 let VERSION = __SHVERSION__;
@@ -13,7 +13,7 @@ let VERSION = __SHVERSION__;
 (window as any).ScriptHausClientId = uuidv4();
 
 document.addEventListener("DOMContentLoaded", () => {
-    initSession("default");
+    loadSessionList(true);
     GlobalWS.reconnect();
     let reactElem = React.createElement(Main, null, null);
     let elem = document.getElementById("app");