From 5dda89aa1ac97535c7d56dd23b53caac53c2644f Mon Sep 17 00:00:00 2001
From: sawka <mike.sawka@gmail.com>
Date: Fri, 19 Aug 2022 16:35:38 -0700
Subject: [PATCH] status display

---
 src/main.tsx | 10 +++++++---
 src/sh2.less | 34 +++++++++++++++++++++++++++++++---
 2 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/src/main.tsx b/src/main.tsx
index de26520d..f4e13721 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -270,16 +270,20 @@ class LineCmd extends React.Component<{sw : ScreenWindow, line : LineType, width
         let totalHeight = cellHeightPx * usedRows;
         let remote = model.getRemote(cmd.remoteId);
         let status = cmd.getStatus();
-        let running = (status == "running");
-        let detached = (status == "detached");
         let termOpts = cmd.getTermOpts();
         let isFocused = sw.getIsFocused(line.cmdid);
         let cmdRefNumStr = (this.props.cmdRefNum == null ? "?" : this.props.cmdRefNum.toString());
         return (
             <div className={cn("line", "line-cmd", {"focus": isFocused})} id={"line-" + getLineId(line)} ref={this.lineRef} style={{position: "relative"}} data-lineid={line.lineid} data-windowid={line.windowid} data-cmdid={line.cmdid}>
                 <div className="line-header">
-                    <div className={cn("avatar",{"num4": cmdRefNumStr.length == 4}, {"num5": cmdRefNumStr.length >= 5}, {"running": running}, {"detached": detached})} onClick={this.doRefresh}>
+                    <div className={cn("avatar",{"num4": cmdRefNumStr.length == 4}, {"num5": cmdRefNumStr.length >= 5}, "status-" + status)} onClick={this.doRefresh}>
                         {cmdRefNumStr}
+                        <If condition={status == "hangup" || status == "error"}>
+                            <i className="fa fa-exclamation-triangle status-icon"/>
+                        </If>
+                        <If condition={status == "detached"}>
+                            <i className="fa fa-refresh status-icon"/>
+                        </If>
                     </div>
                     <div className="meta-wrap">
                         <div className="meta">
diff --git a/src/sh2.less b/src/sh2.less
index e4ccf90b..6690fae4 100644
--- a/src/sh2.less
+++ b/src/sh2.less
@@ -378,6 +378,14 @@ html, body, #main {
         font-size: 1rem;
         margin-right: 10px;
         border-radius: 5px;
+        position: relative;
+        
+        .status-icon {
+            font-size: 8px;
+            position: absolute;
+            top: 2px;
+            right: 2px;
+        }
 
         &.num4 {
             font-size: 0.8rem;
@@ -387,13 +395,33 @@ html, body, #main {
             font-size: 0.7rem;
         }
 
-        &.running {
+        &.status-done {
+            background-color: #555;
+        }
+
+        &.status-error {
+            .status-icon {
+                color: #cc0000;
+            }
+        }
+
+        &.status-hangup {
+            .status-icon {
+                color: #c4a000;
+            }
+        }
+
+        &.status-running {
             background-color: #729fcf;
         }
 
-        &.detached {
+        &.status-detached {
             background-color: #729fcf;
-            outline: 2px solid white;
+            .status-icon {
+                top: 3px;
+                right: 3px;
+                color: white;
+            }
         }
     }