Ethica/Termix
1
0 Fork 0
mirror of https://github.com/Termix-SSH/Termix.git synced 2026-10-28 06:05:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: redesign user host defaults system

Browse Source
This commit is contained in:
LukeGus committed 2026-09-30 06:19:56 -05:00
1 parent 3028ab1176
commit a4a4d4f27b
144 files changed
+24609 -2555
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

plugins/host-metrics/src/backend/routes.ts
-19
View File
@@ -102,25 +102,6 @@ export function registerRoutes(router: Router, deps: RouteDeps): void {
poller.registerViewer(hostId, sessionId, userId),
};
/**
* @openapi
* /plugin-api/host-metrics/defaults:
* get:
* summary: Get defaults for new hosts
* description: Whether a new host starts with metrics on, an admin setting any user creating a host needs.
* tags:
* - Host Metrics
* responses:
* 200:
* description: The defaults.
*/
router.get("/defaults", async (_req, res) => {
res.json({
enabledForNewHosts:
(await ctx.settings.get<boolean>("enabledForNewHosts")) !== false,
});
});
/**
* @openapi
* /plugin-api/host-metrics/metrics/{id}:
plugins/host-metrics/src/frontend/HostEditorStatsTab.tsx
+23 -37
View File
@@ -1,13 +1,14 @@
import {
Button,
HostDefaultBadge,
Input,
SectionCard,
SettingRow,
FakeSwitch,
useIsDefaultsEditor,
} from "@termix/plugin-sdk/ui";
import { useEffect, useState } from "react";
import { useState } from "react";
import {
usePluginApi,
useTranslation,
type HostEditorSectionProps,
} from "@termix/plugin-sdk/frontend";
@@ -24,11 +25,7 @@ type PluginSettingsBag = Record<string, Record<string, unknown>>;
* host settings, carried on form.pluginSettings and saved by the editor after
* the host itself.
*/
export function HostStatsTab({
form,
updateForm,
host,
}: HostEditorSectionProps) {
export function HostStatsTab({ form, updateForm }: HostEditorSectionProps) {
const { t } = useTranslation();
const [newMount, setNewMount] = useState("");
const [newMonitoredPath, setNewMonitoredPath] = useState("");
@@ -38,7 +35,7 @@ export function HostStatsTab({
];
const settings = readHostMetricsSettings(bag);
const { excludedMounts, monitoredMounts } = settings;
const api = usePluginApi();
const defaultsEditor = useIsDefaultsEditor();
const patch = (values: Record<string, unknown>) =>
updateForm((current) => {
@@ -52,23 +49,6 @@ export function HostStatsTab({
};
});
// A new host starts with the admin's default for metrics.
useEffect(() => {
if (host || bag?.metricsEnabled !== undefined) return;
let cancelled = false;
api
.get<{ enabledForNewHosts: boolean }>("/defaults")
.then(({ data }) => {
if (!cancelled && data.enabledForNewHosts === false) {
patch({ metricsEnabled: false });
}
})
.catch(() => {});
return () => {
cancelled = true;
};
}, [host]);
const addExcludedMount = () => {
const value = newMount.trim();
if (!value || excludedMounts.includes(value)) {
@@ -102,6 +82,7 @@ export function HostStatsTab({
<SettingRow
label={t("hosts.enableMetricsLabel")}
description={t("hosts.enableMetricsDesc")}
defaultKey="metricsEnabled"
>
<FakeSwitch
checked={settings.metricsEnabled}
@@ -112,6 +93,7 @@ export function HostStatsTab({
<SettingRow
label={t("hosts.useGlobalMetrics")}
description={t("hosts.useGlobalMetricsDesc")}
defaultKey="metricsInterval"
>
<FakeSwitch
checked={settings.metricsInterval === null}
@@ -141,8 +123,9 @@ export function HostStatsTab({
icon={<HardDrive className="size-3.5" />}
>
<div className="flex flex-col gap-3 py-3">
<p className="text-xs text-muted-foreground">
<p className="flex items-center gap-1.5 text-xs text-muted-foreground">
{t("hosts.monitoredMountsDesc")}
<HostDefaultBadge settingKey="monitoredMounts" />
</p>
<div className="grid grid-cols-[1fr_0.7fr_auto] gap-2">
<Input
@@ -212,8 +195,9 @@ export function HostStatsTab({
icon={<HardDrive className="size-3.5" />}
>
<div className="flex flex-col gap-3 py-3">
<p className="text-xs text-muted-foreground">
<p className="flex items-center gap-1.5 text-xs text-muted-foreground">
{t("hosts.excludedMountsDesc")}
<HostDefaultBadge settingKey="excludedMounts" />
</p>
<div className="flex items-center gap-2">
<Input
@@ -265,16 +249,18 @@ export function HostStatsTab({
))}
</div>
</SectionCard>
<SectionCard
title={t("hosts.visibleWidgets")}
icon={<LayoutDashboard className="size-3.5" />}
>
<div className="flex flex-col gap-2 py-3">
<p className="text-xs text-muted-foreground">
{t("hosts.widgetsMovedToHostMetrics")}
</p>
</div>
</SectionCard>
{!defaultsEditor && (
<SectionCard
title={t("hosts.visibleWidgets")}
icon={<LayoutDashboard className="size-3.5" />}
>
<div className="flex flex-col gap-2 py-3">
<p className="text-xs text-muted-foreground">
{t("hosts.widgetsMovedToHostMetrics")}
</p>
</div>
</SectionCard>
)}
</>
);
}
plugins/host-metrics/src/frontend/index.tsx
+1
View File
@@ -96,6 +96,7 @@ export async function activate(app: TermixApp): Promise<void> {
titleKey: "hosts.tabHostMetrics",
icon: Activity,
order: 70,
defaults: true,
component: MetricsHostSection,
});
plugins/host-metrics/tests/backend/routes.test.ts
-13
View File
@@ -35,19 +35,6 @@ describe("permissions", () => {
);
});
describe("defaults", () => {
it("tells any user whether new hosts start with metrics on", async () => {
server = await startServer();
expect((await server.request("GET", "/defaults")).body).toEqual({
enabledForNewHosts: true,
});
await server.mock.ctx.settings.set("enabledForNewHosts", false);
expect((await server.request("GET", "/defaults")).body).toEqual({
enabledForNewHosts: false,
});
});
});
describe("metrics", () => {
it("answers 404 until a sample exists", async () => {
server = await startServer();
plugins/proxmox/manifest.json
+8 -4
View File
@@ -39,22 +39,26 @@
{
"key": "enableProxmox",
"type": "custom",
"component": "proxmoxHostSettings"
"component": "proxmoxHostSettings",
"defaultable": false
},
{
"key": "proxmoxConfig",
"type": "custom",
"component": "proxmoxHostSettings"
"component": "proxmoxHostSettings",
"defaultable": false
},
{
"key": "enableProxmoxStats",
"type": "custom",
"component": "proxmoxHostSettings"
"component": "proxmoxHostSettings",
"defaultable": false
},
{
"key": "proxmoxStatsConfig",
"type": "custom",
"component": "proxmoxHostSettings"
"component": "proxmoxHostSettings",
"defaultable": false
}
]
}
plugins/remote-desktop/locales/en.json
+3 -1
View File
@@ -323,7 +323,9 @@
"enableToolbar": {
"label": "Remote desktop toolbar",
"description": "Show the toolbar in RDP, VNC and Telnet sessions."
}
},
"displayGroup": "Display",
"displayDefaultsTab": "Remote Desktop"
}
},
"palette": {
plugins/remote-desktop/manifest.json
+293 -18
View File
@@ -150,7 +150,8 @@
"labelKey": "settings.user.colorDepth32"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "resizeMethod",
@@ -172,7 +173,8 @@
"labelKey": "settings.user.resizeReconnect"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "forceLossless",
@@ -194,7 +196,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "enableWallpaper",
@@ -216,7 +219,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "enableFontSmoothing",
@@ -238,7 +242,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "enableDesktopComposition",
@@ -260,7 +265,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "disableAudio",
@@ -282,7 +288,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "enablePrinting",
@@ -304,7 +311,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "enableDrive",
@@ -326,7 +334,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "disableCopy",
@@ -348,7 +357,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
},
{
"key": "disablePaste",
@@ -370,7 +380,8 @@
"labelKey": "settings.user.off"
}
],
"default": "inherit"
"default": "inherit",
"hidden": true
}
],
"host": {
@@ -380,21 +391,24 @@
"type": "boolean",
"labelKey": "settings.host.enableRdp.label",
"default": false,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "enableVnc",
"type": "boolean",
"labelKey": "settings.host.enableVnc.label",
"default": false,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "enableTelnet",
"type": "boolean",
"labelKey": "settings.host.enableTelnet.label",
"default": false,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "rdpPort",
@@ -403,7 +417,8 @@
"min": 1,
"max": 65535,
"default": 3389,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "vncPort",
@@ -412,7 +427,8 @@
"min": 1,
"max": 65535,
"default": 5900,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "telnetPort",
@@ -421,7 +437,8 @@
"min": 1,
"max": 65535,
"default": 23,
"hidden": true
"hidden": true,
"defaultable": false
},
{
"key": "rdpSecurity",
@@ -444,7 +461,8 @@
"default": {},
"hidden": true,
"shareRead": "edit",
"secretKeys": ["gateway-password"]
"secretKeys": ["gateway-password"],
"defaultable": false
},
{
"key": "enableToolbar",
@@ -453,6 +471,263 @@
"descriptionKey": "settings.host.enableToolbar.description",
"default": true,
"hidden": true
},
{
"key": "colorDepth",
"type": "select",
"labelKey": "settings.user.colorDepth.label",
"descriptionKey": "settings.user.colorDepth.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "16",
"labelKey": "settings.user.colorDepth16"
},
{
"value": "24",
"labelKey": "settings.user.colorDepth24"
},
{
"value": "32",
"labelKey": "settings.user.colorDepth32"
}
],
"default": "inherit",
"personal": true
},
{
"key": "resizeMethod",
"type": "select",
"labelKey": "settings.user.resizeMethod.label",
"descriptionKey": "settings.user.resizeMethod.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "display-update",
"labelKey": "settings.user.resizeDisplayUpdate"
},
{
"value": "reconnect",
"labelKey": "settings.user.resizeReconnect"
}
],
"default": "inherit",
"personal": true
},
{
"key": "forceLossless",
"type": "select",
"labelKey": "settings.user.forceLossless.label",
"descriptionKey": "settings.user.forceLossless.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "enableWallpaper",
"type": "select",
"labelKey": "settings.user.enableWallpaper.label",
"descriptionKey": "settings.user.enableWallpaper.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "enableFontSmoothing",
"type": "select",
"labelKey": "settings.user.enableFontSmoothing.label",
"descriptionKey": "settings.user.enableFontSmoothing.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "enableDesktopComposition",
"type": "select",
"labelKey": "settings.user.enableDesktopComposition.label",
"descriptionKey": "settings.user.enableDesktopComposition.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "disableAudio",
"type": "select",
"labelKey": "settings.user.disableAudio.label",
"descriptionKey": "settings.user.disableAudio.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "enablePrinting",
"type": "select",
"labelKey": "settings.user.enablePrinting.label",
"descriptionKey": "settings.user.enablePrinting.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "enableDrive",
"type": "select",
"labelKey": "settings.user.enableDrive.label",
"descriptionKey": "settings.user.enableDrive.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "disableCopy",
"type": "select",
"labelKey": "settings.user.disableCopy.label",
"descriptionKey": "settings.user.disableCopy.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
},
{
"key": "disablePaste",
"type": "select",
"labelKey": "settings.user.disablePaste.label",
"descriptionKey": "settings.user.disablePaste.description",
"group": "settings.host.displayGroup",
"options": [
{
"value": "inherit",
"labelKey": "settings.user.inherit"
},
{
"value": "on",
"labelKey": "settings.user.on"
},
{
"value": "off",
"labelKey": "settings.user.off"
}
],
"default": "inherit",
"personal": true
}
]
}
plugins/remote-desktop/src/backend/host-settings.ts
+18 -5
View File
@@ -177,7 +177,7 @@ export function hostPayloadLegacy(
return Object.keys(out).length > 0 ? out : null;
}
/** User setting key to the guacd parameter it sets. */
/** Display field key to the guacd parameter it sets. */
const USER_DEFAULT_PARAMS: Record<string, string> = {
colorDepth: "color-depth",
resizeMethod: "resize-method",
@@ -193,8 +193,8 @@ const USER_DEFAULT_PARAMS: Record<string, string> = {
};
/**
* The user's RDP defaults as guacd parameters. "inherit" leaves a parameter
* to the host and guacd; on and off become booleans.
* Display settings as guacd parameters. "inherit" leaves a parameter to the
* host and guacd; on and off become booleans.
*/
export function userDefaultParams(
values: Record<string, unknown>,
@@ -215,9 +215,22 @@ export function userDefaultParams(
return params;
}
export async function readUserDefaults(
/**
* The display settings a session runs with, as guacd parameters: the host's
* as this user sees them (their own defaults while the host follows its
* defaults), or with no host, this user's defaults.
*/
export async function readDisplayDefaults(
ctx: PluginContext,
userId: string,
hostId?: number,
): Promise<Record<string, unknown>> {
return userDefaultParams(await ctx.settings.getAll("user", userId));
const values: Record<string, unknown> = {};
for (const key of Object.keys(USER_DEFAULT_PARAMS)) {
values[key] =
hostId === undefined
? await ctx.settings.getHostDefault(userId, key)
: await ctx.settings.getHostFor(hostId, userId, key);
}
return userDefaultParams(values);
}
plugins/remote-desktop/src/backend/routes.ts
+9 -5
View File
@@ -23,7 +23,7 @@ import {
PORT_KEY,
isRemoteProtocol,
readHostSettings,
readUserDefaults,
readDisplayDefaults,
type RemoteProtocol,
} from "./host-settings.js";
import { errorMessage, type RemoteDesktopLogger } from "./log.js";
@@ -203,7 +203,7 @@ export function registerRoutes(router: Router, deps: RouteDeps): void {
const userId = ctx.currentActor();
if (type === "rdp" && userId) {
for (const [key, value] of Object.entries(
await readUserDefaults(ctx, userId),
await readDisplayDefaults(ctx, userId),
)) {
if (isServerOwnedSetting(key)) continue;
if (options[key] === undefined) options[key] = value;
@@ -319,9 +319,11 @@ export function registerRoutes(router: Router, deps: RouteDeps): void {
});
}
// The user's RDP defaults sit under whatever the host sets itself.
// The display settings sit under whatever the host's guacd settings say.
const { config, guacdOverrides } = cleanGuacConfig({
...(protocol === "rdp" ? await readUserDefaults(ctx, userId) : {}),
...(protocol === "rdp"
? await readDisplayDefaults(ctx, userId, hostId)
: {}),
...settings.guacamoleConfig,
});
let guacConfig = config;
@@ -545,7 +547,9 @@ export function registerRoutes(router: Router, deps: RouteDeps): void {
.json({ error: "Protocol is not enabled for this host" });
}
const { guacdOverrides } = cleanGuacConfig({
...(protocol === "rdp" ? await readUserDefaults(ctx, userId) : {}),
...(protocol === "rdp"
? await readDisplayDefaults(ctx, userId, hostId)
: {}),
...settings.guacamoleConfig,
});
guacd = {
plugins/remote-desktop/src/frontend/index.tsx
+33
View File
@@ -17,6 +17,7 @@ import {
} from "@termix/plugin-sdk/frontend";
import {
FakeSwitch,
HostFeatureFields,
SectionCard,
SettingRow,
isElectron,
@@ -166,6 +167,7 @@ function ToolbarCard({
<SettingRow
label={t("settings.host.enableToolbar.label")}
description={t("settings.host.enableToolbar.description")}
defaultKey="enableToolbar"
>
<FakeSwitch
checked={form.enableToolbar}
@@ -254,6 +256,27 @@ function TelnetSection(props: HostEditorSectionProps) {
);
}
/**
* The defaults editor's remote desktop section: the display settings and the
* toolbar, which every host follows unless its own guacd settings say
* otherwise. A host edits these in its protocol tabs instead.
*/
function DisplayDefaultsSection(props: HostEditorSectionProps) {
const { t } = useTranslation();
const { form, setField } = remoteDesktopForm(props);
return (
<>
<SectionCard
title={t("settings.host.displayGroup")}
icon={<Monitor className="size-3.5" />}
>
<HostFeatureFields form={props.form} updateForm={props.updateForm} />
</SectionCard>
<ToolbarCard form={form} setField={setField} />
</>
);
}
const SECTIONS: Record<Protocol, ComponentType<HostEditorSectionProps>> = {
rdp: RdpSection,
vnc: VncSection,
@@ -343,6 +366,16 @@ function registerHostSurfaces(app: TermixApp): void {
});
}
app.registerHostEditorSection({
id: "remote-desktop-display",
group: "top",
titleKey: "settings.host.displayDefaultsTab",
icon: Monitor,
order: 40,
defaults: "only",
component: DisplayDefaultsSection,
});
if (isElectron()) registerNativeRdp(app);
}
plugins/remote-desktop/tests/backend/routes.test.ts
+4 -3
View File
@@ -149,14 +149,15 @@ describe("POST /connect-host/:hostId", () => {
});
});
it("puts the user's RDP defaults under the host's own values", async () => {
it("puts the host's display settings under its own guacd settings", async () => {
server = await start({ protocolTargets: { "7:rdp": target() } });
await server.mock.ctx.settings.setHost(7, "enableRdp", true);
await server.mock.ctx.settings.setHost(7, "guacamoleConfig", {
"color-depth": 32,
});
await server.mock.ctx.settings.setUser("user-1", "colorDepth", "16");
await server.mock.ctx.settings.setUser("user-1", "disableCopy", "on");
// What the host follows from its defaults.
await server.mock.ctx.settings.setHost(7, "colorDepth", "16");
await server.mock.ctx.settings.setHost(7, "disableCopy", "on");
const response = await server.request("POST", "/connect-host/7", {
protocol: "rdp",
plugins/snippets/manifest.json
+4 -2
View File
@@ -108,7 +108,8 @@
"descriptionKey": "host.startupDescription",
"hidden": true,
"min": 1,
"shareRead": "view"
"shareRead": "view",
"defaultLevels": ["user", "folder"]
},
{
"key": "quickActions",
@@ -117,7 +118,8 @@
"descriptionKey": "host.quickActionsDescription",
"hidden": true,
"default": [],
"shareRead": "view"
"shareRead": "view",
"defaultLevels": ["user", "folder"]
}
]
}
plugins/snippets/src/frontend/HostSnippetsSection.tsx
+119 -103
View File
@@ -3,7 +3,14 @@ import {
useTranslation,
type HostEditorSectionProps,
} from "@termix/plugin-sdk/frontend";
import { Button, Input, SectionCard, Select2 } from "@termix/plugin-sdk/ui";
import {
Button,
HostDefaultBadge,
HostDefaultField,
Input,
SectionCard,
Select2,
} from "@termix/plugin-sdk/ui";
import { PLUGIN_ID, readStartupSnippetId } from "../shared/host-settings.js";
import { useSnippetOptions } from "./use-snippet-options";
@@ -62,110 +69,119 @@ export function HostSnippetsSection({
return (
<>
<SectionCard
title={t("host.startupTitle")}
icon={<Play className="size-3.5" />}
>
<div className="flex flex-col gap-1.5 py-3">
<p className="text-xs text-muted-foreground">
{t("host.startupDescription")}
</p>
<Select2
aria-label={t("host.startupTitle")}
value={startupSnippetId ?? ""}
onChange={(e) =>
write({
startupSnippetId: e.target.value
? Number(e.target.value)
: null,
})
}
className="flex h-9 w-full border border-border bg-background px-3 py-1 text-xs outline-none focus:ring-1 focus:ring-ring"
>
<option value="">{t("host.none")}</option>
{options.map((snippet) => (
<option key={snippet.id} value={snippet.id}>
{snippet.name}
</option>
))}
</Select2>
</div>
</SectionCard>
<SectionCard
title={t("host.quickActionsTitle")}
icon={<Zap className="size-3.5" />}
action={
<Button
variant="outline"
size="sm"
className="h-6 text-[10px] px-2 border-accent-brand/40 text-accent-brand"
onClick={() =>
setQuickActions([...quickActions, { name: "", snippetId: null }])
}
>
<Plus className="size-3 mr-1" /> {t("host.addQuickAction")}
</Button>
}
>
<div className="flex flex-col gap-3 py-3">
<p className="text-xs text-muted-foreground">
{t("host.quickActionsDescription")}
</p>
{quickActions.length === 0 && (
<div className="flex flex-col items-center justify-center py-4 text-muted-foreground/40 gap-1.5">
<Zap className="size-6" />
<span className="text-xs">{t("host.noQuickActions")}</span>
</div>
)}
{quickActions.map((row, index) => (
<div
key={index}
className="flex items-center gap-2 p-2 bg-muted/20 border border-border group"
<HostDefaultField settingKey="startupSnippetId">
<SectionCard
title={t("host.startupTitle")}
icon={<Play className="size-3.5" />}
>
<div className="flex flex-col gap-1.5 py-3">
<p className="flex items-center gap-1.5 text-xs text-muted-foreground">
{t("host.startupDescription")}
<HostDefaultBadge settingKey="startupSnippetId" />
</p>
<Select2
aria-label={t("host.startupTitle")}
value={startupSnippetId ?? ""}
onChange={(e) =>
write({
startupSnippetId: e.target.value
? Number(e.target.value)
: null,
})
}
className="flex h-9 w-full border border-border bg-background px-3 py-1 text-xs outline-none focus:ring-1 focus:ring-ring"
>
<Input
className="h-7 text-xs flex-1"
placeholder={t("host.buttonLabel")}
value={row.name}
onChange={(e) => {
const next = [...quickActions];
next[index] = { ...row, name: e.target.value };
setQuickActions(next);
}}
/>
<Select2
aria-label={t("host.selectSnippet")}
className="h-7 text-xs flex-1 border border-border bg-background px-2 outline-none focus:ring-1 focus:ring-ring"
value={row.snippetId ?? ""}
onChange={(e) => {
const next = [...quickActions];
next[index] = {
...row,
snippetId: e.target.value ? Number(e.target.value) : null,
};
setQuickActions(next);
}}
<option value="">{t("host.none")}</option>
{options.map((snippet) => (
<option key={snippet.id} value={snippet.id}>
{snippet.name}
</option>
))}
</Select2>
</div>
</SectionCard>
</HostDefaultField>
<HostDefaultField settingKey="quickActions">
<SectionCard
title={t("host.quickActionsTitle")}
icon={<Zap className="size-3.5" />}
action={
<Button
variant="outline"
size="sm"
className="h-6 text-[10px] px-2 border-accent-brand/40 text-accent-brand"
onClick={() =>
setQuickActions([
...quickActions,
{ name: "", snippetId: null },
])
}
>
<Plus className="size-3 mr-1" /> {t("host.addQuickAction")}
</Button>
}
>
<div className="flex flex-col gap-3 py-3">
<p className="flex items-center gap-1.5 text-xs text-muted-foreground">
{t("host.quickActionsDescription")}
<HostDefaultBadge settingKey="quickActions" />
</p>
{quickActions.length === 0 && (
<div className="flex flex-col items-center justify-center py-4 text-muted-foreground/40 gap-1.5">
<Zap className="size-6" />
<span className="text-xs">{t("host.noQuickActions")}</span>
</div>
)}
{quickActions.map((row, index) => (
<div
key={index}
className="flex items-center gap-2 p-2 bg-muted/20 border border-border group"
>
<option value="">{t("host.selectSnippet")}</option>
{options.map((snippet) => (
<option key={snippet.id} value={snippet.id}>
{snippet.name}
</option>
))}
</Select2>
<button
type="button"
aria-label={t("host.removeQuickAction")}
className="text-muted-foreground hover:text-destructive opacity-0 group-hover:opacity-100 transition-opacity"
onClick={() =>
setQuickActions(quickActions.filter((_, i) => i !== index))
}
>
<Trash2 className="size-3.5" />
</button>
</div>
))}
</div>
</SectionCard>
<Input
className="h-7 text-xs flex-1"
placeholder={t("host.buttonLabel")}
value={row.name}
onChange={(e) => {
const next = [...quickActions];
next[index] = { ...row, name: e.target.value };
setQuickActions(next);
}}
/>
<Select2
aria-label={t("host.selectSnippet")}
className="h-7 text-xs flex-1 border border-border bg-background px-2 outline-none focus:ring-1 focus:ring-ring"
value={row.snippetId ?? ""}
onChange={(e) => {
const next = [...quickActions];
next[index] = {
...row,
snippetId: e.target.value ? Number(e.target.value) : null,
};
setQuickActions(next);
}}
>
<option value="">{t("host.selectSnippet")}</option>
{options.map((snippet) => (
<option key={snippet.id} value={snippet.id}>
{snippet.name}
</option>
))}
</Select2>
<button
type="button"
aria-label={t("host.removeQuickAction")}
className="text-muted-foreground hover:text-destructive opacity-0 group-hover:opacity-100 transition-opacity"
onClick={() =>
setQuickActions(quickActions.filter((_, i) => i !== index))
}
>
<Trash2 className="size-3.5" />
</button>
</div>
))}
</div>
</SectionCard>
</HostDefaultField>
</>
);
}
plugins/snippets/src/frontend/index.tsx
+1
View File
@@ -127,6 +127,7 @@ export function activate(app: TermixApp): void {
titleKey: "host.tabTitle",
icon: Play,
order: 15,
defaults: true,
component: HostSnippetsSection,
});
plugins/ssh-terminal/locales/en.json
-17
View File
@@ -461,13 +461,11 @@
"lineHeight": "Line Height",
"lineHeightLabel": "Line Height",
"linkClickBehaviorConfirm": "Show popup to open or copy",
"linkClickBehaviorDefault": "Default (follow app setting)",
"linkClickBehaviorDesc": "Controls what happens when you click a link in the terminal. Use 'Default' to follow the app-level setting.",
"linkClickBehaviorDirect": "Open directly",
"linkClickBehaviorLabel": "Link Click Behavior",
"loadingHost": "Loading host...",
"localEchoAuto": "Automatic",
"localEchoDefault": "Use global setting",
"localEchoDesc": "Predict safe printable keystrokes locally on slow connections. Password prompts and control input are never echoed.",
"localEchoLabel": "Local Echo",
"localEchoOff": "Off",
@@ -512,8 +510,6 @@
"themePreview": "Theme Preview",
"useSSHTitleDesc": "Update the tab title from the shell's window title instead of the host name",
"useSSHTitleLabel": "Use SSH Window Title",
"useUserDefaults": "Use user defaults",
"useUserTerminalDefaultsDesc": "Keep this host in step with the terminal defaults in your profile.",
"enableTunnel": "Enable Tunnel",
"enableFileManager": "Enable File Manager",
"enableDocker": "Enable Docker",
@@ -571,19 +567,6 @@
"startRecording": "Start Recording",
"stopRecording": "Stop Recording"
},
"terminalDefaults": {
"clearAll": "Clear All",
"description": "Set values that every host inherits unless it overrides them.",
"dialogDescription": "These apply to hosts that leave a setting unset. Anything set on a host wins.",
"inherit": "Inherit",
"manage": "Manage",
"off": "Off",
"on": "On",
"savedThemeLabel": "Apply Saved Theme",
"savedThemePlaceholder": "Choose a saved theme",
"title": "Connection Defaults",
"apply": "Apply"
},
"keybindings": {
"copy": "Copy selection",
"paste": "Paste",
plugins/ssh-terminal/manifest.json
+47 -38
View File
@@ -151,21 +151,24 @@
"type": "boolean",
"labelKey": "settings.admin.commandHistoryForNewHosts.label",
"descriptionKey": "settings.admin.commandHistoryForNewHosts.description",
"default": true
"default": true,
"hidden": true
},
{
"key": "newHostTheme",
"type": "custom",
"component": "newHostTheme",
"group": "settings.admin.group.newHosts",
"default": "termix"
"default": "termix",
"hidden": true
},
{
"key": "newHostFontFamily",
"type": "custom",
"component": "newHostFontFamily",
"group": "settings.admin.group.newHosts",
"default": "Caskaydia Cove Nerd Font Mono"
"default": "Caskaydia Cove Nerd Font Mono",
"hidden": true
},
{
"key": "newHostFontSize",
@@ -175,7 +178,8 @@
"group": "settings.admin.group.newHosts",
"min": 8,
"max": 36,
"default": 14
"default": 14,
"hidden": true
},
{
"key": "newHostCursorStyle",
@@ -196,14 +200,16 @@
"value": "bar",
"labelKey": "hosts.cursorStyleBar"
}
]
],
"hidden": true
},
{
"key": "newHostCursorBlink",
"type": "boolean",
"labelKey": "settings.admin.newHostCursorBlink.label",
"group": "settings.admin.group.newHosts",
"default": true
"default": true,
"hidden": true
},
{
"key": "newHostAutoTmux",
@@ -211,7 +217,8 @@
"labelKey": "settings.admin.newHostAutoTmux.label",
"descriptionKey": "settings.admin.newHostAutoTmux.description",
"group": "settings.admin.group.newHosts",
"default": false
"default": false,
"hidden": true
},
{
"key": "touchInput",
@@ -399,15 +406,15 @@
"type": "boolean",
"labelKey": "settings.host.enableCommandHistory.label",
"descriptionKey": "settings.host.enableCommandHistory.description",
"default": true,
"defaultFrom": "commandHistoryForNewHosts"
"default": true
},
{
"key": "inheritAppearance",
"type": "boolean",
"labelKey": "settings.host.inheritAppearance.label",
"hidden": true,
"default": true
"default": true,
"defaultable": false
},
{
"key": "theme",
@@ -415,7 +422,7 @@
"labelKey": "settings.host.theme.label",
"hidden": true,
"default": "termix",
"defaultFrom": "newHostTheme"
"personal": true
},
{
"key": "cursorBlink",
@@ -423,7 +430,7 @@
"labelKey": "settings.host.cursorBlink.label",
"hidden": true,
"default": true,
"defaultFrom": "newHostCursorBlink"
"personal": true
},
{
"key": "cursorStyle",
@@ -445,7 +452,7 @@
"labelKey": "hosts.cursorStyleBar"
}
],
"defaultFrom": "newHostCursorStyle"
"personal": true
},
{
"key": "fontSize",
@@ -453,7 +460,7 @@
"labelKey": "settings.host.fontSize.label",
"hidden": true,
"default": 14,
"defaultFrom": "newHostFontSize"
"personal": true
},
{
"key": "fontFamily",
@@ -461,28 +468,31 @@
"labelKey": "settings.host.fontFamily.label",
"hidden": true,
"default": "Caskaydia Cove Nerd Font Mono",
"defaultFrom": "newHostFontFamily"
"personal": true
},
{
"key": "scrollback",
"type": "number",
"labelKey": "settings.host.scrollback.label",
"hidden": true,
"default": 10000
"default": 10000,
"personal": true
},
{
"key": "letterSpacing",
"type": "number",
"labelKey": "settings.host.letterSpacing.label",
"hidden": true,
"default": 0
"default": 0,
"personal": true
},
{
"key": "lineHeight",
"type": "number",
"labelKey": "settings.host.lineHeight.label",
"hidden": true,
"default": 1
"default": 1,
"personal": true
},
{
"key": "bellStyle",
@@ -507,34 +517,39 @@
"value": "both",
"labelKey": "hosts.bellStyleBoth"
}
]
],
"personal": true
},
{
"key": "minimumContrastRatio",
"type": "number",
"labelKey": "settings.host.minimumContrastRatio.label",
"hidden": true,
"default": 1
"default": 1,
"personal": true
},
{
"key": "backgroundImage",
"type": "string",
"labelKey": "settings.host.backgroundImage.label",
"hidden": true,
"default": ""
"default": "",
"personal": true
},
{
"key": "backgroundImageOpacity",
"type": "number",
"labelKey": "settings.host.backgroundImageOpacity.label",
"hidden": true,
"default": 0.15
"default": 0.15,
"personal": true
},
{
"key": "customThemeColors",
"type": "json",
"labelKey": "settings.host.customThemeColors.label",
"hidden": true
"hidden": true,
"personal": true
},
{
"key": "rightClickSelectsWord",
@@ -614,8 +629,7 @@
"type": "boolean",
"labelKey": "settings.host.autoTmux.label",
"hidden": true,
"default": false,
"defaultFrom": "newHostAutoTmux"
"default": false
},
{
"key": "useSSHTitle",
@@ -642,12 +656,8 @@
"type": "select",
"labelKey": "settings.host.linkClickBehavior.label",
"hidden": true,
"default": "default",
"default": "confirm",
"options": [
{
"value": "default",
"labelKey": "hosts.linkClickBehaviorDefault"
},
{
"value": "confirm",
"labelKey": "hosts.linkClickBehaviorConfirm"
@@ -663,12 +673,8 @@
"type": "select",
"labelKey": "settings.host.localEcho.label",
"hidden": true,
"default": "default",
"default": "auto",
"options": [
{
"value": "default",
"labelKey": "hosts.localEchoDefault"
},
{
"value": "off",
"labelKey": "hosts.localEchoOff"
@@ -704,7 +710,8 @@
"key": "terminalDefaults",
"type": "custom",
"component": "terminalDefaults",
"default": {}
"default": {},
"hidden": true
},
{
"key": "customThemes",
@@ -739,7 +746,8 @@
"value": "on",
"labelKey": "hosts.localEchoOn"
}
]
],
"hidden": true
},
{
"key": "linkClickBehavior",
@@ -756,7 +764,8 @@
"value": "direct",
"labelKey": "hosts.linkClickBehaviorDirect"
}
]
],
"hidden": true
},
{
"key": "macros",
plugins/ssh-terminal/src/backend/settings.ts
-26
View File
@@ -10,11 +10,7 @@ import {
} from "./images/image-storage-settings.js";
import { DEFAULT_TIMEOUT_MINUTES } from "./session-manager.js";
import {
DEFAULT_APPEARANCE,
NEW_HOST_ADMIN_KEYS,
pickTerminalValues,
readUserSettings,
type NewHostTerminalDefaults,
type TerminalUserSettings,
} from "../shared/terminal-settings.js";
@@ -84,8 +80,6 @@ export interface ClientSettings {
sessionPersistence: boolean;
commandHistoryEnabled: boolean;
touchInput: TouchInputSettings;
/** What a new host's terminal starts with. */
newHostDefaults: NewHostTerminalDefaults;
/** The caller's own terminal settings. */
user: TerminalUserSettings;
}
@@ -114,26 +108,6 @@ export async function readClientSettings(
sessionPersistence: all[ADMIN_KEYS.sessionPersistence] !== false,
commandHistoryEnabled: all[ADMIN_KEYS.commandHistoryEnabled] !== false,
touchInput: normalizeTouchInputSettings(touch),
newHostDefaults: readNewHostDefaults(all),
user: readUserSettings(user),
};
}
/** The admin's new-host terminal defaults, typed, with the built-in ones under them. */
export function readNewHostDefaults(
admin: Record<string, unknown>,
): NewHostTerminalDefaults {
const byHostKey: Record<string, unknown> = {};
for (const [adminKey, hostKey] of Object.entries(NEW_HOST_ADMIN_KEYS)) {
byHostKey[hostKey] = admin[adminKey];
}
return {
fontSize: DEFAULT_APPEARANCE.fontSize,
fontFamily: DEFAULT_APPEARANCE.fontFamily,
theme: DEFAULT_APPEARANCE.theme,
cursorStyle: DEFAULT_APPEARANCE.cursorStyle,
cursorBlink: DEFAULT_APPEARANCE.cursorBlink,
autoTmux: false,
...pickTerminalValues(byHostKey, Object.values(NEW_HOST_ADMIN_KEYS)),
} as NewHostTerminalDefaults;
}
plugins/ssh-terminal/src/frontend/index.tsx
+2 -13
View File
@@ -46,11 +46,6 @@ import {
SendControlCodeEditor,
SendTextEditor,
} from "./lib/keybinding-editors";
import { TerminalDefaultsSettings } from "./settings/TerminalDefaultsSettings";
import {
NewHostFontSetting,
NewHostThemeSetting,
} from "./settings/NewHostLookSettings";
import { TerminalPreview } from "./look/TerminalPreview";
import { installTerminalGlobalStyles } from "./look/terminal-global-styles";
import {
@@ -60,7 +55,6 @@ import {
} from "./look/look-actions";
import {
invalidateTerminalClientSettings,
loadTerminalClientSettings,
resetTerminalClientSettings,
} from "./terminal-settings";
import { moveLocalTerminalPreferences } from "./settings/local-preferences-migration";
@@ -142,6 +136,7 @@ export function activate(app: TermixApp): void {
titleKey: "hosts.tabTerminal",
icon: SquareTerminal,
order: 10,
defaults: true,
component: HostTerminalSection,
});
@@ -305,9 +300,6 @@ export function activate(app: TermixApp): void {
app.registerAction("terminal.resolveTheme", (async (
request: ResolveLookRequest & { hostId?: number | string } = {},
) => {
const settings = await loadTerminalClientSettings(app.api).catch(
() => null,
);
let host: PluginHostRecord | null | undefined = request.host;
if (!host && request.hostId !== undefined) {
host =
@@ -316,15 +308,12 @@ export function activate(app: TermixApp): void {
(entry) => String(entry.id) === String(request.hostId),
);
}
return resolveTerminalLook({ ...request, host }, settings?.user);
return resolveTerminalLook({ ...request, host });
}) as never);
app.registerAction("terminal.themes", () => listTerminalThemes());
app.registerSettingsComponent("touchInput", TouchInputSettings);
app.registerSettingsComponent("imageStorageTest", ImageStorageTest);
app.registerSettingsComponent("terminalDefaults", TerminalDefaultsSettings);
app.registerSettingsComponent("newHostTheme", NewHostThemeSetting);
app.registerSettingsComponent("newHostFontFamily", NewHostFontSetting);
app.onSettingsChanged(() => invalidateTerminalClientSettings());
if (!app.guest) void moveLocalTerminalPreferences(app);
plugins/ssh-terminal/src/frontend/look/look-actions.ts
+1 -3
View File
@@ -10,7 +10,6 @@ import { resolveForHost } from "../terminal-settings";
import type {
CursorStyle,
TerminalThemeColors,
TerminalUserSettings,
} from "../../shared/terminal-settings";
/**
@@ -45,9 +44,8 @@ export interface ResolveLookRequest {
export function resolveTerminalLook(
request: ResolveLookRequest,
user: TerminalUserSettings | undefined,
): ResolvedTerminalLook {
const config = resolveForHost(request.host ?? null, user);
const config = resolveForHost(request.host ?? null);
const themeId = request.theme || config.theme;
ensureTerminalFontsLoaded(config.fontFamily);
return {
plugins/ssh-terminal/src/frontend/settings/HostTerminalSettings.tsx
+53 -81
View File
@@ -5,6 +5,7 @@ import { toast } from "sonner";
import {
Button,
FakeSwitch,
HostDefaultBadge,
Input,
SectionCard,
Select2,
@@ -33,9 +34,6 @@ import {
TERMINAL_FONT_ZOOM_MAX,
} from "../look/terminal-font-zoom";
import {
APPEARANCE_KEYS,
INHERIT_APPEARANCE_KEY,
pickTerminalValues,
readHostTerminalSettings,
readUserSettings,
type BackspaceMode,
@@ -45,14 +43,10 @@ import {
type HostTerminalSettings as HostTerminalValues,
type SavedCustomTheme,
} from "../../shared/terminal-settings";
import {
invalidateTerminalClientSettings,
useTerminalClientSettings,
} from "../terminal-settings";
import { invalidateTerminalClientSettings } from "../terminal-settings";
const PLUGIN_ID = "ssh-terminal";
const CUSTOM_FONT_OPTION = "__custom__";
const APPEARANCE = new Set<string>(APPEARANCE_KEYS);
type HostPluginSettings = Record<string, Record<string, unknown>>;
@@ -64,10 +58,8 @@ type HostPluginSettings = Record<string, Record<string, unknown>>;
export function HostTerminalSettings({
form: editorForm,
updateForm,
host,
}: Pick<HostEditorSectionProps, "form" | "setField" | "updateForm" | "host">) {
const { t } = useTranslation();
const client = useTerminalClientSettings();
const userSettings = useSettings("user");
// The preview ends when the editor section goes away.
useEffect(() => () => setThemePreview(null), []);
@@ -75,18 +67,8 @@ export function HostTerminalSettings({
const stored = ((editorForm?.pluginSettings as HostPluginSettings)?.[
PLUGIN_ID
] ?? {}) as Record<string, unknown>;
// A new host starts from the admin's new-host defaults.
const seed = host ? {} : (client?.newHostDefaults ?? {});
const own = readHostTerminalSettings({ ...seed, ...stored });
const userDefaults = pickTerminalValues(
client?.user.terminalDefaults ?? {},
APPEARANCE_KEYS,
);
// While the host follows the user, show the look it will actually get.
const form = {
...own,
...(own.inheritAppearance ? userDefaults : {}),
} as HostTerminalValues;
// The form holds what the host follows, so this is what it will look like.
const form = readHostTerminalSettings(stored) as HostTerminalValues;
const writeValues = (values: Record<string, unknown>) =>
updateForm((current) => {
@@ -103,23 +85,7 @@ export function HostTerminalSettings({
const setField = <K extends keyof HostTerminalValues>(
key: K,
value: HostTerminalValues[K],
) =>
writeValues({
[key]: value,
// Touching the look takes the host off the user's defaults.
...(APPEARANCE.has(key) ? { [INHERIT_APPEARANCE_KEY]: false } : {}),
});
const setInheritAppearance = (inherit: boolean) => {
if (inherit) {
writeValues({ [INHERIT_APPEARANCE_KEY]: true });
return;
}
// Keep what was shown, so switching off does not change the look.
const shown: Record<string, unknown> = {};
for (const key of APPEARANCE_KEYS) shown[key] = form[key];
writeValues({ ...shown, [INHERIT_APPEARANCE_KEY]: false });
};
) => writeValues({ [key]: value });
const [isCustomFont, setIsCustomFont] = useState(
() => !TERMINAL_FONTS.some((f) => f.value === form.fontFamily),
@@ -183,21 +149,7 @@ export function HostTerminalSettings({
icon={<Palette className="size-3.5" />}
>
<div className="flex flex-col gap-4 py-3">
<SettingRow
label={t("hosts.useUserDefaults")}
description={t("hosts.useUserTerminalDefaultsDesc")}
>
<FakeSwitch
checked={form.inheritAppearance}
onChange={setInheritAppearance}
/>
</SettingRow>
<fieldset
disabled={form.inheritAppearance}
className={
form.inheritAppearance ? "contents opacity-60" : "contents"
}
>
<>
<div className="space-y-2">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.themePreview")}
@@ -215,8 +167,9 @@ export function HostTerminalSettings({
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.colorTheme")}
<HostDefaultBadge settingKey="theme" />
</label>
<Select2
value={form.theme}
@@ -245,8 +198,9 @@ export function HostTerminalSettings({
</div>
<div className="flex flex-col gap-1.5">
<div className="flex items-center gap-1">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.fontFamilyLabel")}
<HostDefaultBadge settingKey="fontFamily" />
</label>
<TooltipProvider delayDuration={200}>
<Tooltip>
@@ -292,8 +246,9 @@ export function HostTerminalSettings({
</div>
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.fontSizeLabel")}
<HostDefaultBadge settingKey="fontSize" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{form.fontSize}px
@@ -308,8 +263,9 @@ export function HostTerminalSettings({
/>
</div>
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.cursorStyleLabel")}
<HostDefaultBadge settingKey="cursorStyle" />
</label>
<Select2
value={form.cursorStyle}
@@ -327,8 +283,9 @@ export function HostTerminalSettings({
</div>
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.letterSpacingPx")}
<HostDefaultBadge settingKey="letterSpacing" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{form.letterSpacing}px
@@ -344,8 +301,9 @@ export function HostTerminalSettings({
</div>
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.lineHeightLabel")}
<HostDefaultBadge settingKey="lineHeight" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{form.lineHeight.toFixed(1)}
@@ -360,8 +318,9 @@ export function HostTerminalSettings({
/>
</div>
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.bellStyleLabel")}
<HostDefaultBadge settingKey="bellStyle" />
</label>
<Select2
value={form.bellStyle}
@@ -378,8 +337,9 @@ export function HostTerminalSettings({
</Select2>
</div>
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.backspaceModeLabel")}
<HostDefaultBadge settingKey="backspaceMode" />
</label>
<Select2
value={form.backspaceMode}
@@ -397,7 +357,7 @@ export function HostTerminalSettings({
</Select2>
</div>
</div>
</fieldset>
</>
{form.theme === "custom" && (
<div className="flex flex-col gap-3">
<div className="flex flex-col gap-1.5">
@@ -455,8 +415,9 @@ export function HostTerminalSettings({
)}
</div>
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.customThemeColors")}
<HostDefaultBadge settingKey="customThemeColors" />
</label>
<button
type="button"
@@ -569,6 +530,7 @@ export function HostTerminalSettings({
)}
<SettingRow
label={t("hosts.cursorBlinking")}
defaultKey="cursorBlink"
description={t("hosts.cursorBlinkingDesc")}
>
<FakeSwitch
@@ -578,6 +540,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.rightClickSelectsWordLabel")}
defaultKey="rightClickSelectsWord"
description={t("hosts.rightClickSelectsWordShortDesc")}
>
<FakeSwitch
@@ -587,6 +550,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.macOptionIsMetaLabel")}
defaultKey="macOptionIsMeta"
description={t("hosts.macOptionIsMetaShortDesc")}
>
<FakeSwitch
@@ -596,6 +560,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.syntaxHighlightingLabel")}
defaultKey="syntaxHighlighting"
description={t("hosts.syntaxHighlightingDesc")}
>
<FakeSwitch
@@ -633,6 +598,7 @@ export function HostTerminalSettings({
).map(([key, labelKey, descKey]) => (
<SettingRow
key={key}
defaultKey="syntaxHighlightingOptions"
label={t(`hosts.${labelKey}`)}
description={t(`hosts.${descKey}`)}
>
@@ -650,8 +616,9 @@ export function HostTerminalSettings({
</div>
)}
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.backgroundImageLabel")}
<HostDefaultBadge settingKey="backgroundImage" />
</label>
<p className="text-[10px] text-muted-foreground">
{t("hosts.backgroundImageDesc")}
@@ -667,8 +634,9 @@ export function HostTerminalSettings({
{form.backgroundImage && (
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.backgroundImageOpacityLabel")}
<HostDefaultBadge settingKey="backgroundImageOpacity" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{Math.round(form.backgroundImageOpacity * 100)}%
@@ -693,8 +661,9 @@ export function HostTerminalSettings({
<div className="flex flex-col gap-4 py-3">
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.scrollbackBufferLabel")}
<HostDefaultBadge settingKey="scrollback" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{form.scrollback.toLocaleString()}{" "}
@@ -711,6 +680,7 @@ export function HostTerminalSettings({
</div>
<SettingRow
label={t("hosts.enableAutoTmux")}
defaultKey="autoTmux"
description={
<>
{t("hosts.enableAutoTmuxDesc")}{" "}
@@ -732,6 +702,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.useSSHTitleLabel")}
defaultKey="useSSHTitle"
description={t("hosts.useSSHTitleDesc")}
>
<FakeSwitch
@@ -741,6 +712,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.enableAutoMosh")}
defaultKey="autoMosh"
description={t("hosts.enableAutoMoshDesc")}
>
<FakeSwitch
@@ -750,6 +722,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.passwordPromptAutoFillLabel")}
defaultKey="passwordPromptAutoFill"
description={t("hosts.passwordPromptAutoFillDesc")}
>
<FakeSwitch
@@ -759,6 +732,7 @@ export function HostTerminalSettings({
</SettingRow>
<SettingRow
label={t("hosts.sudoPasswordAutoFillLabel")}
defaultKey="sudoPasswordAutoFill"
description={t("hosts.sudoPasswordAutoFillDesc")}
>
<FakeSwitch
@@ -767,20 +741,17 @@ export function HostTerminalSettings({
/>
</SettingRow>
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.localEchoLabel")}
<HostDefaultBadge settingKey="localEcho" />
</label>
<Select2
value={form.localEcho}
onChange={(e) =>
setField(
"localEcho",
e.target.value as "default" | "off" | "auto" | "on",
)
setField("localEcho", e.target.value as "off" | "auto" | "on")
}
className="flex h-9 w-full border border-border bg-background px-3 py-1 text-xs outline-none focus:ring-1 focus:ring-ring"
>
<option value="default">{t("hosts.localEchoDefault")}</option>
<option value="off">{t("hosts.localEchoOff")}</option>
<option value="auto">{t("hosts.localEchoAuto")}</option>
<option value="on">{t("hosts.localEchoOn")}</option>
@@ -798,22 +769,20 @@ export function HostTerminalSettings({
</p>
</div>
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.linkClickBehaviorLabel")}
<HostDefaultBadge settingKey="linkClickBehavior" />
</label>
<Select2
value={form.linkClickBehavior}
onChange={(e) =>
setField(
"linkClickBehavior",
e.target.value as "default" | "confirm" | "direct",
e.target.value as "confirm" | "direct",
)
}
className="flex h-9 w-full border border-border bg-background px-3 py-1 text-xs outline-none focus:ring-1 focus:ring-ring"
>
<option value="default">
{t("hosts.linkClickBehaviorDefault")}
</option>
<option value="confirm">
{t("hosts.linkClickBehaviorConfirm")}
</option>
@@ -827,8 +796,9 @@ export function HostTerminalSettings({
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 border-t border-border pt-4">
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.fastScrollModifierLabel")}
<HostDefaultBadge settingKey="fastScrollModifier" />
</label>
<Select2
value={form.fastScrollModifier}
@@ -849,8 +819,9 @@ export function HostTerminalSettings({
</div>
<div className="flex flex-col gap-1.5">
<div className="flex items-center justify-between">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.fastScrollSensitivityLabel")}
<HostDefaultBadge settingKey="fastScrollSensitivity" />
</label>
<span className="text-[10px] text-muted-foreground tabular-nums">
{form.fastScrollSensitivity}
@@ -867,8 +838,9 @@ export function HostTerminalSettings({
</div>
{form.autoMosh && (
<div className="flex flex-col gap-1.5">
<label className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
<label className="flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-widest text-muted-foreground">
{t("hosts.moshCommandLabel")}
<HostDefaultBadge settingKey="moshCommand" />
</label>
<Input
placeholder="mosh"
plugins/ssh-terminal/src/frontend/settings/NewHostLookSettings.tsx
-78
View File
@@ -1,78 +0,0 @@
import { SettingRow, Select2 } from "@termix/plugin-sdk/ui";
import {
useTranslation,
type SettingsComponentProps,
} from "@termix/plugin-sdk/frontend";
import { TERMINAL_FONTS, TERMINAL_THEMES } from "../look/terminal-themes";
import { DEFAULT_APPEARANCE } from "../../shared/terminal-settings";
const selectClass =
"flex h-8 w-48 border border-border bg-background px-2 text-xs outline-none focus:ring-1 focus:ring-ring";
/** Admin setting `newHostTheme`: the theme a new host starts with. */
export function NewHostThemeSetting({
values,
setValue,
running,
}: SettingsComponentProps) {
const { t } = useTranslation();
const value =
typeof values.newHostTheme === "string"
? values.newHostTheme
: DEFAULT_APPEARANCE.theme;
return (
<SettingRow
label={t("settings.admin.newHostTheme.label")}
description={t("settings.admin.newHostTheme.description")}
>
<Select2
value={value}
disabled={!running}
onChange={(e) => setValue("newHostTheme", e.target.value)}
className={selectClass}
>
{Object.entries(TERMINAL_THEMES)
.filter(([key]) => key !== "termixDark" && key !== "termixLight")
.map(([key, theme]) => (
<option key={key} value={key}>
{theme.name}
</option>
))}
</Select2>
</SettingRow>
);
}
/** Admin setting `newHostFontFamily`: the font a new host starts with. */
export function NewHostFontSetting({
values,
setValue,
running,
}: SettingsComponentProps) {
const { t } = useTranslation();
const value =
typeof values.newHostFontFamily === "string"
? values.newHostFontFamily
: DEFAULT_APPEARANCE.fontFamily;
const known = TERMINAL_FONTS.some((font) => font.value === value);
return (
<SettingRow
label={t("settings.admin.newHostFontFamily.label")}
description={t("settings.admin.newHostFontFamily.description")}
>
<Select2
value={value}
disabled={!running}
onChange={(e) => setValue("newHostFontFamily", e.target.value)}
className={`${selectClass} font-mono`}
>
{!known && <option value={value}>{value}</option>}
{TERMINAL_FONTS.map((font) => (
<option key={font.value} value={font.value}>
{font.label}
</option>
))}
</Select2>
</SettingRow>
);
}
plugins/ssh-terminal/src/frontend/settings/TerminalDefaultsSettings.tsx
-317
View File
@@ -1,317 +0,0 @@
import { useMemo, useState } from "react";
import type React from "react";
import {
Button,
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
SettingRow,
} from "@termix/plugin-sdk/ui";
import {
useTranslation,
type SettingsComponentProps,
} from "@termix/plugin-sdk/frontend";
import {
CURSOR_STYLES,
TERMINAL_FONTS,
TERMINAL_THEMES,
} from "../look/terminal-themes";
import { fromTriState, toTriState, type TriState } from "./tri-state";
import {
readUserSettings,
type TerminalDefaults,
} from "../../shared/terminal-settings";
const inputClass =
"h-8 w-full border border-border bg-background px-2 text-xs outline-none focus:ring-1 focus:ring-ring";
const labelClass =
"text-[10px] font-bold uppercase tracking-widest text-muted-foreground";
function Field({
label,
children,
}: {
label: string;
children: React.ReactNode;
}) {
return (
<div className="flex flex-col gap-1.5">
<span className={labelClass}>{label}</span>
{children}
</div>
);
}
function TriStateSelect({
value,
onChange,
}: {
value?: boolean;
onChange: (value: boolean | undefined) => void;
}) {
const { t } = useTranslation();
return (
<select
className="h-7 w-28 border border-border bg-background px-2 text-xs outline-none focus:ring-1 focus:ring-ring"
value={toTriState(value)}
onChange={(e) => onChange(fromTriState(e.target.value as TriState))}
>
<option value="inherit">{t("terminalDefaults.inherit")}</option>
<option value="on">{t("terminalDefaults.on")}</option>
<option value="off">{t("terminalDefaults.off")}</option>
</select>
);
}
/**
* The user's terminal defaults (the `terminalDefaults` user setting): the
* look every host that follows the user starts from. Applied to the form,
* saved with the rest of the section.
*/
export function TerminalDefaultsSettings({
values,
setValue,
running,
}: SettingsComponentProps) {
const { t } = useTranslation();
const saved = useMemo(() => readUserSettings(values), [values]);
const [open, setOpen] = useState(false);
const [terminal, setTerminal] = useState<TerminalDefaults>({});
const configuredCount = Object.values(saved.terminalDefaults).filter(
(value) => value !== undefined,
).length;
const openDialog = () => {
setTerminal(saved.terminalDefaults);
setOpen(true);
};
const updateTerminal = <K extends keyof TerminalDefaults>(
key: K,
value: TerminalDefaults[K],
) => setTerminal((current) => ({ ...current, [key]: value }));
const applySavedTheme = (id: string) => {
const theme = saved.customThemes.find((entry) => entry.id === id);
if (!theme) return;
setTerminal((current) => ({
...current,
theme: "custom",
customThemeColors: { ...theme.colors },
}));
};
const apply = () => {
const cleaned = Object.fromEntries(
Object.entries(terminal).filter(([, value]) => value !== undefined),
);
setValue("terminalDefaults", cleaned);
setOpen(false);
};
const inheritLabel = t("terminalDefaults.inherit");
return (
<>
<SettingRow
label={t("terminalDefaults.title")}
description={t("terminalDefaults.description")}
badge={configuredCount > 0 ? String(configuredCount) : undefined}
>
<Button
variant="outline"
size="sm"
disabled={!running}
onClick={openDialog}
>
{t("terminalDefaults.manage")}
</Button>
</SettingRow>
<Dialog open={open} onOpenChange={setOpen}>
<DialogContent className="sm:max-w-xl">
<DialogHeader>
<DialogTitle className="text-base font-bold">
{t("terminalDefaults.title")}
</DialogTitle>
<DialogDescription className="text-xs text-muted-foreground">
{t("terminalDefaults.dialogDescription")}{" "}
<a
href="https://docs.termix.site/features/files-and-hosts/connection-defaults"
target="_blank"
rel="noreferrer"
className="text-accent-brand hover:underline"
>
{t("hosts.docsLink")}
</a>
</DialogDescription>
</DialogHeader>
<div className="max-h-[55vh] overflow-y-auto pr-1">
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
<Field label={t("hosts.fontFamilyLabel")}>
<select
className={inputClass}
value={terminal.fontFamily ?? ""}
onChange={(e) =>
updateTerminal("fontFamily", e.target.value || undefined)
}
>
<option value="">{inheritLabel}</option>
{TERMINAL_FONTS.map((font) => (
<option key={font.value} value={font.value}>
{font.label}
</option>
))}
</select>
</Field>
<Field label={t("hosts.colorTheme")}>
<select
className={inputClass}
value={terminal.theme ?? ""}
onChange={(e) =>
updateTerminal("theme", e.target.value || undefined)
}
>
<option value="">{inheritLabel}</option>
{Object.entries(TERMINAL_THEMES)
.filter(
([key]) => key !== "termixDark" && key !== "termixLight",
)
.map(([key, theme]) => (
<option key={key} value={key}>
{theme.name}
</option>
))}
</select>
</Field>
{saved.customThemes.length > 0 && (
<Field label={t("terminalDefaults.savedThemeLabel")}>
<select
className={inputClass}
value=""
onChange={(e) => applySavedTheme(e.target.value)}
>
<option value="">
{t("terminalDefaults.savedThemePlaceholder")}
</option>
{saved.customThemes.map((theme) => (
<option key={theme.id} value={theme.id}>
{theme.name}
</option>
))}
</select>
</Field>
)}
<Field label={t("hosts.fontSizeLabel")}>
<input
className={inputClass}
type="number"
min={8}
max={32}
value={terminal.fontSize ?? ""}
placeholder={inheritLabel}
onChange={(e) =>
updateTerminal(
"fontSize",
e.target.value ? Number(e.target.value) : undefined,
)
}
/>
</Field>
<Field label={t("hosts.lineHeightLabel")}>
<input
className={inputClass}
type="number"
min={0.8}
max={2}
step={0.05}
value={terminal.lineHeight ?? ""}
placeholder={inheritLabel}
onChange={(e) =>
updateTerminal(
"lineHeight",
e.target.value ? Number(e.target.value) : undefined,
)
}
/>
</Field>
<Field label={t("hosts.cursorStyleLabel")}>
<select
className={inputClass}
value={terminal.cursorStyle ?? ""}
onChange={(e) =>
updateTerminal(
"cursorStyle",
(e.target.value || undefined) as
TerminalDefaults["cursorStyle"] | undefined,
)
}
>
<option value="">{inheritLabel}</option>
{CURSOR_STYLES.map((style) => (
<option key={style.value} value={style.value}>
{t(style.labelKey)}
</option>
))}
</select>
</Field>
<Field label={t("hosts.scrollbackBufferLabel")}>
<input
className={inputClass}
type="number"
min={1000}
max={100000}
step={1000}
value={terminal.scrollback ?? ""}
placeholder={inheritLabel}
onChange={(e) =>
updateTerminal(
"scrollback",
e.target.value ? Number(e.target.value) : undefined,
)
}
/>
</Field>
<div className="sm:col-span-2">
<SettingRow
label={t("hosts.cursorBlinking")}
description={t("hosts.cursorBlinkingDesc")}
>
<TriStateSelect
value={terminal.cursorBlink}
onChange={(value) => updateTerminal("cursorBlink", value)}
/>
</SettingRow>
</div>
</div>
</div>
<div className="flex items-center justify-between gap-2 pt-3 border-t border-border">
<Button variant="ghost" size="sm" onClick={() => setTerminal({})}>
{t("terminalDefaults.clearAll")}
</Button>
<div className="flex items-center gap-2">
<Button variant="ghost" size="sm" onClick={() => setOpen(false)}>
{t("common.cancel")}
</Button>
<Button size="sm" onClick={apply}>
{t("terminalDefaults.apply")}
</Button>
</div>
</div>
</DialogContent>
</Dialog>
</>
);
}
plugins/ssh-terminal/src/frontend/settings/tri-state.ts
-12
View File
@@ -1,12 +0,0 @@
// Booleans have three states in the defaults UI: unset means the host decides.
export type TriState = "inherit" | "on" | "off";
export function toTriState(value?: boolean): TriState {
if (value === undefined) return "inherit";
return value ? "on" : "off";
}
export function fromTriState(value: TriState): boolean | undefined {
if (value === "inherit") return undefined;
return value === "on";
}
plugins/ssh-terminal/src/frontend/terminal-api.ts
-2
View File
@@ -5,7 +5,6 @@ import {
} from "../shared/touch-input-settings";
import {
readUserSettings,
type NewHostTerminalDefaults,
type TerminalUserSettings,
} from "../shared/terminal-settings";
@@ -16,7 +15,6 @@ export interface TerminalClientSettings {
sessionPersistence: boolean;
commandHistoryEnabled: boolean;
touchInput: TouchInputSettings;
newHostDefaults?: NewHostTerminalDefaults;
user: TerminalUserSettings;
}
plugins/ssh-terminal/src/frontend/terminal-settings.ts
+1 -3
View File
@@ -105,11 +105,9 @@ export function hostTerminalValues(
export function resolveForHost(
host: object | null | undefined,
user: TerminalUserSettings = DEFAULT_USER_SETTINGS,
): ResolvedTerminalConfig {
const resolved = resolveTerminalSettings(
readHostTerminalSettings(hostTerminalValues(host)),
user.terminalDefaults,
);
return {
...resolved,
@@ -126,7 +124,7 @@ export function useTerminalSettings(
const ownKey = own ? JSON.stringify(own) : "";
return useMemo(() => {
const user = client?.user ?? DEFAULT_USER_SETTINGS;
return { config: resolveForHost(host, user), user };
return { config: resolveForHost(host), user };
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [ownKey, client]);
}
plugins/ssh-terminal/src/shared/terminal-settings.ts
+14 -56
View File
@@ -47,7 +47,7 @@ export type BackspaceMode = "normal" | "control-h";
export type HostLocalEcho = "default" | "off" | "auto" | "on";
export type HostLinkClickBehavior = "default" | "confirm" | "direct";
/** How a terminal looks. A host follows the user's defaults unless it opts out. */
/** How a terminal looks. Each value follows the host defaults unless the host sets it. */
export interface TerminalAppearance {
theme: string;
cursorBlink: boolean;
@@ -64,7 +64,7 @@ export interface TerminalAppearance {
customThemeColors: TerminalThemeColors | null;
}
/** How a terminal behaves on one host. Always the host's own. */
/** How a terminal behaves on one host. */
export interface TerminalBehavior {
rightClickSelectsWord: boolean;
macOptionIsMeta: boolean;
@@ -165,8 +165,8 @@ export const DEFAULT_BEHAVIOR: TerminalBehavior = {
useSSHTitle: false,
syntaxHighlighting: true,
syntaxHighlightingOptions: DEFAULT_SYNTAX_HIGHLIGHTING,
linkClickBehavior: "default",
localEcho: "default",
linkClickBehavior: "confirm",
localEcho: "auto",
passwordPromptAutoFill: true,
sudoPasswordAutoFill: false,
};
@@ -177,9 +177,6 @@ export const DEFAULT_HOST_TERMINAL_SETTINGS: HostTerminalSettings = {
inheritAppearance: true,
};
/** The user's terminal defaults: any appearance key, unset ones inherit. */
export type TerminalDefaults = Partial<TerminalAppearance>;
export interface SavedCustomTheme {
id: string;
name: string;
@@ -188,7 +185,6 @@ export interface SavedCustomTheme {
/** The ssh-terminal user settings the terminal reads. */
export interface TerminalUserSettings {
terminalDefaults: TerminalDefaults;
customThemes: SavedCustomTheme[];
commandAutocomplete: boolean;
localEcho: "off" | "auto" | "on";
@@ -196,33 +192,12 @@ export interface TerminalUserSettings {
}
export const DEFAULT_USER_SETTINGS: TerminalUserSettings = {
terminalDefaults: {},
customThemes: [],
commandAutocomplete: false,
localEcho: "auto",
linkClickBehavior: "confirm",
};
/** The admin's defaults for a new host's terminal. */
export interface NewHostTerminalDefaults {
fontSize: number;
fontFamily: string;
theme: string;
cursorStyle: CursorStyle;
cursorBlink: boolean;
autoTmux: boolean;
}
/** Admin field -> the host field it seeds (manifest defaultFrom). */
export const NEW_HOST_ADMIN_KEYS = {
newHostFontSize: "fontSize",
newHostFontFamily: "fontFamily",
newHostTheme: "theme",
newHostCursorStyle: "cursorStyle",
newHostCursorBlink: "cursorBlink",
newHostAutoTmux: "autoTmux",
} as const satisfies Record<string, keyof NewHostTerminalDefaults>;
const ENUMS: Record<string, readonly string[]> = {
cursorStyle: ["block", "underline", "bar"],
bellStyle: ["none", "sound", "visual", "both"],
@@ -357,7 +332,6 @@ export function readUserSettings(
values: Record<string, unknown> | null | undefined,
): TerminalUserSettings {
const source = values ?? {};
const defaults = asObject(source.terminalDefaults);
const themes = Array.isArray(source.customThemes)
? source.customThemes
: typeof source.customThemes === "string"
@@ -371,10 +345,6 @@ export function readUserSettings(
})()
: [];
return {
terminalDefaults: pickTerminalValues(
defaults,
APPEARANCE_KEYS,
) as TerminalDefaults,
customThemes: themes.filter(
(theme): theme is SavedCustomTheme =>
isObject(theme) &&
@@ -393,35 +363,25 @@ export function readUserSettings(
}
/**
* What a terminal on a host runs with: the defaults, then the user's
* terminal defaults, then the host's own look when it does not follow the
* user, then the host's behavior.
* What a terminal on a host runs with: the host's values over the built-in
* ones. The host's values already follow its host defaults, and for a host
* shared with this user its look follows theirs.
*/
export function resolveTerminalSettings(
host: HostTerminalSettings | null | undefined,
userDefaults: TerminalDefaults = {},
): TerminalAppearance & TerminalBehavior {
const own = host ?? DEFAULT_HOST_TERMINAL_SETTINGS;
const appearance: TerminalAppearance = {
...DEFAULT_APPEARANCE,
...pickTerminalValues(userDefaults, APPEARANCE_KEYS),
};
if (!own.inheritAppearance) {
for (const key of APPEARANCE_KEYS) {
(appearance as unknown as Record<string, unknown>)[key] = own[key];
}
const resolved = {} as Record<string, unknown>;
for (const key of APPEARANCE_KEYS) {
resolved[key] = own[key] ?? DEFAULT_APPEARANCE[key];
}
const behavior = {} as TerminalBehavior;
for (const key of BEHAVIOR_KEYS) {
(behavior as unknown as Record<string, unknown>)[key] = own[key];
}
return { ...appearance, ...behavior };
for (const key of BEHAVIOR_KEYS) resolved[key] = own[key];
return resolved as unknown as TerminalAppearance & TerminalBehavior;
}
/**
* The host's settings in the 2.8 `terminalConfig` shape, for clients that
* still read it (Termix-Mobile). The look is left out while the host follows
* the user, the way 2.8 stored it.
* still read it (Termix-Mobile).
*/
export function terminalConfigFromHostSettings(
values: Record<string, unknown>,
@@ -429,9 +389,7 @@ export function terminalConfigFromHostSettings(
const settings = readHostTerminalSettings(values);
const config: Record<string, unknown> = {};
for (const key of BEHAVIOR_KEYS) config[key] = settings[key];
if (!settings.inheritAppearance) {
for (const key of APPEARANCE_KEYS) config[key] = settings[key];
}
for (const key of APPEARANCE_KEYS) config[key] = settings[key];
if (config.linkClickBehavior === "default") delete config.linkClickBehavior;
if (config.localEcho === "default") delete config.localEcho;
return config;
plugins/ssh-terminal/tests/backend/host-import.test.ts
+3 -2
View File
@@ -54,8 +54,9 @@ describe("hostPayloadLegacy", () => {
fontSize: 20,
}) as { terminalConfig: Record<string, unknown> };
expect(terminalConfig.autoTmux).toBe(true);
expect(terminalConfig).not.toHaveProperty("fontSize");
expect(terminalConfig).not.toHaveProperty("localEcho");
// The values already follow the host defaults, so the look is included.
expect(terminalConfig.fontSize).toBe(20);
expect(terminalConfig.localEcho).toBe("auto");
});
it("includes the look of a host that has its own", () => {
plugins/ssh-terminal/tests/backend/routes.test.ts
+3 -9
View File
@@ -146,26 +146,20 @@ describe("terminal settings routes", () => {
authType: "password",
});
it("hands every user their own terminal settings and the new-host defaults", async () => {
server = await startServer({
settings: { newHostFontSize: 20, newHostTheme: "nord" },
});
it("hands every user their own terminal settings", async () => {
server = await startServer();
await server.mock.ctx.settings.setUser(
"user-1",
"commandAutocomplete",
true,
);
await server.mock.ctx.settings.setUser("user-1", "terminalDefaults", {
fontSize: 18,
});
const { body } = await server.request("GET", "/client-settings");
expect(body.user).toMatchObject({
commandAutocomplete: true,
terminalDefaults: { fontSize: 18 },
localEcho: "auto",
linkClickBehavior: "confirm",
});
expect(body.newHostDefaults).toMatchObject({ fontSize: 20, theme: "nord" });
expect(body).not.toHaveProperty("newHostDefaults");
const other = await server.request("GET", "/client-settings", {
user: "user-2",
});
plugins/ssh-terminal/tests/backend/terminal-settings.test.ts
+13 -8
View File
@@ -30,19 +30,25 @@ describe("hostSettingsFromTerminalConfig", () => {
});
describe("resolveTerminalSettings", () => {
it("uses the user's defaults while the host follows them", () => {
it("runs with the host's values, which already follow its defaults", () => {
const host = readHostTerminalSettings({ fontSize: 30, autoTmux: true });
const resolved = resolveTerminalSettings(host, { fontSize: 18 });
expect(resolved.fontSize).toBe(18);
const resolved = resolveTerminalSettings(host);
expect(resolved.fontSize).toBe(30);
expect(resolved.autoTmux).toBe(true);
});
it("uses the host's own look once it opts out", () => {
it("ignores the old follow-the-user switch", () => {
const host = readHostTerminalSettings({
inheritAppearance: false,
fontSize: 30,
inheritAppearance: true,
fontSize: 22,
});
expect(resolveTerminalSettings(host, { fontSize: 18 }).fontSize).toBe(30);
expect(resolveTerminalSettings(host).fontSize).toBe(22);
});
it("defaults echo and link clicks to concrete modes", () => {
const resolved = resolveTerminalSettings(readHostTerminalSettings({}));
expect(resolved.localEcho).toBe("auto");
expect(resolved.linkClickBehavior).toBe("confirm");
});
it("falls back to the built-in defaults", () => {
@@ -62,7 +68,6 @@ describe("readUserSettings", () => {
linkClickBehavior: "direct",
}),
).toEqual({
terminalDefaults: { fontSize: 16 },
customThemes: [{ id: "a", name: "A", colors: {} }],
commandAutocomplete: false,
localEcho: "auto",
plugins/ssh-terminal/tests/frontend/activate.test.tsx
+5 -5
View File
@@ -116,11 +116,11 @@ describe(`${manifest.id} activate`, () => {
it("registers its settings components", async () => {
rendered = await renderWithApp(plugin, { manifest, locales });
expect(rendered.registered.settingsComponents()).toEqual(
expect.arrayContaining([
"terminalDefaults",
"newHostTheme",
"newHostFontFamily",
]),
expect.arrayContaining(["touchInput", "imageStorageTest"]),
);
// Terminal defaults are host defaults now, set in the host editor.
expect(rendered.registered.settingsComponents()).not.toContain(
"terminalDefaults",
);
});
plugins/ssh-terminal/tests/frontend/settings/TerminalDefaultsSettings.test.tsx
-37
View File
@@ -1,37 +0,0 @@
import { afterEach, describe, expect, it, vi } from "vitest";
import { cleanup, fireEvent, render, screen } from "@testing-library/react";
import { TerminalDefaultsSettings } from "../../../src/frontend/settings/TerminalDefaultsSettings";
afterEach(cleanup);
describe("TerminalDefaultsSettings", () => {
it("counts the defaults the user set", () => {
render(
<TerminalDefaultsSettings
pluginId="ssh-terminal"
values={{ terminalDefaults: { fontSize: 18, cursorBlink: false } }}
setValue={vi.fn()}
running
/>,
);
expect(screen.getByText("2")).toBeTruthy();
});
it("applies the dialog's values to the terminalDefaults setting", () => {
const setValue = vi.fn();
render(
<TerminalDefaultsSettings
pluginId="ssh-terminal"
values={{ terminalDefaults: { fontSize: 18 } }}
setValue={setValue}
running
/>,
);
fireEvent.click(screen.getByText("terminalDefaults.manage"));
fireEvent.change(screen.getByDisplayValue("18"), {
target: { value: "20" },
});
fireEvent.click(screen.getByText("terminalDefaults.apply"));
expect(setValue).toHaveBeenCalledWith("terminalDefaults", { fontSize: 20 });
});
});
plugins/ssh-terminal/tests/frontend/settings/tri-state.test.ts
-17
View File
@@ -1,17 +0,0 @@
import { describe, expect, it } from "vitest";
import {
fromTriState,
toTriState,
} from "../../../src/frontend/settings/tri-state";
describe("tri-state", () => {
it("keeps unset booleans distinct from false", () => {
expect(toTriState(undefined)).toBe("inherit");
expect(toTriState(true)).toBe("on");
expect(toTriState(false)).toBe("off");
expect(fromTriState("inherit")).toBeUndefined();
expect(fromTriState("on")).toBe(true);
expect(fromTriState("off")).toBe(false);
});
});
plugins/tmux-monitor/src/frontend/HostTmuxMonitorSection.tsx
+1
View File
@@ -43,6 +43,7 @@ export function HostTmuxMonitorSection({
<div className="flex flex-col gap-4 py-3">
<SettingRow
label={t("hosts.enableTmuxMonitor")}
defaultKey="enableTmuxMonitor"
description={
<>
{t("hosts.enableTmuxMonitorDesc")}{" "}
plugins/tmux-monitor/src/frontend/index.tsx
+1
View File
@@ -55,6 +55,7 @@ export function activate(app: TermixApp): void {
titleKey: "hosts.tabTmuxMonitor",
icon: Layers,
order: 45,
defaults: true,
component: HostTmuxMonitorSection,
});
}
plugins/tunnels/manifest.json
+2 -1
View File
@@ -79,7 +79,8 @@
"key": "tunnelConnections",
"type": "custom",
"component": "tunnelConnections",
"requires": "enableTunnel"
"requires": "enableTunnel",
"defaultable": false
}
]
}
plugins/vault/manifest.json
+2 -1
View File
@@ -62,7 +62,8 @@
"type": "number",
"labelKey": "settings.host.profileId.label",
"hidden": true,
"ownerOnly": true
"ownerOnly": true,
"defaultLevels": ["user", "folder"]
}
]
}
plugins/wake-on-lan/manifest.json
+2 -1
View File
@@ -46,7 +46,8 @@
"type": "string",
"labelKey": "settings.host.macAddress.label",
"descriptionKey": "settings.host.macAddress.description",
"placeholderKey": "settings.host.macAddress.placeholder"
"placeholderKey": "settings.host.macAddress.placeholder",
"defaultable": false
},
{
"key": "broadcastAddress",
plugins/web-endpoint/manifest.json
+2 -1
View File
@@ -47,7 +47,8 @@
"key": "webUiConfig",
"type": "json",
"labelKey": "hosts.webUiEndpointsSection",
"requires": "enableWebUi"
"requires": "enableWebUi",
"defaultable": false
}
]
}