working on remote display, bug fixes

src/main.tsx

@@ -1231,13 +1231,26 @@ class MainSideBar extends React.Component<{}, {}> {
         })();
     }
 
+    remoteDisplayName(remote : RemoteType) : any {
+        if (!isBlank(remote.remotealias)) {
+            return (
+                <>
+                    <span>{remote.remotealias}</span>
+                    <span className="small-text"> {remote.remotecanonicalname}</span>
+                </>
+            );
+        }
+        return (<span>{remote.remotecanonicalname}</span>);
+    }
+
     render() {
         let model = GlobalModel;
         let activeSessionId = model.activeSessionId.get();
         let session : Session = null;
-        let remotes = model.remotes;
+        let remotes = model.remotes ?? [];
         let remote : RemoteType = null;
         let idx : number = 0;
+        remotes = remotes.filter((r) => !r.archived);
         return (
             <div className={cn("main-sidebar", {"collapsed": this.collapsed.get()})}>
                 <div className="collapse-container">
@@ -1304,7 +1317,10 @@ class MainSideBar extends React.Component<{}, {}> {
                     </p>
                     <ul className="menu-list">
                         <For each="remote" of={remotes}>
-                            <li key={remote.remoteid}><a><i className={cn("remote-status fa fa-circle", "status-" + remote.status)}/>{remote.remotealias ?? remote.remotecanonicalname}</a></li>
+                            <li key={remote.remoteid} className="remote-menu-item"><a>
+                                <i className={cn("remote-status fa fa-circle", "status-" + remote.status)}/>
+                                {this.remoteDisplayName(remote)}
+                            </a></li>
                         </For>
                     </ul>
                     <div className="bottom-spacer"></div>

src/model.ts

@@ -1265,6 +1265,15 @@ class Model {
     cmdStatusUpdate(sessionId : string, cmdId : string, origStatus : string, newStatus : string) {
         // TODO force recompute usedrows in terminal when status changes to done
         console.log("cmd status", sessionId, cmdId, origStatus, "=>", newStatus);
+        let sw = this.getActiveSW();
+        if (sw == null || sw.sessionId != sessionId) {
+            return;
+        }
+        let term = sw.terms[cmdId];
+        if (term == null) {
+            return;
+        }
+        setTimeout(() => term.updateUsedRows(true), 500);
     }
 
     onMetaArrowUp() : void {
@@ -1406,7 +1415,7 @@ class Model {
         if ("sessions" in update) {
             let oldActiveScreen = this.getActiveScreen();
             genMergeData(this.sessionList, update.sessions, (s : Session) => s.sessionId, (sdata : SessionDataType) => sdata.sessionid, (sdata : SessionDataType) => new Session(sdata), (s : Session) => s.sessionIdx.get());
-            if (!("activatesessionid" in update)) {
+            if (!("activesessionid" in update)) {
                 let newActiveScreen = this.getActiveScreen();
                 if (oldActiveScreen != newActiveScreen) {
                     if (newActiveScreen == null) {

src/sh2.less

@@ -184,7 +184,7 @@ html, body, #main {
     border-right: 1px solid #aaa;
     padding: 0 5px 5px 5px;
     width: 200px;
-    overflow-x: auto;
+    overflow-x: hidden;
     display: flex;
     flex-direction: column;
     color: #ddd;
@@ -234,6 +234,14 @@ html, body, #main {
         }
     }
 
+    .menu-list li.remote-menu-item {
+        a {
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+    }
+
     .menu-list li a {
         color: #bbb;
         white-space: nowrap;
@@ -260,6 +268,11 @@ html, body, #main {
             font-size: 10px;
         }
 
+        .small-text {
+            color: #777;
+            font-size: 10px;
+        }
+
         &.is-active {
             color: #ddd;
             font-weight: bold;