From 8d78e145be6f913ca431348eb7086bc2d2503ba1 Mon Sep 17 00:00:00 2001
From: sawka <mike.sawka@gmail.com>
Date: Wed, 14 Sep 2022 12:07:31 -0700
Subject: [PATCH] sort remotes, order by remoteidx and status

---
 src/main.tsx | 23 ++++++++++++++++++++++-
 src/sh2.less |  5 +++++
 src/types.ts |  1 +
 3 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/src/main.tsx b/src/main.tsx
index b96a21a0..5f96a4b4 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1206,6 +1206,19 @@ class SessionView extends React.Component<{}, {}> {
     }
 }
 
+function getConnVal(r : RemoteType) : number {
+    if (r.status == "connected") {
+        return 1;
+    }
+    if (r.status == "init" || r.status == "disconnected") {
+        return 2;
+    }
+    if (r.status == "error") {
+        return 3;
+    }
+    return 4;
+}
+
 @mobxReact.observer
 class MainSideBar extends React.Component<{}, {}> {
     collapsed : mobx.IObservableValue<boolean> = mobx.observable.box(false);
@@ -1251,6 +1264,14 @@ class MainSideBar extends React.Component<{}, {}> {
         let remote : RemoteType = null;
         let idx : number = 0;
         remotes = remotes.filter((r) => !r.archived);
+        remotes.sort((a, b) => {
+            let connValA = getConnVal(a);
+            let connValB = getConnVal(b);
+            if (connValA != connValB) {
+                return connValA - connValB;
+            }
+            return a.remoteidx - b.remoteidx;
+        });
         return (
             <div className={cn("main-sidebar", {"collapsed": this.collapsed.get()})}>
                 <div className="collapse-container">
@@ -1315,7 +1336,7 @@ class MainSideBar extends React.Component<{}, {}> {
                     <p className="menu-label">
                         <a onClick={() => this.clickRemotes()}>Remotes</a>
                     </p>
-                    <ul className="menu-list">
+                    <ul className="menu-list remotes-menu-list">
                         <For each="remote" of={remotes}>
                             <li key={remote.remoteid} className="remote-menu-item"><a>
                                 <i className={cn("remote-status fa fa-circle", "status-" + remote.status)}/>
diff --git a/src/sh2.less b/src/sh2.less
index 2ebf299e..41f82b78 100644
--- a/src/sh2.less
+++ b/src/sh2.less
@@ -234,6 +234,11 @@ html, body, #main {
         }
     }
 
+    .menu-list.remotes-menu-list {
+        max-height: 35%;
+        overflow-y: auto;
+    }
+
     .menu-list li.remote-menu-item {
         a {
             white-space: nowrap;
diff --git a/src/types.ts b/src/types.ts
index d9be6923..524e6c38 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -79,6 +79,7 @@ type RemoteType = {
     status : string,
     defaultstate : RemoteStateType,
     connectmode : string,
+    remoteidx : number,
     remove? : boolean,
 };