bump version to v0.7.4

Contains the implementation of the block store

In this pr is a simple way to send and receive data through a database

I have implemented the base functionality as well as quite a few tests
to make sure that everything works
 
There are a few methods that have yet to be implemented, but
theoretically they should be implemented as calls to the other
functions, ie append should just be a call to WriteAt

This doesn't affect anything yet so it can safely be merged whenever. I
don't want this pr to stagnate like file view, so I'm happy to write
multiple prs for this

.github/workflows/regression.yml

@@ -1,26 +1,65 @@
 name: TestDriver.ai Regression Testing
-
 on:
   push:
-    branches: ["main"]
+    branches:
+      - main
   pull_request:
-    branches: ["main"]
+    branches:
+      - main
   schedule:
-    - cron: "0 21 * * *" # every day at 9pm
-  workflow_dispatch:
+    - cron: 0 21 * * *
+  workflow_dispatch: null
+  
+permissions:
+  contents: read  # To allow the action to read repository contents
+  pull-requests: write  # To allow the action to create/update pull request comments
 
 jobs:
   test:
-    name: "TestDriver"
+    name: TestDriver
     runs-on: ubuntu-latest
     steps:
       - uses: dashcamio/testdriver@main
         id: testdriver
-        # note that .testdriver/prerun.sh runs before this, so the app has launched already
         with:
+          version: v2.10.2
+          prerun: |
+            rm ~/Desktop/WITH-LOVE-FROM-AMERICA.txt
+            cd ~/actions-runner/_work/testdriver/testdriver/
+            brew install go
+            brew tap scripthaus-dev/scripthaus
+            brew install scripthaus
+            npm install -g yarn
+            scripthaus run build-backend
+            echo "Yarn"
+            yarn
+            echo "Rebuild"
+            scripthaus run electron-rebuild
+            echo "Webpack"
+            scripthaus run webpack-build
+            echo "Starting Electron"
+            scripthaus run electron 1>/dev/null 2>&1 &
+            echo "Electron Done"
+            exit
           prompt: |
-            2. click "Continue"
-            2. focus the Wave input with the keyboard shorcut Command + I
-            3. type 'ls' into the input
-            4. press return
-            5. validate Wave shows the result of 'ls'
+            1. wait 10 seconds
+            1. click "Continue"
+            1. click "Create new tab"
+            1. validate that overlapping text does not appear in the application
+            1. focus the Wave input with the keyboard shorcut Command + I
+            1. type 'ls' into the input
+            1. press return
+            1. validate Wave shows the result of 'ls'
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - uses: peter-evans/create-or-update-comment@v4
+        if: ${{always()}}
+        with:
+          issue-number: ${{ github.event.pull_request.number }}
+          body: |
+            ## TestDriver Summary
+            ${{ steps.testdriver.outputs.markdown }}
+            ${{ steps.testdriver.outputs.summary }}
+          reactions: |
+            +1
+            -1

README.md

@@ -9,6 +9,8 @@
 
 # Wave Terminal
 
+[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2Fwavetermdev%2Fwaveterm.svg?type=shield)](https://app.fossa.com/projects/git%2Bgithub.com%2Fwavetermdev%2Fwaveterm?ref=badge_shield)
+
 Wave is an open-source AI-native terminal built for seamless workflows.
 
 Wave isn't just another terminal emulator; it's a rethink on how terminals are built. Wave combines command line with the power of the open web to help veteran CLI users and new developers alike.
@@ -56,3 +58,7 @@ Find more information in our [Contributions Guide](CONTRIBUTING.md), which inclu
 
 -   [Ways to contribute](CONTRIBUTING.md#contributing-to-wave-terminal)
 -   [Contribution guidelines](CONTRIBUTING.md#before-you-start)
+
+## License
+
+Wave Terminal is licensed under the Apache-2.0 License. For more information on our dependencies, see [here](./acknowledgements/README.md).

acknowledgements/README.md

@@ -1,20 +1,5 @@
 # Open-Source Acknowledgements
 
-We make use of many amazing open-source projects to build Wave Terminal. Here are the links to the latest acknowledgements for each of our components, including license disclaimers for each dependency:
+We make use of many amazing open-source projects to build Wave Terminal. We automatically generate license reports via FOSSA to comply with the license distribution requirements of our dependencies. Below is a summary of the licenses used by our product. Clicking on the image will take you to the full report on FOSSA's website.
 
-- [Frontend](./disclaimers/frontend.md)
-- [Backend](./disclaimers/backend.md)
-
-## Generating license disclaimers
-
-The license disclaimers for the backend are generated using the [go-licenses](https://github.com/google/go-licenses) tool. We supply a template file ([`go_licenses_report.tpl`](./go_licenses_report.tpl)) to generate a pretty print of the disclaimers for each dependency. This outputs to the file [`backend.md`](./disclaimers/backend.md).
-
-The license disclaimers for the frontend are generated using the [`yarn licenses` tool](https://classic.yarnpkg.com/lang/en/docs/cli/licenses/). This outputs to the file [`frontend.md`](./disclaimers/frontend.md).
-
-These disclaimer files linked above will be periodically regenerated to reflect new dependencies.
-
-The [`scripthaus.md` file](../scripthaus.md) contains scripts to generate the disclaimers and package them. To manually generate the disclaimers, run the following from the repository root directory:
-
-```bash
-scripthaus run generate-license-disclaimers
-```
+[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2Fwavetermdev%2Fwaveterm.svg?type=large)](https://app.fossa.com/projects/git%2Bgithub.com%2Fwavetermdev%2Fwaveterm?ref=badge_large)

acknowledgements/go_licenses_report.tpl

@@ -1,16 +0,0 @@
-# Wave Terminal Backend Acknowledgements
-
-The following sets forth attribution notices for third party software that may be contained in portions of the Wave Terminal product.
-{{ range . }}
-## {{ .Name }}
-
-* Name: {{ .Name }}
-* Version: {{ .Version }}
-* License: [{{ .LicenseName }}]({{ .LicenseURL }})
-
-```txt
-{{ .LicenseText }}
-```
-
------
-{{ end }}

package.json

@@ -6,7 +6,7 @@
     },
     "productName": "Wave",
     "description": "An Open-Source, AI-Native, Terminal Built for Seamless Workflows",
-    "version": "0.7.2",
+    "version": "0.7.4",
     "main": "dist/emain.js",
     "license": "Apache-2.0",
     "repository": {
@@ -24,7 +24,6 @@
         "@table-nav/react": "^0.0.7",
         "@tanstack/match-sorter-utils": "^8.8.4",
         "@tanstack/react-table": "^8.10.3",
-        "@withfig/autocomplete": "^2.652.3",
         "autobind-decorator": "^2.4.0",
         "base64-js": "^1.5.1",
         "classnames": "^2.3.1",
@@ -33,10 +32,10 @@
         "electron-squirrel-startup": "^1.0.0",
         "electron-updater": "^6.1.8",
         "framer-motion": "^10.16.16",
-        "lexical": "^0.14.3",
+        "lexical": "0.14.5",
         "mobx": "6.12",
         "mobx-react": "^7.5.0",
-        "monaco-editor": "^0.44.0",
+        "monaco-editor": "0.48.0",
         "mustache": "^4.2.0",
         "node-fetch": "^3.2.10",
         "overlayscrollbars": "^2.6.1",
@@ -47,7 +46,6 @@
         "react-markdown": "^9.0.0",
         "remark": "^15.0.1",
         "remark-gfm": "^4.0.0",
-        "shell-quote": "^1.8.1",
         "sprintf-js": "^1.1.2",
         "throttle-debounce": "^5.0.0",
         "tsx-control-statements": "^5.1.1",
@@ -78,17 +76,15 @@
         "@types/papaparse": "^5.3.10",
         "@types/react": "^18.0.12",
         "@types/semver": "^7.5.6",
-        "@types/shell-quote": "^1.7.5",
         "@types/sprintf-js": "^1.1.3",
         "@types/throttle-debounce": "^5.0.1",
         "@types/uuid": "^9.0.7",
         "@types/webpack-env": "^1.18.3",
-        "@withfig/autocomplete-types": "^1.30.0",
         "babel-loader": "^9.1.3",
         "babel-plugin-jsx-control-statements": "^4.1.2",
         "copy-webpack-plugin": "^12.0.0",
-        "css-loader": "^6.7.1",
-        "electron": "^29.0.1",
+        "css-loader": "^7.1.0",
+        "electron": "^30.0.1",
         "electron-builder": "^24.13.3",
         "electron-builder-squirrel-windows": "^24.13.3",
         "file-loader": "^6.2.0",
@@ -100,7 +96,7 @@
         "prettier": "^2.8.8",
         "raw-loader": "^4.0.2",
         "react-split-it": "^2.0.0",
-        "style-loader": "^3.3.1",
+        "style-loader": "4.0.0",
         "typescript": "^5.0.0",
         "webpack": "^5.73.0",
         "webpack-bundle-analyzer": "^4.10.1",
@@ -112,4 +108,4 @@
     "scripts": {
         "postinstall": "electron-builder install-app-deps"
     }
-}
+}

public/themes/default.css

@@ -156,7 +156,7 @@
     --table-border-color: rgba(241, 246, 243, 0.15);
     --table-thead-border-top-color: rgba(250, 250, 250, 0.1);
     --table-thead-bright-border-color: rgb(204, 204, 204);
-    --table-thead-bg-color: rgba(250, 250, 250, 0.02);
+    --table-thead-bg-color: rgb(5, 5, 5);
     --table-tr-border-bottom-color: rgba(241, 246, 243, 0.15);
     --table-tr-hover-bg-color: rgba(255, 255, 255, 0.06);
     --table-tr-selected-bg-color: rgb(34, 34, 34);

public/themes/light.css

@@ -57,6 +57,10 @@
     --scrollbar-thumb-hover-color: rgba(0, 0, 0, 0.4);
     --scrollbar-thumb-active-color: rgba(0, 0, 0, 0.5);
 
+    /* table colors */
+    --table-thead-bg-color: rgb(253, 253, 253);
+    --table-tr-selected-bg-color: rgb(216, 216, 216);
+
     /* line color */
     --line-actions-bg-color: rgba(0, 0, 0, 0.1);
     --line-actions-inactive-color: rgba(0, 0, 0, 0.3);

scripthaus.md

@@ -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.7
 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.7
 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.7
 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)

src/app/app.tsx

@@ -4,10 +4,10 @@
 import * as React from "react";
 import * as mobxReact from "mobx-react";
 import * as mobx from "mobx";
+import cn from "classnames";
+
 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 { isBlank } from "@/util/util";
 import { WorkspaceView } from "./workspace/workspaceview";
@@ -22,15 +22,15 @@ import { DisconnectedModal, ClientStopModal } from "@/modals";
 import { ModalsProvider } from "@/modals/provider";
 import { Button } from "@/elements";
 import { ErrorBoundary } from "@/common/error/errorboundary";
-import cn from "classnames";
-import "./app.less";
+import { TermStyleList } from "@/elements";
 
-dayjs.extend(localizedFormat);
+import "./app.less";
 
 @mobxReact.observer
 class App extends React.Component<{}, {}> {
     dcWait: OV<boolean> = mobx.observable.box(false, { name: "dcWait" });
     mainContentRef: React.RefObject<HTMLDivElement> = React.createRef();
+    termThemesLoaded: OV<boolean> = mobx.observable.box(false, { name: "termThemesLoaded" });
 
     constructor(props: {}) {
         super(props);
@@ -80,6 +80,13 @@ class App extends React.Component<{}, {}> {
         rightSidebarModel.saveState(width, false);
     }
 
+    @boundMethod
+    handleTermThemesRendered() {
+        mobx.action(() => {
+            this.termThemesLoaded.set(true);
+        })();
+    }
+
     render() {
         const remotesModel = GlobalModel.remotesModel;
         const disconnected = !GlobalModel.ws.open.get() || !GlobalModel.waveSrvRunning.get();
@@ -90,7 +97,8 @@ class App extends React.Component<{}, {}> {
 
         // Previously, this is done in sidebar.tsx but it causes flicker when clientData is null cos screen-view shifts around.
         // Doing it here fixes the flicker cos app is not rendered until clientData is populated.
-        if (clientData == null) {
+        // wait for termThemes as well (this actually means that the "connect" packet has been received)
+        if (clientData == null || GlobalModel.termThemes.get() == null) {
             return null;
         }
 
@@ -118,52 +126,65 @@ class App extends React.Component<{}, {}> {
         if (dcWait) {
             setTimeout(() => this.updateDcWait(false), 0);
         }
+
         // 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 mainClassName = cn(
+            "platform-" + platform,
+            {
+                "mainsidebar-collapsed": mainSidebarCollapsed,
+                "rightsidebar-collapsed": rightSidebarCollapsed,
+            },
+            lightDarkClass
+        );
         return (
-            <div
-                key={"version-" + renderVersion}
-                id="main"
-                className={cn(
-                    "platform-" + platform,
-                    { "mainsidebar-collapsed": mainSidebarCollapsed, "rightsidebar-collapsed": rightSidebarCollapsed },
-                    lightDarkClass
-                )}
-                onContextMenu={this.handleContextMenu}
-            >
-                <If condition={mainSidebarCollapsed}>
-                    <div key="logo-button" className="logo-button-container">
-                        <div className="logo-button-spacer" />
-                        <div className="logo-button" onClick={this.openMainSidebar}>
-                            <img src="public/logos/wave-logo.png" alt="logo" />
+            <>
+                <TermStyleList onRendered={this.handleTermThemesRendered} />
+                <div
+                    key={`version- + ${renderVersion}`}
+                    id="main"
+                    className={mainClassName}
+                    onContextMenu={this.handleContextMenu}
+                >
+                    <If condition={this.termThemesLoaded.get()}>
+                        <If condition={mainSidebarCollapsed}>
+                            <div key="logo-button" className="logo-button-container">
+                                <div className="logo-button-spacer" />
+                                <div className="logo-button" onClick={this.openMainSidebar}>
+                                    <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-solid fa-sidebar-flip"></i>
+                                </Button>
+                            </div>
+                        </If>
+                        <div ref={this.mainContentRef} className="main-content">
+                            <MainSideBar parentRef={this.mainContentRef} />
+                            <ErrorBoundary>
+                                <PluginsView />
+                                <WorkspaceView />
+                                <HistoryView />
+                                <BookmarksView />
+                                <ConnectionsView model={remotesModel} />
+                                <ClientSettingsView model={remotesModel} />
+                            </ErrorBoundary>
+                            <RightSideBar parentRef={this.mainContentRef} />
                         </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-solid fa-sidebar-flip"></i>
-                        </Button>
-                    </div>
-                </If>
-                <div ref={this.mainContentRef} className="main-content">
-                    <MainSideBar parentRef={this.mainContentRef} />
-                    <ErrorBoundary>
-                        <PluginsView />
-                        <WorkspaceView />
-                        <HistoryView />
-                        <BookmarksView />
-                        <ConnectionsView model={remotesModel} />
-                        <ClientSettingsView model={remotesModel} />
-                    </ErrorBoundary>
-                    <RightSideBar parentRef={this.mainContentRef} />
+                        <ModalsProvider />
+                    </If>
                 </div>
-                <ModalsProvider />
-            </div>
+            </>
         );
     }
 }

src/app/appconst.ts

@@ -46,6 +46,10 @@ export const TabIcons = [
     "heart",
     "file",
 ];
+export const DefaultSudoPwStore = "on";
+export const DefaultSudoPwTimeoutMs = 5 * 60 * 1000;
+
+export const MaxWebSocketSendSize = 64 * 1024 - 100;
 
 // @ts-ignore
 export const VERSION = __WAVETERM_VERSION__;
@@ -68,4 +72,3 @@ export const ErrorCode_InvalidCwd = "ERRCWD";
 export const InputAuxView_History = "history";
 export const InputAuxView_Info = "info";
 export const InputAuxView_AIChat = "aichat";
-export const InputAuxView_Suggestions = "suggestions";

src/app/clientsettings/clientsettings.less

@@ -1,6 +1,7 @@
 .clientsettings-view {
     .content {
-        padding: 14px 18px 0 30px;
+        padding: 14px 18px 14px 30px;
+        overflow-y: scroll;
     }
 
     .wave-dropdown {

src/app/clientsettings/clientsettings.tsx

@@ -11,9 +11,10 @@ import { Toggle, InlineSettingsTextEdit, SettingsError, Dropdown } from "@/commo
 import { commandRtnHandler, isBlank } from "@/util/util";
 import { getTermThemes } from "@/util/themeutil";
 import * as appconst from "@/app/appconst";
-import { MainView } from "@/common/elements/mainview";
 
 import "./clientsettings.less";
+import { MainView } from "../common/elements/mainview";
+import { OverlayScrollbarsComponent } from "overlayscrollbars-react";
 
 class ClientSettingsKeybindings extends React.Component<{}, {}> {
     componentDidMount() {
@@ -76,14 +77,13 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
 
     @boundMethod
     handleChangeTermTheme(theme: string): void {
-        // For global terminal theme, the key is global, otherwise it's either
+        // For root terminal theme, the key is root, otherwise it's either
         // sessionId or screenId.
-        const currTheme = GlobalModel.getTermTheme()["global"];
+        const currTheme = GlobalModel.getTermThemeSettings()["root"];
         if (currTheme == theme) {
             return;
         }
-
-        const prtn = GlobalCommandRunner.setGlobalTermTheme(theme, false);
+        const prtn = GlobalCommandRunner.setRootTermTheme(theme, false);
         commandRtnHandler(prtn, this.errorMessage);
     }
 
@@ -110,19 +110,6 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         GlobalModel.getElectronApi().changeAutoUpdate(val);
     }
 
-    @boundMethod
-    handleChangeAutocompleteEnabled(val: boolean): void {
-        const prtn: Promise<CommandRtnType> = GlobalCommandRunner.setAutocompleteEnabled(val);
-        commandRtnHandler(prtn, this.errorMessage);
-    }
-
-    @boundMethod
-    handleChangeAutocompleteDebuggingEnabled(val: boolean): void {
-        mobx.action(() => {
-            GlobalModel.autocompleteModel.loggingEnabled = val;
-        })();
-    }
-
     getFontSizes(): DropdownItem[] {
         const availableFontSizes: DropdownItem[] = [];
         for (let s = appconst.MinFontSize; s <= appconst.MaxFontSize; s++) {
@@ -171,6 +158,12 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         commandRtnHandler(prtn, this.errorMessage);
     }
 
+    @boundMethod
+    inlineUpdateOpenAITimeout(newTimeout: string): void {
+        const prtn = GlobalCommandRunner.setClientOpenAISettings({ timeout: newTimeout });
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
     @boundMethod
     setErrorMessage(msg: string): void {
         mobx.action(() => {
@@ -205,6 +198,35 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         GlobalModel.clientSettingsViewModel.closeView();
     }
 
+    @boundMethod
+    getSudoPwStoreOptions(): DropdownItem[] {
+        const sudoCacheSources: DropdownItem[] = [];
+        sudoCacheSources.push({ label: "On", value: "on" });
+        sudoCacheSources.push({ label: "Off", value: "off" });
+        sudoCacheSources.push({ label: "On Without Timeout", value: "notimeout" });
+        return sudoCacheSources;
+    }
+
+    @boundMethod
+    handleChangeSudoPwStoreConfig(store: string) {
+        const prtn = GlobalCommandRunner.setSudoPwStore(store);
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
+    @boundMethod
+    handleChangeSudoPwTimeoutConfig(timeout: string) {
+        if (Number(timeout) != 0) {
+            const prtn = GlobalCommandRunner.setSudoPwTimeout(timeout);
+            commandRtnHandler(prtn, this.errorMessage);
+        }
+    }
+
+    @boundMethod
+    handleChangeSudoPwClearOnSleepConfig(clearOnSleep: boolean) {
+        const prtn = GlobalCommandRunner.setSudoPwClearOnSleep(clearOnSleep);
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
     render() {
         const isHidden = GlobalModel.activeMainView.get() != "clientsettings";
         if (isHidden) {
@@ -217,14 +239,25 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         const maxTokensStr = String(
             openAIOpts.maxtokens == null || openAIOpts.maxtokens == 0 ? 1000 : openAIOpts.maxtokens
         );
+        const aiTimeoutStr = String(
+            openAIOpts.timeout == null || openAIOpts.timeout == 0 ? 10 : openAIOpts.timeout / 1000
+        );
         const curFontSize = GlobalModel.getTermFontSize();
         const curFontFamily = GlobalModel.getTermFontFamily();
         const curTheme = GlobalModel.getThemeSource();
-        const termThemes = getTermThemes(GlobalModel.termThemes, "Wave Default");
-        const currTermTheme = GlobalModel.getTermTheme()["global"] ?? termThemes[0].label;
+        const termThemes = getTermThemes(GlobalModel.termThemes.get(), "Wave Default");
+        const currTermTheme = GlobalModel.getTermThemeSettings()["root"] ?? termThemes[0].label;
+        const curSudoPwStore = GlobalModel.getSudoPwStore();
+        const curSudoPwTimeout = String(GlobalModel.getSudoPwTimeout());
+        const curSudoPwClearOnSleep = GlobalModel.getSudoPwClearOnSleep();
 
         return (
-            <MainView className="clientsettings-view" title="Client Settings" onClose={this.handleClose}>
+            <MainView
+                className="clientsettings-view"
+                title="Client Settings"
+                onClose={this.handleClose}
+                scrollable={true}
+            >
                 <If condition={!isHidden}>
                     <ClientSettingsKeybindings></ClientSettingsKeybindings>
                 </If>
@@ -356,6 +389,19 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
                             />
                         </div>
                     </div>
+                    <div className="settings-field">
+                        <div className="settings-label">AI Timeout (seconds)</div>
+                        <div className="settings-input">
+                            <InlineSettingsTextEdit
+                                placeholder=""
+                                text={aiTimeoutStr}
+                                value={aiTimeoutStr}
+                                onChange={this.inlineUpdateOpenAITimeout}
+                                maxLength={10}
+                                showIcon={true}
+                            />
+                        </div>
+                    </div>
                     <div className="settings-field">
                         <div className="settings-label">Global Hotkey</div>
                         <div className="settings-input">
@@ -368,20 +414,36 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
                         </div>
                     </div>
                     <div className="settings-field">
-                        <div className="settings-label">Command Autocomplete</div>
+                        <div className="settings-label">Remember Sudo Password</div>
                         <div className="settings-input">
-                            <Toggle
-                                checked={cdata.clientopts.autocompleteenabled ?? false}
-                                onChange={this.handleChangeAutocompleteEnabled}
+                            <Dropdown
+                                className="hotkey-dropdown"
+                                options={this.getSudoPwStoreOptions()}
+                                defaultValue={curSudoPwStore}
+                                onChange={this.handleChangeSudoPwStoreConfig}
                             />
                         </div>
                     </div>
                     <div className="settings-field">
-                        <div className="settings-label">Command Autocomplete Debugging</div>
+                        <div className="settings-label">Sudo Timeout (Minutes)</div>
+                        <div className="settings-input">
+                            <InlineSettingsTextEdit
+                                placeholder=""
+                                text={curSudoPwTimeout}
+                                value={curSudoPwTimeout}
+                                onChange={this.handleChangeSudoPwTimeoutConfig}
+                                maxLength={6}
+                                showIcon={true}
+                                isNumber={true}
+                            />
+                        </div>
+                    </div>
+                    <div className="settings-field">
+                        <div className="settings-label">Clear Sudo Password on Sleep</div>
                         <div className="settings-input">
                             <Toggle
-                                checked={GlobalModel.autocompleteModel.loggingEnabled}
-                                onChange={this.handleChangeAutocompleteDebuggingEnabled}
+                                checked={curSudoPwClearOnSleep}
+                                onChange={this.handleChangeSudoPwClearOnSleepConfig}
                             />
                         </div>
                     </div>

src/app/common/elements/dropdown.tsx

@@ -258,7 +258,11 @@ class Dropdown extends React.Component<DropdownProps, DropdownState> {
                   document.getElementById("app")!
               )
             : null;
-
+        let selectedOptionLabelStyle = {};
+        const wrapperClientWidth = this.wrapperRef.current?.clientWidth;
+        if ((wrapperClientWidth ?? 0) > 0) {
+            selectedOptionLabelStyle["width"] = Math.max(wrapperClientWidth - 55, 0);
+        }
         return (
             <div
                 className={cn("wave-dropdown", className, {
@@ -284,7 +288,10 @@ class Dropdown extends React.Component<DropdownProps, DropdownState> {
                     </div>
                 </If>
                 <div
-                    className={cn("wave-dropdown-display unselectable", { "offset-left": decoration?.startDecoration })}
+                    className={cn("wave-dropdown-display unselectable truncate", {
+                        "offset-left": decoration?.startDecoration,
+                    })}
+                    style={selectedOptionLabelStyle}
                 >
                     {selectedOptionLabel}
                 </div>

src/app/common/elements/index.tsx

@@ -8,7 +8,6 @@ export { InputDecoration } from "./inputdecoration";
 export { LinkButton } from "./linkbutton";
 export { Markdown } from "./markdown";
 export { Modal } from "./modal";
-export { NumberField } from "./numberfield";
 export { PasswordField } from "./passwordfield";
 export { ResizableSidebar } from "./resizablesidebar";
 export { SettingsError } from "./settingserror";
@@ -18,4 +17,5 @@ export { Toggle } from "./toggle";
 export { Tooltip } from "./tooltip";
 export { TabIcon } from "./tabicon";
 export { DatePicker } from "./datepicker";
+export { TermStyleList } from "./termstyle";
 export { CopyButton } from "./copybutton";

src/app/common/elements/inlinesettingstextedit.tsx

@@ -22,6 +22,7 @@ class InlineSettingsTextEdit extends React.Component<
         maxLength: number;
         placeholder: string;
         showIcon?: boolean;
+        isNumber?: boolean;
     },
     {}
 > {
@@ -46,6 +47,12 @@ class InlineSettingsTextEdit extends React.Component<
 
     @boundMethod
     handleChangeText(e: any): void {
+        const isNumber = this.props.isNumber ?? false;
+        const value = e.target.value;
+        if (isNumber && value !== "" && !/^\d*$/.test(value)) {
+            return;
+        }
+
         mobx.action(() => {
             this.tempText.set(e.target.value);
         })();

src/app/common/elements/mainview.less

@@ -40,7 +40,8 @@
     }
 
     .mainview-content {
-        padding-top: 14px;
+        display: flex;
+        flex-direction: column;
     }
 }
 

src/app/common/elements/mainview.tsx

@@ -7,6 +7,8 @@ import cn from "classnames";
 import { GlobalModel } from "@/models";
 
 import "./mainview.less";
+import { Choose, If, Otherwise, When } from "tsx-control-statements/components";
+import { OverlayScrollbarsComponent } from "overlayscrollbars-react";
 
 @mobxReact.observer
 class MainView extends React.Component<{
@@ -14,6 +16,8 @@ class MainView extends React.Component<{
     onClose: () => void;
     children: React.ReactNode;
     className?: string;
+    scrollable?: boolean;
+    onScrollbarInitialized?: () => void;
 }> {
     render() {
         const sidebarModel = GlobalModel.mainSidebarModel;
@@ -31,7 +35,21 @@ class MainView extends React.Component<{
                         </div>
                     </header>
                 </div>
-                <div className="mainview-content">{this.props.children}</div>
+                <Choose>
+                    <When condition={this.props.scrollable}>
+                        <OverlayScrollbarsComponent
+                            className="mainview-content"
+                            options={{ scrollbars: { autoHide: "leave" } }}
+                            defer={true}
+                            events={{ initialized: this.props.onScrollbarInitialized }}
+                        >
+                            {this.props.children}
+                        </OverlayScrollbarsComponent>
+                    </When>
+                    <Otherwise>
+                        <div className="mainview-content">{this.props.children}</div>
+                    </Otherwise>
+                </Choose>
             </div>
         );
     }

src/app/common/elements/modal.less

@@ -52,6 +52,7 @@
             }
 
             button {
+                padding-right: 4px !important;
                 i {
                     font-size: 18px;
                 }