revert width of modal

src/app/app.tsx

@@ -7,9 +7,10 @@ import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
 import { If } from "tsx-control-statements/components";
 import dayjs from "dayjs";
+import type { ContextMenuOpts } from "../types/types";
 import localizedFormat from "dayjs/plugin/localizedFormat";
-import { GlobalModel } from "@/models";
-import { isBlank } from "@/util/util";
+import { GlobalModel } from "../models";
+import { isBlank } from "../util/util";
 import { WorkspaceView } from "./workspace/workspaceview";
 import { PluginsView } from "./pluginsview/pluginsview";
 import { BookmarksView } from "./bookmarks/bookmarks";
@@ -24,6 +25,8 @@ import "./app.less";
 
 dayjs.extend(localizedFormat);
 
+type OV<V> = mobx.IObservableValue<V>;
+
 @mobxReact.observer
 class App extends React.Component<{}, {}> {
     dcWait: OV<boolean> = mobx.observable.box(false, { name: "dcWait" });

src/app/appconst.ts

@@ -47,13 +47,3 @@ export const TabIcons = [
 export const VERSION = __WAVETERM_VERSION__;
 // @ts-ignore
 export const BUILD = __WAVETERM_BUILD__;
-
-/**
- * Levels for the screen status indicator
- */
-export enum StatusIndicatorLevel {
-    None = 0,
-    Output = 1,
-    Success = 2,
-    Error = 3,
-}

src/app/bookmarks/bookmarks.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../app/common/themes/themes.less";
 
 .bookmarks-view {
     background-color: @background-session;

src/app/bookmarks/bookmarks.tsx

@@ -7,14 +7,15 @@ import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
 import { If, For } from "tsx-control-statements/components";
 import cn from "classnames";
-import { GlobalModel } from "@/models";
-import { CmdStrCode, Markdown } from "@/common/elements";
+import type { BookmarkType } from "../../types/types";
+import { GlobalModel } from "../../models";
+import { CmdStrCode, Markdown } from "../common/elements";
 
-import { ReactComponent as XmarkIcon } from "@/assets/icons/line/xmark.svg";
-import { ReactComponent as CopyIcon } from "@/assets/icons/favourites/copy.svg";
-import { ReactComponent as PenIcon } from "@/assets/icons/favourites/pen.svg";
-import { ReactComponent as TrashIcon } from "@/assets/icons/favourites/trash.svg";
-import { ReactComponent as FavoritesIcon } from "@/assets/icons/favourites.svg";
+import { ReactComponent as XmarkIcon } from "../assets/icons/line/xmark.svg";
+import { ReactComponent as CopyIcon } from "../assets/icons/favourites/copy.svg";
+import { ReactComponent as PenIcon } from "../assets/icons/favourites/pen.svg";
+import { ReactComponent as TrashIcon } from "../assets/icons/favourites/trash.svg";
+import { ReactComponent as FavoritesIcon } from "../assets/icons/favourites.svg";
 
 import "./bookmarks.less";
 

src/app/clientsettings/clientsettings.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../app/common/themes/themes.less";
 
 .clientsettings-view {
     background-color: @background-session;

src/app/clientsettings/clientsettings.tsx

@@ -6,19 +6,20 @@ import * as mobxReact from "mobx-react";
 import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
 import cn from "classnames";
-import { GlobalModel, GlobalCommandRunner, RemotesModel } from "@/models";
-import { Toggle, InlineSettingsTextEdit, SettingsError, Dropdown } from "@/common/elements";
-import { commandRtnHandler, isBlank } from "@/util/util";
-import * as appconst from "@/app/appconst";
+import { GlobalModel, GlobalCommandRunner, RemotesModel } from "../../models";
+import { Toggle, InlineSettingsTextEdit, SettingsError, Dropdown } from "../common/elements";
+import * as types from "../../types/types";
+import { commandRtnHandler, isBlank } from "../../util/util";
+import * as appconst from "../appconst";
 
 import "./clientsettings.less";
 
 @mobxReact.observer
 class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hoveredItemId: string }> {
-    fontSizeDropdownActive: OV<boolean> = mobx.observable.box(false, {
+    fontSizeDropdownActive: types.OV<boolean> = mobx.observable.box(false, {
         name: "clientSettings-fontSizeDropdownActive",
     });
-    errorMessage: OV<string> = mobx.observable.box(null, { name: "ClientSettings-errorMessage" });
+    errorMessage: types.OV<string> = mobx.observable.box(null, { name: "ClientSettings-errorMessage" });
 
     @boundMethod
     dismissError(): void {
@@ -29,12 +30,12 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
 
     @boundMethod
     handleChangeFontSize(fontSize: string): void {
-        const newFontSize = Number(fontSize);
+        let newFontSize = Number(fontSize);
         this.fontSizeDropdownActive.set(false);
         if (GlobalModel.termFontSize.get() == newFontSize) {
             return;
         }
-        const prtn = GlobalCommandRunner.setTermFontSize(newFontSize, false);
+        let prtn = GlobalCommandRunner.setTermFontSize(newFontSize, false);
         commandRtnHandler(prtn, this.errorMessage);
     }
 
@@ -47,7 +48,7 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
 
     @boundMethod
     handleChangeTelemetry(val: boolean): void {
-        let prtn: Promise<CommandRtnType> = null;
+        let prtn: Promise<types.CommandRtnType> = null;
         if (val) {
             prtn = GlobalCommandRunner.telemetryOn(false);
         } else {
@@ -58,7 +59,7 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
 
     @boundMethod
     handleChangeReleaseCheck(val: boolean): void {
-        let prtn: Promise<CommandRtnType> = null;
+        let prtn: Promise<types.CommandRtnType> = null;
         if (val) {
             prtn = GlobalCommandRunner.releaseCheckAutoOn(false);
         } else {
@@ -67,29 +68,29 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         commandRtnHandler(prtn, this.errorMessage);
     }
 
-    getFontSizes(): DropdownItem[] {
-        const availableFontSizes: DropdownItem[] = [];
+    getFontSizes(): any {
+        let availableFontSizes: { label: string; value: number }[] = [];
         for (let s = appconst.MinFontSize; s <= appconst.MaxFontSize; s++) {
-            availableFontSizes.push({ label: s + "px", value: String(s) });
+            availableFontSizes.push({ label: s + "px", value: s });
         }
         return availableFontSizes;
     }
 
     @boundMethod
     inlineUpdateOpenAIModel(newModel: string): void {
-        const prtn = GlobalCommandRunner.setClientOpenAISettings({ model: newModel });
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({ model: newModel });
         commandRtnHandler(prtn, this.errorMessage);
     }
 
     @boundMethod
     inlineUpdateOpenAIToken(newToken: string): void {
-        const prtn = GlobalCommandRunner.setClientOpenAISettings({ apitoken: newToken });
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({ apitoken: newToken });
         commandRtnHandler(prtn, this.errorMessage);
     }
 
     @boundMethod
     inlineUpdateOpenAIMaxTokens(newMaxTokensStr: string): void {
-        const prtn = GlobalCommandRunner.setClientOpenAISettings({ maxtokens: newMaxTokensStr });
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({ maxtokens: newMaxTokensStr });
         commandRtnHandler(prtn, this.errorMessage);
     }
 
@@ -105,41 +106,19 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
         GlobalModel.clientSettingsViewModel.closeView();
     }
 
-    @boundMethod
-    handleChangeShortcut(newShortcut: string): void {
-        const prtn = GlobalCommandRunner.setGlobalShortcut(newShortcut);
-        commandRtnHandler(prtn, this.errorMessage);
-    }
-
-    getFKeys(): DropdownItem[] {
-        const opts: DropdownItem[] = [];
-        opts.push({ label: "Disabled", value: "" });
-        const platform = GlobalModel.getPlatform();
-        for (let i = 1; i <= 12; i++) {
-            const shortcut = (platform == "darwin" ? "Cmd" : "Alt") + "+F" + String(i);
-            opts.push({ label: shortcut, value: shortcut });
-        }
-        return opts;
-    }
-
-    getCurrentShortcut(): string {
-        const clientData = GlobalModel.clientData.get();
-        return clientData?.clientopts?.globalshortcut ?? "";
-    }
-
     render() {
-        const isHidden = GlobalModel.activeMainView.get() != "clientsettings";
+        let isHidden = GlobalModel.activeMainView.get() != "clientsettings";
         if (isHidden) {
             return null;
         }
 
-        const cdata: ClientDataType = GlobalModel.clientData.get();
-        const openAIOpts = cdata.openaiopts ?? {};
-        const apiTokenStr = isBlank(openAIOpts.apitoken) ? "(not set)" : "********";
-        const maxTokensStr = String(
+        let cdata: types.ClientDataType = GlobalModel.clientData.get();
+        let openAIOpts = cdata.openaiopts ?? {};
+        let apiTokenStr = isBlank(openAIOpts.apitoken) ? "(not set)" : "********";
+        let maxTokensStr = String(
             openAIOpts.maxtokens == null || openAIOpts.maxtokens == 0 ? 1000 : openAIOpts.maxtokens
         );
-        const curFontSize = GlobalModel.termFontSize.get();
+        let curFontSize = GlobalModel.termFontSize.get();
 
         return (
             <div className={cn("view clientsettings-view")}>
@@ -229,17 +208,6 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
                             />
                         </div>
                     </div>
-                    <div className="settings-field">
-                        <div className="settings-label">Global Hotkey</div>
-                        <div className="settings-input">
-                            <Dropdown
-                                className="hotkey-dropdown"
-                                options={this.getFKeys()}
-                                defaultValue={this.getCurrentShortcut()}
-                                onChange={this.handleChangeShortcut}
-                            />
-                        </div>
-                    </div>
                     <SettingsError errorMessage={this.errorMessage} />
                 </div>
             </div>

src/app/common/elements/button.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .wave-button {
     background: none;

src/app/common/elements/checkbox.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .checkbox {
     display: flex;

src/app/common/elements/cmdstrcode.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .cmdstr-code {
     position: relative;

src/app/common/elements/cmdstrcode.tsx

@@ -6,8 +6,8 @@ import { boundMethod } from "autobind-decorator";
 import cn from "classnames";
 import { If } from "tsx-control-statements/components";
 
-import { ReactComponent as CheckIcon } from "@/assets/icons/line/check.svg";
-import { ReactComponent as CopyIcon } from "@/assets/icons/history/copy.svg";
+import { ReactComponent as CheckIcon } from "../../assets/icons/line/check.svg";
+import { ReactComponent as CopyIcon } from "../../assets/icons/history/copy.svg";
 
 import "./cmdstrcode.less";
 

src/app/common/elements/dropdown.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .wave-dropdown {
     position: relative;

src/app/common/elements/dropdown.tsx

@@ -17,7 +17,7 @@ interface DropdownDecorationProps {
 
 interface DropdownProps {
     label?: string;
-    options: DropdownItem[];
+    options: { value: string; label: string }[];
     value?: string;
     className?: string;
     onChange: (value: string) => void;

src/app/common/elements/inlinesettingstextedit.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .inline-edit {
     .icon {

src/app/common/elements/inlinesettingstextedit.tsx

@@ -7,10 +7,12 @@ import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
 import cn from "classnames";
 import { If } from "tsx-control-statements/components";
-import { checkKeyPressed, adaptFromReactOrNativeKeyEvent } from "@/util/keyutil";
+import { checkKeyPressed, adaptFromReactOrNativeKeyEvent } from "../../../util/keyutil";
 
 import "./inlinesettingstextedit.less";
 
+type OV<V> = mobx.IObservableValue<V>;
+
 @mobxReact.observer
 class InlineSettingsTextEdit extends React.Component<
     {

src/app/common/elements/inputdecoration.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .wave-input-decoration {
     display: flex;

src/app/common/elements/markdown.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .markdown {
     color: @term-white;

src/app/common/elements/markdown.tsx

@@ -6,7 +6,7 @@ import * as mobxReact from "mobx-react";
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 import cn from "classnames";
-import { GlobalModel } from "@/models";
+import { GlobalModel } from "../../../models";
 
 import "./markdown.less";
 

src/app/common/elements/modal.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .wave-modal-container {
     position: fixed;

src/app/common/elements/modal.tsx

@@ -10,6 +10,8 @@ import { IconButton } from "./iconbutton";
 
 import "./modal.less";
 
+type OV<V> = mobx.IObservableValue<V>;
+
 interface ModalHeaderProps {
     onClose?: () => void;
     title: string;

src/app/common/elements/passwordfield.less

@@ -1,4 +1,4 @@
-@import "@/common/themes/themes.less";
+@import "../../../app/common/themes/themes.less";
 
 .wave-password {
     .wave-textfield-inner-eye {