merge branch 'main' into ssh-extra-fixes

feat: add connection segfault protection
A user recently reported a crash on a failed connection. This handles these errors more gracefully than the previous system and prints the errors to the connection prompt.
2026-04-22 15:26:58 -07:00 · 2024-03-14 16:20:55 -07:00 · 2024-03-14 16:19:32 -07:00 · 2024-03-14 01:07:54 -07:00 · 2024-03-13 18:08:29 -07:00 · 2024-03-08 00:32:46 -08:00
169 changed files with 8239 additions and 11739 deletions
@@ -1,8 +1,7 @@
 [
    {
      "command": "system:toggleDeveloperTools",
-      "keys": ["Cmd:Option:i"],
-      "info": "Opens the chrome developer tool menu"
+      "keys": ["Cmd:Option:i"]
    },
    {
      "command": "system:hideWindow",
@@ -16,62 +15,10 @@
      "command": "generic:confirm",
      "keys": ["Enter"]
    },
-    {
-      "command": "generic:expandTextInput",
-      "keys": ["Shift:Enter", "Ctrl:Enter"]
-    },
    {
      "command": "generic:deleteItem",
      "keys": ["Backspace", "Delete"]
    },
-    {
-      "command": "generic:space",
-      "keys": ["Space"]
-    },
-    {
-      "command": "generic:tab",
-      "keys": ["Tab"]
-    },
-    {
-      "command": "generic:numpad-0",
-      "keys": ["0"]
-    },
-    {
-      "command": "generic:numpad-1",
-      "keys": ["1"]
-    },
-    {
-      "command": "generic:numpad-2",
-      "keys": ["2"]
-    },
-    {
-      "command": "generic:numpad-3",
-      "keys": ["3"]
-    },
-    {
-      "command": "generic:numpad-4",
-      "keys": ["4"]
-    },
-    {
-      "command": "generic:numpad-5",
-      "keys": ["5"]
-    },
-    {
-      "command": "generic:numpad-6",
-      "keys": ["6"]
-    },
-    {
-      "command": "generic:numpad-7",
-      "keys": ["7"]
-    },
-    {
-      "command": "generic:numpad-8",
-      "keys": ["8"]
-    },
-    {
-      "command": "generic:numpad-9",
-      "keys": ["9"]
-    },
    {
      "command": "generic:selectAbove",
      "keys": ["ArrowUp"]
@@ -80,14 +27,6 @@
      "command": "generic:selectBelow",
      "keys": ["ArrowDown"]
    },
-    {
-      "command": "generic:selectLeft",
-      "keys": ["ArrowLeft"]
-    },
-    {
-      "command": "generic:selectRight",
-      "keys": ["ArrowRight"]
-    },
    {
      "command": "generic:selectPageAbove",
      "keys": ["PageUp"]
@@ -128,8 +67,7 @@
    },
    {
      "command": "app:restartCommand",
-      "keys": ["Cmd:r"],
-      "info": "Restarts the command running in the current selected line"
+      "keys": ["Cmd:r"]
    },
    {
      "command": "app:restartLastCommand",
@@ -149,48 +87,39 @@
    },
    {
      "command": "app:selectTab-1",
-      "keys": ["Cmd:1"],
-      "commandStr":"/screen 1"
+      "keys": ["Cmd:1"]
    },
    {
      "command": "app:selectTab-2",
-      "keys": ["Cmd:2"],
-      "commandStr":"/screen 2"
+      "keys": ["Cmd:2"]
    },
    {
      "command": "app:selectTab-3",
-      "keys": ["Cmd:3"],
-      "commandStr":"/screen 3"
+      "keys": ["Cmd:3"]
    },
    {
      "command": "app:selectTab-4",
-      "keys": ["Cmd:4"],
-      "commandStr":"/screen 4"
+      "keys": ["Cmd:4"]
    },
    {
      "command": "app:selectTab-5",
-      "keys": ["Cmd:5"],
-      "commandStr":"/screen 5"
+      "keys": ["Cmd:5"]
    },
    {
      "command": "app:selectTab-6",
-      "keys": ["Cmd:6"],
-      "commandStr":"/screen 6"
+      "keys": ["Cmd:6"]
    },
    {
      "command": "app:selectTab-7",
-      "keys": ["Cmd:7"],
-      "commandStr":"/screen 7"
+      "keys": ["Cmd:7"]
    },
    {
      "command": "app:selectTab-8",
-      "keys": ["Cmd:8"],
-      "commandStr":"/screen 8"
+      "keys": ["Cmd:8"]
    },
    {
      "command": "app:selectTab-9",
-      "keys": ["Cmd:9"],
-      "commandStr":"/screen 9"
+      "keys": ["Cmd:9"]
    },
    {
      "command": "app:selectTabLeft",
@@ -6,7 +6,7 @@
    },
    "productName": "Wave",
    "description": "An Open-Source, AI-Native, Terminal Built for Seamless Workflows",
-    "version": "0.7.2",
+    "version": "0.7.0",
    "main": "dist/emain.js",
    "license": "Apache-2.0",
    "repository": {
@@ -23,6 +23,7 @@
        "@table-nav/react": "^0.0.7",
        "@tanstack/match-sorter-utils": "^8.8.4",
        "@tanstack/react-table": "^8.10.3",
+        "@types/semver": "^7.5.6",
        "autobind-decorator": "^2.4.0",
        "base64-js": "^1.5.1",
        "classnames": "^2.3.1",
@@ -32,28 +33,23 @@
        "electron-updater": "^6.1.8",
        "framer-motion": "^10.16.16",
        "mobx": "6.12",
-        "mobx-react": "^9.1.1",
+        "mobx-react": "^7.5.0",
        "monaco-editor": "^0.44.0",
        "mustache": "^4.2.0",
        "node-fetch": "^3.2.10",
-        "overlayscrollbars": "^2.6.1",
-        "overlayscrollbars-react": "^0.5.5",
        "papaparse": "^5.4.1",
-        "preact": "^10.20.1",
-        "react": "npm:@preact/compat",
-        "react-dom": "npm:@preact/compat",
+        "react": "^18.1.0",
+        "react-dom": "^18.1.0",
        "react-markdown": "^9.0.0",
        "remark": "^15.0.1",
        "remark-gfm": "^4.0.0",
        "sprintf-js": "^1.1.2",
        "throttle-debounce": "^5.0.0",
-        "tsx-control-statements": "^5.1.1",
+        "tsx-control-statements": "^4.1.1",
        "uuid": "^9.0.0",
        "winston": "^3.8.2",
-        "xterm": "^5.3.0",
-        "xterm-addon-serialize": "^0.11.0",
-        "xterm-addon-web-links": "^0.9.0",
-        "xterm-addon-webgl": "^0.16.0"
+        "xterm": "^5.0.0",
+        "xterm-addon-web-links": "^0.9.0"
    },
    "devDependencies": {
        "@babel/cli": "^7.17.10",
@@ -70,24 +66,24 @@
        "@svgr/webpack": "^8.1.0",
        "@types/classnames": "^2.3.1",
        "@types/electron": "^1.6.10",
-        "@types/node": "^20.11.0",
+        "@types/node": "20.11.0",
        "@types/papaparse": "^5.3.10",
-        "@types/semver": "^7.5.6",
+        "@types/react": "^18.0.12",
        "@types/sprintf-js": "^1.1.3",
        "@types/throttle-debounce": "^5.0.1",
-        "@types/uuid": "^9.0.7",
+        "@types/uuid": "9.0.7",
        "@types/webpack-env": "^1.18.3",
        "babel-loader": "^9.1.3",
        "babel-plugin-jsx-control-statements": "^4.1.2",
-        "copy-webpack-plugin": "^12.0.0",
+        "copy-webpack-plugin": "^11.0.0",
        "css-loader": "^6.7.1",
-        "electron": "^29.0.1",
+        "electron": "29.0.1",
        "electron-builder": "^24.13.3",
        "electron-builder-squirrel-windows": "^24.13.3",
        "file-loader": "^6.2.0",
        "http-server": "^14.1.1",
        "less": "^4.1.2",
-        "less-loader": "^12.0.0",
+        "less-loader": "^11.0.0",
        "lodash-webpack-plugin": "^0.11.6",
        "mini-css-extract-plugin": "^2.6.0",
        "prettier": "^2.8.8",
@@ -98,7 +94,7 @@
        "webpack": "^5.73.0",
        "webpack-bundle-analyzer": "^4.10.1",
        "webpack-cli": "^5.1.4",
-        "webpack-dev-server": "^5.0.4",
+        "webpack-dev-server": "^4.9.1",
        "webpack-merge": "^5.8.0",
        "yaml": "^2.4.0"
    },
@@ -5,14 +5,14 @@
        <base href="../" />
        <script charset="UTF-8" src="dist-dev/waveterm.js"></script>
        <link rel="stylesheet" href="public/bulma-0.9.4.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/fontawesome.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/brands.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/solid.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/sharp-solid.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/sharp-regular.min.css" />
+        <link rel="stylesheet" href="public/fontawesome/css/fontawesome.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/brands.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/solid.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/sharp-solid.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/sharp-regular.min.css">
        <link rel="stylesheet" href="dist-dev/waveterm.css" />

-        <link rel="stylesheet" id="theme-stylesheet" href="public/themes/themequery.css" />
+        <link rel="stylesheet" id="theme-stylesheet" href="public/themes/default.css">
    </head>
    <body>
        <div id="measure"></div>
@@ -5,14 +5,14 @@
        <base href="../" />
        <script charset="UTF-8" src="dist/waveterm.js"></script>
        <link rel="stylesheet" href="public/bulma-0.9.4.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/fontawesome.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/brands.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/solid.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/sharp-solid.min.css" />
-        <link rel="stylesheet" href="public/fontawesome/css/sharp-regular.min.css" />
+        <link rel="stylesheet" href="public/fontawesome/css/fontawesome.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/brands.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/solid.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/sharp-solid.min.css">
+        <link rel="stylesheet" href="public/fontawesome/css/sharp-regular.min.css">
        <link rel="stylesheet" href="dist/waveterm.css" />

-        <link rel="stylesheet" id="theme-stylesheet" href="public/themes/themequery.css" />
+        <link rel="stylesheet" id="theme-stylesheet" href="public/themes/default.css" />
    </head>
    <body>
        <div id="measure"></div>
@@ -7,6 +7,16 @@
 :root {
    --fa-style-family: "Font Awesome 6 Sharp";

+    /* these variables are overridden by user settings */
+    /*
+    --termfontfamily: "Hack";
+    --termfontsize: 13px;
+    --termlineheight: 15px;
+    --termpad: 7px;
+    --termfontsize-sm: 11px;
+    --termlineheight-sm: 13px;
+    */
+
    /* base fonts */
    --base-font: normal 15px / normal "Lato", sans-serif;

@@ -34,18 +44,16 @@
    --floating-logo-width: 40px;
    --floating-logo-height: var(--screentabs-height);

-    /* right sidebar triggers */
-    --floating-right-sidebar-triggers-width-darwin: 50px;
-    --floating-right-sidebar-triggers-width: 40px;
-
    /* global colors */
    --app-bg-color: black;
    --app-accent-color: rgb(88, 193, 66);
-    --app-accent-bg-color: rgba(88, 193, 66, 0.25);
+    --app-accent-bg-color: rgba(88, 193, 66, 0.2);
+    --app-error-color: rgb(229, 77, 46);
+    --app-warning-color: rgb(224, 185, 86);
+    --app-success-color: rgb(78, 154, 6);
    --app-text-color: rgb(211, 215, 207);
    --app-text-primary-color: rgb(255, 255, 255);
    --app-text-secondary-color: rgb(195, 200, 194);
-    --app-text-disabled-color: rgb(173, 173, 173);
    --app-border-color: rgb(51, 51, 51);
    --app-maincontent-bg-color: #333;
    --app-panel-bg-color: rgba(21, 23, 21, 1);
@@ -54,20 +62,19 @@
    --app-icon-hover-color: #fff;
    --app-selected-mask-color: rgba(255, 255, 255, 0.06);

-    /* global status colors */
-    --app-error-color: rgb(229, 77, 46);
-    --app-warning-color: rgb(224, 185, 86);
-    --app-success-color: rgb(78, 154, 6);
-    --app-idle-color: var(--app-text-secondary-color);
+    /* icon colors */

    /* just for macos */
    --app-border-radius-darwin: 10px;

+    /* global generic colors */
+    --app-black: rgb(0, 0, 0);
+
    /* scrollbar colors */
+    /* --scrollbar-background-color: rgba(21, 23, 21, 1); */
    --scrollbar-background-color: var(--app-bg-color);
    --scrollbar-thumb-color: rgba(255, 255, 255, 0.3);
    --scrollbar-thumb-hover-color: rgba(255, 255, 255, 0.5);
-    --scrollbar-thumb-active-color: rgba(255, 255, 255, 0.6);

    /* code color */
    --pre-bg-color: rgb(0, 0, 0);
@@ -87,7 +94,6 @@
    --form-element-border-color: rgba(241, 246, 243, 0.15);
    --form-element-bg-color: var(--app-bg-color);
    --form-element-text-color: var(--app-text-primary-color);
-    --form-element-primary-text-color: var(--app-text-primary-color);
    --form-element-label-color: var(--app-text-secondary-color);
    --form-element-primary-color: var(--app-accent-color);
    --form-element-secondary-color: rgba(255, 255, 255, 0.2);
@@ -106,15 +112,34 @@
    --markdown-bg-color: rgb(35, 35, 35);
    --markdown-outline-color: var(--form-element-primary-color);

+    /* status(remote) colors */
+    /* todo: all status colors must be unified */
+    --status-connected-color: var(--app-success-color);
+    --status-connecting-color: var(--app-warning-color);
+    --status-error-color: var(--app-error-color);
+    --status-disconnected-color: var(--app-text-secondary-color);
+
+    /* status indicator colors */
+    /* todo: all status colors must be unified */
+    --status-indicator-color: var(--app-text-color);
+    --status-indicator-error: var(--status-error-color);
+    --status-indicator-success: var(--status-connected-color);
+
+    /* status(version) colors */
+    /* todo: all status colors must be unified */
+    --status-outdated-color: var(--status-connecting-color);
+    --status-updated-color: var(--status-connected-color);
+
    /* term status colors */
-    --term-error-color: var(--app-error-color);
-    --term-warning-color: var(--app-warning-color);
+    /* todo: all status colors must be unified */
+    --term-error-color: var(--status-error-color);
+    --term-warning-color: var(--status-connecting-color);

    /* hotkey colors */
    --hotkey-text-color: var(--app-text-secondary-color);

    /* sidebar colors */
-    --sidebar-highlight-color: var(--app-accent-bg-color);
+    --sidebar-highlight-color: rgba(241, 246, 243, 0.08);
    --sidebar-font-size: 15px;
    --sidebar-line-height: 1.5;
    --sidebar-font-weight: normal;
@@ -127,6 +152,7 @@
    --line-text-color: rgb(211, 215, 207);
    --line-svg-fill-color: rgb(150, 152, 150);
    --line-svg-hover-fill-color: #eceeec;
+    --line-selected-border-color: rgb(193, 195, 193);
    --line-separator-color: rgb(126, 126, 126);
    --line-error-color: var(--app-error-color);
    --line-warning-color: var(--app-warning-color);
@@ -149,6 +175,17 @@
    --line-actions-active-color: rgba(255, 255, 255, 1);
    --line-actions-bg-color: rgba(255, 255, 255, 0.15);

+    /* view colors */
+    /* todo: bookmarks is a view, colors must be unified with --view* colors */
+    --bookmarks-text-color: rgb(211, 215, 207);
+    --bookmarks-textarea-bg-color: rgb(0, 0, 0);
+    --bookmarks-disabled-text-color: rgb(173, 173, 173);
+    --bookmarks-control-hover-color: rgb(255, 255, 255);
+
+    /* view colors */
+    --view-error-color: var(--app-error-color);
+    --view-text-color: var(--app-text-color);
+
    /* table colors */
    --table-border-color: rgba(241, 246, 243, 0.15);
    --table-thead-border-top-color: rgba(250, 250, 250, 0.1);
@@ -159,6 +196,9 @@
    --table-tr-selected-bg-color: #222;
    --table-tr-selected-hover-bg-color: #333;

+    /* session colors */
+    --session-bg-color: rgba(13, 13, 13, 0.85);
+
    /* cmdinput colors */
    --cmdinput-textarea-bg-color: #171717;
    --cmdinput-text-error-color: var(--term-red);
@@ -179,20 +219,5 @@
    --modal-bg-color: var(--app-bg-color);
    --modal-header-bottom-border-color: rgba(241, 246, 243, 0.15);

-    --logo-button-hover-bg-color: var(--app-accent-bg-color);
-
-    --xterm-viewport-border-color: rgba(241, 246, 243, 0.15);
-
-    --datepicker-cell-hover-bg-color: rgba(255, 255, 255, 0.06);
-    --datepicker-cell-other-text-color: rgba(255, 255, 255, 0.3);
-    --datepicker-header-fade-color: rgba(255, 255, 255, 0.4);
-    --datepicker-year-header-bg-color: rgba(255, 255, 255, 0.2); /* Light grey background */
-    --datepicker-year-header-border-color: rgba(241, 246, 243, 0.15); /* Light grey border */
-
-    /* OverlayScrollbars styling */
-    .os-scrollbar {
-        --os-handle-bg: var(--scrollbar-thumb-color);
-        --os-handle-bg-hover: var(--scrollbar-thumb-hover-color);
-        --os-handle-bg-active: var(--scrollbar-thumb-active-color);
-    }
+    --logo-button-hover-bg-color: #1e1e1e;
 }
@@ -1,8 +1,9 @@
 /* Copyright 2024, Command Line Inc.
   SPDX-License-Identifier: Apache-2.0 */

-@import url("./term-default.css");
-@import url("./term-light.css");
+@import "./default.css";
+@import "./term-default.css";
+@import "./term-light.css";

 :root {
    --app-bg-color: #fefefe;
@@ -22,7 +23,14 @@

    /* tab color */
    --tab-white: rgb(0, 0, 0, 0.6);
-    --tab-mint: rgb(70, 235, 156);
+
+    /* button colors */
+    --button-text-color: rgb(50, 50, 50); /* Dark gray for light theme */
+    --button-primary-color: #fefefe;
+    --button-secondary-bg-color: rgba(200, 200, 200, 0.3); /* Semi-transparent light gray */
+
+    /* view colors */
+    --view-text-color: var(--app-text-color);

    /* table colors */
    --table-thead-border-top-color: rgba(0, 0, 0, 0.2);
@@ -36,8 +44,7 @@
    /* form colors */
    --form-element-border-color: rgba(0, 0, 0, 0.3);
    --form-element-bg-color: var(--app-bg-color);
-    --form-element-text-color: var(--app-text-primary-color);
-    --form-element-primary-text-color: var(--app-text-primary-color);
+    --form-element-text-color: var(--app-text-color);
    --form-element-label-color: rgba(0, 0, 0, 0.6);
    --form-element-secondary-color: rgba(0, 0, 0, 0.09);
    --form-element-icon-color: rgb(0, 0, 0, 0.6);
@@ -57,23 +64,14 @@
    --scrollbar-background-color: var(--app-bg-color);
    --scrollbar-thumb-color: rgba(0, 0, 0, 0.2);
    --scrollbar-thumb-hover-color: rgba(0, 0, 0, 0.4);
-    --scrollbar-thumb-active-color: rgba(0, 0, 0, 0.5);

    /* line color */
    --line-actions-bg-color: rgba(0, 0, 0, 0.1);
    --line-actions-inactive-color: rgba(0, 0, 0, 0.3);
    --line-actions-active-color: rgba(0, 0, 0, 1);

-    --logo-button-hover-bg-color: #f0f0f0;
-
-    --xterm-viewport-border-color: rgba(0, 0, 0, 0.3);
-
-    --datepicker-cell-hover-bg-color: #f0f0f0;
-    --datepicker-cell-other-text-color: rgba(0, 0, 0, 0.3);
-    --datepicker-header-fade-color: rgba(0, 0, 0, 0.4);
-    --datepicker-year-header-bg-color: #f5f5f5;
-    --datepicker-year-header-border-color: #dcdcdc;
-
    /* toggle colors */
    --toggle-thumb-color: var(--app-bg-color);
+
+    --logo-button-hover-bg-color: #f0f0f0;
 }
@@ -27,6 +27,6 @@
    --term-cmdtext: #ffffff;
    --term-foreground: #d3d7cf;
    --term-background: #000000;
-    --term-selection-background: #ffffff60;
+    --term-selection-background: #ffffff90;
    --term-cursor-accent: #000000;
 }
@@ -1,3 +0,0 @@
-@import url("./default.css") screen;
-
-@import url("./light.css") screen and (prefers-color-scheme: light);
@@ -44,7 +44,7 @@ rm -rf bin/
 rm -rf build/
 node_modules/.bin/webpack --env prod
 WAVESRV_VERSION=$(node -e 'console.log(require("./version.js"))')
-WAVESHELL_VERSION=v0.6
+WAVESHELL_VERSION=v0.5
 GO_LDFLAGS="-s -w -X main.BuildTime=$(date +'%Y%m%d%H%M')"
 function buildWaveShell {
    (cd waveshell; CGO_ENABLED=0 GOOS=$1 GOARCH=$2 go build -ldflags="$GO_LDFLAGS" -o ../bin/mshell/mshell-$WAVESHELL_VERSION-$1.$2 main-waveshell.go)
@@ -69,7 +69,7 @@ rm -rf bin/
 rm -rf build/
 node_modules/.bin/webpack --env prod
 WAVESRV_VERSION=$(node -e 'console.log(require("./version.js"))')
-WAVESHELL_VERSION=v0.6
+WAVESHELL_VERSION=v0.5
 GO_LDFLAGS="-s -w -X main.BuildTime=$(date +'%Y%m%d%H%M')"
 function buildWaveShell {
    (cd waveshell; CGO_ENABLED=0 GOOS=$1 GOARCH=$2 go build -ldflags="$GO_LDFLAGS" -o ../bin/mshell/mshell-$WAVESHELL_VERSION-$1.$2 main-waveshell.go)
@@ -96,7 +96,7 @@ CGO_ENABLED=1 go build -tags "osusergo,netgo,sqlite_omit_load_extension" -ldflag
 ```bash
 # @scripthaus command fullbuild-waveshell
 set -e
-WAVESHELL_VERSION=v0.6
+WAVESHELL_VERSION=v0.5
 GO_LDFLAGS="-s -w -X main.BuildTime=$(date +'%Y%m%d%H%M')"
 function buildWaveShell {
    (cd waveshell; CGO_ENABLED=0 GOOS=$1 GOARCH=$2 go build -ldflags="$GO_LDFLAGS" -o ../bin/mshell/mshell-$WAVESHELL_VERSION-$1.$2 main-waveshell.go)
@@ -101,7 +101,6 @@ body input.input {
    font-size: 10px;
    font-weight: 300;
    line-height: 14px;
-    user-select: none;
 }

 .text-s1.icon {
@@ -251,13 +250,6 @@ input[type="checkbox"] {
    justify-content: center;
 }

-.flex-centered-column {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
-
 a.a-block {
    display: block;
 }
@@ -310,25 +302,6 @@ a.a-block {
    }
 }

-.right-sidebar-triggers {
-    position: absolute;
-    z-index: 25;
-    right: 0px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    pointer-events: none;
-    height: 38px;
-    padding: 0 5px;
-
-    .right-sidebar-trigger {
-        cursor: pointer;
-        user-select: none;
-        -webkit-app-region: no-drag;
-        pointer-events: all;
-    }
-}
-
 .copied-indicator {
    position: absolute;
    top: 0;
@@ -743,28 +716,28 @@ a.a-block {
 .status-icon.status-connected {
    path,
    circle {
-        fill: var(--app-success-color);
+        fill: var(--status-connected-color);
    }
 }

 .status-icon.status-connecting {
    path,
    circle {
-        fill: var(--app-warning-color);
+        fill: var(--status-connecting-color);
    }
 }

 .status-icon.status-disconnected {
    path,
    circle {
-        fill: var(--app-idle-color);
+        fill: var(--status-disconnected-color);
    }
 }

 .status-icon.status-error {
    path,
    circle {
-        fill: var(--app-error-color);
+        fill: var(--status-error-color);
    }
 }

@@ -793,75 +766,6 @@ a.a-block {
    margin-top: 6px;
 }

-.conn-dropdown {
-    width: 412px;
-
-    .lefticon {
-        position: absolute;
-        top: 50%;
-        left: 16px;
-        transform: translateY(-50%);
-
-        .globe-icon {
-            width: 16px;
-            height: 16px;
-            flex-shrink: 0;
-            fill: var(--app-text-secondary-color);
-        }
-
-        .status-icon {
-            position: absolute;
-            left: 7px;
-            top: 8px;
-            circle {
-                stroke: var(--app-bg-color);
-            }
-        }
-    }
-
-    .wave-dropdown-display {
-        bottom: 7px;
-    }
-}
-
-.tab-colors,
-.tab-icons {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-
-    .tab-color-sep,
-    .tab-icon-sep {
-        padding-left: 10px;
-        padding-right: 10px;
-        font-weight: bold;
-        user-select: none;
-    }
-
-    .tab-color-icon,
-    .tab-icon-icon {
-        width: 1.1em;
-        vertical-align: middle;
-    }
-
-    .tab-color-name,
-    .tab-icon-name {
-        display: inline-block;
-        margin-left: 1em;
-        min-width: 70px;
-        user-select: none;
-    }
-
-    .tab-color-select,
-    .tab-icon-select {
-        cursor: pointer;
-        margin: 3px;
-        &:hover {
-            outline: 2px solid white;
-        }
-    }
-}
-
 .settings-field {
    display: flex;
    flex-direction: row;
@@ -896,7 +800,6 @@ a.a-block {
        display: flex;
        flex-direction: row;
        align-items: center;
-        user-select: none;
        .info-message {
            margin-left: 5px;
        }
@@ -923,7 +826,7 @@ a.a-block {
            }
        }

-        input:not(.wave-input) {
+        input {
            padding: 4px;
            border-radius: 3px;
        }
@@ -934,6 +837,42 @@ a.a-block {
            }
        }

+        .tab-colors,
+        .tab-icons {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+
+            .tab-color-sep,
+            .tab-icon-sep {
+                padding-left: 10px;
+                padding-right: 10px;
+                font-weight: bold;
+            }
+
+            .tab-color-icon,
+            .tab-icon-icon {
+                width: 1.1em;
+                vertical-align: middle;
+            }
+
+            .tab-color-name,
+            .tab-icon-name {
+                display: inline-block;
+                margin-left: 1em;
+                min-width: 70px;
+            }
+
+            .tab-color-select,
+            .tab-icon-select {
+                cursor: pointer;
+                margin: 3px;
+                &:hover {
+                    outline: 2px solid white;
+                }
+            }
+        }
+
        .action-text {
            margin-left: 20px;

@@ -8,7 +8,7 @@ import { boundMethod } from "autobind-decorator";
 import { If } from "tsx-control-statements/components";
 import dayjs from "dayjs";
 import localizedFormat from "dayjs/plugin/localizedFormat";
-import { GlobalModel } from "@/models";
+import { GlobalCommandRunner, GlobalModel } from "@/models";
 import { isBlank } from "@/util/util";
 import { WorkspaceView } from "./workspace/workspaceview";
 import { PluginsView } from "./pluginsview/pluginsview";
@@ -16,19 +16,17 @@ import { BookmarksView } from "./bookmarks/bookmarks";
 import { HistoryView } from "./history/history";
 import { ConnectionsView } from "./connections/connections";
 import { ClientSettingsView } from "./clientsettings/clientsettings";
-import { MainSideBar } from "./sidebar/main";
-import { RightSideBar } from "./sidebar/right";
-import { DisconnectedModal, ClientStopModal } from "@/modals";
-import { ModalsProvider } from "@/modals/provider";
-import { Button } from "@/elements";
-import { ErrorBoundary } from "@/common/error/errorboundary";
+import { MainSideBar } from "./sidebar/sidebar";
+import { DisconnectedModal, ClientStopModal } from "./common/modals";
+import { ModalsProvider } from "./common/modals/provider";
+import { ErrorBoundary } from "./common/error/errorboundary";
 import cn from "classnames";
 import "./app.less";

 dayjs.extend(localizedFormat);

@mobxReact.observer
-class App extends React.PureComponent<{}, {}> {
+class App extends React.Component<{}, {}> {
    dcWait: OV<boolean> = mobx.observable.box(false, { name: "dcWait" });
    mainContentRef: React.RefObject<HTMLDivElement> = React.createRef();

@@ -67,17 +65,9 @@ class App extends React.PureComponent<{}, {}> {
    }

    @boundMethod
-    openMainSidebar() {
-        const mainSidebarModel = GlobalModel.mainSidebarModel;
-        const width = mainSidebarModel.getWidth(true);
-        mainSidebarModel.saveState(width, false);
-    }
-
-    @boundMethod
-    openRightSidebar() {
-        const rightSidebarModel = GlobalModel.rightSidebarModel;
-        const width = rightSidebarModel.getWidth(true);
-        rightSidebarModel.saveState(width, false);
+    openSidebar() {
+        const width = GlobalModel.mainSidebarModel.getWidth(true);
+        GlobalCommandRunner.clientSetSidebar(width, false);
    }

    render() {
@@ -101,7 +91,7 @@ class App extends React.PureComponent<{}, {}> {
            return (
                <div id="main" className={"platform-" + platform} onContextMenu={this.handleContextMenu}>
                    <div ref={this.mainContentRef} className="main-content">
-                        <MainSideBar parentRef={this.mainContentRef} />
+                        <MainSideBar parentRef={this.mainContentRef} clientData={clientData} />
                        <div className="session-view" />
                    </div>
                    <If condition={dcWait}>
@@ -120,38 +110,25 @@ class App extends React.PureComponent<{}, {}> {
        }
        // used to force a full reload of the application
        const renderVersion = GlobalModel.renderVersion.get();
-        const mainSidebarCollapsed = GlobalModel.mainSidebarModel.getCollapsed();
-        const rightSidebarCollapsed = GlobalModel.rightSidebarModel.getCollapsed();
-        const activeMainView = GlobalModel.activeMainView.get();
-        const lightDarkClass = GlobalModel.isDarkTheme.get() ? "is-dark" : "is-light";
+        const sidebarCollapsed = GlobalModel.mainSidebarModel.getCollapsed();
+        const lightDarkClass = GlobalModel.isThemeDark() ? "is-dark" : "is-light";
        return (
            <div
                key={"version-" + renderVersion}
                id="main"
-                className={cn(
-                    "platform-" + platform,
-                    { "mainsidebar-collapsed": mainSidebarCollapsed, "rightsidebar-collapsed": rightSidebarCollapsed },
-                    lightDarkClass
-                )}
+                className={cn("platform-" + platform, { "sidebar-collapsed": sidebarCollapsed }, lightDarkClass)}
                onContextMenu={this.handleContextMenu}
            >
-                <If condition={mainSidebarCollapsed}>
+                <If condition={sidebarCollapsed}>
                    <div key="logo-button" className="logo-button-container">
                        <div className="logo-button-spacer" />
-                        <div className="logo-button" onClick={this.openMainSidebar}>
+                        <div className="logo-button" onClick={this.openSidebar}>
                            <img src="public/logos/wave-logo.png" alt="logo" />
                        </div>
                    </div>
                </If>
-                <If condition={GlobalModel.isDev && rightSidebarCollapsed && activeMainView == "session"}>
-                    <div className="right-sidebar-triggers">
-                        <Button className="secondary ghost right-sidebar-trigger" onClick={this.openRightSidebar}>
-                            <i className="fa-sharp fa-regular fa-lightbulb"></i>
-                        </Button>
-                    </div>
-                </If>
                <div ref={this.mainContentRef} className="main-content">
-                    <MainSideBar parentRef={this.mainContentRef} />
+                    <MainSideBar parentRef={this.mainContentRef} clientData={clientData} />
                    <ErrorBoundary>
                        <PluginsView />
                        <WorkspaceView />
@@ -160,7 +137,6 @@ class App extends React.PureComponent<{}, {}> {
                        <ConnectionsView model={remotesModel} />
                        <ClientSettingsView model={remotesModel} />
                    </ErrorBoundary>
-                    <RightSideBar parentRef={this.mainContentRef} />
                </div>
                <ModalsProvider />
            </div>
@@ -6,11 +6,11 @@
    }

    .bookmarks-list {
-        color: var(--app-text-color);
+        color: var(--bookmarks-text-color);
        margin: 4px 10px 5px 5px;

        .no-bookmarks {
-            color: var(--app-text-color);
+            color: var(--bookmarks-text-color);
            padding: 30px 10px 35px 10px;
            border-bottom: 1px solid white;
        }
@@ -46,21 +46,21 @@
        }

        label {
-            color: var(--app-text-color);
+            color: var(--bookmarks-text-color);
            margin-bottom: 4px;
        }

        textarea {
            width: 80%;
            min-width: 50%;
-            color: var(--app-text-color);
-            background-color: var(--form-element-bg-color);
+            color: var(--bookmarks-text-color);
+            background-color: var(--bookmarks-textarea-bg-color);
        }

        .bookmark-id-div {
            display: none;
            position: absolute;
-            color: var(--app-text-disabled-color);
+            color: var(--bookmarks-disabled-text-color);
            right: 5px;
            bottom: 2px;
            font-size: 0.8em;
@@ -75,7 +75,7 @@
            flex-direction: row;

            visibility: hidden;
-            color: var(--app-text-color);
+            color: var(--bookmarks-text-color);

            .bookmark-control:first-child {
                margin-left: 0;
@@ -85,6 +85,10 @@
                margin-left: 10px;
                cursor: pointer;
                padding: 2px;
+
+                &:hover {
+                    color: var(--bookmarks-control-hover-color);
+                }
            }
        }

@@ -22,61 +22,8 @@ type BookmarkProps = {
    bookmark: BookmarkType;
 };

-class BookmarkKeybindings extends React.PureComponent<{}, {}> {
-    @boundMethod
-    componentDidMount(): void {
-        let keybindManager = GlobalModel.keybindManager;
-        let bookmarksModel = GlobalModel.bookmarksModel;
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:cancel", (waveEvent) => {
-            bookmarksModel.handleUserClose();
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:deleteItem", (waveEvent) => {
-            bookmarksModel.handleUserDelete();
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:selectAbove", (waveEvent) => {
-            bookmarksModel.handleUserNavigate(-1);
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:selectBelow", (waveEvent) => {
-            bookmarksModel.handleUserNavigate(1);
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:selectPageAbove", (waveEvent) => {
-            bookmarksModel.handleUserNavigate(-10);
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:selectPageBelow", (waveEvent) => {
-            bookmarksModel.handleUserNavigate(10);
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "generic:confirm", (waveEvent) => {
-            bookmarksModel.handleUserConfirm();
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "bookmarks:edit", (waveEvent) => {
-            bookmarksModel.handleUserEdit();
-            return true;
-        });
-        keybindManager.registerKeybinding("mainview", "bookmarks", "bookmarks:copy", (waveEvent) => {
-            bookmarksModel.handleUserCopy();
-            return true;
-        });
-    }
-
-    @boundMethod
-    componentWillUnmount() {
-        GlobalModel.keybindManager.unregisterDomain("bookmarks");
-    }
-
-    render() {
-        return null;
-    }
-}
-
@mobxReact.observer
-class Bookmark extends React.PureComponent<BookmarkProps, {}> {
+class Bookmark extends React.Component<BookmarkProps, {}> {
    @boundMethod
    handleDeleteClick(): void {
        let { bookmark } = this.props;
@@ -232,7 +179,7 @@ class Bookmark extends React.PureComponent<BookmarkProps, {}> {
 }

@mobxReact.observer
-class BookmarksView extends React.PureComponent<{}, {}> {
+class BookmarksView extends React.Component<{}, {}> {
    @boundMethod
    handleClose() {
        GlobalModel.bookmarksModel.closeView();
@@ -247,9 +194,6 @@ class BookmarksView extends React.PureComponent<{}, {}> {
        let bookmark: BookmarkType = null;
        return (
            <MainView className="bookmarks-view" title="Bookmarks" onClose={this.handleClose}>
-                <If condition={!isHidden}>
-                    <BookmarkKeybindings></BookmarkKeybindings>
-                </If>
                <div className="bookmarks-list">
                    <For index="idx" each="bookmark" of={bookmarks}>
                        <Bookmark key={bookmark.bookmarkid} bookmark={bookmark} />
@@ -5,7 +5,6 @@ import * as React from "react";
 import * as mobxReact from "mobx-react";
 import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
-import { If } from "tsx-control-statements/components";
 import { GlobalModel, GlobalCommandRunner, RemotesModel, getApi } from "@/models";
 import { Toggle, InlineSettingsTextEdit, SettingsError, Dropdown } from "@/common/elements";
 import { commandRtnHandler, isBlank } from "@/util/util";
@@ -14,27 +13,8 @@ import * as appconst from "@/app/appconst";
 import "./clientsettings.less";
 import { MainView } from "../common/elements/mainview";

-class ClientSettingsKeybindings extends React.PureComponent<{}, {}> {
-    componentDidMount() {
-        let clientSettingsViewModel = GlobalModel.clientSettingsViewModel;
-        let keybindManager = GlobalModel.keybindManager;
-        keybindManager.registerKeybinding("mainview", "clientsettings", "generic:cancel", (waveEvent) => {
-            clientSettingsViewModel.closeView();
-            return true;
-        });
-    }
-
-    componentWillUnmount() {
-        GlobalModel.keybindManager.unregisterDomain("clientsettings");
-    }
-
-    render() {
-        return null;
-    }
-}
-
@mobxReact.observer
-class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, { hoveredItemId: string }> {
+class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hoveredItemId: string }> {
    errorMessage: OV<string> = mobx.observable.box(null, { name: "ClientSettings-errorMessage" });

    @boundMethod
@@ -64,12 +44,11 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
    }

    @boundMethod
-    handleChangeThemeSource(themeSource: NativeThemeSource): void {
-        if (GlobalModel.getThemeSource() == themeSource) {
+    handleChangeTheme(theme: string): void {
+        if (GlobalModel.getTheme() == theme) {
            return;
        }
-        const prtn = GlobalCommandRunner.setTheme(themeSource, false);
-        getApi().setNativeThemeSource(themeSource);
+        const prtn = GlobalCommandRunner.setTheme(theme, false);
        commandRtnHandler(prtn, this.errorMessage);
    }

@@ -112,12 +91,11 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
        return availableFontFamilies;
    }

-    getThemeSources(): DropdownItem[] {
-        const themeSources: DropdownItem[] = [];
-        themeSources.push({ label: "Dark", value: "dark" });
-        themeSources.push({ label: "Light", value: "light" });
-        themeSources.push({ label: "System", value: "system" });
-        return themeSources;
+    getThemes(): DropdownItem[] {
+        const themes: DropdownItem[] = [];
+        themes.push({ label: "Dark", value: "dark" });
+        themes.push({ label: "Light", value: "light" });
+        return themes;
    }

    @boundMethod
@@ -138,12 +116,6 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
        commandRtnHandler(prtn, this.errorMessage);
    }

-    @boundMethod
-    inlineUpdateOpenAIBaseURL(newBaseURL: string): void {
-        const prtn = GlobalCommandRunner.setClientOpenAISettings({ baseurl: newBaseURL });
-        commandRtnHandler(prtn, this.errorMessage);
-    }
-
    @boundMethod
    setErrorMessage(msg: string): void {
        mobx.action(() => {
@@ -192,13 +164,10 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
        );
        const curFontSize = GlobalModel.getTermFontSize();
        const curFontFamily = GlobalModel.getTermFontFamily();
-        const curTheme = GlobalModel.getThemeSource();
+        const curTheme = GlobalModel.getTheme();

        return (
            <MainView className="clientsettings-view" title="Client Settings" onClose={this.handleClose}>
-                <If condition={!isHidden}>
-                    <ClientSettingsKeybindings></ClientSettingsKeybindings>
-                </If>
                <div className="content">
                    <div className="settings-field">
                        <div className="settings-label">Term Font Size</div>
@@ -227,9 +196,9 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
                        <div className="settings-input">
                            <Dropdown
                                className="theme-dropdown"
-                                options={this.getThemeSources()}
+                                options={this.getThemes()}
                                defaultValue={curTheme}
-                                onChange={this.handleChangeThemeSource}
+                                onChange={this.handleChangeTheme}
                            />
                        </div>
                    </div>
@@ -263,7 +232,7 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
                        </div>
                    </div>
                    <div className="settings-field">
-                        <div className="settings-label">AI Token</div>
+                        <div className="settings-label">OpenAI Token</div>
                        <div className="settings-input">
                            <InlineSettingsTextEdit
                                placeholder=""
@@ -276,20 +245,7 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
                        </div>
                    </div>
                    <div className="settings-field">
-                        <div className="settings-label">AI Base URL</div>
-                        <div className="settings-input">
-                            <InlineSettingsTextEdit
-                                placeholder=""
-                                text={isBlank(openAIOpts.baseurl) ? "openai default" : openAIOpts.baseurl}
-                                value={openAIOpts.baseurl ?? ""}
-                                onChange={this.inlineUpdateOpenAIBaseURL}
-                                maxLength={200}
-                                showIcon={true}
-                            />
-                        </div>
-                    </div>
-                    <div className="settings-field">
-                        <div className="settings-label">AI Model</div>
+                        <div className="settings-label">OpenAI Model</div>
                        <div className="settings-input">
                            <InlineSettingsTextEdit
                                placeholder="gpt-3.5-turbo"
@@ -302,7 +258,7 @@ class ClientSettingsView extends React.PureComponent<{ model: RemotesModel }, {
                        </div>
                    </div>
                    <div className="settings-field">
-                        <div className="settings-label">AI MaxTokens</div>
+                        <div className="settings-label">OpenAI MaxTokens</div>
                        <div className="settings-input">
                            <InlineSettingsTextEdit
                                placeholder=""
@@ -1,8 +1,11 @@
 .wave-button {
    background: none;
+    color: inherit;
    border: none;
+    font: inherit;
    cursor: pointer;
    outline: inherit;
+
    display: flex;
    padding: 6px 16px;
    align-items: center;
@@ -10,111 +13,57 @@
    border-radius: 6px;
    height: auto;
    line-height: 1.5;
-    white-space: nowrap;
-    user-select: none;
-
-    color: var(--form-element-text-color);
-    background: var(--form-element-primary-color);
-    i {
-        fill: var(--form-element-text-color);
-    }

    &.primary {
-        color: var(--form-element-primary-text-color);
-        background: var(--form-element-primary-color);
-        i {
-            fill: var(--form-element-text-color);
-        }
-    }
-
-    &.primary.danger {
-        background: var(--app-error-color);
-    }
-
-    &.primary.outlined {
        background: none;
-        border: 1px solid var(--form-element-primary-color);

        i {
            fill: var(--form-element-primary-color);
        }
-    }

-    &.primary.greyoutlined {
-        background: none;
-        border: 1px solid var(--app-text-secondary-color);
+        &.solid {
+            color: var(--form-element-text-color);
+            background: var(--form-element-primary-color);

-        i {
-            fill: var(--app-text-secondary-color);
+            i {
+                fill: var(--form-element-text-color);
+            }
        }
-    }

-    &.primary.outlined,
-    &.primary.greyoutlined {
-        &.hover-danger:hover {
-            color: var(--form-element-primary-text-color);
-            border: 1px solid var(--app-error-color);
-            background: var(--app-error-color);
+        &.outlined {
+            border: 1px solid var(--form-element-primary-color);
        }
-    }

-    &.primary.outlined.danger {
-        background: none;
-        border: 1px solid var(--app-error-color);
-
-        i {
-            fill: var(--app-error-color);
+        &.ghost {
+            // Styles for .ghost are already defined above
        }
-    }

-    &.greytext {
-        color: var(--app-text-secondary-color);
-    }
-
-    &.primary.ghost {
-        background: none;
-        i {
-            fill: var(--form-element-primary-color);
-        }
-    }
-
-    &.primary.ghost.danger {
-        background: none;
-        i {
-            fill: var(--app-error-color);
+        &:hover {
+            color: var(--form-element-text-color);
        }
    }

    &.secondary {
        color: var(--form-element-text-color);
-        background: var(--form-element-secondary-color);
-        i {
-            fill: var(--form-element-text-color);
+        background: none;
+
+        &.solid {
+            color: var(--form-element-text-color);
+            background: var(--form-element-secondary-color);
+            box-shadow: none;
        }
-    }

-    &.secondary.outlined {
-        background: none;
-        border: 1px solid var(--form-element-text-color);
-    }
+        &.outlined {
+            border: 1px solid var(--form-element-secondary-color);
+        }

-    &.secondary.outlined.danger {
-        background: none;
-        border: 1px solid var(--app-error-color);
-    }
+        &.ghost {
+            padding: 6px 10px;

-    &.secondary.ghost {
-        background: none;
-    }
-
-    &.secondary.danger {
-        color: var(--app-error-color);
-    }
-
-    &.small {
-        padding: 4px 8px;
-        font-size: 12px;
-        border-radius: 3.6px;
+            i {
+                fill: var(--form-element-primary-color);
+            }
+        }
    }

    &.term-inline {
@@ -1,25 +1,36 @@
+// Copyright 2023, Command Line Inc.
+// SPDX-License-Identifier: Apache-2.0
+
 import * as React from "react";
 import { boundMethod } from "autobind-decorator";
 import cn from "classnames";

 import "./button.less";

+type ButtonVariantType = "outlined" | "solid" | "ghost";
+type ButtonThemeType = "primary" | "secondary";
+
 interface ButtonProps {
+    theme?: ButtonThemeType;
    children: React.ReactNode;
    onClick?: () => void;
    disabled?: boolean;
+    variant?: ButtonVariantType;
    leftIcon?: React.ReactNode;
    rightIcon?: React.ReactNode;
+    color?: string;
    style?: React.CSSProperties;
    autoFocus?: boolean;
    className?: string;
    termInline?: boolean;
 }

-class Button extends React.PureComponent<ButtonProps> {
+class Button extends React.Component<ButtonProps> {
    static defaultProps = {
+        theme: "primary",
+        variant: "solid",
+        color: "",
        style: {},
-        className: "primary",
    };

    @boundMethod
@@ -30,11 +41,31 @@ class Button extends React.PureComponent<ButtonProps> {
    }

    render() {
-        const { leftIcon, rightIcon, children, disabled, style, autoFocus, termInline, className } = this.props;
+        const {
+            leftIcon,
+            rightIcon,
+            theme,
+            children,
+            disabled,
+            variant,
+            color,
+            style,
+            autoFocus,
+            termInline,
+            className,
+        } = this.props;

        return (
            <button
-                className={cn("wave-button", { disabled }, { "term-inline": termInline }, className)}
+                className={cn(
+                    "wave-button",
+                    theme,
+                    variant,
+                    color,
+                    { disabled: disabled },
+                    { "term-inline": termInline },
+                    className
+                )}
                onClick={this.handleClick}
                disabled={disabled}
                style={style}
@@ -7,7 +7,7 @@ import cn from "classnames";

 import "./checkbox.less";

-class Checkbox extends React.PureComponent<
+class Checkbox extends React.Component<
    {
        checked?: boolean;
        defaultChecked?: boolean;
@@ -11,7 +11,7 @@ import { ReactComponent as CopyIcon } from "@/assets/icons/history/copy.svg";

 import "./cmdstrcode.less";

-class CmdStrCode extends React.PureComponent<
+class CmdStrCode extends React.Component<
    {
        cmdstr: string;
        onUse: () => void;
@@ -1,187 +0,0 @@
-.day-picker-modal {
-    background-color: var(--form-element-bg-color);
-    z-index: 1000;
-    width: 250px;
-    height: 293px;
-    font-size: 13px;
-    border: 1px solid var(--form-element-border-color);
-    border-radius: 4px;
-    color: var(--form-element-text-color);
-}
-
-.day-picker-input {
-    cursor: default;
-    border: 1px solid var(--form-element-border-color) !important;
-    height: 34px;
-    user-select: none;
-    display: flex;
-    border-radius: 4px;
-    justify-content: space-between;
-    align-items: center;
-    padding: 0 15px !important;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: var(--form-element-bg-color);
-
-    input {
-        outline: none !important;
-        border: none !important;
-        height: 100%;
-        padding: 0 !important;
-        cursor: default !important;
-        background-color: inherit !important;
-    }
-
-    .fa-calendar {
-        margin-left: 10px;
-        cursor: pointer;
-    }
-}
-
-.day-picker-header {
-    color: var(--form-element-text-color);
-    padding: 10px 10px 0;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 40px;
-    position: sticky;
-
-    div {
-        cursor: default;
-        font-weight: bold;
-        user-select: none;
-
-        &.fade {
-            color: var(--datepicker-header-fade-color);
-        }
-    }
-
-    .arrows {
-        display: flex;
-
-        .wave-button {
-            padding: 5px !important;
-            font-size: 18px !important;
-            cursor: default !important;
-        }
-    }
-}
-
-.day-header {
-    display: flex;
-    color: var(--form-element-text-color);
-    padding: 0 10px;
-
-    .day-header-cell {
-        flex: 1;
-        padding: 10px;
-        color: var(--form-element-text-color);
-        text-align: center;
-        font-weight: bold;
-        user-select: none;
-    }
-}
-
-.day-picker {
-    display: grid;
-    grid-template-columns: repeat(7, 1fr);
-    gap: 0;
-    padding: 0 10px 10px;
-
-    .day {
-        padding: 10px 4px;
-        color: var(--form-element-text-color);
-        text-align: center;
-        cursor: default;
-        border-radius: 3px;
-
-        &:hover {
-            background-color: var(--datepicker-cell-hover-bg-color);
-        }
-        &.selected {
-            color: var(--form-element-primary-text-color);
-            background-color: var(--form-element-primary-color);
-            font-weight: bold;
-        }
-    }
-
-    .other-month {
-        color: var(--datepicker-cell-other-text-color);
-    }
-}
-
-.year-month-accordion-wrapper {
-    overflow-y: auto;
-    height: 243px;
-    margin-top: 8px;
-    padding: 0 10px 10px;
-
-    .year-month-accordion {
-        color: var(--form-element-text-color);
-    }
-
-    .year-header {
-        padding: 5px 10px;
-        background-color: var(--datepicker-year-header-bg-color);
-        border-bottom: 1px solid var(--datepicker-year-header-border-color);
-        margin-bottom: 5px;
-        font-weight: bold;
-        text-align: center;
-        cursor: default;
-        color: var(--form-element-text-color);
-        user-select: none;
-
-        &:last-child {
-            margin-bottom: 0;
-        }
-    }
-
-    .month-container {
-        display: grid;
-        grid-template-columns: repeat(3, 1fr);
-        gap: 5px;
-        padding: 10px;
-        max-height: 0;
-        overflow: hidden;
-        transition: max-height 0.3s ease;
-        cursor: default;
-    }
-
-    .month {
-        padding: 5px;
-        text-align: center;
-        border-radius: 3px;
-        color: var(--form-element-text-color);
-
-        &:hover {
-            background-color: var(--datepicker-cell-hover-bg-color);
-        }
-
-        &.selected {
-            color: var(--form-element-primary-text-color);
-            background-color: var(--form-element-primary-color);
-        }
-    }
-
-    .expanded {
-        max-height: 500px;
-    }
-}
-
-.dropdown-arrow {
-    display: inline-block;
-    margin-left: 5px;
-    width: 0;
-    height: 0;
-    border-left: 5px solid transparent;
-    border-right: 5px solid transparent;
-    border-top: 5px solid var(--form-element-text-color);
-    vertical-align: middle;
-    user-select: none;
-
-    &.fade {
-        border-top: 5px solid var(--datepicker-header-fade-color);
-    }
-}
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Sylvia Crowe	00c2ab9fc4	merge branch 'main' into ssh-extra-fixes	2024-03-14 16:20:55 -07:00
Sylvia Crowe	81294820c8	feat: add connection segfault protection A user recently reported a crash on a failed connection. This handles these errors more gracefully than the previous system and prints the errors to the connection prompt.	2024-03-14 16:19:32 -07:00
Sylvia Crowe	bb8f5dc660	chore: remove legacy remote launcher The Legacy Launch function was kept as a way to maintain the old ssh system while adding the new one. Now that the new system has been released with minimal issues, it is safe to fully remove the legacy launcher.	2024-03-14 01:07:54 -07:00
Sylvia Crowe	c3917444a2	merge branch 'main' into ssh-extra-fixes	2024-03-13 18:08:29 -07:00
Sylvia Crowe	2cc86f39d6	feat: relax user requirement for canonical name Previously, the canonical name required a user as a part of it. This change makes it possible to omit the username if desired. In this case, the connection will default to your current user.	2024-03-08 00:32:46 -08:00
Sylvia Crowe	af22fd38af	feat: don't hide nonsecret kbd-interactive answers Some Kbd-Interactive challenges are marked with echo true. For these, it makes sense to use a TextField in place of a PasswordField. This change differentiates between the two options.	2024-03-07 23:32:15 -08:00