dennii/Termix
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases 22 Wiki Activity

v1.9.0 #437

Merged
LukeGus merged 33 commits from dev-1.9.0 into main 2025-11-17 15:46:05 +00:00
Conversation 0 Commits 33 Files Changed 105 +1774 -634
31 changed files with 1774 additions and 634 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7e8105a938 - Show all commits

3
.github/workflows/docker.yml vendored
View File

@@ -84,7 +84,8 @@ jobs:
labels: |
org.opencontainers.image.source=https://github.com/${{ github.repository }}
org.opencontainers.image.revision=${{ github.sha }}
outputs: type=registry,compression=zstd,compression-level=19
org.opencontainers.image.created=${{ github.run_id }}
outputs: type=registry,compression=gzip,compression-level=9
- name: Cleanup Docker
if: always()

42
electron/main.cjs
View File

@@ -395,6 +395,48 @@ ipcMain.handle("save-server-config", (event, config) => {
}
});
ipcMain.handle("get-setting", (event, key) => {
try {
const userDataPath = app.getPath("userData");
const settingsPath = path.join(userDataPath, "settings.json");
if (!fs.existsSync(settingsPath)) {
return null;
}
const settingsData = fs.readFileSync(settingsPath, "utf8");
const settings = JSON.parse(settingsData);
return settings[key] !== undefined ? settings[key] : null;
} catch (error) {
console.error("Error reading setting:", error);
return null;
}
});
ipcMain.handle("set-setting", (event, key, value) => {
try {
const userDataPath = app.getPath("userData");
const settingsPath = path.join(userDataPath, "settings.json");
if (!fs.existsSync(userDataPath)) {
fs.mkdirSync(userDataPath, { recursive: true });
}
let settings = {};
if (fs.existsSync(settingsPath)) {
const settingsData = fs.readFileSync(settingsPath, "utf8");
settings = JSON.parse(settingsData);
}
settings[key] = value;
fs.writeFileSync(settingsPath, JSON.stringify(settings, null, 2));
return { success: true };
} catch (error) {
console.error("Error saving setting:", error);
return { success: false, error: error.message };
}
});
ipcMain.handle("test-server-connection", async (event, serverUrl) => {
try {
const https = require("https");

4
electron/preload.js
View File

@@ -22,6 +22,10 @@ contextBridge.exposeInMainWorld("electronAPI", {
isElectron: true,
isDev: process.env.NODE_ENV === "development",
// Settings/preferences storage
getSetting: (key) => ipcRenderer.invoke("get-setting", key),
setSetting: (key, value) => ipcRenderer.invoke("set-setting", key, value),
invoke: (channel, ...args) => ipcRenderer.invoke(channel, ...args),
});

26
src/backend/database/database.ts
View File

@@ -22,6 +22,7 @@ import { DatabaseMigration } from "../utils/database-migration.js";
import { UserDataExport } from "../utils/user-data-export.js";
import { AutoSSLSetup } from "../utils/auto-ssl-setup.js";
import { eq, and } from "drizzle-orm";
import { parseUserAgent } from "../utils/user-agent-parser.js";
import {
users,
sshData,
@@ -457,8 +458,12 @@ app.post("/database/export", authenticateJWT, async (req, res) => {
code: "PASSWORD_REQUIRED",
});
}
const unlocked = await authManager.authenticateUser(userId, password);
const deviceInfo = parseUserAgent(req);
const unlocked = await authManager.authenticateUser(
userId,
password,
deviceInfo.type,
);
if (!unlocked) {
return res.status(401).json({ error: "Invalid password" });
}
@@ -905,6 +910,7 @@ app.post(
const userId = (req as AuthenticatedRequest).userId;
const { password } = req.body;
const mainDb = getDb();
const deviceInfo = parseUserAgent(req);
const userRecords = await mainDb
.select()
@@ -925,12 +931,19 @@ app.post(
});
}
const unlocked = await authManager.authenticateUser(userId, password);
const unlocked = await authManager.authenticateUser(
userId,
password,
deviceInfo.type,
);
if (!unlocked) {
return res.status(401).json({ error: "Invalid password" });
}
} else if (!DataCrypto.getUserDataKey(userId)) {
const oidcUnlocked = await authManager.authenticateOIDCUser(userId);
const oidcUnlocked = await authManager.authenticateOIDCUser(
userId,
deviceInfo.type,
);
if (!oidcUnlocked) {
return res.status(403).json({
error: "Failed to unlock user data with SSO credentials",
@@ -948,7 +961,10 @@ app.post(
let userDataKey = DataCrypto.getUserDataKey(userId);
if (!userDataKey && isOidcUser) {
const oidcUnlocked = await authManager.authenticateOIDCUser(userId);
const oidcUnlocked = await authManager.authenticateOIDCUser(
userId,
deviceInfo.type,
);
if (oidcUnlocked) {
userDataKey = DataCrypto.getUserDataKey(userId);
}

41
src/backend/database/db/index.ts
View File

@@ -183,7 +183,7 @@ async function initializeCompleteDatabase(): Promise<void> {
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
expires_at TEXT NOT NULL,
last_active_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS ssh_data (
@@ -214,7 +214,7 @@ async function initializeCompleteDatabase(): Promise<void> {
terminal_config TEXT,
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
updated_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS file_manager_recent (
@@ -224,8 +224,8 @@ async function initializeCompleteDatabase(): Promise<void> {
name TEXT NOT NULL,
path TEXT NOT NULL,
last_opened TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS file_manager_pinned (
@@ -235,8 +235,8 @@ async function initializeCompleteDatabase(): Promise<void> {
name TEXT NOT NULL,
path TEXT NOT NULL,
pinned_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS file_manager_shortcuts (
@@ -246,8 +246,8 @@ async function initializeCompleteDatabase(): Promise<void> {
name TEXT NOT NULL,
path TEXT NOT NULL,
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS dismissed_alerts (
@@ -255,7 +255,7 @@ async function initializeCompleteDatabase(): Promise<void> {
user_id TEXT NOT NULL,
alert_id TEXT NOT NULL,
dismissed_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS ssh_credentials (
@@ -275,7 +275,7 @@ async function initializeCompleteDatabase(): Promise<void> {
last_used TEXT,
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
updated_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS ssh_credential_usage (
@@ -284,9 +284,9 @@ async function initializeCompleteDatabase(): Promise<void> {
host_id INTEGER NOT NULL,
user_id TEXT NOT NULL,
used_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (credential_id) REFERENCES ssh_credentials (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id),
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (credential_id) REFERENCES ssh_credentials (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE,
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS snippets (
@@ -297,7 +297,7 @@ async function initializeCompleteDatabase(): Promise<void> {
description TEXT,
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
updated_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS ssh_folders (
@@ -308,7 +308,7 @@ async function initializeCompleteDatabase(): Promise<void> {
icon TEXT,
created_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
updated_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS recent_activity (
@@ -318,8 +318,8 @@ async function initializeCompleteDatabase(): Promise<void> {
host_id INTEGER NOT NULL,
host_name TEXT NOT NULL,
timestamp TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS command_history (
@@ -328,8 +328,8 @@ async function initializeCompleteDatabase(): Promise<void> {
host_id INTEGER NOT NULL,
command TEXT NOT NULL,
executed_at TEXT NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users (id),
FOREIGN KEY (host_id) REFERENCES ssh_data (id)
FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
FOREIGN KEY (host_id) REFERENCES ssh_data (id) ON DELETE CASCADE
);
`);
@@ -452,6 +452,7 @@ const migrateSchema = () => {
"INTEGER NOT NULL DEFAULT 1",
);
addColumnIfNotExists("ssh_data", "tunnel_connections", "TEXT");
addColumnIfNotExists("ssh_data", "jump_hosts", "TEXT");
addColumnIfNotExists(
"ssh_data",
"enable_file_manager",
@@ -475,7 +476,7 @@ const migrateSchema = () => {
addColumnIfNotExists(
"ssh_data",
"credential_id",
"INTEGER REFERENCES ssh_credentials(id)",
"INTEGER REFERENCES ssh_credentials(id) ON DELETE SET NULL",
);
addColumnIfNotExists(
"ssh_data",

47
src/backend/database/db/schema.ts
View File

@@ -34,7 +34,7 @@ export const sessions = sqliteTable("sessions", {
id: text("id").primaryKey(),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
jwtToken: text("jwt_token").notNull(),
deviceType: text("device_type").notNull(),
deviceInfo: text("device_info").notNull(),
@@ -51,7 +51,7 @@ export const sshData = sqliteTable("ssh_data", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
name: text("name"),
ip: text("ip").notNull(),
port: integer("port").notNull(),
@@ -71,7 +71,7 @@ export const sshData = sqliteTable("ssh_data", {
autostartKey: text("autostart_key", { length: 8192 }),
autostartKeyPassword: text("autostart_key_password"),
credentialId: integer("credential_id").references(() => sshCredentials.id),
credentialId: integer("credential_id").references(() => sshCredentials.id, { onDelete: "set null" }),
overrideCredentialUsername: integer("override_credential_username", {
mode: "boolean",
}),
@@ -82,6 +82,7 @@ export const sshData = sqliteTable("ssh_data", {
.notNull()
.default(true),
tunnelConnections: text("tunnel_connections"),
jumpHosts: text("jump_hosts"),
enableFileManager: integer("enable_file_manager", { mode: "boolean" })
.notNull()
.default(true),
@@ -98,12 +99,9 @@ export const sshData = sqliteTable("ssh_data", {
export const fileManagerRecent = sqliteTable("file_manager_recent", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
.references(() => sshData.id, { onDelete: "cascade" }),
name: text("name").notNull(),
path: text("path").notNull(),
lastOpened: text("last_opened")
@@ -115,10 +113,10 @@ export const fileManagerPinned = sqliteTable("file_manager_pinned", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
.references(() => sshData.id, { onDelete: "cascade" }),
name: text("name").notNull(),
path: text("path").notNull(),
pinnedAt: text("pinned_at")
@@ -130,13 +128,10 @@ export const fileManagerShortcuts = sqliteTable("file_manager_shortcuts", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
name: text("name").notNull(),
path: text("path").notNull(),
createdAt: text("created_at")
.references(() => sshData.id, { onDelete: "cascade" }),
.notNull()
.default(sql`CURRENT_TIMESTAMP`),
});
@@ -145,7 +140,7 @@ export const dismissedAlerts = sqliteTable("dismissed_alerts", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
alertId: text("alert_id").notNull(),
dismissedAt: text("dismissed_at")
.notNull()
@@ -156,7 +151,7 @@ export const sshCredentials = sqliteTable("ssh_credentials", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
name: text("name").notNull(),
description: text("description"),
folder: text("folder"),
@@ -184,13 +179,13 @@ export const sshCredentialUsage = sqliteTable("ssh_credential_usage", {
id: integer("id").primaryKey({ autoIncrement: true }),
credentialId: integer("credential_id")
.notNull()
.references(() => sshCredentials.id),
.references(() => sshCredentials.id, { onDelete: "cascade" }),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
.references(() => sshData.id, { onDelete: "cascade" }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
usedAt: text("used_at")
.notNull()
.default(sql`CURRENT_TIMESTAMP`),
@@ -200,7 +195,7 @@ export const snippets = sqliteTable("snippets", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
name: text("name").notNull(),
content: text("content").notNull(),
description: text("description"),
@@ -216,7 +211,7 @@ export const sshFolders = sqliteTable("ssh_folders", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
name: text("name").notNull(),
color: text("color"),
icon: text("icon"),
@@ -232,12 +227,11 @@ export const recentActivity = sqliteTable("recent_activity", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
type: text("type").notNull(),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
hostName: text("host_name").notNull(),
.references(() => sshData.id, { onDelete: "cascade" }),
timestamp: text("timestamp")
.notNull()
.default(sql`CURRENT_TIMESTAMP`),
@@ -247,11 +241,10 @@ export const commandHistory = sqliteTable("command_history", {
id: integer("id").primaryKey({ autoIncrement: true }),
userId: text("user_id")
.notNull()
.references(() => users.id),
.references(() => users.id, { onDelete: "cascade" }),
hostId: integer("host_id")
.notNull()
.references(() => sshData.id),
command: text("command").notNull(),
.references(() => sshData.id, { onDelete: "cascade" }),
executedAt: text("executed_at")
.notNull()
.default(sql`CURRENT_TIMESTAMP`),

156
src/backend/database/routes/ssh.ts
View File

@@ -235,6 +235,7 @@ router.post(
enableFileManager,
defaultPath,
tunnelConnections,
jumpHosts,
statsConfig,
terminalConfig,
forceKeyboardInteractive,
@@ -271,6 +272,7 @@ router.post(
tunnelConnections: Array.isArray(tunnelConnections)
? JSON.stringify(tunnelConnections)
: null,
jumpHosts: Array.isArray(jumpHosts) ? JSON.stringify(jumpHosts) : null,
enableFileManager: enableFileManager ? 1 : 0,
defaultPath: defaultPath || null,
statsConfig: statsConfig ? JSON.stringify(statsConfig) : null,
@@ -329,6 +331,9 @@ router.post(
tunnelConnections: createdHost.tunnelConnections
? JSON.parse(createdHost.tunnelConnections as string)
: [],
jumpHosts: createdHost.jumpHosts
? JSON.parse(createdHost.jumpHosts as string)
: [],
enableFileManager: !!createdHost.enableFileManager,
statsConfig: createdHost.statsConfig
? JSON.parse(createdHost.statsConfig as string)
@@ -370,6 +375,7 @@ router.post(
router.put(
"/db/host/:id",
authenticateJWT,
requireDataAccess,
upload.single("key"),
async (req: Request, res: Response) => {
const hostId = req.params.id;
@@ -425,6 +431,7 @@ router.put(
enableFileManager,
defaultPath,
tunnelConnections,
jumpHosts,
statsConfig,
terminalConfig,
forceKeyboardInteractive,
@@ -462,6 +469,7 @@ router.put(
tunnelConnections: Array.isArray(tunnelConnections)
? JSON.stringify(tunnelConnections)
: null,
jumpHosts: Array.isArray(jumpHosts) ? JSON.stringify(jumpHosts) : null,
enableFileManager: enableFileManager ? 1 : 0,
defaultPath: defaultPath || null,
statsConfig: statsConfig ? JSON.stringify(statsConfig) : null,
@@ -538,6 +546,9 @@ router.put(
tunnelConnections: updatedHost.tunnelConnections
? JSON.parse(updatedHost.tunnelConnections as string)
: [],
jumpHosts: updatedHost.jumpHosts
? JSON.parse(updatedHost.jumpHosts as string)
: [],
enableFileManager: !!updatedHost.enableFileManager,
statsConfig: updatedHost.statsConfig
? JSON.parse(updatedHost.statsConfig as string)
@@ -577,67 +588,74 @@ router.put(
// Route: Get SSH data for the authenticated user (requires JWT)
// GET /ssh/host
router.get("/db/host", authenticateJWT, async (req: Request, res: Response) => {
const userId = (req as AuthenticatedRequest).userId;
if (!isNonEmptyString(userId)) {
sshLogger.warn("Invalid userId for SSH data fetch", {
operation: "host_fetch",
userId,
});
return res.status(400).json({ error: "Invalid userId" });
}
try {
const data = await SimpleDBOps.select(
db.select().from(sshData).where(eq(sshData.userId, userId)),
"ssh_data",
userId,
);
router.get(
"/db/host",
authenticateJWT,
requireDataAccess,
async (req: Request, res: Response) => {
const userId = (req as AuthenticatedRequest).userId;
if (!isNonEmptyString(userId)) {
sshLogger.warn("Invalid userId for SSH data fetch", {
operation: "host_fetch",
userId,
});
return res.status(400).json({ error: "Invalid userId" });
}
try {
const data = await SimpleDBOps.select(
db.select().from(sshData).where(eq(sshData.userId, userId)),
"ssh_data",
userId,
);
const result = await Promise.all(
data.map(async (row: Record<string, unknown>) => {
const baseHost = {
...row,
tags:
typeof row.tags === "string"
? row.tags
? row.tags.split(",").filter(Boolean)
: []
const result = await Promise.all(
data.map(async (row: Record<string, unknown>) => {
const baseHost = {
...row,
tags:
typeof row.tags === "string"
? row.tags
? row.tags.split(",").filter(Boolean)
: []
: [],
pin: !!row.pin,
enableTerminal: !!row.enableTerminal,
enableTunnel: !!row.enableTunnel,
tunnelConnections: row.tunnelConnections
? JSON.parse(row.tunnelConnections as string)
: [],
pin: !!row.pin,
enableTerminal: !!row.enableTerminal,
enableTunnel: !!row.enableTunnel,
tunnelConnections: row.tunnelConnections
? JSON.parse(row.tunnelConnections as string)
: [],
enableFileManager: !!row.enableFileManager,
statsConfig: row.statsConfig
? JSON.parse(row.statsConfig as string)
: undefined,
terminalConfig: row.terminalConfig
? JSON.parse(row.terminalConfig as string)
: undefined,
forceKeyboardInteractive: row.forceKeyboardInteractive === "true",
};
jumpHosts: row.jumpHosts ? JSON.parse(row.jumpHosts as string) : [],
enableFileManager: !!row.enableFileManager,
statsConfig: row.statsConfig
? JSON.parse(row.statsConfig as string)
: undefined,
terminalConfig: row.terminalConfig
? JSON.parse(row.terminalConfig as string)
: undefined,
forceKeyboardInteractive: row.forceKeyboardInteractive === "true",
};
return (await resolveHostCredentials(baseHost)) || baseHost;
}),
);
return (await resolveHostCredentials(baseHost)) || baseHost;
}),
);
res.json(result);
} catch (err) {
sshLogger.error("Failed to fetch SSH hosts from database", err, {
operation: "host_fetch",
userId,
});
res.status(500).json({ error: "Failed to fetch SSH data" });
}
});
res.json(result);
} catch (err) {
sshLogger.error("Failed to fetch SSH hosts from database", err, {
operation: "host_fetch",
userId,
});
res.status(500).json({ error: "Failed to fetch SSH data" });
}
},
);
// Route: Get SSH host by ID (requires JWT)
// GET /ssh/host/:id
router.get(
"/db/host/:id",
authenticateJWT,
requireDataAccess,
async (req: Request, res: Response) => {
const hostId = req.params.id;
const userId = (req as AuthenticatedRequest).userId;
@@ -813,42 +831,6 @@ router.delete(
const numericHostId = Number(hostId);
await db
.delete(fileManagerRecent)
.where(
and(
eq(fileManagerRecent.userId, userId),
eq(fileManagerRecent.hostId, numericHostId),
),
);
await db
.delete(fileManagerPinned)
.where(
and(
eq(fileManagerPinned.userId, userId),
eq(fileManagerPinned.hostId, numericHostId),
),
);
await db
.delete(fileManagerShortcuts)
.where(
and(
eq(fileManagerShortcuts.userId, userId),
eq(fileManagerShortcuts.hostId, numericHostId),
),
);
await db
.delete(sshCredentialUsage)
.where(
and(
eq(sshCredentialUsage.userId, userId),
eq(sshCredentialUsage.hostId, numericHostId),
),
);
await db
.delete(sshData)
.where(and(eq(sshData.id, numericHostId), eq(sshData.userId, userId)));

23
src/backend/database/routes/users.ts
View File

@@ -747,6 +747,7 @@ router.get("/oidc/callback", async (req, res) => {
});
}
const deviceInfo = parseUserAgent(req);
let user = await db
.select()
.from(users)
@@ -780,7 +781,11 @@ router.get("/oidc/callback", async (req, res) => {
});
try {
await authManager.registerOIDCUser(id);
const sessionDurationMs =
deviceInfo.type === "desktop" || deviceInfo.type === "mobile"
? 30 * 24 * 60 * 60 * 1000 // 30 days
: 7 * 24 * 60 * 60 * 1000; // 7 days
await authManager.registerOIDCUser(id, sessionDurationMs);
} catch (encryptionError) {
await db.delete(users).where(eq(users.id, id));
authLogger.error(
@@ -819,7 +824,7 @@ router.get("/oidc/callback", async (req, res) => {
const userRecord = user[0];
try {
await authManager.authenticateOIDCUser(userRecord.id);
await authManager.authenticateOIDCUser(userRecord.id, deviceInfo.type);
} catch (setupError) {
authLogger.error("Failed to setup OIDC user encryption", setupError, {
operation: "oidc_user_encryption_setup_failed",
@@ -827,7 +832,6 @@ router.get("/oidc/callback", async (req, res) => {
});
}
const deviceInfo = parseUserAgent(req);
const token = await authManager.generateJWTToken(userRecord.id, {
deviceType: deviceInfo.type,
deviceInfo: deviceInfo.deviceInfo,
@@ -941,7 +945,10 @@ router.post("/login", async (req, res) => {
operation: "user_login",
username,
ip: clientIp,
remainingAttempts: loginRateLimiter.getRemainingAttempts(clientIp, username),
remainingAttempts: loginRateLimiter.getRemainingAttempts(
clientIp,
username,
),
});
return res.status(401).json({ error: "Invalid username or password" });
}
@@ -967,7 +974,10 @@ router.post("/login", async (req, res) => {
username,
userId: userRecord.id,
ip: clientIp,
remainingAttempts: loginRateLimiter.getRemainingAttempts(clientIp, username),
remainingAttempts: loginRateLimiter.getRemainingAttempts(
clientIp,
username,
),
});
return res.status(401).json({ error: "Invalid username or password" });
}
@@ -985,9 +995,11 @@ router.post("/login", async (req, res) => {
databaseLogger.debug("Operation failed, continuing", { error });
}
const deviceInfo = parseUserAgent(req);
const dataUnlocked = await authManager.authenticateUser(
userRecord.id,
password,
deviceInfo.type,
);
if (!dataUnlocked) {
return res.status(401).json({ error: "Incorrect password" });
@@ -1005,7 +1017,6 @@ router.post("/login", async (req, res) => {
});
}
const deviceInfo = parseUserAgent(req);
const token = await authManager.generateJWTToken(userRecord.id, {
deviceType: deviceInfo.type,
deviceInfo: deviceInfo.deviceInfo,

217
src/backend/ssh/file-manager.ts
View File

@@ -89,6 +89,173 @@ app.use(express.raw({ limit: "5gb", type: "application/octet-stream" }));
const authManager = AuthManager.getInstance();
app.use(authManager.createAuthMiddleware());
async function resolveJumpHost(
hostId: number,
userId: string,
): Promise<any | null> {
try {
const hosts = await SimpleDBOps.select(
getDb()
.select()
.from(sshData)
.where(and(eq(sshData.id, hostId), eq(sshData.userId, userId))),
"ssh_data",
userId,
);
if (hosts.length === 0) {
return null;
}
const host = hosts[0];
if (host.credentialId) {
const credentials = await SimpleDBOps.select(
getDb()
.select()
.from(sshCredentials)
.where(
and(
eq(sshCredentials.id, host.credentialId as number),
eq(sshCredentials.userId, userId),
),
),
"ssh_credentials",
userId,
);
if (credentials.length > 0) {
const credential = credentials[0];
return {
...host,
password: credential.password,
key:
credential.private_key || credential.privateKey || credential.key,
keyPassword: credential.key_password || credential.keyPassword,
keyType: credential.key_type || credential.keyType,
authType: credential.auth_type || credential.authType,
};
}
}
return host;
} catch (error) {
fileLogger.error("Failed to resolve jump host", error, {
operation: "resolve_jump_host",
hostId,
userId,
});
return null;
}
}
async function createJumpHostChain(
jumpHosts: Array<{ hostId: number }>,
userId: string,
): Promise<SSHClient | null> {
if (!jumpHosts || jumpHosts.length === 0) {
return null;
}
let currentClient: SSHClient | null = null;
const clients: SSHClient[] = [];
try {
for (let i = 0; i < jumpHosts.length; i++) {
const jumpHostConfig = await resolveJumpHost(jumpHosts[i].hostId, userId);
if (!jumpHostConfig) {
fileLogger.error(`Jump host ${i + 1} not found`, undefined, {
operation: "jump_host_chain",
hostId: jumpHosts[i].hostId,
});
clients.forEach((c) => c.end());
return null;
}
const jumpClient = new SSHClient();
clients.push(jumpClient);
const connected = await new Promise<boolean>((resolve) => {
const timeout = setTimeout(() => {
resolve(false);
}, 30000);
jumpClient.on("ready", () => {
clearTimeout(timeout);
resolve(true);
});
jumpClient.on("error", (err) => {
clearTimeout(timeout);
fileLogger.error(`Jump host ${i + 1} connection failed`, err, {
operation: "jump_host_connect",
hostId: jumpHostConfig.id,
ip: jumpHostConfig.ip,
});
resolve(false);
});
const connectConfig: any = {
host: jumpHostConfig.ip,
port: jumpHostConfig.port || 22,
username: jumpHostConfig.username,
tryKeyboard: true,
readyTimeout: 30000,
};
if (jumpHostConfig.authType === "password" && jumpHostConfig.password) {
connectConfig.password = jumpHostConfig.password;
} else if (jumpHostConfig.authType === "key" && jumpHostConfig.key) {
const cleanKey = jumpHostConfig.key
.trim()
.replace(/\r\n/g, "\n")
.replace(/\r/g, "\n");
connectConfig.privateKey = Buffer.from(cleanKey, "utf8");
if (jumpHostConfig.keyPassword) {
connectConfig.passphrase = jumpHostConfig.keyPassword;
}
}
if (currentClient) {
currentClient.forwardOut(
"127.0.0.1",
0,
jumpHostConfig.ip,
jumpHostConfig.port || 22,
(err, stream) => {
if (err) {
clearTimeout(timeout);
resolve(false);
return;
}
connectConfig.sock = stream;
jumpClient.connect(connectConfig);
},
);
} else {
jumpClient.connect(connectConfig);
}
});
if (!connected) {
clients.forEach((c) => c.end());
return null;
}
currentClient = jumpClient;
}
return currentClient;
} catch (error) {
fileLogger.error("Failed to create jump host chain", error, {
operation: "jump_host_chain",
});
clients.forEach((c) => c.end());
return null;
}
}
interface SSHSession {
client: SSHClient;
isConnected: boolean;
@@ -176,6 +343,7 @@ app.post("/ssh/file_manager/ssh/connect", async (req, res) => {
credentialId,
userProvidedPassword,
forceKeyboardInteractive,
jumpHosts,
} = req.body;
const userId = (req as AuthenticatedRequest).userId;
@@ -627,7 +795,54 @@ app.post("/ssh/file_manager/ssh/connect", async (req, res) => {
},
);
client.connect(config);
if (jumpHosts && jumpHosts.length > 0 && userId) {
try {
const jumpClient = await createJumpHostChain(jumpHosts, userId);
if (!jumpClient) {
fileLogger.error("Failed to establish jump host chain", {
operation: "file_jump_chain",
sessionId,
hostId,
});
return res
.status(500)
.json({ error: "Failed to connect through jump hosts" });
}
jumpClient.forwardOut("127.0.0.1", 0, ip, port, (err, stream) => {
if (err) {
fileLogger.error("Failed to forward through jump host", err, {
operation: "file_jump_forward",
sessionId,
hostId,
ip,
port,
});
jumpClient.end();
return res
.status(500)
.json({
error: "Failed to forward through jump host: " + err.message,
});
}
config.sock = stream;
client.connect(config);
});
} catch (error) {
fileLogger.error("Jump host error", error, {
operation: "file_jump_host",
sessionId,
hostId,
});
return res
.status(500)
.json({ error: "Failed to connect through jump hosts" });
}
} else {
client.connect(config);
}
});
app.post("/ssh/file_manager/ssh/connect-totp", async (req, res) => {

209
src/backend/ssh/server-stats.ts
View File

@@ -19,6 +19,173 @@ import { collectProcessesMetrics } from "./widgets/processes-collector.js";
import { collectSystemMetrics } from "./widgets/system-collector.js";
import { collectLoginStats } from "./widgets/login-stats-collector.js";
async function resolveJumpHost(
hostId: number,
userId: string,
): Promise<any | null> {
try {
const hosts = await SimpleDBOps.select(
getDb()
.select()
.from(sshData)
.where(and(eq(sshData.id, hostId), eq(sshData.userId, userId))),
"ssh_data",
userId,
);
if (hosts.length === 0) {
return null;
}
const host = hosts[0];
if (host.credentialId) {
const credentials = await SimpleDBOps.select(
getDb()
.select()
.from(sshCredentials)
.where(
and(
eq(sshCredentials.id, host.credentialId as number),
eq(sshCredentials.userId, userId),
),
),
"ssh_credentials",
userId,
);
if (credentials.length > 0) {
const credential = credentials[0];
return {
...host,
password: credential.password,
key:
credential.private_key || credential.privateKey || credential.key,
keyPassword: credential.key_password || credential.keyPassword,
keyType: credential.key_type || credential.keyType,
authType: credential.auth_type || credential.authType,
};
}
}
return host;
} catch (error) {
statsLogger.error("Failed to resolve jump host", error, {
operation: "resolve_jump_host",
hostId,
userId,
});
return null;
}
}
async function createJumpHostChain(
jumpHosts: Array<{ hostId: number }>,
userId: string,
): Promise<Client | null> {
if (!jumpHosts || jumpHosts.length === 0) {
return null;
}
let currentClient: Client | null = null;
const clients: Client[] = [];
try {
for (let i = 0; i < jumpHosts.length; i++) {
const jumpHostConfig = await resolveJumpHost(jumpHosts[i].hostId, userId);
if (!jumpHostConfig) {
statsLogger.error(`Jump host ${i + 1} not found`, undefined, {
operation: "jump_host_chain",
hostId: jumpHosts[i].hostId,
});
clients.forEach((c) => c.end());
return null;
}
const jumpClient = new Client();
clients.push(jumpClient);
const connected = await new Promise<boolean>((resolve) => {
const timeout = setTimeout(() => {
resolve(false);
}, 30000);
jumpClient.on("ready", () => {
clearTimeout(timeout);
resolve(true);
});
jumpClient.on("error", (err) => {
clearTimeout(timeout);
statsLogger.error(`Jump host ${i + 1} connection failed`, err, {
operation: "jump_host_connect",
hostId: jumpHostConfig.id,
ip: jumpHostConfig.ip,
});
resolve(false);
});
const connectConfig: any = {
host: jumpHostConfig.ip,
port: jumpHostConfig.port || 22,
username: jumpHostConfig.username,
tryKeyboard: true,
readyTimeout: 30000,
};
if (jumpHostConfig.authType === "password" && jumpHostConfig.password) {
connectConfig.password = jumpHostConfig.password;
} else if (jumpHostConfig.authType === "key" && jumpHostConfig.key) {
const cleanKey = jumpHostConfig.key
.trim()
.replace(/\r\n/g, "\n")
.replace(/\r/g, "\n");
connectConfig.privateKey = Buffer.from(cleanKey, "utf8");
if (jumpHostConfig.keyPassword) {
connectConfig.passphrase = jumpHostConfig.keyPassword;
}
}
if (currentClient) {
currentClient.forwardOut(
"127.0.0.1",
0,
jumpHostConfig.ip,
jumpHostConfig.port || 22,
(err, stream) => {
if (err) {
clearTimeout(timeout);
resolve(false);
return;
}
connectConfig.sock = stream;
jumpClient.connect(connectConfig);
},
);
} else {
jumpClient.connect(connectConfig);
}
});
if (!connected) {
clients.forEach((c) => c.end());
return null;
}
currentClient = jumpClient;
}
return currentClient;
} catch (error) {
statsLogger.error("Failed to create jump host chain", error, {
operation: "jump_host_chain",
});
clients.forEach((c) => c.end());
return null;
}
}
interface PooledConnection {
client: Client;
lastUsed: number;
@@ -87,7 +254,7 @@ class SSHConnectionPool {
private async createConnection(
host: SSHHostWithCredentials,
): Promise<Client> {
return new Promise((resolve, reject) => {
return new Promise(async (resolve, reject) => {
const client = new Client();
const timeout = setTimeout(() => {
client.end();
@@ -137,7 +304,44 @@ class SSHConnectionPool {
);
try {
client.connect(buildSshConfig(host));
const config = buildSshConfig(host);
if (host.jumpHosts && host.jumpHosts.length > 0 && host.userId) {
const jumpClient = await createJumpHostChain(
host.jumpHosts,
host.userId,
);
if (!jumpClient) {
clearTimeout(timeout);
reject(new Error("Failed to establish jump host chain"));
return;
}
jumpClient.forwardOut(
"127.0.0.1",
0,
host.ip,
host.port,
(err, stream) => {
if (err) {
clearTimeout(timeout);
jumpClient.end();
reject(
new Error(
"Failed to forward through jump host: " + err.message,
),
);
return;
}
config.sock = stream;
client.connect(config);
},
);
} else {
client.connect(config);
}
} catch (err) {
clearTimeout(timeout);
reject(err);
@@ -396,6 +600,7 @@ interface SSHHostWithCredentials {
enableFileManager: boolean;
defaultPath: string;
tunnelConnections: unknown[];
jumpHosts?: Array<{ hostId: number }>;
statsConfig?: string;
createdAt: string;
updatedAt: string;

231
src/backend/ssh/terminal.ts
View File

@@ -31,6 +31,7 @@ interface ConnectToHostData {
credentialId?: number;
userId?: string;
forceKeyboardInteractive?: boolean;
jumpHosts?: Array<{ hostId: number }>;
};
initialPath?: string;
executeCommand?: string;
@@ -57,6 +58,173 @@ const userCrypto = UserCrypto.getInstance();
const userConnections = new Map<string, Set<WebSocket>>();
async function resolveJumpHost(
hostId: number,
userId: string,
): Promise<any | null> {
try {
const hosts = await SimpleDBOps.select(
getDb()
.select()
.from(sshData)
.where(and(eq(sshData.id, hostId), eq(sshData.userId, userId))),
"ssh_data",
userId,
);
if (hosts.length === 0) {
return null;
}
const host = hosts[0];
if (host.credentialId) {
const credentials = await SimpleDBOps.select(
getDb()
.select()
.from(sshCredentials)
.where(
and(
eq(sshCredentials.id, host.credentialId as number),
eq(sshCredentials.userId, userId),
),
),
"ssh_credentials",
userId,
);
if (credentials.length > 0) {
const credential = credentials[0];
return {
...host,
password: credential.password,
key:
credential.private_key || credential.privateKey || credential.key,
keyPassword: credential.key_password || credential.keyPassword,
keyType: credential.key_type || credential.keyType,
authType: credential.auth_type || credential.authType,
};
}
}
return host;
} catch (error) {
sshLogger.error("Failed to resolve jump host", error, {
operation: "resolve_jump_host",
hostId,
userId,
});
return null;
}
}
async function createJumpHostChain(
jumpHosts: Array<{ hostId: number }>,
userId: string,
): Promise<Client | null> {
if (!jumpHosts || jumpHosts.length === 0) {
return null;
}
let currentClient: Client | null = null;
const clients: Client[] = [];
try {
for (let i = 0; i < jumpHosts.length; i++) {
const jumpHostConfig = await resolveJumpHost(jumpHosts[i].hostId, userId);
if (!jumpHostConfig) {
sshLogger.error(`Jump host ${i + 1} not found`, undefined, {
operation: "jump_host_chain",
hostId: jumpHosts[i].hostId,
});
clients.forEach((c) => c.end());
return null;
}
const jumpClient = new Client();
clients.push(jumpClient);
const connected = await new Promise<boolean>((resolve) => {
const timeout = setTimeout(() => {
resolve(false);
}, 30000);
jumpClient.on("ready", () => {
clearTimeout(timeout);
resolve(true);
});
jumpClient.on("error", (err) => {
clearTimeout(timeout);
sshLogger.error(`Jump host ${i + 1} connection failed`, err, {
operation: "jump_host_connect",
hostId: jumpHostConfig.id,
ip: jumpHostConfig.ip,
});
resolve(false);
});
const connectConfig: any = {
host: jumpHostConfig.ip,
port: jumpHostConfig.port || 22,
username: jumpHostConfig.username,
tryKeyboard: true,
readyTimeout: 30000,
};
if (jumpHostConfig.authType === "password" && jumpHostConfig.password) {
connectConfig.password = jumpHostConfig.password;
} else if (jumpHostConfig.authType === "key" && jumpHostConfig.key) {
const cleanKey = jumpHostConfig.key
.trim()
.replace(/\r\n/g, "\n")
.replace(/\r/g, "\n");
connectConfig.privateKey = Buffer.from(cleanKey, "utf8");
if (jumpHostConfig.keyPassword) {
connectConfig.passphrase = jumpHostConfig.keyPassword;
}
}
if (currentClient) {
currentClient.forwardOut(
"127.0.0.1",
0,
jumpHostConfig.ip,
jumpHostConfig.port || 22,
(err, stream) => {
if (err) {
clearTimeout(timeout);
resolve(false);
return;
}
connectConfig.sock = stream;
jumpClient.connect(connectConfig);
},
);
} else {
jumpClient.connect(connectConfig);
}
});
if (!connected) {
clients.forEach((c) => c.end());
return null;
}
currentClient = jumpClient;
}
return currentClient;
} catch (error) {
sshLogger.error("Failed to create jump host chain", error, {
operation: "jump_host_chain",
});
clients.forEach((c) => c.end());
return null;
}
}
const wss = new WebSocketServer({
port: 30002,
verifyClient: async (info) => {
@@ -990,7 +1158,68 @@ wss.on("connection", async (ws: WebSocket, req) => {
return;
}
sshConn.connect(connectConfig);
if (
hostConfig.jumpHosts &&
hostConfig.jumpHosts.length > 0 &&
hostConfig.userId
) {
try {
const jumpClient = await createJumpHostChain(
hostConfig.jumpHosts,
hostConfig.userId,
);
if (!jumpClient) {
sshLogger.error("Failed to establish jump host chain");
ws.send(
JSON.stringify({
type: "error",
message: "Failed to connect through jump hosts",
}),
);
cleanupSSH(connectionTimeout);
return;
}
jumpClient.forwardOut("127.0.0.1", 0, ip, port, (err, stream) => {
if (err) {
sshLogger.error("Failed to forward through jump host", err, {
operation: "ssh_jump_forward",
hostId: id,
ip,
port,
});
ws.send(
JSON.stringify({
type: "error",
message: "Failed to forward through jump host: " + err.message,
}),
);
jumpClient.end();
cleanupSSH(connectionTimeout);
return;
}
connectConfig.sock = stream;
sshConn.connect(connectConfig);
});
} catch (error) {
sshLogger.error("Jump host error", error, {
operation: "ssh_jump_host",
hostId: id,
});
ws.send(
JSON.stringify({
type: "error",
message: "Failed to connect through jump hosts",
}),
);
cleanupSSH(connectionTimeout);
return;
}
} else {
sshConn.connect(connectConfig);
}
}
function handleResize(data: ResizeData) {

34
src/backend/utils/auth-manager.ts
View File

@@ -85,12 +85,26 @@ class AuthManager {
await this.userCrypto.setupUserEncryption(userId, password);
}
async registerOIDCUser(userId: string): Promise<void> {
await this.userCrypto.setupOIDCUserEncryption(userId);
async registerOIDCUser(
userId: string,
sessionDurationMs: number,
): Promise<void> {
await this.userCrypto.setupOIDCUserEncryption(userId, sessionDurationMs);
}
async authenticateOIDCUser(userId: string): Promise<boolean> {
const authenticated = await this.userCrypto.authenticateOIDCUser(userId);
async authenticateOIDCUser(
userId: string,
deviceType?: DeviceType,
): Promise<boolean> {
const sessionDurationMs =
deviceType === "desktop" || deviceType === "mobile"
? 30 * 24 * 60 * 60 * 1000 // 30 days
: 7 * 24 * 60 * 60 * 1000; // 7 days
const authenticated = await this.userCrypto.authenticateOIDCUser(
userId,
sessionDurationMs,
);
if (authenticated) {
await this.performLazyEncryptionMigration(userId);
@@ -99,10 +113,20 @@ class AuthManager {
return authenticated;
}
async authenticateUser(userId: string, password: string): Promise<boolean> {
async authenticateUser(
userId: string,
password: string,
deviceType?: DeviceType,
): Promise<boolean> {
const sessionDurationMs =
deviceType === "desktop" || deviceType === "mobile"
? 30 * 24 * 60 * 60 * 1000 // 30 days
: 7 * 24 * 60 * 60 * 1000; // 7 days
const authenticated = await this.userCrypto.authenticateUser(
userId,
password,
sessionDurationMs,
);
if (authenticated) {

49
src/backend/utils/user-crypto.ts
View File

@@ -21,7 +21,6 @@ interface EncryptedDEK {
interface UserSession {
dataKey: Buffer;
lastActivity: number;
expiresAt: number;
}
@@ -33,8 +32,6 @@ class UserCrypto {
private static readonly PBKDF2_ITERATIONS = 100000;
private static readonly KEK_LENGTH = 32;
private static readonly DEK_LENGTH = 32;
private static readonly SESSION_DURATION = 24 * 60 * 60 * 1000;
private static readonly MAX_INACTIVITY = 6 * 60 * 60 * 1000;
private constructor() {
setInterval(
@@ -69,7 +66,10 @@ class UserCrypto {
DEK.fill(0);
}
async setupOIDCUserEncryption(userId: string): Promise<void> {
async setupOIDCUserEncryption(
userId: string,
sessionDurationMs: number,
): Promise<void> {
const existingEncryptedDEK = await this.getEncryptedDEK(userId);
let DEK: Buffer;
@@ -104,14 +104,17 @@ class UserCrypto {
const now = Date.now();
this.userSessions.set(userId, {
dataKey: Buffer.from(DEK),
lastActivity: now,
expiresAt: now + UserCrypto.SESSION_DURATION,
expiresAt: now + sessionDurationMs,
});
DEK.fill(0);
}
async authenticateUser(userId: string, password: string): Promise<boolean> {
async authenticateUser(
userId: string,
password: string,
sessionDurationMs: number,
): Promise<boolean> {
try {
const kekSalt = await this.getKEKSalt(userId);
if (!kekSalt) return false;
@@ -144,8 +147,7 @@ class UserCrypto {
this.userSessions.set(userId, {
dataKey: Buffer.from(DEK),
lastActivity: now,
expiresAt: now + UserCrypto.SESSION_DURATION,
expiresAt: now + sessionDurationMs,
});
DEK.fill(0);
@@ -161,13 +163,16 @@ class UserCrypto {
}
}
async authenticateOIDCUser(userId: string): Promise<boolean> {
async authenticateOIDCUser(
userId: string,
sessionDurationMs: number,
): Promise<boolean> {
try {
const kekSalt = await this.getKEKSalt(userId);
const encryptedDEK = await this.getEncryptedDEK(userId);
if (!kekSalt || !encryptedDEK) {
await this.setupOIDCUserEncryption(userId);
await this.setupOIDCUserEncryption(userId, sessionDurationMs);
return true;
}
@@ -176,7 +181,7 @@ class UserCrypto {
systemKey.fill(0);
if (!DEK || DEK.length === 0) {
await this.setupOIDCUserEncryption(userId);
await this.setupOIDCUserEncryption(userId, sessionDurationMs);
return true;
}
@@ -189,15 +194,14 @@ class UserCrypto {
this.userSessions.set(userId, {
dataKey: Buffer.from(DEK),
lastActivity: now,
expiresAt: now + UserCrypto.SESSION_DURATION,
expiresAt: now + sessionDurationMs,
});
DEK.fill(0);
return true;
} catch {
await this.setupOIDCUserEncryption(userId);
await this.setupOIDCUserEncryption(userId, sessionDurationMs);
return true;
}
}
@@ -219,16 +223,6 @@ class UserCrypto {
return null;
}
if (now - session.lastActivity > UserCrypto.MAX_INACTIVITY) {
this.userSessions.delete(userId);
session.dataKey.fill(0);
if (this.sessionExpiredCallback) {
this.sessionExpiredCallback(userId);
}
return null;
}
session.lastActivity = now;
return session.dataKey;
}
@@ -359,10 +353,7 @@ class UserCrypto {
const expiredUsers: string[] = [];
for (const [userId, session] of this.userSessions.entries()) {
if (
now > session.expiresAt ||
now - session.lastActivity > UserCrypto.MAX_INACTIVITY
) {
if (now > session.expiresAt) {
session.dataKey.fill(0);
expiredUsers.push(userId);
}

3
src/locales/de/translation.json
View File

@@ -295,6 +295,7 @@
"submit": "Senden",
"change": "Ändern",
"save": "Speichern",
"saving": "Speichern...",
"delete": "Löschen",
"edit": "Bearbeiten",
"add": "Hinzufügen",
@@ -1192,7 +1193,7 @@
"from": "von"
},
"auth": {
"tagline": "SSH TERMINAL MANAGER",
"tagline": "SSH SERVER MANAGER",
"description": "Sichere, leistungsstarke und intuitive SSH-Verbindungsverwaltung",
"welcomeBack": "Willkommen zurück bei TERMIX",
"createAccount": "Erstellen Sie Ihr TERMIX-Konto",

3
src/locales/en/translation.json
View File

@@ -344,6 +344,7 @@
"cancel": "Cancel",
"change": "Change",
"save": "Save",
"saving": "Saving...",
"delete": "Delete",
"edit": "Edit",
"add": "Add",
@@ -1343,7 +1344,7 @@
"from": "from"
},
"auth": {
"tagline": "SSH TERMINAL MANAGER",
"tagline": "SSH SERVER MANAGER",
"description": "Secure, powerful, and intuitive SSH connection management",
"welcomeBack": "Welcome back to TERMIX",
"createAccount": "Create your TERMIX account",

10
src/types/index.ts
View File

@@ -5,6 +5,10 @@ import type { Request } from "express";
// SSH HOST TYPES
// ============================================================================
export interface JumpHost {
hostId: number;
}
export interface SSHHost {
id: number;
name: string;
@@ -33,12 +37,17 @@ export interface SSHHost {
enableFileManager: boolean;
defaultPath: string;
tunnelConnections: TunnelConnection[];
jumpHosts?: JumpHost[];
statsConfig?: string;
terminalConfig?: TerminalConfig;
createdAt: string;
updatedAt: string;
}
export interface JumpHostData {
hostId: number;
}
export interface SSHHostData {
name?: string;
ip: string;
@@ -60,6 +69,7 @@ export interface SSHHostData {
defaultPath?: string;
forceKeyboardInteractive?: boolean;
tunnelConnections?: TunnelConnection[];
jumpHosts?: JumpHostData[];
statsConfig?: string | Record<string, unknown>;
terminalConfig?: TerminalConfig;
}

14
src/ui/desktop/DesktopApp.tsx
View File

@@ -8,6 +8,7 @@ import {
useTabs,
} from "@/ui/desktop/navigation/tabs/TabContext.tsx";
import { TopNavbar } from "@/ui/desktop/navigation/TopNavbar.tsx";
import { CommandHistoryProvider } from "@/ui/desktop/contexts/CommandHistoryContext.tsx";
import { AdminSettings } from "@/ui/desktop/admin/AdminSettings.tsx";
import { UserProfile } from "@/ui/desktop/user/UserProfile.tsx";
import { Toaster } from "@/components/ui/sonner.tsx";
@@ -37,11 +38,16 @@ function AppContent() {
useEffect(() => {
const handleKeyDown = (event: KeyboardEvent) => {
if (event.code === "ShiftLeft") {
if (event.repeat) {
return;
}
const now = Date.now();
if (now - lastShiftPressTime.current < 300) {
setIsCommandPaletteOpen((isOpen) => !isOpen);
lastShiftPressTime.current = 0; // Reset on double press
} else {
lastShiftPressTime.current = now;
}
lastShiftPressTime.current = now;
}
if (event.key === "Escape") {
setIsCommandPaletteOpen(false);
@@ -314,7 +320,7 @@ function AppContent() {
"subtitleFade 1.6s cubic-bezier(0.4, 0, 0.2, 1) forwards",
}}
>
SSH TERMINAL MANAGER
SSH SERVER MANAGER
</div>
</div>
</div>
@@ -421,7 +427,9 @@ function AppContent() {
function DesktopApp() {
return (
<TabProvider>
<AppContent />
<CommandHistoryProvider>
<AppContent />
</CommandHistoryProvider>
</TabProvider>
);
}

213
src/ui/desktop/admin/AdminSettings.tsx
View File

@@ -1072,109 +1072,113 @@ export function AdminSettings({
</div>
) : (
<div className="border rounded-md overflow-hidden">
<Table>
<TableHeader>
<TableRow>
<TableHead className="px-4">Device</TableHead>
<TableHead className="px-4">User</TableHead>
<TableHead className="px-4">Created</TableHead>
<TableHead className="px-4">Last Active</TableHead>
<TableHead className="px-4">Expires</TableHead>
<TableHead className="px-4">
{t("admin.actions")}
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{sessions.map((session) => {
const DeviceIcon =
session.deviceType === "desktop"
? Monitor
: session.deviceType === "mobile"
? Smartphone
: Globe;
<div className="overflow-x-auto">
<Table>
<TableHeader>
<TableRow>
<TableHead className="px-4">Device</TableHead>
<TableHead className="px-4">User</TableHead>
<TableHead className="px-4">Created</TableHead>
<TableHead className="px-4">Last Active</TableHead>
<TableHead className="px-4">Expires</TableHead>
<TableHead className="px-4">
{t("admin.actions")}
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{sessions.map((session) => {
const DeviceIcon =
session.deviceType === "desktop"
? Monitor
: session.deviceType === "mobile"
? Smartphone
: Globe;
const createdDate = new Date(session.createdAt);
const lastActiveDate = new Date(session.lastActiveAt);
const expiresDate = new Date(session.expiresAt);
const createdDate = new Date(session.createdAt);
const lastActiveDate = new Date(
session.lastActiveAt,
);
const expiresDate = new Date(session.expiresAt);
const formatDate = (date: Date) =>
date.toLocaleDateString() +
" " +
date.toLocaleTimeString([], {
hour: "2-digit",
minute: "2-digit",
});
const formatDate = (date: Date) =>
date.toLocaleDateString() +
" " +
date.toLocaleTimeString([], {
hour: "2-digit",
minute: "2-digit",
});
return (
<TableRow
key={session.id}
className={
session.isRevoked ? "opacity-50" : undefined
}
>
<TableCell className="px-4">
<div className="flex items-center gap-2">
<DeviceIcon className="h-4 w-4" />
<div className="flex flex-col">
<span className="font-medium text-sm">
{session.deviceInfo}
</span>
{session.isRevoked && (
<span className="text-xs text-red-600">
Revoked
return (
<TableRow
key={session.id}
className={
session.isRevoked ? "opacity-50" : undefined
}
>
<TableCell className="px-4">
<div className="flex items-center gap-2">
<DeviceIcon className="h-4 w-4" />
<div className="flex flex-col">
<span className="font-medium text-sm">
{session.deviceInfo}
</span>
)}
{session.isRevoked && (
<span className="text-xs text-red-600">
Revoked
</span>
)}
</div>
</div>
</div>
</TableCell>
<TableCell className="px-4">
{session.username || session.userId}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(createdDate)}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(lastActiveDate)}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(expiresDate)}
</TableCell>
<TableCell className="px-4">
<div className="flex gap-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
handleRevokeSession(session.id)
}
className="text-red-600 hover:text-red-700 hover:bg-red-50"
disabled={session.isRevoked}
>
<Trash2 className="h-4 w-4" />
</Button>
{session.username && (
</TableCell>
<TableCell className="px-4">
{session.username || session.userId}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(createdDate)}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(lastActiveDate)}
</TableCell>
<TableCell className="px-4 text-sm text-muted-foreground">
{formatDate(expiresDate)}
</TableCell>
<TableCell className="px-4">
<div className="flex gap-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
handleRevokeAllUserSessions(
session.userId,
)
handleRevokeSession(session.id)
}
className="text-orange-600 hover:text-orange-700 hover:bg-orange-50 text-xs"
title="Revoke all sessions for this user"
className="text-red-600 hover:text-red-700 hover:bg-red-50"
disabled={session.isRevoked}
>
Revoke All
<Trash2 className="h-4 w-4" />
</Button>
)}
</div>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
{session.username && (
<Button
variant="ghost"
size="sm"
onClick={() =>
handleRevokeAllUserSessions(
session.userId,
)
}
className="text-orange-600 hover:text-orange-700 hover:bg-orange-50 text-xs"
title="Revoke all sessions for this user"
>
Revoke All
</Button>
)}
</div>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</div>
</div>
)}
</div>
@@ -1185,8 +1189,8 @@ export function AdminSettings({
<h3 className="text-lg font-semibold">
{t("admin.adminManagement")}
</h3>
<div className="space-y-4 p-6 border rounded-md bg-muted/50">
<h4 className="font-medium">{t("admin.makeUserAdmin")}</h4>
<div className="space-y-4 p-4 border rounded-md bg-dark-bg-panel">
<h4 className="font-semibold">{t("admin.makeUserAdmin")}</h4>
<form onSubmit={handleMakeUserAdmin} className="space-y-4">
<div className="space-y-2">
<Label htmlFor="new-admin-username">
@@ -1279,32 +1283,17 @@ export function AdminSettings({
<TabsContent value="security" className="space-y-6">
<div className="space-y-4">
<div className="flex items-center gap-3">
<Database className="h-5 w-5" />
<h3 className="text-lg font-semibold">
{t("admin.databaseSecurity")}
</h3>
</div>
<div className="p-4 border rounded bg-card">
<div className="flex items-center gap-2">
<Lock className="h-4 w-4 text-green-500" />
<div>
<div className="text-sm font-medium">
{t("admin.encryptionStatus")}
</div>
<div className="text-xs text-green-500">
{t("admin.encryptionEnabled")}
</div>
</div>
</div>
</div>
<div className="grid gap-3 md:grid-cols-2">
<div className="p-4 border rounded bg-card">
<div className="p-4 border rounded-lg bg-dark-bg-panel">
<div className="space-y-3">
<div className="flex items-center gap-2">
<Download className="h-4 w-4 text-blue-500" />
<h4 className="font-medium">{t("admin.export")}</h4>
<h4 className="font-semibold">{t("admin.export")}</h4>
</div>
<p className="text-xs text-muted-foreground">
{t("admin.exportDescription")}
@@ -1351,11 +1340,11 @@ export function AdminSettings({
</div>
</div>
<div className="p-4 border rounded bg-card">
<div className="p-4 border rounded-lg bg-dark-bg-panel">
<div className="space-y-3">
<div className="flex items-center gap-2">
<Upload className="h-4 w-4 text-green-500" />
<h4 className="font-medium">{t("admin.import")}</h4>
<h4 className="font-semibold">{t("admin.import")}</h4>
</div>
<p className="text-xs text-muted-foreground">
{t("admin.importDescription")}

24
src/ui/desktop/apps/file-manager/FileManagerContextMenu.tsx
View File

@@ -369,6 +369,18 @@ export function FileManagerContextMenu({
menuItems.push({ separator: true } as MenuItem);
}
if (isSingleFile && onProperties) {
menuItems.push({
icon: <Info className="w-4 h-4" />,
label: t("fileManager.properties"),
action: () => onProperties(files[0]),
});
}
if ((isSingleFile && onProperties) || onDelete) {
menuItems.push({ separator: true } as MenuItem);
}
if (onDelete) {
menuItems.push({
icon: <Trash2 className="w-4 h-4" />,
@@ -380,18 +392,6 @@ export function FileManagerContextMenu({
danger: true,
});
}
if (onDelete) {
menuItems.push({ separator: true } as MenuItem);
}
if (isSingleFile && onProperties) {
menuItems.push({
icon: <Info className="w-4 h-4" />,
label: t("fileManager.properties"),
action: () => onProperties(files[0]),
});
}
} else {
if (onOpenTerminal && currentPath) {
menuItems.push({

32
src/ui/desktop/apps/file-manager/components/CompressDialog.tsx
View File

@@ -73,17 +73,22 @@ export function CompressDialog({
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="sm:max-w-[500px]">
<DialogContent className="sm:max-w-[500px] bg-dark-bg border-2 border-dark-border">
<DialogHeader>
<DialogTitle>{t("fileManager.compressFiles")}</DialogTitle>
<DialogDescription>
<DialogDescription className="text-muted-foreground">
{t("fileManager.compressFilesDesc", { count: fileNames.length })}
</DialogDescription>
</DialogHeader>
<div className="grid gap-4 py-4">
<div className="grid gap-2">
<Label htmlFor="archiveName">{t("fileManager.archiveName")}</Label>
<div className="space-y-6 py-4">
<div className="space-y-3">
<Label
className="text-base font-semibold text-foreground"
htmlFor="archiveName"
>
{t("fileManager.archiveName")}
</Label>
<Input
id="archiveName"
value={archiveName}
@@ -98,8 +103,13 @@ export function CompressDialog({
/>
</div>
<div className="grid gap-2">
<Label htmlFor="format">{t("fileManager.compressionFormat")}</Label>
<div className="space-y-3">
<Label
className="text-base font-semibold text-foreground"
htmlFor="format"
>
{t("fileManager.compressionFormat")}
</Label>
<Select value={format} onValueChange={setFormat}>
<SelectTrigger id="format">
<SelectValue />
@@ -115,18 +125,18 @@ export function CompressDialog({
</Select>
</div>
<div className="rounded-md bg-muted p-3">
<p className="text-sm text-muted-foreground mb-2">
<div className="rounded-md bg-dark-hover/50 border border-dark-border p-3">
<p className="text-sm text-gray-400 mb-2">
{t("fileManager.selectedFiles")}:
</p>
<ul className="text-sm space-y-1">
{fileNames.slice(0, 5).map((name, index) => (
<li key={index} className="truncate">
<li key={index} className="truncate text-foreground">
• {name}
</li>
))}
{fileNames.length > 5 && (
<li className="text-muted-foreground italic">
<li className="text-gray-400 italic">
{t("fileManager.andMoreFiles", {
count: fileNames.length - 5,
})}

306
src/ui/desktop/apps/host-manager/HostManagerEditor.tsx
View File

@@ -1,6 +1,7 @@
import { zodResolver } from "@hookform/resolvers/zod";
import { Controller, useForm } from "react-hook-form";
import { z } from "zod";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button.tsx";
import {
@@ -49,6 +50,18 @@ import {
SelectTrigger,
SelectValue,
} from "@/components/ui/select.tsx";
import {
Command,
CommandEmpty,
CommandGroup,
CommandInput,
CommandItem,
} from "@/components/ui/command.tsx";
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover.tsx";
import { Slider } from "@/components/ui/slider.tsx";
import {
Accordion,
@@ -66,7 +79,7 @@ import {
} from "@/constants/terminal-themes";
import { TerminalPreview } from "@/ui/desktop/apps/terminal/TerminalPreview.tsx";
import type { TerminalConfig } from "@/types";
import { Plus, X } from "lucide-react";
import { Plus, X, Check, ChevronsUpDown } from "lucide-react";
interface SSHHost {
id: number;
@@ -94,6 +107,9 @@ interface SSHHost {
retryInterval: number;
autoStart: boolean;
}>;
jumpHosts?: Array<{
hostId: number;
}>;
statsConfig?: StatsConfig;
terminalConfig?: TerminalConfig;
createdAt: string;
@@ -113,6 +129,7 @@ export function HostManagerEditor({
const { t } = useTranslation();
const [folders, setFolders] = useState<string[]>([]);
const [sshConfigurations, setSshConfigurations] = useState<string[]>([]);
const [hosts, setHosts] = useState<SSHHost[]>([]);
const [credentials, setCredentials] = useState<
Array<{ id: number; username: string; authType: string }>
>([]);
@@ -146,6 +163,7 @@ export function HostManagerEditor({
getCredentials(),
getSnippets(),
]);
setHosts(hostsData);
setCredentials(credentialsData);
setSnippets(Array.isArray(snippetsData) ? snippetsData : []);
@@ -327,6 +345,13 @@ export function HostManagerEditor({
})
.optional(),
forceKeyboardInteractive: z.boolean().optional(),
jumpHosts: z
.array(
z.object({
hostId: z.number().min(1),
}),
)
.default([]),
})
.superRefine((data, ctx) => {
if (data.authType === "none") {
@@ -414,6 +439,7 @@ export function HostManagerEditor({
enableFileManager: true,
defaultPath: "/",
tunnelConnections: [],
jumpHosts: [],
statsConfig: DEFAULT_STATS_CONFIG,
terminalConfig: DEFAULT_TERMINAL_CONFIG,
forceKeyboardInteractive: false,
@@ -433,7 +459,7 @@ export function HostManagerEditor({
}
}
}
}, [authTab, credentials, form]);
}, [authTab, credentials, form.getValues, form.setValue]);
useEffect(() => {
if (editingHost) {
@@ -477,7 +503,7 @@ export function HostManagerEditor({
port: cleanedHost.port || 22,
username: cleanedHost.username || "",
folder: cleanedHost.folder || "",
tags: cleanedHost.tags || [],
tags: Array.isArray(cleanedHost.tags) ? cleanedHost.tags : [],
pin: Boolean(cleanedHost.pin),
authType: defaultAuthType as "password" | "key" | "credential" | "none",
credentialId: null,
@@ -492,9 +518,22 @@ export function HostManagerEditor({
enableTunnel: Boolean(cleanedHost.enableTunnel),
enableFileManager: Boolean(cleanedHost.enableFileManager),
defaultPath: cleanedHost.defaultPath || "/",
tunnelConnections: cleanedHost.tunnelConnections || [],
tunnelConnections: Array.isArray(cleanedHost.tunnelConnections)
? cleanedHost.tunnelConnections
: [],
jumpHosts: Array.isArray(cleanedHost.jumpHosts)
? cleanedHost.jumpHosts
: [],
statsConfig: parsedStatsConfig,
terminalConfig: cleanedHost.terminalConfig || DEFAULT_TERMINAL_CONFIG,
terminalConfig: {
...DEFAULT_TERMINAL_CONFIG,
...(cleanedHost.terminalConfig || {}),
environmentVariables: Array.isArray(
cleanedHost.terminalConfig?.environmentVariables,
)
? cleanedHost.terminalConfig.environmentVariables
: [],
},
forceKeyboardInteractive: Boolean(cleanedHost.forceKeyboardInteractive),
};
@@ -542,6 +581,7 @@ export function HostManagerEditor({
enableFileManager: true,
defaultPath: "/",
tunnelConnections: [],
jumpHosts: [],
statsConfig: DEFAULT_STATS_CONFIG,
terminalConfig: DEFAULT_TERMINAL_CONFIG,
forceKeyboardInteractive: false,
@@ -601,6 +641,7 @@ export function HostManagerEditor({
enableFileManager: Boolean(data.enableFileManager),
defaultPath: data.defaultPath || "/",
tunnelConnections: data.tunnelConnections || [],
jumpHosts: data.jumpHosts || [],
statsConfig: data.statsConfig || DEFAULT_STATS_CONFIG,
terminalConfig: data.terminalConfig || DEFAULT_TERMINAL_CONFIG,
forceKeyboardInteractive: Boolean(data.forceKeyboardInteractive),
@@ -1387,6 +1428,147 @@ export function HostManagerEditor({
</FormItem>
)}
/>
<Separator className="my-6" />
<FormLabel className="mb-3 font-bold">
{t("hosts.jumpHosts")}
</FormLabel>
<Alert className="mt-2 mb-4">
<AlertDescription>
{t("hosts.jumpHostsDescription")}
</AlertDescription>
</Alert>
<FormField
control={form.control}
name="jumpHosts"
render={({ field }) => (
<FormItem className="mt-4">
<FormLabel>{t("hosts.jumpHostChain")}</FormLabel>
<FormControl>
<div className="space-y-3">
{field.value.map((jumpHost, index) => {
const selectedHost = hosts.find(
(h) => h.id === jumpHost.hostId,
);
const [open, setOpen] = React.useState(false);
return (
<div
key={index}
className="flex items-center gap-2 p-3 border rounded-lg bg-muted/30"
>
<div className="flex items-center gap-2 flex-1">
<span className="text-sm font-medium text-muted-foreground">
{index + 1}.
</span>
<Popover open={open} onOpenChange={setOpen}>
<PopoverTrigger asChild>
<Button
variant="outline"
role="combobox"
aria-expanded={open}
className="flex-1 justify-between"
>
{selectedHost
? `${selectedHost.name || `${selectedHost.username}@${selectedHost.ip}`}`
: t("hosts.selectServer")}
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button>
</PopoverTrigger>
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandInput
placeholder={t(
"hosts.searchServers",
)}
/>
<CommandEmpty>
{t("hosts.noServerFound")}
</CommandEmpty>
<CommandGroup className="max-h-[300px] overflow-y-auto">
{hosts
.filter(
(h) =>
!editingHost ||
h.id !== editingHost.id,
)
.map((host) => (
<CommandItem
key={host.id}
value={`${host.name} ${host.ip} ${host.username}`}
onSelect={() => {
const newJumpHosts = [
...field.value,
];
newJumpHosts[index] = {
hostId: host.id,
};
field.onChange(
newJumpHosts,
);
setOpen(false);
}}
>
<Check
className={cn(
"mr-2 h-4 w-4",
jumpHost.hostId ===
host.id
? "opacity-100"
: "opacity-0",
)}
/>
<div className="flex flex-col">
<span className="font-medium">
{host.name ||
`${host.username}@${host.ip}`}
</span>
<span className="text-xs text-muted-foreground">
{host.username}@{host.ip}:
{host.port}
</span>
</div>
</CommandItem>
))}
</CommandGroup>
</Command>
</PopoverContent>
</Popover>
</div>
<Button
type="button"
variant="ghost"
size="icon"
onClick={() => {
const newJumpHosts = field.value.filter(
(_, i) => i !== index,
);
field.onChange(newJumpHosts);
}}
>
<X className="h-4 w-4" />
</Button>
</div>
);
})}
<Button
type="button"
variant="outline"
size="sm"
onClick={() => {
field.onChange([...field.value, { hostId: 0 }]);
}}
>
<Plus className="h-4 w-4 mr-2" />
{t("hosts.addJumpHost")}
</Button>
</div>
</FormControl>
<FormDescription>
{t("hosts.jumpHostsOrder")}
</FormDescription>
</FormItem>
)}
/>
</TabsContent>
<TabsContent value="terminal" className="space-y-1">
<FormField
@@ -1417,7 +1599,9 @@ export function HostManagerEditor({
</h1>
<Accordion type="multiple" className="w-full">
<AccordionItem value="appearance">
<AccordionTrigger>{t("hosts.appearance")}</AccordionTrigger>
<AccordionTrigger>
{t("hosts.appearance")}
</AccordionTrigger>
<AccordionContent className="space-y-4 pt-4">
<div className="space-y-2">
<label className="text-sm font-medium">
@@ -1452,7 +1636,9 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectTheme")} />
<SelectValue
placeholder={t("hosts.selectTheme")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
@@ -1484,7 +1670,9 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectFont")} />
<SelectValue
placeholder={t("hosts.selectFont")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
@@ -1510,7 +1698,11 @@ export function HostManagerEditor({
name="terminalConfig.fontSize"
render={({ field }) => (
<FormItem>
<FormLabel>{t("hosts.fontSizeValue", { value: field.value })}</FormLabel>
<FormLabel>
{t("hosts.fontSizeValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
min={8}
@@ -1535,7 +1727,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem>
<FormLabel>
{t("hosts.letterSpacingValue", { value: field.value })}
{t("hosts.letterSpacingValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
@@ -1560,7 +1754,11 @@ export function HostManagerEditor({
name="terminalConfig.lineHeight"
render={({ field }) => (
<FormItem>
<FormLabel>{t("hosts.lineHeightValue", { value: field.value })}</FormLabel>
<FormLabel>
{t("hosts.lineHeightValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
min={1}
@@ -1591,15 +1789,21 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectCursorStyle")} />
<SelectValue
placeholder={t("hosts.selectCursorStyle")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
<SelectItem value="block">{t("hosts.cursorStyleBlock")}</SelectItem>
<SelectItem value="block">
{t("hosts.cursorStyleBlock")}
</SelectItem>
<SelectItem value="underline">
{t("hosts.cursorStyleUnderline")}
</SelectItem>
<SelectItem value="bar">{t("hosts.cursorStyleBar")}</SelectItem>
<SelectItem value="bar">
{t("hosts.cursorStyleBar")}
</SelectItem>
</SelectContent>
</Select>
<FormDescription>
@@ -1641,7 +1845,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem>
<FormLabel>
{t("hosts.scrollbackBufferValue", { value: field.value })}
{t("hosts.scrollbackBufferValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
@@ -1673,14 +1879,24 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectBellStyle")} />
<SelectValue
placeholder={t("hosts.selectBellStyle")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
<SelectItem value="none">{t("hosts.bellStyleNone")}</SelectItem>
<SelectItem value="sound">{t("hosts.bellStyleSound")}</SelectItem>
<SelectItem value="visual">{t("hosts.bellStyleVisual")}</SelectItem>
<SelectItem value="both">{t("hosts.bellStyleBoth")}</SelectItem>
<SelectItem value="none">
{t("hosts.bellStyleNone")}
</SelectItem>
<SelectItem value="sound">
{t("hosts.bellStyleSound")}
</SelectItem>
<SelectItem value="visual">
{t("hosts.bellStyleVisual")}
</SelectItem>
<SelectItem value="both">
{t("hosts.bellStyleBoth")}
</SelectItem>
</SelectContent>
</Select>
<FormDescription>
@@ -1696,7 +1912,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3">
<div className="space-y-0.5">
<FormLabel>{t("hosts.rightClickSelectsWord")}</FormLabel>
<FormLabel>
{t("hosts.rightClickSelectsWord")}
</FormLabel>
<FormDescription>
{t("hosts.rightClickSelectsWordDesc")}
</FormDescription>
@@ -1716,20 +1934,30 @@ export function HostManagerEditor({
name="terminalConfig.fastScrollModifier"
render={({ field }) => (
<FormItem>
<FormLabel>{t("hosts.fastScrollModifier")}</FormLabel>
<FormLabel>
{t("hosts.fastScrollModifier")}
</FormLabel>
<Select
onValueChange={field.onChange}
value={field.value}
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectModifier")} />
<SelectValue
placeholder={t("hosts.selectModifier")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
<SelectItem value="alt">{t("hosts.modifierAlt")}</SelectItem>
<SelectItem value="ctrl">{t("hosts.modifierCtrl")}</SelectItem>
<SelectItem value="shift">{t("hosts.modifierShift")}</SelectItem>
<SelectItem value="alt">
{t("hosts.modifierAlt")}
</SelectItem>
<SelectItem value="ctrl">
{t("hosts.modifierCtrl")}
</SelectItem>
<SelectItem value="shift">
{t("hosts.modifierShift")}
</SelectItem>
</SelectContent>
</Select>
<FormDescription>
@@ -1745,7 +1973,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem>
<FormLabel>
{t("hosts.fastScrollSensitivityValue", { value: field.value })}
{t("hosts.fastScrollSensitivityValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
@@ -1771,7 +2001,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem>
<FormLabel>
{t("hosts.minimumContrastRatioValue", { value: field.value })}
{t("hosts.minimumContrastRatioValue", {
value: field.value,
})}
</FormLabel>
<FormControl>
<Slider
@@ -1802,7 +2034,9 @@ export function HostManagerEditor({
render={({ field }) => (
<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3">
<div className="space-y-0.5">
<FormLabel>{t("hosts.sshAgentForwarding")}</FormLabel>
<FormLabel>
{t("hosts.sshAgentForwarding")}
</FormLabel>
<FormDescription>
{t("hosts.sshAgentForwardingDesc")}
</FormDescription>
@@ -1829,7 +2063,11 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectBackspaceMode")} />
<SelectValue
placeholder={t(
"hosts.selectBackspaceMode",
)}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
@@ -1865,7 +2103,9 @@ export function HostManagerEditor({
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t("hosts.selectSnippet")} />
<SelectValue
placeholder={t("hosts.selectSnippet")}
/>
</SelectTrigger>
</FormControl>
<SelectContent>
@@ -1882,7 +2122,9 @@ export function HostManagerEditor({
/>
</div>
<div className="max-h-[200px] overflow-y-auto">
<SelectItem value="none">{t("hosts.snippetNone")}</SelectItem>
<SelectItem value="none">
{t("hosts.snippetNone")}
</SelectItem>
{snippets
.filter((snippet) =>
snippet.name

8
src/ui/desktop/apps/host-manager/HostManagerViewer.tsx
View File

@@ -105,14 +105,18 @@ export function HostManagerViewer({ onEditHost }: SSHManagerHostViewerProps) {
fetchFolderMetadata();
};
const handleFoldersRefresh = () => {
fetchFolderMetadata();
};
window.addEventListener("hosts:refresh", handleHostsRefresh);
window.addEventListener("ssh-hosts:changed", handleHostsRefresh);
window.addEventListener("folders:changed", handleHostsRefresh);
window.addEventListener("folders:changed", handleFoldersRefresh);
return () => {
window.removeEventListener("hosts:refresh", handleHostsRefresh);
window.removeEventListener("ssh-hosts:changed", handleHostsRefresh);
window.removeEventListener("folders:changed", handleHostsRefresh);
window.removeEventListener("folders:changed", handleFoldersRefresh);
};
}, []);

238
src/ui/desktop/apps/terminal/CommandHistoryDialog.tsx
View File

@@ -1,238 +0,0 @@
import React, { useState, useEffect, useRef } from "react";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import { Input } from "@/components/ui/input";
import { ScrollArea } from "@/components/ui/scroll-area";
import { cn } from "@/lib/utils";
import { Search, Clock, X, Trash2 } from "lucide-react";
import { Button } from "@/components/ui/button";
interface CommandHistoryDialogProps {
open: boolean;
onOpenChange: (open: boolean) => void;
commands: string[];
onSelectCommand: (command: string) => void;
onDeleteCommand?: (command: string) => void;
isLoading?: boolean;
}
export function CommandHistoryDialog({
open,
onOpenChange,
commands,
onSelectCommand,
onDeleteCommand,
isLoading = false,
}: CommandHistoryDialogProps) {
const [searchQuery, setSearchQuery] = useState("");
const [selectedIndex, setSelectedIndex] = useState(0);
const inputRef = useRef<HTMLInputElement>(null);
const listRef = useRef<HTMLDivElement>(null);
const selectedRef = useRef<HTMLDivElement>(null);
// Filter commands based on search query
const filteredCommands = searchQuery
? commands.filter((cmd) =>
cmd.toLowerCase().includes(searchQuery.toLowerCase()),
)
: commands;
// Reset state when dialog opens/closes
useEffect(() => {
if (open) {
setSearchQuery("");
setSelectedIndex(0);
// Focus search input
setTimeout(() => inputRef.current?.focus(), 100);
}
}, [open]);
// Scroll selected item into view
useEffect(() => {
if (selectedRef.current && listRef.current) {
selectedRef.current.scrollIntoView({
block: "nearest",
behavior: "smooth",
});
}
}, [selectedIndex]);
// Handle keyboard navigation
const handleKeyDown = (e: React.KeyboardEvent) => {
if (filteredCommands.length === 0) return;
switch (e.key) {
case "ArrowDown":
e.preventDefault();
setSelectedIndex((prev) =>
prev < filteredCommands.length - 1 ? prev + 1 : prev,
);
break;
case "ArrowUp":
e.preventDefault();
setSelectedIndex((prev) => (prev > 0 ? prev - 1 : 0));
break;
case "Enter":
e.preventDefault();
if (filteredCommands[selectedIndex]) {
onSelectCommand(filteredCommands[selectedIndex]);
onOpenChange(false);
}
break;
case "Escape":
e.preventDefault();
onOpenChange(false);
break;
}
};
const handleSelect = (command: string) => {
onSelectCommand(command);
onOpenChange(false);
};
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="sm:max-w-[600px] p-0 gap-0">
<DialogHeader className="px-6 pt-6 pb-4">
<DialogTitle className="flex items-center gap-2">
<Clock className="h-5 w-5" />
Command History
</DialogTitle>
</DialogHeader>
<div className="px-6 pb-4">
<div className="relative">
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" />
<Input
ref={inputRef}
placeholder="Search commands... (↑↓ to navigate, Enter to select)"
value={searchQuery}
onChange={(e) => {
setSearchQuery(e.target.value);
setSelectedIndex(0);
}}
onKeyDown={handleKeyDown}
className="pl-10 pr-10"
/>
{searchQuery && (
<Button
variant="ghost"
size="sm"
className="absolute right-1 top-1/2 transform -translate-y-1/2 h-7 w-7 p-0"
onClick={() => {
setSearchQuery("");
inputRef.current?.focus();
}}
>
<X className="h-4 w-4" />
</Button>
)}
</div>
</div>
<ScrollArea ref={listRef} className="h-[400px] px-6 pb-6">
{isLoading ? (
<div className="flex items-center justify-center py-8 text-muted-foreground">
<div className="flex items-center gap-2">
<div className="w-4 h-4 border-2 border-blue-400 border-t-transparent rounded-full animate-spin"></div>
Loading history...
</div>
</div>
) : filteredCommands.length === 0 ? (
<div className="flex flex-col items-center justify-center py-8 text-muted-foreground">
{searchQuery ? (
<>
<Search className="h-12 w-12 mb-2 opacity-20" />
<p>No commands found matching "{searchQuery}"</p>
</>
) : (
<>
<Clock className="h-12 w-12 mb-2 opacity-20" />
<p>No command history yet</p>
<p className="text-sm">
Execute commands to build your history
</p>
</>
)}
</div>
) : (
<div className="space-y-1">
{filteredCommands.map((command, index) => (
<div
key={index}
ref={index === selectedIndex ? selectedRef : null}
className={cn(
"px-4 py-2.5 rounded-md transition-colors group",
"font-mono text-sm flex items-center justify-between gap-2",
"hover:bg-accent",
index === selectedIndex &&
"bg-blue-500/20 text-blue-400 ring-1 ring-blue-500/50",
)}
onMouseEnter={() => setSelectedIndex(index)}
>
<span
className="flex-1 cursor-pointer"
onClick={() => handleSelect(command)}
>
{command}
</span>
{onDeleteCommand && (
<Button
variant="ghost"
size="sm"
className="h-6 w-6 p-0 opacity-0 group-hover:opacity-100 hover:bg-red-500/20 hover:text-red-400"
onClick={(e) => {
e.stopPropagation();
onDeleteCommand(command);
}}
title="Delete command"
>
<Trash2 className="h-3.5 w-3.5" />
</Button>
)}
</div>
))}
</div>
)}
</ScrollArea>
<div className="px-6 py-3 border-t border-border bg-muted/30">
<div className="flex items-center justify-between text-xs text-muted-foreground">
<div className="flex items-center gap-4">
<span>
<kbd className="px-1.5 py-0.5 bg-background border border-border rounded">
↑↓
</kbd>{" "}
Navigate
</span>
<span>
<kbd className="px-1.5 py-0.5 bg-background border border-border rounded">
Enter
</kbd>{" "}
Select
</span>
<span>
<kbd className="px-1.5 py-0.5 bg-background border border-border rounded">
Esc
</kbd>{" "}
Close
</span>
</div>
<span>
{filteredCommands.length} command
{filteredCommands.length !== 1 ? "s" : ""}
</span>
</div>
</div>
</DialogContent>
</Dialog>
);
}

42
src/ui/desktop/apps/terminal/Terminal.tsx
View File

@@ -28,8 +28,8 @@ import {
} from "@/constants/terminal-themes";
import type { TerminalConfig } from "@/types";
import { useCommandTracker } from "@/ui/hooks/useCommandTracker";
import { useCommandHistory } from "@/ui/hooks/useCommandHistory";
import { CommandHistoryDialog } from "./CommandHistoryDialog";
import { useCommandHistory as useCommandHistoryHook } from "@/ui/hooks/useCommandHistory";
import { useCommandHistory } from "@/ui/desktop/contexts/CommandHistoryContext.tsx";
import { CommandAutocomplete } from "./CommandAutocomplete";
import { SimpleLoader } from "@/ui/desktop/navigation/animations/SimpleLoader.tsx";
@@ -91,6 +91,7 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
const { t } = useTranslation();
const { instance: terminal, ref: xtermRef } = useXTerm();
const commandHistoryContext = useCommandHistory();
const config = { ...DEFAULT_TERMINAL_CONFIG, ...hostConfig.terminalConfig };
const themeColors =
@@ -183,20 +184,24 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
useEffect(() => {
if (showHistoryDialog && hostConfig.id) {
setIsLoadingHistory(true);
commandHistoryContext.setIsLoading(true);
import("@/ui/main-axios.ts")
.then((module) => module.getCommandHistory(hostConfig.id!))
.then((history) => {
setCommandHistory(history);
commandHistoryContext.setCommandHistory(history);
})
.catch((error) => {
console.error("Failed to load command history:", error);
setCommandHistory([]);
commandHistoryContext.setCommandHistory([]);
})
.finally(() => {
setIsLoadingHistory(false);
commandHistoryContext.setIsLoading(false);
});
}
}, [showHistoryDialog, hostConfig.id]);
}, [showHistoryDialog, hostConfig.id, commandHistoryContext]);
// Load command history for autocomplete on mount (Stage 3)
useEffect(() => {
@@ -898,6 +903,11 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
[terminal],
);
// Register handlers with context
useEffect(() => {
commandHistoryContext.setOnSelectCommand(handleSelectCommand);
}, [handleSelectCommand, commandHistoryContext]);
// Handle autocomplete selection (mouse click)
const handleAutocompleteSelect = useCallback(
(selectedCommand: string) => {
@@ -944,7 +954,11 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
await deleteCommandFromHistory(hostConfig.id, command);
// Update local state
setCommandHistory((prev) => prev.filter((cmd) => cmd !== command));
setCommandHistory((prev) => {
const newHistory = prev.filter((cmd) => cmd !== command);
commandHistoryContext.setCommandHistory(newHistory);
return newHistory;
});
// Update autocomplete history
autocompleteHistory.current = autocompleteHistory.current.filter(
@@ -956,9 +970,14 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
console.error("Failed to delete command from history:", error);
}
},
[hostConfig.id],
[hostConfig.id, commandHistoryContext],
);
// Register delete handler with context
useEffect(() => {
commandHistoryContext.setOnDeleteCommand(handleDeleteCommand);
}, [handleDeleteCommand, commandHistoryContext]);
useEffect(() => {
if (!terminal || !xtermRef.current) return;
@@ -1074,6 +1093,10 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
e.preventDefault();
e.stopPropagation();
setShowHistoryDialog(true);
// Also trigger the sidebar to open
if (commandHistoryContext.openCommandHistory) {
commandHistoryContext.openCommandHistory();
}
return false;
}
@@ -1476,15 +1499,6 @@ export const Terminal = forwardRef<TerminalHandle, SSHTerminalProps>(
backgroundColor={backgroundColor}
/>
<CommandHistoryDialog
open={showHistoryDialog}
onOpenChange={setShowHistoryDialog}
commands={commandHistory}
onSelectCommand={handleSelectCommand}
onDeleteCommand={handleDeleteCommand}
isLoading={isLoadingHistory}
/>
<CommandAutocomplete
visible={showAutocomplete}
suggestions={autocompleteSuggestions}

217
src/ui/desktop/apps/tools/SSHUtilitySidebar.tsx
View File

@@ -23,7 +23,17 @@ import {
SidebarProvider,
SidebarGroupLabel,
} from "@/components/ui/sidebar.tsx";
import { Plus, Play, Edit, Trash2, Copy, X, RotateCcw } from "lucide-react";
import {
Plus,
Play,
Edit,
Trash2,
Copy,
X,
RotateCcw,
Search,
Loader2,
} from "lucide-react";
import { toast } from "sonner";
import { useTranslation } from "react-i18next";
import { useConfirmation } from "@/hooks/use-confirmation.ts";
@@ -56,6 +66,12 @@ interface SSHUtilitySidebarProps {
onSnippetExecute: (content: string) => void;
sidebarWidth: number;
setSidebarWidth: (width: number) => void;
commandHistory?: string[];
onSelectCommand?: (command: string) => void;
onDeleteCommand?: (command: string) => void;
isHistoryLoading?: boolean;
initialTab?: string;
onTabChange?: () => void;
}
export function SSHUtilitySidebar({
@@ -64,15 +80,39 @@ export function SSHUtilitySidebar({
onSnippetExecute,
sidebarWidth,
setSidebarWidth,
commandHistory = [],
onSelectCommand,
onDeleteCommand,
isHistoryLoading = false,
initialTab,
onTabChange,
}: SSHUtilitySidebarProps) {
const { t } = useTranslation();
const { confirmWithToast } = useConfirmation();
const { tabs } = useTabs() as { tabs: TabData[] };
const [activeTab, setActiveTab] = useState("ssh-tools");
const [activeTab, setActiveTab] = useState(initialTab || "ssh-tools");
// Update active tab when initialTab changes
useEffect(() => {
if (initialTab && isOpen) {
setActiveTab(initialTab);
}
}, [initialTab, isOpen]);
// Call onTabChange when active tab changes
const handleTabChange = (tab: string) => {
setActiveTab(tab);
if (onTabChange) {
onTabChange();
}
};
// SSH Tools state
const [isRecording, setIsRecording] = useState(false);
const [selectedTabIds, setSelectedTabIds] = useState<number[]>([]);
const [rightClickCopyPaste, setRightClickCopyPaste] = useState<boolean>(
() => getCookie("rightClickCopyPaste") === "true",
);
// Snippets state
const [snippets, setSnippets] = useState<Snippet[]>([]);
@@ -92,6 +132,10 @@ export function SSHUtilitySidebar({
[],
);
// Command History state
const [searchQuery, setSearchQuery] = useState("");
const [selectedCommandIndex, setSelectedCommandIndex] = useState(0);
// Resize state
const [isResizing, setIsResizing] = useState(false);
const startXRef = React.useRef<number | null>(null);
@@ -99,6 +143,13 @@ export function SSHUtilitySidebar({
const terminalTabs = tabs.filter((tab: TabData) => tab.type === "terminal");
// Filter command history based on search query
const filteredCommands = searchQuery
? commandHistory.filter((cmd) =>
cmd.toLowerCase().includes(searchQuery.toLowerCase()),
)
: commandHistory;
// Initialize CSS variable on mount and when sidebar width changes
useEffect(() => {
document.documentElement.style.setProperty(
@@ -327,6 +378,7 @@ export function SSHUtilitySidebar({
const updateRightClickCopyPaste = (checked: boolean) => {
setCookie("rightClickCopyPaste", checked.toString());
setRightClickCopyPaste(checked);
};
// Snippets handlers
@@ -441,6 +493,33 @@ export function SSHUtilitySidebar({
toast.success(t("snippets.copySuccess", { name: snippet.name }));
};
// Command History handlers
const handleCommandSelect = (command: string) => {
if (onSelectCommand) {
onSelectCommand(command);
}
};
const handleCommandDelete = (command: string) => {
if (onDeleteCommand) {
confirmWithToast(
t("commandHistory.deleteConfirmDescription", {
defaultValue: `Delete "${command}" from history?`,
command,
}),
() => {
onDeleteCommand(command);
toast.success(
t("commandHistory.deleteSuccess", {
defaultValue: "Command deleted from history",
}),
);
},
"destructive",
);
}
};
return (
<>
{isOpen && (
@@ -482,14 +561,17 @@ export function SSHUtilitySidebar({
</SidebarHeader>
<Separator className="p-0.25" />
<SidebarContent className="p-4">
<Tabs value={activeTab} onValueChange={setActiveTab}>
<TabsList className="w-full grid grid-cols-2 mb-4">
<Tabs value={activeTab} onValueChange={handleTabChange}>
<TabsList className="w-full grid grid-cols-3 mb-4">
<TabsTrigger value="ssh-tools">
{t("sshTools.title")}
</TabsTrigger>
<TabsTrigger value="snippets">
{t("snippets.title")}
</TabsTrigger>
<TabsTrigger value="command-history">
{t("commandHistory.title", { defaultValue: "History" })}
</TabsTrigger>
</TabsList>
<TabsContent value="ssh-tools" className="space-y-4">
@@ -577,9 +659,7 @@ export function SSHUtilitySidebar({
<Checkbox
id="enable-copy-paste"
onCheckedChange={updateRightClickCopyPaste}
defaultChecked={
getCookie("rightClickCopyPaste") === "true"
}
checked={rightClickCopyPaste}
/>
<label
htmlFor="enable-copy-paste"
@@ -763,6 +843,129 @@ export function SSHUtilitySidebar({
</TooltipProvider>
)}
</TabsContent>
<TabsContent value="command-history" className="space-y-4">
<div className="space-y-2">
<div className="relative">
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" />
<Input
placeholder={t("commandHistory.searchPlaceholder", {
defaultValue: "Search commands...",
})}
value={searchQuery}
onChange={(e) => {
setSearchQuery(e.target.value);
setSelectedCommandIndex(0);
}}
className="pl-10 pr-10"
/>
{searchQuery && (
<Button
variant="ghost"
size="sm"
className="absolute right-1 top-1/2 transform -translate-y-1/2 h-7 w-7 p-0"
onClick={() => setSearchQuery("")}
>
<X className="h-4 w-4" />
</Button>
)}
</div>
</div>
<div className="flex-1 overflow-hidden">
{isHistoryLoading ? (
<div className="flex flex-row items-center text-muted-foreground text-sm animate-pulse py-8">
<Loader2 className="animate-spin mr-2" size={16} />
<span>
{t("commandHistory.loading", {
defaultValue: "Loading history...",
})}
</span>
</div>
) : filteredCommands.length === 0 ? (
<div className="text-center text-muted-foreground py-8">
{searchQuery ? (
<>
<Search className="h-12 w-12 mb-2 opacity-20 mx-auto" />
<p className="mb-2 font-medium">
{t("commandHistory.noResults", {
defaultValue: "No commands found",
})}
</p>
<p className="text-sm">
{t("commandHistory.noResultsHint", {
defaultValue: `No commands matching "${searchQuery}"`,
query: searchQuery,
})}
</p>
</>
) : (
<>
<p className="mb-2 font-medium">
{t("commandHistory.empty", {
defaultValue: "No command history yet",
})}
</p>
<p className="text-sm">
{t("commandHistory.emptyHint", {
defaultValue:
"Execute commands to build your history",
})}
</p>
</>
)}
</div>
) : (
<div className="space-y-2 overflow-y-auto max-h-[calc(100vh-300px)]">
{filteredCommands.map((command, index) => (
<div
key={index}
className="bg-dark-bg border-2 border-dark-border rounded-md px-3 py-2.5 hover:bg-dark-hover-alt hover:border-blue-400/50 transition-all duration-200 group"
>
<div className="flex items-center justify-between gap-2">
<span
className="flex-1 font-mono text-sm cursor-pointer text-white"
onClick={() => handleCommandSelect(command)}
>
{command}
</span>
{onDeleteCommand && (
<Button
variant="ghost"
size="sm"
className="h-6 w-6 p-0 opacity-0 group-hover:opacity-100 hover:bg-red-500/20 hover:text-red-400"
onClick={(e) => {
e.stopPropagation();
handleCommandDelete(command);
}}
title={t("commandHistory.deleteTooltip", {
defaultValue: "Delete command",
})}
>
<Trash2 className="h-3.5 w-3.5" />
</Button>
)}
</div>
</div>
))}
</div>
)}
</div>
<Separator />
<div className="text-xs text-muted-foreground">
<span>
{filteredCommands.length}{" "}
{t("commandHistory.commandCount", {
defaultValue:
filteredCommands.length !== 1
? "commands"
: "command",
})}
</span>
</div>
</TabsContent>
</Tabs>
</SidebarContent>
{isOpen && (

15
src/ui/desktop/authentication/Auth.tsx
View File

@@ -847,7 +847,7 @@ export function Auth({
<div className="w-full h-full flex flex-col md:flex-row">
{/* Left Side - Brand Showcase */}
<div
className="hidden md:flex md:w-2/5 items-center justify-center relative"
className="hidden md:flex md:w-2/5 items-center justify-center relative border-r-2 border-bg-border-dark"
style={{
background: "#0e0e10",
backgroundImage: `repeating-linear-gradient(
@@ -871,21 +871,14 @@ export function Auth({
TERMIX
</div>
<div className="text-lg text-muted-foreground tracking-widest font-light">
{t("auth.tagline") || "SSH TERMINAL MANAGER"}
</div>
<div className="mt-8 text-sm text-muted-foreground/80 max-w-md">
{t("auth.description") ||
"Secure, powerful, and intuitive SSH connection management"}
{t("auth.tagline")}
</div>
</div>
</div>
{/* Right Side - Auth Form */}
<div className="flex-1 flex items-center justify-center p-6 md:p-12 bg-background overflow-y-auto">
<div
className="w-full max-w-md backdrop-blur-sm bg-card/50 rounded-2xl p-8 shadow-xl border-2 border-dark-border animate-in fade-in slide-in-from-bottom-4 duration-500"
style={{ maxHeight: "calc(100vh - 3rem)" }}
>
<div className="flex-1 flex p-6 md:p-12 bg-background overflow-y-auto">
<div className="m-auto w-full max-w-md backdrop-blur-sm bg-card/50 rounded-2xl p-8 shadow-xl border-2 border-dark-border animate-in fade-in slide-in-from-bottom-4 duration-500 flex flex-col">
{isInElectronWebView() && !webviewAuthSuccess && (
<Alert className="mb-4 border-blue-500 bg-blue-500/10">
<Monitor className="h-4 w-4" />

5
src/ui/desktop/authentication/ElectronLoginForm.tsx
View File

@@ -25,6 +25,11 @@ export function ElectronLoginForm({
const [currentUrl, setCurrentUrl] = useState(serverUrl);
const hasLoadedOnce = useRef(false);
useEffect(() => {
// Clear any existing token to prevent login loops with expired tokens
localStorage.removeItem("jwt");
}, []);
useEffect(() => {
const handleMessage = async (event: MessageEvent) => {
try {

85
src/ui/desktop/contexts/CommandHistoryContext.tsx Normal file
View File

@@ -0,0 +1,85 @@
import React, {
createContext,
useContext,
useState,
useCallback,
ReactNode,
} from "react";
interface CommandHistoryContextType {
commandHistory: string[];
isLoading: boolean;
setCommandHistory: (history: string[]) => void;
setIsLoading: (loading: boolean) => void;
onSelectCommand?: (command: string) => void;
setOnSelectCommand: (callback: (command: string) => void) => void;
onDeleteCommand?: (command: string) => void;
setOnDeleteCommand: (callback: (command: string) => void) => void;
openCommandHistory: () => void;
setOpenCommandHistory: (callback: () => void) => void;
}
const CommandHistoryContext = createContext<
CommandHistoryContextType | undefined
>(undefined);
export function CommandHistoryProvider({ children }: { children: ReactNode }) {
const [commandHistory, setCommandHistory] = useState<string[]>([]);
const [isLoading, setIsLoading] = useState(false);
const [onSelectCommand, setOnSelectCommand] = useState<
((command: string) => void) | undefined
>(undefined);
const [onDeleteCommand, setOnDeleteCommand] = useState<
((command: string) => void) | undefined
>(undefined);
const [openCommandHistory, setOpenCommandHistory] = useState<
(() => void) | undefined
>(() => () => {});
const handleSetOnSelectCommand = useCallback(
(callback: (command: string) => void) => {
setOnSelectCommand(() => callback);
},
[],
);
const handleSetOnDeleteCommand = useCallback(
(callback: (command: string) => void) => {
setOnDeleteCommand(() => callback);
},
[],
);
const handleSetOpenCommandHistory = useCallback((callback: () => void) => {
setOpenCommandHistory(() => callback);
}, []);
return (
<CommandHistoryContext.Provider
value={{
commandHistory,
isLoading,
setCommandHistory,
setIsLoading,
onSelectCommand,
setOnSelectCommand: handleSetOnSelectCommand,
onDeleteCommand,
setOnDeleteCommand: handleSetOnDeleteCommand,
openCommandHistory: openCommandHistory || (() => {}),
setOpenCommandHistory: handleSetOpenCommandHistory,
}}
>
{children}
</CommandHistoryContext.Provider>
);
}
export function useCommandHistory() {
const context = useContext(CommandHistoryContext);
if (context === undefined) {
throw new Error(
"useCommandHistory must be used within a CommandHistoryProvider",
);
}
return context;
}

11
src/ui/desktop/navigation/LeftSidebar.tsx
View File

@@ -247,6 +247,9 @@ export function LeftSidebar({
const handleCredentialsChanged = () => {
fetchHosts();
};
const handleFoldersChanged = () => {
fetchFolderMetadata();
};
window.addEventListener(
"ssh-hosts:changed",
handleHostsChanged as EventListener,
@@ -255,6 +258,10 @@ export function LeftSidebar({
"credentials:changed",
handleCredentialsChanged as EventListener,
);
window.addEventListener(
"folders:changed",
handleFoldersChanged as EventListener,
);
return () => {
window.removeEventListener(
"ssh-hosts:changed",
@@ -264,6 +271,10 @@ export function LeftSidebar({
"credentials:changed",
handleCredentialsChanged as EventListener,
);
window.removeEventListener(
"folders:changed",
handleFoldersChanged as EventListener,
);
};
}, [fetchHosts, fetchFolderMetadata]);

22
src/ui/desktop/navigation/TopNavbar.tsx
View File

@@ -8,6 +8,7 @@ import { useTabs } from "@/ui/desktop/navigation/tabs/TabContext.tsx";
import { useTranslation } from "react-i18next";
import { TabDropdown } from "@/ui/desktop/navigation/tabs/TabDropdown.tsx";
import { SSHUtilitySidebar } from "@/ui/desktop/apps/tools/SSHUtilitySidebar.tsx";
import { useCommandHistory } from "@/ui/desktop/contexts/CommandHistoryContext.tsx";
interface TabData {
id: number;
@@ -55,11 +56,13 @@ export function TopNavbar({
const leftPosition =
state === "collapsed" ? "26px" : "calc(var(--sidebar-width) + 8px)";
const { t } = useTranslation();
const commandHistory = useCommandHistory();
const [toolsSidebarOpen, setToolsSidebarOpen] = useState(false);
const [commandHistoryTabActive, setCommandHistoryTabActive] = useState(false);
const [rightSidebarWidth, setRightSidebarWidth] = useState<number>(() => {
const saved = localStorage.getItem("rightSidebarWidth");
return saved !== null ? parseInt(saved, 10) : 400;
return saved !== null ? parseInt(saved, 10) : 350;
});
React.useEffect(() => {
@@ -72,6 +75,14 @@ export function TopNavbar({
}
}, [toolsSidebarOpen, rightSidebarWidth, onRightSidebarStateChange]);
// Register function to open command history sidebar
React.useEffect(() => {
commandHistory.setOpenCommandHistory(() => {
setToolsSidebarOpen(true);
setCommandHistoryTabActive(true);
});
}, [commandHistory]);
const rightPosition = toolsSidebarOpen
? `calc(var(--right-sidebar-width, ${rightSidebarWidth}px) + 8px)`
: "17px";
@@ -359,8 +370,7 @@ export function TopNavbar({
tab.type === "user_profile") &&
isSplitScreenActive);
const isHome = tab.type === "home";
const disableClose =
(isSplitScreenActive && isActive) || isHome;
const disableClose = (isSplitScreenActive && isActive) || isHome;
const isDraggingThisTab = dragState.draggedIndex === index;
const isTheDraggedTab = tab.id === dragState.draggedId;
@@ -536,6 +546,12 @@ export function TopNavbar({
onSnippetExecute={handleSnippetExecute}
sidebarWidth={rightSidebarWidth}
setSidebarWidth={setRightSidebarWidth}
commandHistory={commandHistory.commandHistory}
onSelectCommand={commandHistory.onSelectCommand}
onDeleteCommand={commandHistory.onDeleteCommand}
isHistoryLoading={commandHistory.isLoading}
initialTab={commandHistoryTabActive ? "command-history" : undefined}
onTabChange={() => setCommandHistoryTabActive(false)}
/>
</div>
);

78
src/ui/main-axios.ts
View File

@@ -137,9 +137,64 @@ function getLoggerForService(serviceName: string) {
}
}
// Cache for Electron settings
const electronSettingsCache = new Map<string, string>();
// Load settings from Electron IPC on startup
if (isElectron()) {
(async () => {
try {
const electronAPI = (
window as Window &
typeof globalThis & {
electronAPI?: any;
}
).electronAPI;
if (electronAPI?.getSetting) {
// Preload common settings
const settingsToLoad = ["rightClickCopyPaste", "jwt"];
for (const key of settingsToLoad) {
const value = await electronAPI.getSetting(key);
if (value !== null && value !== undefined) {
electronSettingsCache.set(key, value);
localStorage.setItem(key, value); // Sync to localStorage
}
}
}
} catch (error) {
console.error("[Electron] Failed to load settings cache:", error);
}
})();
}
export function setCookie(name: string, value: string, days = 7): void {
if (isElectron()) {
localStorage.setItem(name, value);
try {
// Update cache
electronSettingsCache.set(name, value);
// Set in localStorage
localStorage.setItem(name, value);
// Persist to file system via Electron IPC
const electronAPI = (
window as Window &
typeof globalThis & {
electronAPI?: any;
}
).electronAPI;
if (electronAPI?.setSetting) {
electronAPI.setSetting(name, value).catch((err: Error) => {
console.error(`[Electron] Failed to persist setting ${name}:`, err);
});
}
console.log(`[Electron] Set setting: ${name} = ${value}`);
} catch (error) {
console.error(`[Electron] Failed to set setting: ${name}`, error);
}
} else {
const expires = new Date(Date.now() + days * 864e5).toUTCString();
document.cookie = `${name}=${encodeURIComponent(value)}; expires=${expires}; path=/`;
@@ -148,8 +203,23 @@ export function setCookie(name: string, value: string, days = 7): void {
export function getCookie(name: string): string | undefined {
if (isElectron()) {
const token = localStorage.getItem(name) || undefined;
return token;
try {
// Try cache first
if (electronSettingsCache.has(name)) {
return electronSettingsCache.get(name);
}
// Fallback to localStorage
const token = localStorage.getItem(name) || undefined;
if (token) {
electronSettingsCache.set(name, token);
}
console.log(`[Electron] Get setting: ${name} = ${token}`);
return token;
} catch (error) {
console.error(`[Electron] Failed to get setting: ${name}`, error);
return undefined;
}
} else {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
@@ -802,6 +872,7 @@ export async function createSSHHost(hostData: SSHHostData): Promise<SSHHost> {
enableFileManager: Boolean(hostData.enableFileManager),
defaultPath: hostData.defaultPath || "/",
tunnelConnections: hostData.tunnelConnections || [],
jumpHosts: hostData.jumpHosts || [],
statsConfig: hostData.statsConfig
? typeof hostData.statsConfig === "string"
? hostData.statsConfig
@@ -866,6 +937,7 @@ export async function updateSSHHost(
enableFileManager: Boolean(hostData.enableFileManager),
defaultPath: hostData.defaultPath || "/",
tunnelConnections: hostData.tunnelConnections || [],
jumpHosts: hostData.jumpHosts || [],
statsConfig: hostData.statsConfig
? typeof hostData.statsConfig === "string"
? hostData.statsConfig