From 3aeab9d4278e72d45ba4d02b41b62a77c6f6f3f1 Mon Sep 17 00:00:00 2001
From: sawka <mike.sawka@gmail.com>
Date: Tue, 23 Aug 2022 17:27:12 -0700
Subject: [PATCH] show metacmd completions

---
 src/main.tsx | 14 ++++++++++++--
 src/sh2.less |  7 +++++++
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/main.tsx b/src/main.tsx
index 051b7bdc0..6e35ec2e4 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -328,6 +328,13 @@ class CmdInput extends React.Component<{}, {}> {
     lastHistoryUpDown : boolean = false;
     lastTabCurLine : mobx.IObservableValue<string> = mobx.observable.box(null);
 
+    componentDidMount() {
+        let input = document.getElementById("main-cmd-input");
+        if (input != null) {
+            input.focus();
+        }
+    }
+
     isModKeyPress(e : any) {
         return e.code.match(/^(Control|Meta|Alt|Shift)(Left|Right)$/);
     }
@@ -433,6 +440,9 @@ class CmdInput extends React.Component<{}, {}> {
     }
 
     getAfterSlash(s : string) : string {
+        if (s.startsWith("^/")) {
+            return s.substr(1);
+        }
         let slashIdx = s.lastIndexOf("/");
         if (slashIdx == s.length-1) {
             slashIdx = s.lastIndexOf("/", slashIdx-1);
@@ -489,14 +499,14 @@ class CmdInput extends React.Component<{}, {}> {
                     <If condition={infoMsg && infoMsg.infolines != null}>
                         <div className="info-lines">
                             <For index="idx" each="line" of={infoMsg.infolines}>
-                                <div key={idx}>{line}</div>
+                                <div key={idx}>{line == "" ? " " : line}</div>
                             </For>
                         </div>
                     </If>
                     <If condition={infoMsg && infoMsg.infocomps != null && infoMsg.infocomps.length > 0}>
                         <div className="info-comps">
                             <For each="istr" index="istrIdx" of={infoMsg.infocomps}>
-                                <div key={istrIdx} className="info-comp">
+                                <div key={istrIdx} className={cn("info-comp", {"metacmd-comp": istr.startsWith("^")})}>
                                     {this.getAfterSlash(istr)}
                                 </div>
                             </For>
diff --git a/src/sh2.less b/src/sh2.less
index fb9267ba2..c37521e88 100644
--- a/src/sh2.less
+++ b/src/sh2.less
@@ -571,6 +571,9 @@ body .xterm .xterm-viewport {
         .info-lines {
             color: #d3d7cf;
             font-size: 12px;
+            font-family: 'JetBrains Mono', monospace;
+            white-space: pre;
+            padding-bottom: 6px;
         }
 
         .info-comps {
@@ -583,6 +586,10 @@ body .xterm .xterm-viewport {
                 min-width: 200px;
                 color: #d3d7cf;
             }
+
+            .metacmd-comp {
+                color: #8ae234;
+            }
         }
 
         .info-error {