diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 3e95562..6b73721 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -32,8 +32,8 @@ jobs:
       - name: Install dependencies
         run: npm ci
 
-      - name: Run tests
-        run: npm test
+      - name: Run tests with coverage
+        run: npm run test:coverage
 
       - name: Run SonarQube scan
         if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name == github.repository
diff --git a/.gitignore b/.gitignore
index 760b222..b780b2e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,3 +13,4 @@ native/rdp-spike/*.ppm
 # FreeRDP static-build working dirs (see build-freerdp-static.sh)
 native/rdp-spike/.freerdp-src/
 native/rdp-spike/.freerdp-static/
+coverage/
diff --git a/native/rdp-spike/sidecar.c b/native/rdp-spike/sidecar.c
index 2f87d65..d632bd7 100644
--- a/native/rdp-spike/sidecar.c
+++ b/native/rdp-spike/sidecar.c
@@ -25,15 +25,23 @@
  * This milestone is output-only (read-only desktop view). Input injection
  * (mouse/keyboard over stdin) is the next milestone.
  *
- * Usage: rdp-sidecar <host> <port> <user> <password> [width] [height]
+ * Usage: rdp-sidecar <host> <port> <user> [width] [height]
+ * The password is read as the first line of stdin so it never appears in the
+ * process list.
  */
 
 #include <stdio.h>
 #include <stdlib.h>
 #include <string.h>
 
+#ifdef _WIN32
+#include <io.h>
+#include <fcntl.h>
+#endif
+
 #include <freerdp/freerdp.h>
 #include <freerdp/client.h>
+#include <freerdp/error.h>
 #include <freerdp/gdi/gdi.h>
 #include <freerdp/codec/color.h>
 #include <winpr/synch.h>
@@ -151,6 +159,88 @@ static BOOL sidecar_end_paint(rdpContext* context)
 	return TRUE;
 }
 
+/* Certificate handling. The default client callbacks
+ * (client_cli_verify_certificate_ex) are interactive: they print the cert
+ * details to *stdout* — corrupting the binary frame channel — and then read a
+ * Y/N answer from *stdin*, which rdp.ts closes right after the password. The
+ * EOF rejects the certificate, so any host not already in
+ * ~/.config/freerdp/known_hosts2 failed to connect. This was the "works some
+ * of the time" bug: only hosts trusted during earlier interactive testing
+ * connected, and they broke again whenever Windows rotated its self-signed
+ * cert.
+ *
+ * Windows RDP hosts almost universally present self-signed certs, so we
+ * accept for the session (return 2 = temporary trust: nothing persisted, no
+ * stale known_hosts state to go bad later) and log the fingerprint to stderr.
+ * Same trust-on-use posture as the app's SSH host-key handling; an in-app
+ * verification UI is a later milestone for both. */
+static DWORD sidecar_verify_certificate(freerdp* instance, const char* host, UINT16 port,
+                                        const char* common_name, const char* subject,
+                                        const char* issuer, const char* fingerprint, DWORD flags)
+{
+	(void)instance;
+	(void)subject;
+	(void)issuer;
+	fprintf(stderr, "[sidecar] accepting certificate for %s:%u (CN=%s)\n", host, (unsigned)port,
+	        common_name ? common_name : "?");
+	if (fingerprint && !(flags & VERIFY_CERT_FLAG_FP_IS_PEM))
+		fprintf(stderr, "[sidecar] fingerprint: %s\n", fingerprint);
+	return 2; /* trust for this session only */
+}
+
+static DWORD sidecar_verify_changed_certificate(freerdp* instance, const char* host, UINT16 port,
+                                                const char* common_name, const char* subject,
+                                                const char* issuer, const char* new_fingerprint,
+                                                const char* old_subject, const char* old_issuer,
+                                                const char* old_fingerprint, DWORD flags)
+{
+	(void)old_subject;
+	(void)old_issuer;
+	(void)old_fingerprint;
+	return sidecar_verify_certificate(instance, host, port, common_name, subject, issuer,
+	                                  new_fingerprint, flags);
+}
+
+/* Map the common connect failures to messages a person can act on. rdp.ts
+ * surfaces the last "[sidecar] error: ..." stderr line in the RDP tab, so this
+ * is what the user sees when a connect fails. */
+static const char* connect_error_message(UINT32 code)
+{
+	switch (code)
+	{
+		case FREERDP_ERROR_CONNECT_LOGON_FAILURE:
+		case FREERDP_ERROR_AUTHENTICATION_FAILED:
+			return "Sign-in failed: the username or password is incorrect.";
+		case FREERDP_ERROR_CONNECT_ACCOUNT_LOCKED_OUT:
+			return "Sign-in failed: the account is locked out.";
+		case FREERDP_ERROR_CONNECT_ACCOUNT_DISABLED:
+			return "Sign-in failed: the account is disabled.";
+		case FREERDP_ERROR_CONNECT_ACCOUNT_EXPIRED:
+			return "Sign-in failed: the account has expired.";
+		case FREERDP_ERROR_CONNECT_ACCOUNT_RESTRICTION:
+			return "Sign-in failed: an account restriction blocked the logon.";
+		case FREERDP_ERROR_CONNECT_PASSWORD_EXPIRED:
+		case FREERDP_ERROR_CONNECT_PASSWORD_CERTAINLY_EXPIRED:
+			return "Sign-in failed: the password has expired and must be changed.";
+		case FREERDP_ERROR_CONNECT_PASSWORD_MUST_CHANGE:
+			return "Sign-in failed: the password must be changed before signing in.";
+		case FREERDP_ERROR_CONNECT_FAILED:
+		case FREERDP_ERROR_CONNECT_TRANSPORT_FAILED:
+			return "Could not reach the host. Check the address, port, and that Remote Desktop is enabled.";
+		case FREERDP_ERROR_DNS_NAME_NOT_FOUND:
+		case FREERDP_ERROR_DNS_ERROR:
+			return "Could not resolve the hostname. Check the address.";
+		case FREERDP_ERROR_TLS_CONNECT_FAILED:
+			return "TLS negotiation with the host failed.";
+		case FREERDP_ERROR_SECURITY_NEGO_CONNECT_FAILED:
+			return "Security negotiation failed. The host may require NLA settings this client did not offer.";
+		case FREERDP_ERROR_CONNECT_CANCELLED:
+			return "The connection was cancelled.";
+		default:
+			return NULL;
+	}
+}
+
 static BOOL sidecar_post_connect(freerdp* instance)
 {
 	if (!gdi_init(instance, PIXEL_FORMAT_BGRA32))
@@ -164,6 +254,10 @@ static BOOL sidecar_client_new(freerdp* instance, rdpContext* context)
 {
 	(void)context;
 	instance->PostConnect = sidecar_post_connect;
+	/* Replace the interactive CLI cert prompts (stdout/stdin) — see
+	 * sidecar_verify_certificate above. */
+	instance->VerifyCertificateEx = sidecar_verify_certificate;
+	instance->VerifyChangedCertificateEx = sidecar_verify_changed_certificate;
 	return TRUE;
 }
 
@@ -208,12 +302,32 @@ int main(int argc, char* argv[])
 		return 2;
 	}
 
+#ifdef _WIN32
+	/* stdout defaults to text mode on Windows and translates \n -> \r\n,
+	 * which corrupts the binary frame stream. */
+	_setmode(_fileno(stdout), _O_BINARY);
+#endif
+
 	const char* host = argv[1];
 	const UINT32 port = (UINT32)strtoul(argv[2], NULL, 10);
 	const char* user = argv[3];
 	const UINT32 width = (argc >= 5) ? (UINT32)strtoul(argv[4], NULL, 10) : 1280;
 	const UINT32 height = (argc >= 6) ? (UINT32)strtoul(argv[5], NULL, 10) : 800;
 
+	/* "DOMAIN\user" must go into separate Domain/Username settings for NLA;
+	 * xfreerdp does this split in its command-line layer, so we mirror it. UPN
+	 * form ("user@domain") is understood natively and passes through as-is. */
+	const char* domain = NULL;
+	char userbuf[256] = { 0 };
+	const char* backslash = strchr(user, '\\');
+	if (backslash && backslash != user && (size_t)(backslash - user) < sizeof(userbuf))
+	{
+		memcpy(userbuf, user, (size_t)(backslash - user));
+		userbuf[backslash - user] = '\0';
+		domain = userbuf;
+		user = backslash + 1;
+	}
+
 	/* Read password from stdin to avoid exposing it in process list */
 	char pass[256];
 	if (!fgets(pass, sizeof(pass), stdin)) {
@@ -240,18 +354,45 @@ int main(int argc, char* argv[])
 	freerdp_settings_set_string(settings, FreeRDP_ServerHostname, host);
 	freerdp_settings_set_uint32(settings, FreeRDP_ServerPort, port);
 	freerdp_settings_set_string(settings, FreeRDP_Username, user);
+	if (domain)
+		freerdp_settings_set_string(settings, FreeRDP_Domain, domain);
 	freerdp_settings_set_string(settings, FreeRDP_Password, pass);
 	freerdp_settings_set_bool(settings, FreeRDP_IgnoreCertificate, FALSE);
 	freerdp_settings_set_uint32(settings, FreeRDP_DesktopWidth, width);
 	freerdp_settings_set_uint32(settings, FreeRDP_DesktopHeight, height);
 	freerdp_settings_set_uint32(settings, FreeRDP_ColorDepth, 32);
 
+	/* The static FreeRDP we ship is trimmed: channel addins (rdpgfx, rdpdr,
+	 * rdpsnd, cliprdr, ...) are not built in. FreeRDP's defaults still enable
+	 * the features backed by those channels, so freerdp_client_load_addins
+	 * tries to load them, fails, and pre-connect aborts before a TCP
+	 * connection is even attempted. Turn every channel-backed feature off —
+	 * this viewer is a plain GDI framebuffer and needs none of them. */
+	freerdp_settings_set_bool(settings, FreeRDP_SupportGraphicsPipeline, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_NetworkAutoDetect, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_SupportHeartbeatPdu, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_SupportMultitransport, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_DeviceRedirection, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_RedirectClipboard, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_AudioPlayback, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_AudioCapture, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_SupportDisplayControl, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_SupportGeometryTracking, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_SupportVideoOptimized, FALSE);
+	freerdp_settings_set_bool(settings, FreeRDP_MultiTouchInput, FALSE);
+
 	freerdp* instance = context->instance;
 
 	int rc = 0;
 	if (!freerdp_connect(instance))
 	{
-		fprintf(stderr, "[sidecar] connect failed err=0x%08X\n", freerdp_get_last_error(context));
+		const UINT32 err = freerdp_get_last_error(context);
+		const char* friendly = connect_error_message(err);
+		if (friendly)
+			fprintf(stderr, "[sidecar] error: %s\n", friendly);
+		else
+			fprintf(stderr, "[sidecar] error: connect failed — %s (0x%08X)\n",
+			        freerdp_get_last_error_string(err), err);
 		rc = 1;
 		goto cleanup;
 	}
@@ -279,6 +420,24 @@ int main(int argc, char* argv[])
 			break;
 	}
 
+	/* If the server ended the session, surface why instead of a silent drop.
+	 * A deliberate sign-out/disconnect is a normal end; everything else
+	 * (kicked by another connection, idle timeout, license/protocol errors)
+	 * exits nonzero so rdp.ts shows the reason in the tab. */
+	{
+		const UINT32 info = freerdp_error_info(instance);
+		const BOOL normalEnd = info == ERRINFO_SUCCESS ||
+		                       info == ERRINFO_RPC_INITIATED_DISCONNECT ||
+		                       info == ERRINFO_RPC_INITIATED_LOGOFF ||
+		                       info == ERRINFO_LOGOFF_BY_USER;
+		if (!normalEnd)
+		{
+			fprintf(stderr, "[sidecar] error: session ended by server — %s\n",
+			        freerdp_get_error_info_string(info));
+			rc = 1;
+		}
+	}
+
 	freerdp_disconnect(instance);
 
 cleanup:
diff --git a/package-lock.json b/package-lock.json
index 7e745cd..6de13f4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -52,6 +52,7 @@
         "@types/react-dom": "^18.3.0",
         "@types/ssh2": "^1.15.1",
         "@vitejs/plugin-react": "^4.3.1",
+        "@vitest/coverage-v8": "^4.1.5",
         "autoprefixer": "^10.4.19",
         "electron": "^31.7.7",
         "electron-builder": "^24.13.3",
@@ -446,6 +447,16 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@bcoe/v8-coverage": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-1.0.2.tgz",
+      "integrity": "sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@bramus/specificity": {
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/@bramus/specificity/-/specificity-2.4.2.tgz",
@@ -3119,6 +3130,37 @@
         "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
       }
     },
+    "node_modules/@vitest/coverage-v8": {
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-4.1.5.tgz",
+      "integrity": "sha512-38C0/Ddb7HcRG0Z4/DUem8x57d2p9jYgp18mkaYswEOQBGsI1CG4f/hjm0ZCeaJfWhSZ4k7jgs29V1Zom7Ki9A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@bcoe/v8-coverage": "^1.0.2",
+        "@vitest/utils": "4.1.5",
+        "ast-v8-to-istanbul": "^1.0.0",
+        "istanbul-lib-coverage": "^3.2.2",
+        "istanbul-lib-report": "^3.0.1",
+        "istanbul-reports": "^3.2.0",
+        "magicast": "^0.5.2",
+        "obug": "^2.1.1",
+        "std-env": "^4.0.0-rc.1",
+        "tinyrainbow": "^3.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@vitest/browser": "4.1.5",
+        "vitest": "4.1.5"
+      },
+      "peerDependenciesMeta": {
+        "@vitest/browser": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@vitest/expect": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-4.1.5.tgz",
@@ -3681,6 +3723,25 @@
         "node": ">=12"
       }
     },
+    "node_modules/ast-v8-to-istanbul": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-1.0.4.tgz",
+      "integrity": "sha512-0bC0/4bTSrnwdhU3IsZDwEdojvuPrSg59OYZfKsLRtJZ0u8VBx9DebfqqG8bRdCC0I7vjgxmPi41P0lpkhJHtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/trace-mapping": "^0.3.31",
+        "estree-walker": "^3.0.3",
+        "js-tokens": "^10.0.0"
+      }
+    },
+    "node_modules/ast-v8-to-istanbul/node_modules/js-tokens": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-10.0.0.tgz",
+      "integrity": "sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/astral-regex": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
@@ -6286,6 +6347,13 @@
         "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
+    "node_modules/html-escaper": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
+      "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/http-cache-semantics": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.2.0.tgz",
@@ -6614,6 +6682,45 @@
       "integrity": "sha512-Yljz7ffyPbrLpLngrMtZ7NduUgVvi6wG9RJ9IUcyCd59YQ911PBJphODUcbOVbqYfxe1wuYf/LJ8PauMRwsM/g==",
       "license": "MIT"
     },
+    "node_modules/istanbul-lib-coverage": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
+      "integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/istanbul-lib-report": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
+      "integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "istanbul-lib-coverage": "^3.0.0",
+        "make-dir": "^4.0.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/istanbul-reports": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.2.0.tgz",
+      "integrity": "sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "html-escaper": "^2.0.0",
+        "istanbul-lib-report": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/jackspeak": {
       "version": "3.4.3",
       "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
@@ -7375,6 +7482,47 @@
         "@jridgewell/sourcemap-codec": "^1.5.5"
       }
     },
+    "node_modules/magicast": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/magicast/-/magicast-0.5.3.tgz",
+      "integrity": "sha512-pVKE4UdSQ7DvHzivsCIFx2BJn1mHG6KsyrFcaxFx6tONdneEuThrDx0Cj3AMg58KyN4pzYT+LHOotxDQDjNvkw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.29.3",
+        "@babel/types": "^7.29.0",
+        "source-map-js": "^1.2.1"
+      }
+    },
+    "node_modules/make-dir": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
+      "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "semver": "^7.5.3"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/make-dir/node_modules/semver": {
+      "version": "7.8.5",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.5.tgz",
+      "integrity": "sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/matcher": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/matcher/-/matcher-3.0.0.tgz",
diff --git a/package.json b/package.json
index 1b85a5c..ee0410c 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,8 @@
     "pack": "electron-vite build && electron-builder --dir",
     "dist": "electron-vite build && electron-builder",
     "test": "vitest run",
-    "test:watch": "vitest"
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage"
   },
   "dependencies": {
     "@codemirror/lang-css": "^6.3.1",
@@ -65,6 +66,7 @@
     "@types/react-dom": "^18.3.0",
     "@types/ssh2": "^1.15.1",
     "@vitejs/plugin-react": "^4.3.1",
+    "@vitest/coverage-v8": "^4.1.5",
     "autoprefixer": "^10.4.19",
     "electron": "^31.7.7",
     "electron-builder": "^24.13.3",
diff --git a/sonar-project.properties b/sonar-project.properties
index ff697ea..71ad788 100644
--- a/sonar-project.properties
+++ b/sonar-project.properties
@@ -3,7 +3,9 @@ sonar.projectName=noxed
 
 sonar.sources=src
 sonar.tests=src
-sonar.test.inclusions=src/**/__tests__/**/*.test.ts
-sonar.exclusions=src/**/__tests__/**/*.test.ts,src/preload/index.d.ts
+sonar.test.inclusions=src/**/__tests__/**/*.test.ts,src/**/__tests__/**/*.test.tsx
+sonar.exclusions=src/**/__tests__/**,src/preload/index.d.ts
+
+sonar.javascript.lcov.reportPaths=coverage/lcov.info
 
 sonar.sourceEncoding=UTF-8
diff --git a/src/main/index.ts b/src/main/index.ts
index 65f69a5..ed78a7d 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -10,8 +10,8 @@ process.on('uncaughtException', (err) => {
   console.error('[uncaughtException]', err)
 })
 
-import { join } from 'path'
-import { readFileSync } from 'fs'
+import { join } from 'node:path'
+import { readFileSync } from 'node:fs'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 import { registerSshHandlers, disposeSshStreamsForSender } from './ipc/ssh'
 import { registerSftpHandlers, disposeSftpClientsForSender } from './ipc/sftp'
diff --git a/src/main/ipc/__tests__/database.test.ts b/src/main/ipc/__tests__/database.test.ts
new file mode 100644
index 0000000..c92e3e4
--- /dev/null
+++ b/src/main/ipc/__tests__/database.test.ts
@@ -0,0 +1,84 @@
+import { describe, it, expect, vi, type Mock } from 'vitest'
+
+vi.mock('electron', () => ({
+  ipcMain: { handle: vi.fn(), on: vi.fn() },
+}))
+vi.mock('pg', () => {
+  const query = vi.fn().mockResolvedValue({ fields: [{ name: 'x' }], rows: [{ x: 1 }], rowCount: 1 })
+  const connect = vi.fn().mockResolvedValue({ release: vi.fn() })
+  // Regular function so `new Pool(...)` works (arrows are not constructible)
+  const PoolCtor = vi.fn(function Pool() {
+    return { query, connect, end: vi.fn(), on: vi.fn() }
+  })
+  return { Pool: PoolCtor, __query: query }
+})
+vi.mock('mysql2/promise', () => ({
+  default: { createPool: vi.fn() },
+}))
+
+import { ipcMain } from 'electron'
+import * as pg from 'pg'
+import { registerDatabaseHandlers } from '../database'
+
+registerDatabaseHandlers()
+
+type Handler = (...args: unknown[]) => unknown
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+const event = { sender: { id: 1 } }
+
+async function connectPg(): Promise<string> {
+  return (await handler('db:connect')(event, {
+    dbType: 'postgresql', host: 'db.example.com', port: 5432,
+    username: 'u', password: 'p', database: 'appdb',
+  })) as string
+}
+
+describe('db:query parameter validation', () => {
+  it('forwards scalar bind parameters to the driver', async () => {
+    const id = await connectPg()
+    await handler('db:query')(event, id, 'UPDATE "t" SET "a" = $1 WHERE "id" = $2', ['x', 7])
+    const pgQuery = (pg as unknown as { __query: Mock }).__query
+    expect(pgQuery).toHaveBeenCalledWith('UPDATE "t" SET "a" = $1 WHERE "id" = $2', ['x', 7])
+  })
+
+  it('accepts omitted and null params', async () => {
+    const id = await connectPg()
+    const result = (await handler('db:query')(event, id, 'SELECT 1')) as { rowCount: number }
+    expect(result.rowCount).toBe(1)
+    await handler('db:query')(event, id, 'SELECT 1', null)
+    const pgQuery = (pg as unknown as { __query: Mock }).__query
+    expect(pgQuery).toHaveBeenLastCalledWith('SELECT 1', undefined)
+  })
+
+  it('accepts null, boolean, and number parameter values', async () => {
+    const id = await connectPg()
+    await handler('db:query')(event, id, 'SELECT $1, $2, $3', [null, true, 3.5])
+    const pgQuery = (pg as unknown as { __query: Mock }).__query
+    expect(pgQuery).toHaveBeenLastCalledWith('SELECT $1, $2, $3', [null, true, 3.5])
+  })
+
+  it('rejects non-array params', async () => {
+    const id = await connectPg()
+    await expect(handler('db:query')(event, id, 'SELECT 1', 'nope')).rejects.toThrow('Invalid query parameters')
+  })
+
+  it('rejects non-scalar parameter values', async () => {
+    const id = await connectPg()
+    await expect(handler('db:query')(event, id, 'SELECT $1', [{ evil: true }]))
+      .rejects.toThrow('Query parameters must be scalar values')
+    await expect(handler('db:query')(event, id, 'SELECT $1', [undefined]))
+      .rejects.toThrow('Query parameters must be scalar values')
+  })
+
+  it('rejects oversized parameter arrays', async () => {
+    const id = await connectPg()
+    await expect(handler('db:query')(event, id, 'SELECT 1', Array(300).fill(1)))
+      .rejects.toThrow('Invalid query parameters')
+  })
+})
diff --git a/src/main/ipc/__tests__/docker.test.ts b/src/main/ipc/__tests__/docker.test.ts
index 7a52d41..0f95a78 100644
--- a/src/main/ipc/__tests__/docker.test.ts
+++ b/src/main/ipc/__tests__/docker.test.ts
@@ -1,4 +1,5 @@
-import { describe, it, expect, vi } from 'vitest'
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest'
+import { EventEmitter } from 'node:events'
 
 vi.mock('electron', () => ({
   ipcMain: { handle: vi.fn(), on: vi.fn() },
@@ -10,9 +11,30 @@ vi.mock('electron-store', () => ({
     set(key: string, value: unknown) { this.data.set(key, value) }
   },
 }))
+vi.mock('../sshClients', () => ({
+  connectSessionClient: vi.fn(),
+}))
+
+import { ipcMain } from 'electron'
+import { connectSessionClient } from '../sshClients'
+import {
+  parseJsonLines,
+  validateContainerRef,
+  validateContainerAction,
+  registerDockerHandlers,
+  disposeDockerSessionsForSender,
+} from '../docker'
+import { ValidationError, NotFoundError, OwnershipError, ConnectionError } from '../errors'
+
+registerDockerHandlers()
 
-import { parseJsonLines, validateContainerRef, validateContainerAction } from '../docker'
-import { ValidationError } from '../errors'
+type Handler = (...args: unknown[]) => unknown
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No handler registered for ${channel}`)
+  return call[1] as Handler
+}
 
 describe('parseJsonLines', () => {
   it('parses one JSON object per line', () => {
@@ -59,3 +81,246 @@ describe('validateContainerAction', () => {
     }
   })
 })
+
+// ── Handler-level tests (fake SSH connection + exec channels) ────────────────
+
+class FakeExecStream extends EventEmitter {
+  stderr = new EventEmitter()
+  close = vi.fn()
+}
+
+interface FakeSshClient extends EventEmitter {
+  exec: Mock
+}
+
+function fakeConn() {
+  const client = new EventEmitter() as FakeSshClient
+  client.exec = vi.fn()
+  return { client, dispose: vi.fn() }
+}
+
+interface FakeEvent {
+  sender: { id: number; isDestroyed: () => boolean; send: Mock }
+}
+
+let senderSeq = 500
+function makeEvent(): FakeEvent {
+  return { sender: { id: senderSeq++, isDestroyed: () => false, send: vi.fn() } }
+}
+
+async function connectDocker(event: FakeEvent = makeEvent()) {
+  const conn = fakeConn()
+  ;(connectSessionClient as Mock).mockResolvedValueOnce(conn)
+  const id = (await handler('docker:connect')(event, 'session-1')) as string
+  return { id, conn, event }
+}
+
+/** Sets up exec to hand back a fresh stream for each call and returns them in order. */
+function execYields(conn: ReturnType<typeof fakeConn>): FakeExecStream[] {
+  const streams: FakeExecStream[] = []
+  conn.client.exec.mockImplementation((_cmd: string, cb: (e: Error | null, s?: FakeExecStream) => void) => {
+    const stream = new FakeExecStream()
+    streams.push(stream)
+    cb(null, stream)
+  })
+  return streams
+}
+
+beforeEach(() => {
+  vi.spyOn(console, 'error').mockImplementation(() => {})
+})
+
+describe('docker:connect / docker:disconnect', () => {
+  it('rejects a non-string connection id', async () => {
+    await expect(handler('docker:connect')(makeEvent(), 42)).rejects.toBeInstanceOf(ValidationError)
+  })
+
+  it('creates a session and disposes it on disconnect', async () => {
+    const { id, conn, event } = await connectDocker()
+    handler('docker:disconnect')(event, id)
+    expect(conn.dispose).toHaveBeenCalled()
+    expect(() => handler('docker:disconnect')(event, id)).toThrow(NotFoundError)
+  })
+
+  it('enforces session ownership and id shape', async () => {
+    const { id } = await connectDocker()
+    expect(() => handler('docker:disconnect')(makeEvent(), id)).toThrow(OwnershipError)
+    expect(() => handler('docker:disconnect')(makeEvent(), 7)).toThrow(ValidationError)
+  })
+
+  it('disposes the session when the SSH connection closes', async () => {
+    const { id, conn, event } = await connectDocker()
+    conn.client.emit('close')
+    expect(conn.dispose).toHaveBeenCalled()
+    expect(() => handler('docker:disconnect')(event, id)).toThrow(NotFoundError)
+  })
+
+  it('disposeDockerSessionsForSender cleans up only that sender', async () => {
+    const mine = await connectDocker()
+    const other = await connectDocker()
+    disposeDockerSessionsForSender(mine.event.sender.id)
+    expect(mine.conn.dispose).toHaveBeenCalled()
+    expect(other.conn.dispose).not.toHaveBeenCalled()
+    handler('docker:disconnect')(other.event, other.id)
+  })
+})
+
+describe('docker exec-based handlers', () => {
+  it('lists containers by parsing json-lines stdout', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const pending = handler('docker:containers')(event, id) as Promise<unknown[]>
+    const stream = streams[0]
+    stream.emit('data', Buffer.from('{"ID":"abc","Names":"web"}\n'))
+    stream.emit('data', Buffer.from('{"ID":"def","Names":"db"}\n'))
+    stream.emit('close', 0)
+    await expect(pending).resolves.toEqual([
+      { ID: 'abc', Names: 'web' },
+      { ID: 'def', Names: 'db' },
+    ])
+    expect(conn.client.exec.mock.calls[0][0]).toContain('docker ps -a')
+  })
+
+  it('resolves stdout when the channel closes without an exit code but with output', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const pending = handler('docker:stats')(event, id) as Promise<unknown[]>
+    streams[0].emit('data', Buffer.from('{"CPUPerc":"1.0%"}\n'))
+    streams[0].emit('close', null)
+    await expect(pending).resolves.toEqual([{ CPUPerc: '1.0%' }])
+  })
+
+  it('maps exit code 127 to a missing-docker error', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const pending = handler('docker:images')(event, id)
+    streams[0].emit('close', 127)
+    await expect(pending).rejects.toThrow('Docker CLI not found on this host')
+  })
+
+  it('surfaces stderr on non-zero exit, falling back to the exit code', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const withStderr = handler('docker:containers')(event, id)
+    streams[0].stderr.emit('data', Buffer.from('permission denied\n'))
+    streams[0].emit('close', 1)
+    await expect(withStderr).rejects.toThrow('permission denied')
+
+    const bare = handler('docker:containers')(event, id)
+    streams[1].emit('close', 2)
+    await expect(bare).rejects.toThrow('Command failed (exit 2)')
+  })
+
+  it('rejects when exec itself fails or the stream errors', async () => {
+    const { id, conn, event } = await connectDocker()
+    conn.client.exec.mockImplementationOnce((_c: string, cb: (e: Error | null) => void) => cb(new Error('channel open failed')))
+    await expect(handler('docker:containers')(event, id)).rejects.toBeInstanceOf(ConnectionError)
+
+    const streams = execYields(conn)
+    const pending = handler('docker:containers')(event, id)
+    streams[0].emit('error', new Error('reset'))
+    await expect(pending).rejects.toBeInstanceOf(ConnectionError)
+  })
+
+  it('times out long-running commands', async () => {
+    vi.useFakeTimers()
+    try {
+      const { id, conn, event } = await connectDocker()
+      const streams = execYields(conn)
+      const pending = handler('docker:containers')(event, id)
+      vi.advanceTimersByTime(20_000)
+      await expect(pending).rejects.toThrow('Remote command timed out')
+      expect(streams[0].close).toHaveBeenCalled()
+    } finally {
+      vi.useRealTimers()
+    }
+  })
+
+  it('returns the first parsed object for docker:info, or null', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const withInfo = handler('docker:info')(event, id)
+    streams[0].emit('data', Buffer.from('{"ServerVersion":"27.0"}\n'))
+    streams[0].emit('close', 0)
+    await expect(withInfo).resolves.toEqual({ ServerVersion: '27.0' })
+
+    const empty = handler('docker:info')(event, id)
+    streams[1].emit('close', 0)
+    await expect(empty).resolves.toBeNull()
+  })
+
+  it('runs validated container actions, forcing rm', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const pending = handler('docker:action')(event, id, 'web-1', 'rm')
+    streams[0].emit('close', 0)
+    await pending
+    expect(conn.client.exec.mock.calls[0][0]).toBe('docker rm -f web-1')
+    await expect(handler('docker:action')(event, id, 'web;rm -rf /', 'stop')).rejects.toBeInstanceOf(ValidationError)
+    await expect(handler('docker:action')(event, id, 'web-1', 'exec')).rejects.toBeInstanceOf(ValidationError)
+  })
+})
+
+describe('docker log streaming', () => {
+  it('starts a log stream and forwards stdout/stderr chunks to the renderer', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const logId = (await handler('docker:logsStart')(event, id, 'web-1', 500)) as string
+    expect(typeof logId).toBe('string')
+    expect(conn.client.exec.mock.calls[0][0]).toBe('docker logs --tail 500 -f web-1 2>&1')
+
+    streams[0].emit('data', Buffer.from('line one\n'))
+    streams[0].stderr.emit('data', Buffer.from('warn line\n'))
+    expect(event.sender.send).toHaveBeenCalledWith('docker:logChunk', logId, 'line one\n')
+    expect(event.sender.send).toHaveBeenCalledWith('docker:logChunk', logId, 'warn line\n')
+
+    streams[0].emit('close')
+    expect(event.sender.send).toHaveBeenCalledWith('docker:logEnd', logId, null)
+  })
+
+  it('clamps the tail and defaults it for invalid values', async () => {
+    const { id, conn, event } = await connectDocker()
+    execYields(conn)
+    await handler('docker:logsStart')(event, id, 'web-1', 1_000_000)
+    expect(conn.client.exec.mock.calls[0][0]).toContain('--tail 10000 ')
+    await handler('docker:logsStart')(event, id, 'web-1', 'lots')
+    expect(conn.client.exec.mock.calls[1][0]).toContain('--tail 200 ')
+  })
+
+  it('reports stream errors through docker:logEnd', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const logId = (await handler('docker:logsStart')(event, id, 'web-1', 100)) as string
+    streams[0].emit('error', new Error('broken pipe'))
+    expect(event.sender.send).toHaveBeenCalledWith('docker:logEnd', logId, 'broken pipe')
+  })
+
+  it('rejects when the log exec fails and validates the container ref', async () => {
+    const { id, conn, event } = await connectDocker()
+    conn.client.exec.mockImplementationOnce((_c: string, cb: (e: Error | null) => void) => cb(new Error('nope')))
+    await expect(handler('docker:logsStart')(event, id, 'web-1', 100)).rejects.toBeInstanceOf(ConnectionError)
+    expect(() => handler('docker:logsStart')(event, id, 'bad name', 100)).toThrow(ValidationError)
+  })
+
+  it('stops log streams with ownership checks', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    const logId = (await handler('docker:logsStart')(event, id, 'web-1', 100)) as string
+
+    expect(() => handler('docker:logsStop')(makeEvent(), logId)).toThrow(OwnershipError)
+    expect(() => handler('docker:logsStop')(event, 42)).toThrow(ValidationError)
+    expect(handler('docker:logsStop')(event, 'unknown-id')).toBeUndefined()
+
+    handler('docker:logsStop')(event, logId)
+    expect(streams[0].close).toHaveBeenCalled()
+  })
+
+  it('stops a sender\'s log streams when its session is disposed', async () => {
+    const { id, conn, event } = await connectDocker()
+    const streams = execYields(conn)
+    await handler('docker:logsStart')(event, id, 'web-1', 100)
+    handler('docker:disconnect')(event, id)
+    expect(streams[0].close).toHaveBeenCalled()
+    expect(conn.dispose).toHaveBeenCalled()
+  })
+})
diff --git a/src/main/ipc/__tests__/k8s.test.ts b/src/main/ipc/__tests__/k8s.test.ts
new file mode 100644
index 0000000..845ec94
--- /dev/null
+++ b/src/main/ipc/__tests__/k8s.test.ts
@@ -0,0 +1,299 @@
+import { describe, it, expect, vi, beforeEach, afterAll, type Mock } from 'vitest'
+import * as net from 'node:net'
+import type { PassThrough } from 'node:stream'
+
+const h = vi.hoisted(() => ({
+  api: {
+    listNamespacedEvent: vi.fn(),
+  },
+  portForward: vi.fn(async () => undefined),
+  execFn: vi.fn(),
+  logFn: vi.fn(),
+}))
+
+vi.mock('@kubernetes/client-node', () => {
+  class KubeConfig {
+    loadFromDefault = vi.fn()
+    loadFromFile = vi.fn()
+    getContexts() { return [{ name: 'ctx', cluster: 'c' }] }
+    getClusters() { return [{ name: 'c', server: 'https://cluster.example.test' }] }
+    setCurrentContext = vi.fn()
+    getCurrentContext() { return 'ctx' }
+    makeApiClient() { return h.api }
+  }
+  class PortForward { portForward = h.portForward }
+  class Exec { exec = h.execFn }
+  class Log { log = h.logFn }
+  class CoreV1Api {}
+  class AppsV1Api {}
+  class NetworkingV1Api {}
+  class BatchV1Api {}
+  return { KubeConfig, PortForward, Exec, Log, CoreV1Api, AppsV1Api, NetworkingV1Api, BatchV1Api }
+})
+vi.mock('electron', () => ({
+  app: { getPath: vi.fn(() => '/tmp/noxed-test-userdata') },
+  ipcMain: { handle: vi.fn(), on: vi.fn() },
+  dialog: { showOpenDialog: vi.fn() },
+  BrowserWindow: { fromWebContents: vi.fn() },
+}))
+vi.mock('../keychain', () => ({
+  isUnlocked: vi.fn(() => true),
+}))
+
+import { ipcMain } from 'electron'
+import { registerK8sHandlers, disposeK8sSessionsForSender } from '../k8s'
+import { OwnershipError, ConnectionError } from '../errors'
+
+registerK8sHandlers()
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type Handler = (...args: any[]) => any
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No invoke handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+function onHandler(channel: string): Handler {
+  const call = (ipcMain.on as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No on handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+interface FakeEvent {
+  sender: { id: number; isDestroyed: () => boolean; send: Mock }
+}
+
+const usedSenderIds: number[] = []
+let senderSeq = 900
+function makeEvent(): FakeEvent {
+  const id = senderSeq++
+  usedSenderIds.push(id)
+  return { sender: { id, isDestroyed: () => false, send: vi.fn() } }
+}
+
+const flush = () => new Promise<void>((resolve) => setImmediate(resolve))
+
+beforeEach(() => {
+  vi.spyOn(console, 'error').mockImplementation(() => {})
+})
+
+afterAll(() => {
+  for (const id of usedSenderIds) disposeK8sSessionsForSender(id)
+})
+
+describe('k8s contexts', () => {
+  it('lists context names and servers from the default kubeconfig', () => {
+    expect(handler('k8s:contexts')({})).toEqual(['ctx'])
+    expect(handler('k8s:contextsDetailed')({})).toEqual([
+      { name: 'ctx', server: 'https://cluster.example.test' },
+    ])
+  })
+})
+
+describe('k8s:events', () => {
+  it('sorts newest-first by lastTimestamp and maps fields with defaults', async () => {
+    h.api.listNamespacedEvent.mockResolvedValueOnce({
+      body: {
+        items: [
+          {
+            metadata: { name: 'older', namespace: 'default' },
+            lastTimestamp: '2026-01-01T00:00:00Z',
+            type: 'Warning',
+            reason: 'BackOff',
+            message: 'restarting',
+            involvedObject: { kind: 'Pod', name: 'api-1' },
+            count: 4,
+          },
+          {
+            metadata: { name: 'newest', namespace: 'default' },
+            lastTimestamp: '2026-06-01T00:00:00Z',
+            involvedObject: { kind: 'Pod', name: 'api-2' },
+          },
+          {
+            metadata: { name: 'undated', namespace: 'default', creationTimestamp: '2025-12-01T00:00:00Z' },
+            involvedObject: { kind: 'Node', name: 'n1' },
+          },
+        ],
+      },
+    })
+    const rows = (await handler('k8s:events')({}, 'ctx', 'default')) as Array<Record<string, unknown>>
+    expect(rows.map((r) => r.name)).toEqual(['newest', 'older', 'undated'])
+    expect(rows[0]).toMatchObject({ type: 'Normal', reason: '', message: '', count: 1, object: 'Pod/api-2' })
+    expect(rows[1]).toMatchObject({ type: 'Warning', reason: 'BackOff', count: 4 })
+    expect(rows[2].age).toBe('2025-12-01T00:00:00Z')
+  })
+
+  it('rejects an unknown context', async () => {
+    await expect(handler('k8s:events')({}, 'nope', 'default')).rejects.toThrow('Unknown kube context')
+  })
+})
+
+describe('k8s:portForwardStart', () => {
+  const start = (event: FakeEvent, localPort?: unknown) =>
+    handler('k8s:portForwardStart')(event, 'ctx', 'default', 'pod-1', 8080, localPort) as Promise<{ id: string; localPort: number }>
+
+  it('rejects an invalid explicit local port', async () => {
+    await expect(start(makeEvent(), 99_999)).rejects.toThrow('Invalid local port')
+    await expect(start(makeEvent(), 'eighty')).rejects.toThrow('Invalid local port')
+  })
+
+  it('listens on an ephemeral port and records the session', async () => {
+    const event = makeEvent()
+    const { id, localPort } = await start(event)
+    expect(id).toMatch(/^k8s_/)
+    expect(localPort).toBeGreaterThan(0)
+
+    const listed = handler('k8s:portForwardList')(event) as Array<Record<string, unknown>>
+    expect(listed).toEqual([
+      { id, context: 'ctx', namespace: 'default', podName: 'pod-1', targetPort: 8080, localPort },
+    ])
+    // Another sender sees nothing.
+    expect(handler('k8s:portForwardList')(makeEvent())).toEqual([])
+
+    handler('k8s:portForwardStop')(event, id)
+    expect(handler('k8s:portForwardList')(event)).toEqual([])
+  })
+
+  it('forwards incoming sockets through the k8s PortForward API and destroys them on failure', async () => {
+    const event = makeEvent()
+    h.portForward.mockRejectedValueOnce(new Error('pod gone'))
+    const { id, localPort } = await start(event)
+
+    const socket = net.connect(localPort, '127.0.0.1')
+    socket.on('error', () => {}) // server side destroys the socket; ignore ECONNRESET
+    const closed = new Promise<void>((resolve) => socket.on('close', () => resolve()))
+    await vi.waitFor(() => expect(h.portForward).toHaveBeenCalled())
+    expect(h.portForward).toHaveBeenCalledWith('default', 'pod-1', [8080], expect.anything(), null, expect.anything())
+    await closed
+
+    handler('k8s:portForwardStop')(event, id)
+  })
+
+  it('rejects with ConnectionError when the local port is already taken', async () => {
+    const event = makeEvent()
+    const first = await start(event)
+    await expect(start(event, first.localPort)).rejects.toBeInstanceOf(ConnectionError)
+    handler('k8s:portForwardStop')(event, first.id)
+  })
+
+  it('enforces ownership on stop and tolerates bogus ids', async () => {
+    const event = makeEvent()
+    const { id } = await start(event)
+    expect(() => handler('k8s:portForwardStop')(makeEvent(), id)).toThrow(OwnershipError)
+    expect(handler('k8s:portForwardStop')(event, 42)).toBeUndefined()
+    expect(handler('k8s:portForwardStop')(event, 'k8s_missing')).toBeUndefined()
+    handler('k8s:portForwardStop')(event, id)
+  })
+})
+
+describe('k8s exec sessions', () => {
+  interface CapturedExec {
+    stdout: PassThrough
+    stdin: PassThrough
+    statusCb: (status: unknown) => void
+    ws: { close: Mock; send: Mock }
+  }
+
+  async function startExec(event: FakeEvent = makeEvent(), ws?: Partial<CapturedExec['ws']>) {
+    const captured = {} as CapturedExec
+    captured.ws = { close: vi.fn(), send: vi.fn(), ...ws } as CapturedExec['ws']
+    h.execFn.mockImplementationOnce(async (
+      _ns: string, _pod: string, _container: string, _cmd: string[],
+      stdout: PassThrough, _stderr: PassThrough, stdin: PassThrough,
+      _tty: boolean, statusCb: (status: unknown) => void,
+    ) => {
+      captured.stdout = stdout
+      captured.stdin = stdin
+      captured.statusCb = statusCb
+      return captured.ws
+    })
+    const sessionId = (await handler('k8s:execStart')(event, 'ctx', 'default', 'pod-1', 'main')) as string
+    return { sessionId, captured, event }
+  }
+
+  it('starts a shell and streams stdout to the renderer', async () => {
+    const { sessionId, captured, event } = await startExec()
+    expect(sessionId).toMatch(/^k8s_/)
+    captured.stdout.write('shell output')
+    await flush()
+    expect(event.sender.send).toHaveBeenCalledWith('k8s:execData', sessionId, 'shell output')
+    handler('k8s:execStop')(event, sessionId)
+  })
+
+  it('k8s:execSend writes to stdin only for the owning sender and sane payloads', async () => {
+    const { sessionId, captured, event } = await startExec()
+    const received: string[] = []
+    captured.stdin.on('data', (c: Buffer) => received.push(c.toString()))
+    const send = onHandler('k8s:execSend')
+
+    send(event, sessionId, 'ls -la\n')
+    await flush()
+    expect(received.join('')).toBe('ls -la\n')
+
+    send(makeEvent(), sessionId, 'whoami\n') // wrong sender
+    send(event, sessionId, 42) // non-string payload
+    send(event, 42, 'x') // non-string session id
+    send(event, 'k8s_missing', 'x') // unknown session
+    send(event, sessionId, 'y'.repeat(65 * 1024)) // oversized
+    await flush()
+    expect(received.join('')).toBe('ls -la\n')
+
+    handler('k8s:execStop')(event, sessionId)
+  })
+
+  it('k8s:execResize sends a resize control frame over the websocket', async () => {
+    const { sessionId, captured, event } = await startExec()
+    const resize = onHandler('k8s:execResize')
+
+    resize(event, sessionId, 80, 24)
+    expect(captured.ws.send).toHaveBeenCalledTimes(1)
+    const buf = captured.ws.send.mock.calls[0][0] as Buffer
+    expect([...buf]).toEqual([4, 0, 24, 0, 80])
+
+    resize(makeEvent(), sessionId, 80, 24) // wrong sender
+    resize(event, sessionId, 0, 24) // out of range
+    resize(event, sessionId, 80.5, 24) // non-integer
+    resize(event, 42, 80, 24) // bad id
+    expect(captured.ws.send).toHaveBeenCalledTimes(1)
+
+    captured.ws.send.mockImplementation(() => { throw new Error('socket closed') })
+    expect(() => resize(event, sessionId, 100, 40)).not.toThrow()
+
+    handler('k8s:execStop')(event, sessionId)
+  })
+
+  it('ignores resize when the websocket has no send method', async () => {
+    const { sessionId, event } = await startExec(makeEvent(), { send: undefined })
+    expect(() => onHandler('k8s:execResize')(event, sessionId, 80, 24)).not.toThrow()
+    handler('k8s:execStop')(event, sessionId)
+  })
+
+  it('notifies the renderer and clears the session when the shell exits', async () => {
+    const { sessionId, captured, event } = await startExec()
+    captured.statusCb({ status: 'Success' })
+    expect(event.sender.send).toHaveBeenCalledWith('k8s:execClose', sessionId, { status: 'Success' })
+    // Session is gone: send becomes a no-op and stop finds nothing.
+    const received: string[] = []
+    captured.stdin.on('data', (c: Buffer) => received.push(c.toString()))
+    onHandler('k8s:execSend')(event, sessionId, 'late\n')
+    await flush()
+    expect(received).toEqual([])
+    expect(handler('k8s:execStop')(event, sessionId)).toBeUndefined()
+  })
+
+  it('enforces ownership on execStop and closes the websocket on dispose', async () => {
+    const { sessionId, captured, event } = await startExec()
+    expect(() => handler('k8s:execStop')(makeEvent(), sessionId)).toThrow(OwnershipError)
+    handler('k8s:execStop')(event, sessionId)
+    expect(captured.ws.close).toHaveBeenCalled()
+  })
+
+  it('disposeK8sSessionsForSender tears down exec sessions', async () => {
+    const { sessionId, captured, event } = await startExec()
+    disposeK8sSessionsForSender(event.sender.id)
+    expect(captured.ws.close).toHaveBeenCalled()
+    expect(handler('k8s:execStop')(event, sessionId)).toBeUndefined()
+  })
+})
diff --git a/src/main/ipc/__tests__/keychain.test.ts b/src/main/ipc/__tests__/keychain.test.ts
index b2dcdab..39cb4e1 100644
--- a/src/main/ipc/__tests__/keychain.test.ts
+++ b/src/main/ipc/__tests__/keychain.test.ts
@@ -1,5 +1,5 @@
 import { describe, it, expect, beforeEach } from 'vitest'
-import { pbkdf2Sync, randomBytes } from 'crypto'
+import { pbkdf2Sync, randomBytes } from 'node:crypto'
 
 // Extracted pure functions mirroring keychain.ts implementation for testing
 
@@ -153,13 +153,6 @@ describe('Keychain — brute-force protection', () => {
 })
 
 describe('Keychain — auth mode verification logic', () => {
-  it('none mode always succeeds', () => {
-    // mode === 'none' → always { success: true }
-    // This is a direct mapping of the production logic
-    const mode = 'none'
-    expect(mode === 'none').toBe(true)
-  })
-
   it('pin/password mode requires a credential', () => {
     const credential = undefined
     const result = !credential ? { success: false, error: 'Credential required' } : { success: true }
@@ -179,13 +172,13 @@ describe('Keychain — auth mode verification logic', () => {
     const salt = randomBytes(16).toString('hex')
     const storedHash = hashCredential('1234', salt)
     const inputHash = hashCredential('1234', salt)
-    expect(inputHash === storedHash).toBe(true)
+    expect(inputHash).toBe(storedHash)
   })
 
   it('pin/password mode rejects incorrect credential', () => {
     const salt = randomBytes(16).toString('hex')
     const storedHash = hashCredential('1234', salt)
     const wrongHash = hashCredential('5678', salt)
-    expect(wrongHash === storedHash).toBe(false)
+    expect(wrongHash).not.toBe(storedHash)
   })
 })
diff --git a/src/main/ipc/__tests__/metrics.test.ts b/src/main/ipc/__tests__/metrics.test.ts
index 04de70f..4f62586 100644
--- a/src/main/ipc/__tests__/metrics.test.ts
+++ b/src/main/ipc/__tests__/metrics.test.ts
@@ -48,4 +48,66 @@ describe('parseMetricsOutput', () => {
     expect(metrics.available).toBe(false)
     expect(cpuStat).toBeUndefined()
   })
+
+  it('clamps CPU to 0 when idle jiffies outgrow the total delta', () => {
+    const prev = { idle: 0, total: 100 }
+    const out = LINUX_OUTPUT.replace(
+      'cpu  100 0 100 700 100 0 0 0 0 0',
+      'cpu  50 0 0 900 50 0 0 0 0 0',
+    )
+    const { metrics } = parseMetricsOutput(out, prev)
+    expect(metrics.cpu).toBe(0)
+  })
+
+  it('clamps CPU to 100 when idle time appears to go backwards', () => {
+    const prev = { idle: 800, total: 1000 }
+    const out = LINUX_OUTPUT.replace(
+      'cpu  100 0 100 700 100 0 0 0 0 0',
+      'cpu  1500 0 400 100 0 0 0 0 0 0',
+    )
+    const { metrics } = parseMetricsOutput(out, prev)
+    expect(metrics.cpu).toBe(100)
+  })
+
+  it('reports 0% CPU when the counter total has not advanced', () => {
+    const first = parseMetricsOutput(LINUX_OUTPUT)
+    const { metrics } = parseMetricsOutput(LINUX_OUTPUT, first.cpuStat)
+    expect(metrics.cpu).toBe(0)
+  })
+
+  it('tolerates missing sections and partial meminfo', () => {
+    const out = 'cpu  100 0 100 700 100 0 0 0 0 0\n::MEM::MemTotal: 2048 kB'
+    const { metrics } = parseMetricsOutput(out)
+    expect(metrics.memTotal).toBe(2048 * 1024)
+    // No MemAvailable line: everything counts as used
+    expect(metrics.memUsed).toBe(2048 * 1024)
+    expect(metrics.diskTotal).toBe(0)
+    expect(metrics.diskUsed).toBe(0)
+    expect(metrics.load1).toBe(0)
+    expect(metrics.uptimeSec).toBe(0)
+    expect(metrics.available).toBe(true)
+  })
+
+  it('ignores garbage in the disk, load, and uptime sections', () => {
+    const out = [
+      'cpu  100 0 100 700 100 0 0 0 0 0',
+      '::MEM::MemTotal: 1000 kB',
+      'MemAvailable: 500 kB',
+      '::DISK::df: /: No such file or directory',
+      '::LOAD::not-a-number',
+      '::UP::soon',
+    ].join('\n')
+    const { metrics } = parseMetricsOutput(out)
+    expect(metrics.diskTotal).toBe(0)
+    expect(metrics.diskUsed).toBe(0)
+    expect(metrics.load1).toBe(0)
+    expect(metrics.uptimeSec).toBe(0)
+  })
+
+  it('handles non-numeric cpu lines without producing a sample', () => {
+    const out = `intr weird output\n${LINUX_OUTPUT.slice(LINUX_OUTPUT.indexOf('::MEM::'))}`
+    const { metrics, cpuStat } = parseMetricsOutput(out)
+    expect(metrics.cpu).toBe(0)
+    expect(cpuStat).toBeUndefined()
+  })
 })
diff --git a/src/main/ipc/__tests__/rdp.test.ts b/src/main/ipc/__tests__/rdp.test.ts
new file mode 100644
index 0000000..0d6d465
--- /dev/null
+++ b/src/main/ipc/__tests__/rdp.test.ts
@@ -0,0 +1,293 @@
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest'
+import { EventEmitter } from 'node:events'
+
+vi.mock('electron', () => ({
+  ipcMain: { handle: vi.fn(), on: vi.fn() },
+}))
+vi.mock('node:child_process', () => ({
+  spawn: vi.fn(),
+}))
+vi.mock('node:fs', () => ({
+  existsSync: vi.fn(() => true),
+}))
+vi.mock('@electron-toolkit/utils', () => ({
+  is: { dev: true },
+}))
+
+import { ipcMain } from 'electron'
+import { spawn } from 'node:child_process'
+import { existsSync } from 'node:fs'
+import { registerRdpHandlers, disposeRdpSessionsForSender } from '../rdp'
+import { ValidationError, NotFoundError, OwnershipError, ConnectionError } from '../errors'
+
+registerRdpHandlers()
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type Handler = (...args: any[]) => any
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+class FakeStdin extends EventEmitter {
+  write = vi.fn()
+  end = vi.fn()
+}
+
+class FakeProc extends EventEmitter {
+  stdout = new EventEmitter()
+  stderr = new EventEmitter()
+  stdin = new FakeStdin()
+  kill = vi.fn()
+}
+
+interface FakeEvent {
+  sender: { id: number; isDestroyed: () => boolean; send: Mock }
+}
+
+let senderSeq = 1
+function makeEvent(destroyed = false): FakeEvent {
+  return { sender: { id: senderSeq++, isDestroyed: () => destroyed, send: vi.fn() } }
+}
+
+const VALID_CONFIG = { host: 'rdp.example.com', username: 'admin', password: 'secret' }
+
+function connect(config: Record<string, unknown> = VALID_CONFIG, event: FakeEvent = makeEvent()) {
+  const proc = new FakeProc()
+  ;(spawn as Mock).mockReturnValueOnce(proc)
+  const id = handler('rdp:connect')(event, config) as string
+  return { proc, id, event }
+}
+
+/** Builds a valid NXF1 frame: 16-byte header + w*h*4 BGRA bytes. */
+function frame(w: number, h: number, fill = 0xab): Buffer {
+  const data = Buffer.alloc(w * h * 4, fill)
+  const head = Buffer.alloc(16)
+  head.write('NXF1', 0, 'ascii')
+  head.writeUInt32LE(w, 4)
+  head.writeUInt32LE(h, 8)
+  head.writeUInt32LE(data.length, 12)
+  return Buffer.concat([head, data])
+}
+
+beforeEach(() => {
+  vi.spyOn(console, 'error').mockImplementation(() => {})
+  ;(existsSync as Mock).mockReturnValue(true)
+})
+
+describe('rdp:connect validation', () => {
+  it('rejects missing or invalid host, username, and password', () => {
+    const connectHandler = handler('rdp:connect')
+    const event = makeEvent()
+    expect(() => connectHandler(event, { username: 'u', password: 'p' })).toThrow(ValidationError)
+    expect(() => connectHandler(event, { host: '', username: 'u', password: 'p' })).toThrow(ValidationError)
+    expect(() => connectHandler(event, { host: 'h', password: 'p' })).toThrow(ValidationError)
+    expect(() => connectHandler(event, { host: 'h', username: 'u', password: 42 })).toThrow(ValidationError)
+    expect(() => connectHandler(event, null)).toThrow(ValidationError)
+  })
+
+  it('throws a ConnectionError when the sidecar binary is missing', () => {
+    ;(existsSync as Mock).mockReturnValue(false)
+    expect(() => handler('rdp:connect')(makeEvent(), VALID_CONFIG)).toThrow(ConnectionError)
+  })
+
+  it('spawns the sidecar with defaults when optional numbers are absent', () => {
+    connect()
+    const [, args, opts] = (spawn as Mock).mock.calls.at(-1)!
+    expect(args).toEqual(['rdp.example.com', '3389', 'admin', '1280', '800'])
+    expect(opts).toEqual({ stdio: ['pipe', 'pipe', 'pipe'] })
+  })
+
+  it('clamps out-of-range port, width, and height', () => {
+    connect({ ...VALID_CONFIG, port: 99_999, width: 100, height: 100_000 })
+    const [, args] = (spawn as Mock).mock.calls.at(-1)!
+    expect(args).toEqual(['rdp.example.com', '65535', 'admin', '640', '7680'])
+  })
+
+  it('writes the password to stdin and closes it', () => {
+    const { proc } = connect()
+    expect(proc.stdin.write).toHaveBeenCalledWith('secret\n')
+    expect(proc.stdin.end).toHaveBeenCalled()
+  })
+
+  it('survives a stdin write error (EPIPE from an instantly-dead sidecar)', () => {
+    const { proc } = connect()
+    expect(() => proc.stdin.emit('error', new Error('EPIPE'))).not.toThrow()
+    expect(console.error).toHaveBeenCalledWith(expect.stringContaining('stdin write failed'))
+  })
+})
+
+describe('frame stream parsing', () => {
+  it('forwards a complete frame to the renderer', () => {
+    const { proc, id, event } = connect()
+    proc.stdout.emit('data', frame(2, 2))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+    const [channel, sentId, w, h, pixels] = event.sender.send.mock.calls[0]
+    expect(channel).toBe('rdp:frame')
+    expect(sentId).toBe(id)
+    expect(w).toBe(2)
+    expect(h).toBe(2)
+    expect(pixels as Buffer).toHaveLength(16)
+  })
+
+  it('buffers partial frames across chunks', () => {
+    const { proc, event } = connect()
+    const full = frame(3, 2)
+    proc.stdout.emit('data', full.subarray(0, 10)) // partial header
+    expect(event.sender.send).not.toHaveBeenCalled()
+    proc.stdout.emit('data', full.subarray(10, 20)) // header complete, pixels partial
+    expect(event.sender.send).not.toHaveBeenCalled()
+    proc.stdout.emit('data', full.subarray(20))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+    expect(event.sender.send.mock.calls[0][2]).toBe(3)
+  })
+
+  it('drains multiple frames from a single chunk', () => {
+    const { proc, event } = connect()
+    proc.stdout.emit('data', Buffer.concat([frame(1, 1, 0x01), frame(2, 1, 0x02)]))
+    expect(event.sender.send).toHaveBeenCalledTimes(2)
+    expect(event.sender.send.mock.calls[0][2]).toBe(1)
+    expect(event.sender.send.mock.calls[1][2]).toBe(2)
+  })
+
+  it('resyncs past stray bytes before a frame', () => {
+    const { proc, event } = connect()
+    proc.stdout.emit('data', Buffer.concat([Buffer.from('some library log line here'), frame(1, 1)]))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+    expect(console.error).toHaveBeenCalledWith(expect.stringContaining('resync'))
+  })
+
+  it('drops junk with no magic while keeping a possible split-magic tail', () => {
+    const { proc, event } = connect()
+    proc.stdout.emit('data', Buffer.from('x'.repeat(20))) // >= header size, no NXF1 anywhere
+    expect(event.sender.send).not.toHaveBeenCalled()
+    // Next frame still parses even though 3 junk bytes were retained.
+    proc.stdout.emit('data', frame(1, 1))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+  })
+
+  it('rejects an implausible header (zero dims) and resyncs to the next frame', () => {
+    const { proc, event } = connect()
+    const bogus = Buffer.alloc(16)
+    bogus.write('NXF1', 0, 'ascii') // width/height/dataLen all zero
+    proc.stdout.emit('data', Buffer.concat([bogus, frame(1, 1)]))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+  })
+
+  it('rejects a header whose dataLen does not match width*height*4', () => {
+    const { proc, event } = connect()
+    const bad = Buffer.alloc(16)
+    bad.write('NXF1', 0, 'ascii')
+    bad.writeUInt32LE(2, 4)
+    bad.writeUInt32LE(2, 8)
+    bad.writeUInt32LE(15, 12) // should be 16
+    proc.stdout.emit('data', Buffer.concat([bad, frame(1, 1)]))
+    expect(event.sender.send).toHaveBeenCalledTimes(1)
+    expect(event.sender.send.mock.calls[0][2]).toBe(1)
+  })
+
+  it('does not send frames to a destroyed sender', () => {
+    const { proc, event } = connect(VALID_CONFIG, makeEvent(true))
+    proc.stdout.emit('data', frame(1, 1))
+    expect(event.sender.send).not.toHaveBeenCalled()
+  })
+})
+
+describe('stderr [sidecar] parsing and exit reasons', () => {
+  it('prefers the last "error:" detail over informational lines', () => {
+    const { proc, id, event } = connect()
+    proc.stderr.emit('data', Buffer.from('[sidecar] connecting to host:3389\n'))
+    proc.stderr.emit('data', Buffer.from('freerdp noise\n[sidecar] error: Logon failed\n'))
+    proc.stderr.emit('data', Buffer.from('[sidecar] disconnecting\n'))
+    proc.emit('exit', 1)
+    expect(event.sender.send).toHaveBeenCalledWith('rdp:closed', id, 'Logon failed')
+  })
+
+  it.each([
+    {
+      name: 'falls back to the last informational sidecar message on failure',
+      stderr: '[sidecar] certificate accepted\n',
+      exitCode: 3,
+      reason: 'certificate accepted',
+    },
+    {
+      name: 'keeps "error:" with no detail as a plain message, not an error detail',
+      stderr: '[sidecar] error:\n',
+      exitCode: 1,
+      reason: 'error:',
+    },
+    {
+      name: 'ignores empty sidecar lines and reports a generic exit reason',
+      stderr: '[sidecar]   \nplain freerdp output\n',
+      exitCode: 2,
+      reason: 'sidecar exited (2)',
+    },
+  ])('$name', ({ stderr, exitCode, reason }) => {
+    const { proc, id, event } = connect()
+    proc.stderr.emit('data', Buffer.from(stderr))
+    proc.emit('exit', exitCode)
+    expect(event.sender.send).toHaveBeenCalledWith('rdp:closed', id, reason)
+  })
+
+  it('sends a null reason on clean exit', () => {
+    const { proc, id, event } = connect()
+    proc.stderr.emit('data', Buffer.from('[sidecar] error: transient\n'))
+    proc.emit('exit', 0)
+    expect(event.sender.send).toHaveBeenCalledWith('rdp:closed', id, null)
+  })
+
+  it('does not send rdp:closed to a destroyed sender', () => {
+    const { proc, event } = connect(VALID_CONFIG, makeEvent(true))
+    proc.emit('exit', 1)
+    expect(event.sender.send).not.toHaveBeenCalled()
+  })
+
+  it('reports spawn errors and removes the session', () => {
+    const { proc, id, event } = connect()
+    proc.emit('error', new Error('spawn ENOENT'))
+    expect(event.sender.send).toHaveBeenCalledWith('rdp:closed', id, 'spawn ENOENT')
+    expect(() => handler('rdp:disconnect')(event, id)).toThrow(NotFoundError)
+  })
+})
+
+describe('rdp:disconnect and session ownership', () => {
+  it('validates the session id shape', () => {
+    expect(() => handler('rdp:disconnect')(makeEvent(), 42)).toThrow(ValidationError)
+  })
+
+  it('throws NotFoundError for unknown sessions', () => {
+    expect(() => handler('rdp:disconnect')(makeEvent(), 'nope')).toThrow(NotFoundError)
+  })
+
+  it('rejects a disconnect from a different sender', () => {
+    const { id } = connect()
+    expect(() => handler('rdp:disconnect')(makeEvent(), id)).toThrow(OwnershipError)
+  })
+
+  it('kills the sidecar on disconnect and forgets the session', () => {
+    const { proc, id, event } = connect()
+    handler('rdp:disconnect')(event, id)
+    expect(proc.kill).toHaveBeenCalled()
+    expect(() => handler('rdp:disconnect')(event, id)).toThrow(NotFoundError)
+  })
+
+  it('swallows kill failures during dispose', () => {
+    const { proc, id, event } = connect()
+    proc.kill.mockImplementation(() => { throw new Error('already dead') })
+    expect(() => handler('rdp:disconnect')(event, id)).not.toThrow()
+  })
+
+  it('disposeRdpSessionsForSender only kills that sender\'s sessions', () => {
+    const mine = makeEvent()
+    const a = connect(VALID_CONFIG, mine)
+    const b = connect(VALID_CONFIG, mine)
+    const other = connect()
+    disposeRdpSessionsForSender(mine.sender.id)
+    expect(a.proc.kill).toHaveBeenCalled()
+    expect(b.proc.kill).toHaveBeenCalled()
+    expect(other.proc.kill).not.toHaveBeenCalled()
+    handler('rdp:disconnect')(other.event, other.id) // still alive for its own sender
+  })
+})
diff --git a/src/main/ipc/__tests__/security.test.ts b/src/main/ipc/__tests__/security.test.ts
index 08722a6..f94dc0d 100644
--- a/src/main/ipc/__tests__/security.test.ts
+++ b/src/main/ipc/__tests__/security.test.ts
@@ -1,6 +1,6 @@
 import { describe, it, expect } from 'vitest'
-import { homedir } from 'os'
-import { resolve, normalize } from 'path'
+import { homedir } from 'node:os'
+import { resolve, normalize } from 'node:path'
 
 // We test isLikelyTextFile directly (pure function, no FS dependency)
 import { isLikelyTextFile } from '../security'
@@ -39,70 +39,33 @@ function validateKeyPathLogic(rawPath: string): { ok: true; resolved: string } |
 
 describe('Security — path traversal protection', () => {
   describe('validateKeyPathLogic', () => {
-    it('allows ~/.ssh/id_rsa', () => {
+    it('resolves ~ to the home directory', () => {
       const result = validateKeyPathLogic('~/.ssh/id_rsa')
       expect(result.ok).toBe(true)
       if (result.ok) expect(result.resolved).toBe(resolve(SSH_DIR, 'id_rsa'))
     })
 
-    it('allows ~/.ssh/id_ed25519', () => {
-      const result = validateKeyPathLogic('~/.ssh/id_ed25519')
-      expect(result.ok).toBe(true)
-    })
-
-    it('allows absolute path inside .ssh', () => {
-      const result = validateKeyPathLogic(`${home}/.ssh/my_key`)
-      expect(result.ok).toBe(true)
-    })
-
-    it('allows ~/.config/ssh/ paths', () => {
-      const result = validateKeyPathLogic('~/.config/ssh/deploy_key')
-      expect(result.ok).toBe(true)
-    })
-
-    it('allows ~/.pem/ paths', () => {
-      const result = validateKeyPathLogic('~/.pem/server.pem')
-      expect(result.ok).toBe(true)
-    })
-
-    it('BLOCKS /etc/passwd', () => {
-      const result = validateKeyPathLogic('/etc/passwd')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS /etc/shadow', () => {
-      const result = validateKeyPathLogic('/etc/shadow')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS reading arbitrary home directory files', () => {
-      const result = validateKeyPathLogic('~/.env')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS path traversal via ../', () => {
-      const result = validateKeyPathLogic('~/.ssh/../../etc/passwd')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS path traversal via encoded sequences', () => {
-      const result = validateKeyPathLogic('~/.ssh/../.env')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS absolute paths outside allowed dirs', () => {
-      const result = validateKeyPathLogic('/tmp/evil_key')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS empty string', () => {
-      const result = validateKeyPathLogic('')
-      expect(result.ok).toBe(false)
-    })
-
-    it('BLOCKS null-byte injection', () => {
-      const result = validateKeyPathLogic('~/.ssh/id_rsa\0/../../etc/passwd')
-      expect(result.ok).toBe(false)
+    it.each([
+      ['~/.ssh/id_rsa', 'ssh key by tilde path'],
+      ['~/.ssh/id_ed25519', 'ed25519 key'],
+      [`${home}/.ssh/my_key`, 'absolute path inside .ssh'],
+      ['~/.config/ssh/deploy_key', '~/.config/ssh/ path'],
+      ['~/.pem/server.pem', '~/.pem/ path'],
+    ])('allows %s (%s)', (path) => {
+      expect(validateKeyPathLogic(path).ok).toBe(true)
+    })
+
+    it.each([
+      ['/etc/passwd', 'system file'],
+      ['/etc/shadow', 'system file'],
+      ['~/.env', 'arbitrary home directory file'],
+      ['~/.ssh/../../etc/passwd', 'path traversal via ../'],
+      ['~/.ssh/../.env', 'path traversal to dotfile'],
+      ['/tmp/evil_key', 'absolute path outside allowed dirs'],
+      ['', 'empty string'],
+      ['~/.ssh/id_rsa\0/../../etc/passwd', 'null-byte injection'],
+    ])('BLOCKS %s (%s)', (path) => {
+      expect(validateKeyPathLogic(path).ok).toBe(false)
     })
 
     it('BLOCKS reading the .ssh directory itself (not a file)', () => {
diff --git a/src/main/ipc/__tests__/sessionTransfer.test.ts b/src/main/ipc/__tests__/sessionTransfer.test.ts
index 90c4d68..e366f1f 100644
--- a/src/main/ipc/__tests__/sessionTransfer.test.ts
+++ b/src/main/ipc/__tests__/sessionTransfer.test.ts
@@ -65,6 +65,12 @@ describe('parseSessionsExport', () => {
     expect(() => parseSessionsExport('[]')).toThrow(ValidationError)
   })
 
+  it('rejects JSON documents whose root is not an object', () => {
+    expect(() => parseSessionsExport('42')).toThrow(ValidationError)
+    expect(() => parseSessionsExport('null')).toThrow(ValidationError)
+    expect(() => parseSessionsExport('"noxed-connections"')).toThrow(ValidationError)
+  })
+
   it('drops entries without a host', () => {
     const result = parseSessionsExport(wrap([{ label: 'broken', port: 22 }]))
     expect(result).toEqual([])
@@ -93,6 +99,96 @@ describe('parseSessionsExport', () => {
     const result = parseSessionsExport(wrap([{ host: 'a.example.com', tags: ['ok', 42, null] }]))
     expect(result[0].tags).toEqual(['ok'])
   })
+
+  it('imports every optional string field', () => {
+    const result = parseSessionsExport(wrap([{
+      host: 'db.example.com',
+      type: 'database',
+      keyPath: '~/.ssh/id_rsa',
+      group: 'Prod',
+      color: '#ff0000',
+      dbType: 'postgres',
+      databaseName: 'app',
+      sslMode: 'require',
+      kubeconfigPath: '~/.kube/config',
+    }]))
+    expect(result[0]).toMatchObject({
+      type: 'database',
+      keyPath: '~/.ssh/id_rsa',
+      group: 'Prod',
+      color: '#ff0000',
+      dbType: 'postgres',
+      databaseName: 'app',
+      sslMode: 'require',
+      kubeconfigPath: '~/.kube/config',
+    })
+  })
+
+  it('treats blank or non-string optional fields as absent', () => {
+    const result = parseSessionsExport(wrap([{
+      host: 'a.example.com',
+      group: '   ',
+      color: 42,
+      dbType: null,
+      keyPath: '',
+    }]))
+    expect(result[0].group).toBeUndefined()
+    expect(result[0].color).toBeUndefined()
+    expect(result[0].dbType).toBeUndefined()
+    expect(result[0].keyPath).toBeUndefined()
+  })
+
+  it('imports boolean and numeric preferences with strict types', () => {
+    const result = parseSessionsExport(wrap([{
+      host: 'a.example.com',
+      isFavorite: true,
+      pollingEnabled: false,
+      connectOnStart: true,
+      pollingIntervalSeconds: 30,
+      redisDb: 3,
+    }]))
+    expect(result[0]).toMatchObject({
+      isFavorite: true,
+      pollingEnabled: false,
+      connectOnStart: true,
+      pollingIntervalSeconds: 30,
+      redisDb: 3,
+    })
+  })
+
+  it('rejects malformed boolean and numeric preferences', () => {
+    const result = parseSessionsExport(wrap([{
+      host: 'a.example.com',
+      isFavorite: 'yes',
+      pollingEnabled: 1,
+      connectOnStart: null,
+      pollingIntervalSeconds: Number.NaN,
+      redisDb: 2.5,
+    }]))
+    expect(result[0].isFavorite).toBeUndefined()
+    expect(result[0].pollingEnabled).toBeUndefined()
+    expect(result[0].connectOnStart).toBeUndefined()
+    expect(result[0].pollingIntervalSeconds).toBeUndefined()
+    expect(result[0].redisDb).toBeUndefined()
+  })
+
+  it('drops non-object connection entries and unknown types fall back to ssh', () => {
+    const result = parseSessionsExport(wrap([
+      null,
+      'garbage',
+      42,
+      { host: 'a.example.com', type: 'carrier-pigeon' },
+      { host: 'b.example.com', type: 'redis' },
+    ]))
+    expect(result).toHaveLength(2)
+    expect(result[0].type).toBe('ssh')
+    expect(result[1].type).toBe('redis')
+  })
+
+  it('rejects oversized import payloads', () => {
+    const huge = `{"pad":"${'x'.repeat(5 * 1024 * 1024)}"}`
+    expect(() => parseSessionsExport(huge)).toThrow(ValidationError)
+  })
 })
 
 describe('connectionDedupKey', () => {
diff --git a/src/main/ipc/__tests__/sftp.test.ts b/src/main/ipc/__tests__/sftp.test.ts
new file mode 100644
index 0000000..737ee43
--- /dev/null
+++ b/src/main/ipc/__tests__/sftp.test.ts
@@ -0,0 +1,347 @@
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest'
+import { EventEmitter } from 'node:events'
+import { randomUUID } from 'node:crypto'
+
+vi.mock('electron', () => ({
+  ipcMain: { handle: vi.fn(), on: vi.fn() },
+}))
+vi.mock('ssh2', async () => {
+  const { EventEmitter } = await import('node:events')
+  const instances: unknown[] = []
+  class Client extends EventEmitter {
+    connect = vi.fn()
+    end = vi.fn()
+    sftp = vi.fn()
+    constructor() {
+      super()
+      instances.push(this)
+    }
+  }
+  return { Client, __clientInstances: instances }
+})
+vi.mock('../ssh', () => ({
+  getOwnedSshClient: vi.fn(),
+  sshConnectOptions: () => ({ readyTimeout: 1000, keepaliveInterval: 0, keepaliveCountMax: 1 }),
+  SSH_CONNECT_DEFAULTS: { algorithms: { kex: [] } },
+}))
+vi.mock('../sshClients', () => ({
+  connectSessionClient: vi.fn(),
+  openJumpSocket: vi.fn(),
+}))
+
+import { ipcMain } from 'electron'
+import * as ssh2 from 'ssh2'
+import { getOwnedSshClient } from '../ssh'
+import { connectSessionClient, openJumpSocket } from '../sshClients'
+import { registerSftpHandlers, disposeSftpClientsForSender } from '../sftp'
+import { ValidationError, NotFoundError, OwnershipError, ConnectionError } from '../errors'
+
+registerSftpHandlers()
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type Handler = (...args: any[]) => any
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+interface FakeClientInstance extends EventEmitter {
+  connect: Mock
+  end: Mock
+  sftp: Mock
+}
+
+function lastClientInstance(): FakeClientInstance {
+  const instances = (ssh2 as unknown as { __clientInstances: FakeClientInstance[] }).__clientInstances
+  return instances[instances.length - 1]
+}
+
+interface FakeEvent {
+  sender: { id: number; isDestroyed: () => boolean; send: Mock }
+}
+
+let senderSeq = 100
+function makeEvent(): FakeEvent {
+  return { sender: { id: senderSeq++, isDestroyed: () => false, send: vi.fn() } }
+}
+
+function fakeSftp() {
+  return {
+    readdir: vi.fn(),
+    stat: vi.fn(),
+    createReadStream: vi.fn(),
+    createWriteStream: vi.fn(),
+    fastGet: vi.fn(),
+    fastPut: vi.fn(),
+    unlink: vi.fn(),
+    rename: vi.fn(),
+    mkdir: vi.fn(),
+    rmdir: vi.fn(),
+    chmod: vi.fn(),
+  }
+}
+
+const BASE_CONFIG = { host: 'sftp.example.com', port: 22, username: 'deploy' }
+
+/** Registers a client through the streamId fast-path (reuses an "owned" SSH client). */
+async function connectViaStream(event: FakeEvent = makeEvent()) {
+  const sftp = fakeSftp()
+  const client = { sftp: vi.fn((cb: (e: Error | null, s: unknown) => void) => cb(null, sftp)), end: vi.fn() }
+  ;(getOwnedSshClient as Mock).mockReturnValueOnce(client)
+  const clientId = (await handler('sftp:connect')(event, { ...BASE_CONFIG, streamId: randomUUID() })) as string
+  return { clientId, sftp, client, event }
+}
+
+beforeEach(() => {
+  vi.spyOn(console, 'error').mockImplementation(() => {})
+})
+
+describe('sftp:connect config validation', () => {
+  const connectHandler = () => handler('sftp:connect')
+
+  it('rejects non-object and malformed configs', () => {
+    const event = makeEvent()
+    expect(() => connectHandler()(event, null)).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, streamId: 'not-a-uuid' })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, host: 'bad host!' })).toThrow()
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, port: 0 })).toThrow()
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, username: '' })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, password: 5 })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, password: 'x'.repeat(2000) })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, privateKey: 5 })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, privateKey: 'k'.repeat(65 * 1024) })).toThrow(ValidationError)
+    expect(() => connectHandler()(event, { ...BASE_CONFIG, jumpHostId: 'j'.repeat(200) })).toThrow(ValidationError)
+  })
+
+  it('throws NotFoundError when the referenced SSH stream does not exist', async () => {
+    ;(getOwnedSshClient as Mock).mockReturnValueOnce(undefined)
+    await expect(async () => connectHandler()(makeEvent(), { ...BASE_CONFIG, streamId: randomUUID() }))
+      .rejects.toBeInstanceOf(NotFoundError)
+  })
+
+  it('opens an sftp channel over an existing owned SSH stream', async () => {
+    const { clientId } = await connectViaStream()
+    expect(typeof clientId).toBe('string')
+  })
+})
+
+describe('sftp:connect standalone client', () => {
+  it('resolves once the client is ready and the sftp channel opens', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw' }) as Promise<string>
+    const client = lastClientInstance()
+    expect(client.connect).toHaveBeenCalledWith(expect.objectContaining({
+      host: 'sftp.example.com',
+      port: 22,
+      username: 'deploy',
+      password: 'pw',
+      tryKeyboard: true,
+    }))
+    client.sftp.mockImplementation((cb: (e: Error | null, s: unknown) => void) => cb(null, fakeSftp()))
+    client.emit('ready')
+    await expect(pending).resolves.toEqual(expect.any(String))
+  })
+
+  it('rejects with ConnectionError on a client error and ignores later events', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw' }) as Promise<string>
+    const client = lastClientInstance()
+    client.sftp.mockImplementation((cb: (e: Error | null, s: unknown) => void) => cb(null, fakeSftp()))
+    client.emit('error', new Error('connection refused'))
+    client.emit('ready') // settle() must ignore this second outcome
+    await expect(pending).rejects.toBeInstanceOf(ConnectionError)
+  })
+
+  it('closes the client when the sftp channel fails after ready', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw' }) as Promise<string>
+    const client = lastClientInstance()
+    client.sftp.mockImplementation((cb: (e: Error | null) => void) => cb(new Error('no sftp subsystem')))
+    client.emit('ready')
+    await expect(pending).rejects.toBeInstanceOf(ConnectionError)
+    expect(client.end).toHaveBeenCalled()
+  })
+
+  it('answers keyboard-interactive prompts with the password', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw' }) as Promise<string>
+    const client = lastClientInstance()
+    const finish = vi.fn()
+    client.emit('keyboard-interactive', 'n', 'i', 'l', [{ prompt: 'Password:' }, { prompt: 'Verification:' }], finish)
+    expect(finish).toHaveBeenCalledWith(['pw', 'pw'])
+    client.sftp.mockImplementation((cb: (e: Error | null, s: unknown) => void) => cb(null, fakeSftp()))
+    client.emit('ready')
+    await pending
+  })
+
+  it('answers keyboard-interactive with no responses when there is no password', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG }) as Promise<string>
+    const client = lastClientInstance()
+    const finish = vi.fn()
+    client.emit('keyboard-interactive', 'n', 'i', 'l', [{ prompt: 'Password:' }], finish)
+    expect(finish).toHaveBeenCalledWith([])
+    client.emit('error', new Error('auth failed'))
+    await expect(pending).rejects.toBeInstanceOf(ConnectionError)
+  })
+
+  it('routes through a jump host and passes the socket to connect', async () => {
+    const event = makeEvent()
+    const upstream = { client: { fake: true }, dispose: vi.fn() }
+    ;(connectSessionClient as Mock).mockResolvedValueOnce(upstream)
+    ;(openJumpSocket as Mock).mockResolvedValueOnce('jump-sock')
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw', jumpHostId: 'jump-1' }) as Promise<string>
+    await vi.waitFor(() => expect(openJumpSocket).toHaveBeenCalledWith(upstream.client, 'sftp.example.com', 22))
+    const client = lastClientInstance()
+    expect(client.connect).toHaveBeenCalledWith(expect.objectContaining({ sock: 'jump-sock' }))
+    client.sftp.mockImplementation((cb: (e: Error | null, s: unknown) => void) => cb(null, fakeSftp()))
+    client.emit('ready')
+    await pending
+    expect(upstream.dispose).not.toHaveBeenCalled()
+  })
+
+  it('disposes the jump connection when the jump socket cannot open', async () => {
+    const upstream = { client: {}, dispose: vi.fn() }
+    ;(connectSessionClient as Mock).mockResolvedValueOnce(upstream)
+    ;(openJumpSocket as Mock).mockRejectedValueOnce(new Error('jump refused'))
+    await expect(handler('sftp:connect')(makeEvent(), { ...BASE_CONFIG, jumpHostId: 'jump-1' }))
+      .rejects.toThrow('jump refused')
+    expect(upstream.dispose).toHaveBeenCalled()
+  })
+})
+
+describe('sftp:list', () => {
+  it('maps directory entries with type and timestamps', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    sftp.readdir.mockImplementation((_path: string, cb: (e: Error | null, list?: unknown[]) => void) =>
+      cb(null, [
+        { filename: 'notes.txt', attrs: { size: 5, mtime: 1000, mode: 0o100644 } },
+        { filename: 'logs', attrs: { size: 0, mtime: 2000, mode: 0o040755 } },
+      ]))
+    const rows = await handler('sftp:list')(event, clientId, '/home/deploy')
+    expect(rows).toEqual([
+      { name: 'notes.txt', size: 5, mtime: 1_000_000, permissions: 0o100644, isDirectory: false },
+      { name: 'logs', size: 0, mtime: 2_000_000, permissions: 0o040755, isDirectory: true },
+    ])
+  })
+
+  it('wraps readdir failures in ConnectionError', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    sftp.readdir.mockImplementation((_path: string, cb: (e: Error | null) => void) => cb(new Error('Permission denied')))
+    await expect(handler('sftp:list')(event, clientId, '/root')).rejects.toBeInstanceOf(ConnectionError)
+  })
+
+  it('validates path and client id, and enforces ownership', async () => {
+    const { clientId, event } = await connectViaStream()
+    expect(() => handler('sftp:list')(event, clientId, '')).toThrow(ValidationError)
+    expect(() => handler('sftp:list')(event, clientId, 'a\0b')).toThrow(ValidationError)
+    expect(() => handler('sftp:list')(event, 'not-a-uuid', '/tmp')).toThrow(ValidationError)
+    expect(() => handler('sftp:list')(event, randomUUID(), '/tmp')).toThrow(NotFoundError)
+    expect(() => handler('sftp:list')(makeEvent(), clientId, '/tmp')).toThrow(OwnershipError)
+  })
+})
+
+describe('sftp:readFile', () => {
+  function statOk(sftp: ReturnType<typeof fakeSftp>, size = 10): void {
+    sftp.stat.mockImplementation((_p: string, cb: (e: Error | null, s?: unknown) => void) => cb(null, { size }))
+  }
+
+  it('reads a small text file', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    statOk(sftp)
+    const stream = new EventEmitter()
+    sftp.createReadStream.mockReturnValue(stream)
+    const pending = handler('sftp:readFile')(event, clientId, '/etc/motd') as Promise<string>
+    stream.emit('data', Buffer.from('hello '))
+    stream.emit('data', Buffer.from('world'))
+    stream.emit('end')
+    await expect(pending).resolves.toBe('hello world')
+  })
+
+  it('rejects when stat fails', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    sftp.stat.mockImplementation((_p: string, cb: (e: Error | null) => void) => cb(new Error('No such file')))
+    await expect(handler('sftp:readFile')(event, clientId, '/missing')).rejects.toBeInstanceOf(ConnectionError)
+  })
+
+  it('refuses binary files by extension before streaming', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    statOk(sftp)
+    await expect(handler('sftp:readFile')(event, clientId, '/pics/photo.png'))
+      .rejects.toBeInstanceOf(ValidationError)
+    expect(sftp.createReadStream).not.toHaveBeenCalled()
+  })
+
+  it('refuses files that sniff as binary (null byte in first 8KB)', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    statOk(sftp)
+    const stream = new EventEmitter()
+    sftp.createReadStream.mockReturnValue(stream)
+    const pending = handler('sftp:readFile')(event, clientId, '/bin/data')
+    stream.emit('data', Buffer.from([0x41, 0x00, 0x42]))
+    stream.emit('end')
+    await expect(pending).rejects.toBeInstanceOf(ValidationError)
+  })
+
+  it('wraps read stream errors in ConnectionError', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    statOk(sftp)
+    const stream = new EventEmitter()
+    sftp.createReadStream.mockReturnValue(stream)
+    const pending = handler('sftp:readFile')(event, clientId, '/etc/motd')
+    stream.emit('error', new Error('read reset'))
+    await expect(pending).rejects.toBeInstanceOf(ConnectionError)
+  })
+})
+
+describe('sftp:writeFile', () => {
+  it('writes content and resolves on finish', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    const stream = new EventEmitter() as EventEmitter & { end: Mock }
+    stream.end = vi.fn(() => stream.emit('finish'))
+    sftp.createWriteStream.mockReturnValue(stream)
+    await expect(handler('sftp:writeFile')(event, clientId, '/tmp/out.txt', 'data')).resolves.toBe(true)
+    expect(stream.end).toHaveBeenCalledWith(Buffer.from('data', 'utf8'))
+  })
+
+  it('rejects invalid content and stream errors', async () => {
+    const { clientId, sftp, event } = await connectViaStream()
+    expect(() => handler('sftp:writeFile')(event, clientId, '/tmp/out.txt', 42)).toThrow(ValidationError)
+    const stream = new EventEmitter() as EventEmitter & { end: Mock }
+    stream.end = vi.fn(() => stream.emit('error', new Error('disk full')))
+    sftp.createWriteStream.mockReturnValue(stream)
+    await expect(handler('sftp:writeFile')(event, clientId, '/tmp/out.txt', 'data')).rejects.toBeInstanceOf(ConnectionError)
+  })
+})
+
+describe('sftp:disconnect and sender cleanup', () => {
+  it('validates ownership on disconnect', async () => {
+    const { clientId } = await connectViaStream()
+    expect(() => handler('sftp:disconnect')(makeEvent(), clientId)).toThrow(OwnershipError)
+  })
+
+  it('ignores disconnects for unknown clients', () => {
+    expect(handler('sftp:disconnect')(makeEvent(), randomUUID())).toBeUndefined()
+  })
+
+  it('does not end a shared (stream-backed) client on disconnect', async () => {
+    const { clientId, client, event } = await connectViaStream()
+    handler('sftp:disconnect')(event, clientId)
+    expect(client.end).not.toHaveBeenCalled()
+    expect(() => handler('sftp:list')(event, clientId, '/tmp')).toThrow(NotFoundError)
+  })
+
+  it('ends owned clients when their sender goes away', async () => {
+    const event = makeEvent()
+    const pending = handler('sftp:connect')(event, { ...BASE_CONFIG, password: 'pw' }) as Promise<string>
+    const client = lastClientInstance()
+    client.sftp.mockImplementation((cb: (e: Error | null, s: unknown) => void) => cb(null, fakeSftp()))
+    client.emit('ready')
+    const clientId = await pending
+    disposeSftpClientsForSender(event.sender.id)
+    expect(client.end).toHaveBeenCalled()
+    expect(() => handler('sftp:list')(event, clientId, '/tmp')).toThrow(NotFoundError)
+  })
+})
diff --git a/src/main/ipc/__tests__/socks.test.ts b/src/main/ipc/__tests__/socks.test.ts
index 3baab33..08dd336 100644
--- a/src/main/ipc/__tests__/socks.test.ts
+++ b/src/main/ipc/__tests__/socks.test.ts
@@ -29,7 +29,7 @@ describe('socks replies', () => {
 
   it('builds a ten-byte connect reply with the given code', () => {
     const reply = socksConnectReply(SOCKS_REPLY.success)
-    expect(reply.length).toBe(10)
+    expect(reply).toHaveLength(10)
     expect(reply[0]).toBe(5)
     expect(reply[1]).toBe(0)
   })
diff --git a/src/main/ipc/__tests__/ssh.handlers.test.ts b/src/main/ipc/__tests__/ssh.handlers.test.ts
new file mode 100644
index 0000000..1dc2aa0
--- /dev/null
+++ b/src/main/ipc/__tests__/ssh.handlers.test.ts
@@ -0,0 +1,579 @@
+import { describe, it, expect, vi, afterEach } from 'vitest'
+import { EventEmitter } from 'node:events'
+
+const { ipc, fakeSsh } = vi.hoisted(() => ({
+  ipc: {
+    handlers: new Map<string, (...args: unknown[]) => unknown>(),
+    listeners: new Map<string, (...args: unknown[]) => unknown>(),
+  },
+  fakeSsh: { clients: [] as FakeSshClient[] },
+}))
+
+interface FakeShellStream extends EventEmitter {
+  stderr: EventEmitter
+  write: ReturnType<typeof vi.fn>
+  end: ReturnType<typeof vi.fn>
+  setWindow: ReturnType<typeof vi.fn>
+}
+
+interface FakeSshClient extends EventEmitter {
+  connectConfig: unknown
+  shellImpl: (opts: unknown, cb: (err: Error | null, stream?: unknown) => void) => void
+  execCalls: Array<{ command: string; cb: (err: Error | null, channel?: unknown) => void }>
+  lastShellStream: FakeShellStream | undefined
+  end: ReturnType<typeof vi.fn>
+  setNoDelay: ReturnType<typeof vi.fn>
+  connect: (config: unknown) => void
+  shell: (opts: unknown, cb: (err: Error | null, stream?: unknown) => void) => void
+  exec: (command: string, cb: (err: Error | null, channel?: unknown) => void) => void
+}
+
+vi.mock('electron', () => ({
+  ipcMain: {
+    handle: vi.fn((channel: string, fn: (...args: unknown[]) => unknown) => {
+      ipc.handlers.set(channel, fn)
+    }),
+    on: vi.fn((channel: string, fn: (...args: unknown[]) => unknown) => {
+      ipc.listeners.set(channel, fn)
+    }),
+  },
+}))
+vi.mock('electron-store', () => ({
+  default: class MockStore {
+    private data = new Map<string, unknown>()
+    get(key: string) { return this.data.get(key) }
+    set(key: string, value: unknown) { this.data.set(key, value) }
+  },
+}))
+
+vi.mock('ssh2', async () => {
+  const { EventEmitter } = await import('node:events')
+
+  function makeShellStream(): FakeShellStream {
+    const stream = new EventEmitter() as FakeShellStream
+    stream.stderr = new EventEmitter()
+    stream.write = vi.fn()
+    stream.end = vi.fn()
+    stream.setWindow = vi.fn()
+    return stream
+  }
+
+  class FakeClient extends EventEmitter {
+    connectConfig: unknown
+    shellImpl: (opts: unknown, cb: (err: Error | null, stream?: unknown) => void) => void
+    execCalls: Array<{ command: string; cb: (err: Error | null, channel?: unknown) => void }> = []
+    lastShellStream: FakeShellStream | undefined
+    end = vi.fn()
+    setNoDelay = vi.fn()
+
+    constructor() {
+      super()
+      this.shellImpl = (_opts, cb) => {
+        this.lastShellStream = makeShellStream()
+        cb(null, this.lastShellStream)
+      }
+      fakeSsh.clients.push(this as unknown as FakeSshClient)
+    }
+
+    connect(config: unknown): void {
+      this.connectConfig = config
+    }
+
+    shell(opts: unknown, cb: (err: Error | null, stream?: unknown) => void): void {
+      this.shellImpl(opts, cb)
+    }
+
+    exec(command: string, cb: (err: Error | null, channel?: unknown) => void): void {
+      this.execCalls.push({ command, cb })
+    }
+  }
+
+  return { Client: FakeClient }
+})
+
+vi.mock('../sshClients', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('../sshClients')>()
+  return {
+    ...actual,
+    connectSessionClient: vi.fn(),
+    openJumpSocket: vi.fn(),
+  }
+})
+
+import { registerSshHandlers, getOwnedSshClient, disposeSshStreamsForSender } from '../ssh'
+import { connectSessionClient, openJumpSocket } from '../sshClients'
+import { METRICS_COMMAND } from '../metrics'
+import { ValidationError, OwnershipError, ConnectionError } from '../errors'
+
+registerSshHandlers()
+
+const LINUX_METRICS_OUTPUT = [
+  'cpu  100 0 100 700 100 0 0 0 0 0',
+  '::MEM::MemTotal:        4096000 kB',
+  'MemAvailable:    1024000 kB',
+  '::DISK::/dev/vda1  102400000 51200000 51200000  50% /',
+  '::LOAD::0.42 0.36 0.30 1/123 4567',
+  '::UP::123456.78 654321.00',
+].join('\n')
+
+let nextSenderId = 1
+
+interface FakeEvent {
+  sender: {
+    id: number
+    isDestroyed: ReturnType<typeof vi.fn>
+    send: ReturnType<typeof vi.fn>
+  }
+}
+
+function makeEvent(): FakeEvent {
+  return {
+    sender: {
+      id: nextSenderId++,
+      isDestroyed: vi.fn(() => false),
+      send: vi.fn(),
+    },
+  }
+}
+
+const VALID_CONFIG = { host: 'example.com', port: 22, username: 'deploy', password: 'pw' }
+
+function invokeConnect(event: FakeEvent, config: unknown = VALID_CONFIG): Promise<string> {
+  const handler = ipc.handlers.get('ssh:connect')
+  if (!handler) throw new Error('ssh:connect handler not registered')
+  return handler(event, config) as Promise<string>
+}
+
+async function connect(event: FakeEvent = makeEvent()) {
+  const pending = invokeConnect(event)
+  const client = fakeSsh.clients.at(-1)
+  if (!client) throw new Error('no ssh client created')
+  client.emit('ready')
+  const streamId = await pending
+  const stream = client.lastShellStream
+  if (!stream) throw new Error('no shell stream opened')
+  return { streamId, client, stream, event }
+}
+
+function makeExecChannel(): FakeShellStream {
+  const chan = new EventEmitter() as FakeShellStream
+  chan.stderr = new EventEmitter()
+  chan.write = vi.fn()
+  chan.end = vi.fn()
+  chan.setWindow = vi.fn()
+  return chan
+}
+
+afterEach(() => {
+  vi.useRealTimers()
+  vi.restoreAllMocks()
+})
+
+describe('ssh:connect', () => {
+  it('resolves with a stream id once the shell is open', async () => {
+    const { streamId, client } = await connect()
+    expect(streamId).toMatch(/^[0-9a-f-]{36}$/i)
+    expect(client.setNoDelay).toHaveBeenCalledWith(true)
+    expect(client.connectConfig).toMatchObject({
+      host: 'example.com',
+      port: 22,
+      username: 'deploy',
+      password: 'pw',
+      tryKeyboard: true,
+    })
+  })
+
+  it('forwards stdout and stderr shell data to the renderer', async () => {
+    const { streamId, stream, event } = await connect()
+    stream.emit('data', Buffer.from('hello'))
+    stream.stderr.emit('data', Buffer.from('oops'))
+    expect(event.sender.send).toHaveBeenCalledWith('ssh:data', streamId, 'hello')
+    expect(event.sender.send).toHaveBeenCalledWith('ssh:data', streamId, 'oops')
+  })
+
+  it('does not send data to a destroyed renderer', async () => {
+    const { stream, event } = await connect()
+    event.sender.isDestroyed.mockReturnValue(true)
+    stream.emit('data', Buffer.from('late'))
+    expect(event.sender.send).not.toHaveBeenCalled()
+  })
+
+  it('notifies the renderer and cleans up when the shell stream closes', async () => {
+    const { streamId, stream, event } = await connect()
+    stream.emit('close')
+    expect(event.sender.send).toHaveBeenCalledWith('ssh:closed', streamId)
+
+    // The stream is gone: further writes are ignored
+    ipc.listeners.get('ssh:data')?.(event, streamId, 'ls\n')
+    expect(stream.write).not.toHaveBeenCalled()
+  })
+
+  it('rejects with a ConnectionError when opening the shell fails', async () => {
+    const event = makeEvent()
+    const pending = invokeConnect(event)
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    client.shellImpl = (_opts, cb) => cb(new Error('no shell for you'))
+    client.emit('ready')
+    await expect(pending).rejects.toThrow(ConnectionError)
+    await expect(pending).rejects.toThrow('no shell for you')
+    expect(client.end).toHaveBeenCalled()
+  })
+
+  it('rejects with a ConnectionError when the client errors before ready', async () => {
+    const event = makeEvent()
+    const pending = invokeConnect(event)
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    client.emit('error', new Error('ECONNREFUSED'))
+    await expect(pending).rejects.toThrow(ConnectionError)
+  })
+
+  it('settles only once when error follows ready', async () => {
+    const { streamId, client, event } = await connect()
+    client.emit('error', new Error('connection reset'))
+    expect(event.sender.send).toHaveBeenCalledWith('ssh:closed', streamId)
+    expect(client.end).toHaveBeenCalled()
+
+    // Stream is unregistered after the late error
+    ipc.listeners.get('ssh:data')?.(event, streamId, 'x')
+    expect(client.lastShellStream?.write).not.toHaveBeenCalled()
+  })
+
+  it('answers keyboard-interactive prompts with the configured password', async () => {
+    const event = makeEvent()
+    const pending = invokeConnect(event)
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    const finish = vi.fn()
+    client.emit('keyboard-interactive', '', '', '', ['Password:', 'Again:'], finish)
+    expect(finish).toHaveBeenCalledWith(['pw', 'pw'])
+    client.emit('ready')
+    await expect(pending).resolves.toBeTruthy()
+  })
+
+  it('answers keyboard-interactive with an empty list when no password is set', async () => {
+    const event = makeEvent()
+    void invokeConnect(event, { host: 'example.com', port: 22, username: 'deploy' })
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    const finish = vi.fn()
+    client.emit('keyboard-interactive', '', '', '', ['Password:'], finish)
+    expect(finish).toHaveBeenCalledWith([])
+  })
+
+  it('rejects malformed configs', async () => {
+    const event = makeEvent()
+    await expect(invokeConnect(event, null)).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: '' })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: 'u', password: 42 })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: 'u', privateKey: 42 })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: 'u', privateKey: 'k'.repeat(65 * 1024) })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: 'u', password: 'p'.repeat(2048) })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'example.com', port: 22, username: 'u', jumpHostId: 42 })).rejects.toThrow(ValidationError)
+    await expect(invokeConnect(event, { host: 'bad host!', port: 22, username: 'u' })).rejects.toThrow()
+    await expect(invokeConnect(event, { host: 'example.com', port: 0, username: 'u' })).rejects.toThrow()
+  })
+})
+
+describe('ssh:connect through a jump host', () => {
+  it('resolves the bastion in main and tunnels the leaf connection through it', async () => {
+    const upstream = { client: {} as never, dispose: vi.fn() }
+    const sock = { jump: 'socket' }
+    vi.mocked(connectSessionClient).mockResolvedValue(upstream)
+    vi.mocked(openJumpSocket).mockResolvedValue(sock as never)
+
+    const event = makeEvent()
+    const pending = invokeConnect(event, { ...VALID_CONFIG, jumpHostId: 'bastion-session' })
+    // Let the awaited bastion connection settle so the leaf client is created
+    await new Promise((r) => setImmediate(r))
+
+    expect(connectSessionClient).toHaveBeenCalledWith('bastion-session')
+    expect(openJumpSocket).toHaveBeenCalledWith(upstream.client, 'example.com', 22)
+
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    client.emit('ready')
+    const streamId = await pending
+    expect((client.connectConfig as { sock?: unknown }).sock).toBe(sock)
+
+    // Closing the leaf shell tears down the bastion chain too
+    client.lastShellStream?.emit('close')
+    expect(upstream.dispose).toHaveBeenCalled()
+    expect(event.sender.send).toHaveBeenCalledWith('ssh:closed', streamId)
+  })
+
+  it('disposes the bastion when the jump socket cannot be opened', async () => {
+    const upstream = { client: {} as never, dispose: vi.fn() }
+    vi.mocked(connectSessionClient).mockResolvedValue(upstream)
+    vi.mocked(openJumpSocket).mockRejectedValue(new ConnectionError('jump host unreachable'))
+
+    const event = makeEvent()
+    await expect(invokeConnect(event, { ...VALID_CONFIG, jumpHostId: 'bastion-session' }))
+      .rejects.toThrow('jump host unreachable')
+    expect(upstream.dispose).toHaveBeenCalled()
+  })
+
+  it('disposes the bastion when the leaf connection fails', async () => {
+    const upstream = { client: {} as never, dispose: vi.fn() }
+    vi.mocked(connectSessionClient).mockResolvedValue(upstream)
+    vi.mocked(openJumpSocket).mockResolvedValue({} as never)
+
+    const event = makeEvent()
+    const pending = invokeConnect(event, { ...VALID_CONFIG, jumpHostId: 'bastion-session' })
+    await new Promise((r) => setImmediate(r))
+    const client = fakeSsh.clients.at(-1)
+    if (!client) throw new Error('no ssh client created')
+    client.emit('error', new Error('auth failed'))
+    await expect(pending).rejects.toThrow(ConnectionError)
+    expect(upstream.dispose).toHaveBeenCalled()
+  })
+})
+
+describe('ssh:data and ssh:resize', () => {
+  it('writes renderer input to the shell stream', async () => {
+    const { streamId, stream, event } = await connect()
+    ipc.listeners.get('ssh:data')?.(event, streamId, 'ls -la\n')
+    expect(stream.write).toHaveBeenCalledWith('ls -la\n')
+  })
+
+  it('silently drops invalid stream ids, oversized payloads, and foreign senders', async () => {
+    const { streamId, stream, event } = await connect()
+    const dataListener = ipc.listeners.get('ssh:data')
+    dataListener?.(event, 'not-a-uuid', 'x')
+    dataListener?.(event, streamId, 'y'.repeat(65 * 1024))
+    dataListener?.(makeEvent(), streamId, 'stolen input')
+    expect(stream.write).not.toHaveBeenCalled()
+  })
+
+  it('resizes the pty via setWindow', async () => {
+    const { streamId, stream, event } = await connect()
+    ipc.listeners.get('ssh:resize')?.(event, streamId, 120, 40)
+    expect(stream.setWindow).toHaveBeenCalledWith(40, 120, 0, 0)
+  })
+
+  it('rethrows unexpected internal errors instead of swallowing them', async () => {
+    const { streamId } = await connect()
+    const broken = { sender: null } as never
+    expect(() => ipc.listeners.get('ssh:data')?.(broken, streamId, 'x')).toThrow(TypeError)
+    expect(() => ipc.listeners.get('ssh:resize')?.(broken, streamId, 80, 24)).toThrow(TypeError)
+    expect(() => ipc.listeners.get('ssh:metrics-stop')?.(broken, streamId)).toThrow(TypeError)
+  })
+
+  it('ignores invalid dimensions', async () => {
+    const { streamId, stream, event } = await connect()
+    const resize = ipc.listeners.get('ssh:resize')
+    resize?.(event, streamId, 0, 40)
+    resize?.(event, streamId, 120, 1001)
+    resize?.(event, streamId, 1.5, 40)
+    expect(stream.setWindow).not.toHaveBeenCalled()
+  })
+})
+
+describe('ssh:disconnect and ownership', () => {
+  it('ends the stream and the client', async () => {
+    const { streamId, stream, client, event } = await connect()
+    ipc.handlers.get('ssh:disconnect')?.(event, streamId)
+    expect(stream.end).toHaveBeenCalled()
+    expect(client.end).toHaveBeenCalled()
+  })
+
+  it('throws OwnershipError when another window tries to disconnect', async () => {
+    const { streamId } = await connect()
+    expect(() => ipc.handlers.get('ssh:disconnect')?.(makeEvent(), streamId)).toThrow(OwnershipError)
+  })
+
+  it('getOwnedSshClient returns the client for the owner and validates ids', async () => {
+    const { streamId, client, event } = await connect()
+    expect(getOwnedSshClient(event as never, streamId)).toBe(client)
+    expect(getOwnedSshClient(event as never, '11111111-1111-4111-8111-111111111111')).toBeUndefined()
+    expect(() => getOwnedSshClient(event as never, 'nope')).toThrow(ValidationError)
+    expect(() => getOwnedSshClient(makeEvent() as never, streamId)).toThrow(OwnershipError)
+  })
+
+  it('disposeSshStreamsForSender disposes every stream owned by that sender', async () => {
+    const { stream, client, event } = await connect()
+    const other = await connect()
+    disposeSshStreamsForSender(event.sender.id)
+    expect(stream.end).toHaveBeenCalled()
+    expect(client.end).toHaveBeenCalled()
+    expect(other.stream.end).not.toHaveBeenCalled()
+  })
+})
+
+describe('ssh metrics polling', () => {
+  it('fetches metrics immediately and emits parsed results to the renderer', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    expect(client.execCalls).toHaveLength(1)
+    expect(client.execCalls[0].command).toBe(METRICS_COMMAND)
+
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('data', Buffer.from(LINUX_METRICS_OUTPUT))
+    chan.stderr.emit('data', Buffer.from('cat: /proc/stat: No such file'))
+    chan.emit('close')
+
+    expect(event.sender.send).toHaveBeenCalledWith(
+      'ssh:metrics',
+      streamId,
+      expect.objectContaining({ available: true, memTotal: 4096000 * 1024, load1: 0.42 })
+    )
+  })
+
+  it('computes a CPU delta on the second sample', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+
+    const first = makeExecChannel()
+    client.execCalls[0].cb(null, first)
+    first.emit('data', Buffer.from(LINUX_METRICS_OUTPUT))
+    first.emit('close')
+
+    vi.advanceTimersByTime(2000)
+    expect(client.execCalls).toHaveLength(2)
+    const second = makeExecChannel()
+    client.execCalls[1].cb(null, second)
+    // 1000 more jiffies, 200 of them idle → 80% busy
+    second.emit('data', Buffer.from(LINUX_METRICS_OUTPUT.replace(
+      'cpu  100 0 100 700 100 0 0 0 0 0',
+      'cpu  500 0 500 850 150 0 0 0 0 0',
+    )))
+    second.emit('close')
+
+    const metricsCalls = event.sender.send.mock.calls.filter((c) => c[0] === 'ssh:metrics')
+    expect(metricsCalls).toHaveLength(2)
+    expect(metricsCalls[0][2].cpu).toBe(0)
+    expect(metricsCalls[1][2].cpu).toBe(80)
+  })
+
+  it('skips overlapping fetches while one is in flight, then resumes on the interval', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    expect(client.execCalls).toHaveLength(1)
+
+    // First exec never completes: the 2s and 5s timers must not stack requests
+    vi.advanceTimersByTime(7000)
+    expect(client.execCalls).toHaveLength(1)
+
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('data', Buffer.from(LINUX_METRICS_OUTPUT))
+    chan.emit('close')
+
+    vi.advanceTimersByTime(5000)
+    expect(client.execCalls).toHaveLength(2)
+  })
+
+  it('clears the in-flight flag when exec itself fails', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    client.execCalls[0].cb(new Error('exec failed'))
+
+    vi.advanceTimersByTime(5000)
+    expect(client.execCalls).toHaveLength(2)
+  })
+
+  it('logs and recovers when the metrics channel errors', async () => {
+    vi.useFakeTimers()
+    const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('error', new Error('channel torn down'))
+    expect(errorSpy).toHaveBeenCalledWith(expect.stringContaining('metrics exec'))
+
+    vi.advanceTimersByTime(5000)
+    expect(client.execCalls).toHaveLength(2)
+  })
+
+  it('logs instead of crashing when emitting metrics throws', async () => {
+    vi.useFakeTimers()
+    const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+
+    event.sender.send.mockImplementationOnce(() => { throw new Error('renderer gone') })
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('data', Buffer.from(LINUX_METRICS_OUTPUT))
+    chan.emit('close')
+
+    expect(errorSpy).toHaveBeenCalledWith(expect.stringContaining('metrics parse'))
+  })
+
+  it('stops polling on ssh:metrics-stop', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('close')
+
+    ipc.listeners.get('ssh:metrics-stop')?.(event, streamId)
+    vi.advanceTimersByTime(60_000)
+    expect(client.execCalls).toHaveLength(1)
+  })
+
+  it('ignores metrics-stop for invalid ids and foreign senders', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('close')
+
+    const stop = ipc.listeners.get('ssh:metrics-stop')
+    stop?.(event, 'not-a-uuid')
+    stop?.(makeEvent(), streamId)
+
+    // Polling continues because neither call was allowed to stop it
+    vi.advanceTimersByTime(2000)
+    expect(client.execCalls).toHaveLength(2)
+  })
+
+  it('stops polling when the stream is disconnected', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    const chan = makeExecChannel()
+    client.execCalls[0].cb(null, chan)
+    chan.emit('close')
+
+    ipc.handlers.get('ssh:disconnect')?.(event, streamId)
+    vi.advanceTimersByTime(60_000)
+    expect(client.execCalls).toHaveLength(1)
+  })
+
+  it('does nothing when metrics-start targets an unknown stream', async () => {
+    const { event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, '11111111-1111-4111-8111-111111111111')
+    expect(() => ipc.handlers.get('ssh:metrics-start')?.(event, 'bogus')).toThrow(ValidationError)
+  })
+
+  it('restarting metrics replaces the previous timers', async () => {
+    vi.useFakeTimers()
+    const { streamId, client, event } = await connect()
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    const first = makeExecChannel()
+    client.execCalls[0].cb(null, first)
+    first.emit('close')
+
+    // Restart clears the old timers and fetches again immediately
+    ipc.handlers.get('ssh:metrics-start')?.(event, streamId)
+    expect(client.execCalls).toHaveLength(2)
+    const second = makeExecChannel()
+    client.execCalls[1].cb(null, second)
+    second.emit('close')
+
+    vi.advanceTimersByTime(2000)
+    expect(client.execCalls).toHaveLength(3)
+  })
+})
diff --git a/src/main/ipc/__tests__/sshConfig.test.ts b/src/main/ipc/__tests__/sshConfig.test.ts
index 4c83315..7a5d202 100644
--- a/src/main/ipc/__tests__/sshConfig.test.ts
+++ b/src/main/ipc/__tests__/sshConfig.test.ts
@@ -1,5 +1,23 @@
-import { describe, it, expect } from 'vitest'
-import { parseSshConfig } from '../sshConfig'
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+const { ipc, readFileMock } = vi.hoisted(() => ({
+  ipc: { handlers: new Map<string, (...args: unknown[]) => unknown>() },
+  readFileMock: vi.fn(),
+}))
+
+vi.mock('electron', () => ({
+  ipcMain: {
+    handle: vi.fn((channel: string, fn: (...args: unknown[]) => unknown) => {
+      ipc.handlers.set(channel, fn)
+    }),
+    on: vi.fn(),
+  },
+}))
+vi.mock('node:fs/promises', () => ({
+  readFile: readFileMock,
+}))
+
+import { parseSshConfig, registerSshConfigHandlers } from '../sshConfig'
 
 describe('parseSshConfig', () => {
   it('parses a basic host block', () => {
@@ -101,4 +119,65 @@ Host direct
     expect(parseSshConfig('')).toEqual([])
     expect(parseSshConfig('# nothing here\n')).toEqual([])
   })
+
+  it('skips directives without a value', () => {
+    // A bare keyword ("Host" with no argument) is not a valid directive
+    const hosts = parseSshConfig('Host\nHost real\n  HostName\n  Port\n')
+    expect(hosts).toEqual([
+      { alias: 'real', host: 'real', port: 22, username: undefined, keyPath: undefined },
+    ])
+  })
+
+  it('ignores unrelated directives inside a host block', () => {
+    const hosts = parseSshConfig('Host web\n  ServerAliveInterval 60\n  Compression yes\n')
+    expect(hosts).toEqual([
+      { alias: 'web', host: 'web', port: 22, username: undefined, keyPath: undefined },
+    ])
+  })
+
+  it('drops quoted wildcard patterns and keeps quoted concrete aliases', () => {
+    const hosts = parseSshConfig('Host "web prod" "*"\n  HostName 10.0.0.4\n')
+    // "web prod" splits on whitespace before unquoting, so each token is checked on its own
+    expect(hosts.every(h => h.host === '10.0.0.4')).toBe(true)
+    expect(hosts.some(h => h.alias.includes('*'))).toBe(false)
+  })
+})
+
+describe('sshconfig:hosts handler', () => {
+  registerSshConfigHandlers()
+  const invoke = () => {
+    const handler = ipc.handlers.get('sshconfig:hosts')
+    if (!handler) throw new Error('sshconfig:hosts handler not registered')
+    return handler() as Promise<unknown>
+  }
+
+  beforeEach(() => {
+    readFileMock.mockReset()
+  })
+
+  it('reads ~/.ssh/config and returns parsed hosts', async () => {
+    readFileMock.mockResolvedValue('Host web\n  HostName web.example.com\n  Port 2200\n')
+    await expect(invoke()).resolves.toEqual([
+      { alias: 'web', host: 'web.example.com', port: 2200, username: undefined, keyPath: undefined },
+    ])
+    expect(readFileMock).toHaveBeenCalledWith(
+      expect.stringMatching(/[/\\]\.ssh[/\\]config$/),
+      'utf-8'
+    )
+  })
+
+  it('returns an empty list when the config file does not exist', async () => {
+    readFileMock.mockRejectedValue(Object.assign(new Error('missing'), { code: 'ENOENT' }))
+    await expect(invoke()).resolves.toEqual([])
+  })
+
+  it('wraps other read errors with a descriptive message', async () => {
+    readFileMock.mockRejectedValue(Object.assign(new Error('permission denied'), { code: 'EACCES' }))
+    await expect(invoke()).rejects.toThrow('Cannot read ~/.ssh/config: permission denied')
+  })
+
+  it('stringifies non-Error rejection reasons', async () => {
+    readFileMock.mockRejectedValue('disk on fire')
+    await expect(invoke()).rejects.toThrow('Cannot read ~/.ssh/config: disk on fire')
+  })
 })
diff --git a/src/main/ipc/__tests__/tunnels.test.ts b/src/main/ipc/__tests__/tunnels.test.ts
new file mode 100644
index 0000000..60c61e7
--- /dev/null
+++ b/src/main/ipc/__tests__/tunnels.test.ts
@@ -0,0 +1,352 @@
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest'
+import { EventEmitter } from 'node:events'
+
+const windows: Array<{ webContents: { isDestroyed: () => boolean; send: Mock } }> = []
+
+vi.mock('electron', () => ({
+  ipcMain: { handle: vi.fn(), on: vi.fn() },
+  BrowserWindow: { getAllWindows: () => windows },
+}))
+vi.mock('electron-store', () => ({
+  default: class MockStore {
+    private data = new Map<string, unknown>()
+    constructor(opts?: { defaults?: Record<string, unknown> }) {
+      for (const [k, v] of Object.entries(opts?.defaults ?? {})) this.data.set(k, v)
+    }
+    get(key: string) { return this.data.get(key) }
+    set(key: string, value: unknown) { this.data.set(key, value) }
+  },
+}))
+vi.mock('node:net', () => ({
+  createServer: vi.fn(),
+  connect: vi.fn(),
+}))
+vi.mock('../sshClients', () => ({
+  connectSessionClient: vi.fn(),
+}))
+vi.mock('../sessions', () => ({
+  getSessionById: vi.fn(() => ({ id: 's1', label: 'server' })),
+}))
+
+import { ipcMain } from 'electron'
+import { createServer, connect as netConnect } from 'node:net'
+import { connectSessionClient } from '../sshClients'
+import { getSessionById } from '../sessions'
+import { registerTunnelHandlers, disposeAllTunnels, listTunnels, TunnelDef } from '../tunnels'
+import { ValidationError, NotFoundError } from '../errors'
+import { SOCKS_REPLY, socksConnectReply, socksGreetingReply } from '../socks'
+
+registerTunnelHandlers()
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type Handler = (...args: any[]) => any
+
+function handler(channel: string): Handler {
+  const call = (ipcMain.handle as Mock).mock.calls.find((c) => c[0] === channel)
+  if (!call) throw new Error(`No handler registered for ${channel}`)
+  return call[1] as Handler
+}
+
+class FakeServer extends EventEmitter {
+  listen = vi.fn((_port: number, _host: string, cb: () => void) => cb())
+  close = vi.fn()
+}
+
+type ConnHandler = (socket: FakeSocket) => void
+
+interface NetState {
+  server: FakeServer
+  connHandler: ConnHandler | undefined
+}
+
+function primeCreateServer(): NetState {
+  const state: NetState = { server: new FakeServer(), connHandler: undefined }
+  // Replace (not queue) the implementation so an unused priming can't leak
+  // into a later test.
+  ;(createServer as Mock).mockImplementation((h: ConnHandler) => {
+    state.connHandler = h
+    return state.server
+  })
+  return state
+}
+
+interface FakeSshClient extends EventEmitter {
+  forwardOut: Mock
+  forwardIn: Mock
+}
+
+function fakeConn() {
+  const client = new EventEmitter() as FakeSshClient
+  client.forwardOut = vi.fn()
+  client.forwardIn = vi.fn()
+  return { client, dispose: vi.fn() }
+}
+
+interface FakeSocket extends EventEmitter {
+  write: Mock
+  end: Mock
+  destroy: Mock
+  pipe: Mock
+  remoteAddress?: string
+  remotePort?: number
+}
+
+function fakeSocket(): FakeSocket {
+  const s = new EventEmitter() as FakeSocket
+  s.write = vi.fn()
+  s.end = vi.fn()
+  s.destroy = vi.fn()
+  s.pipe = vi.fn()
+  return s
+}
+
+function fakeStream(): FakeSocket {
+  return fakeSocket()
+}
+
+const DYNAMIC_DEF = { type: 'dynamic', sessionId: 's1', listenPort: 1080 }
+const LOCAL_DEF = { type: 'local', sessionId: 's1', listenPort: 15432, targetHost: 'db.internal', targetPort: 5432 }
+const REMOTE_DEF = { type: 'remote', sessionId: 's1', listenPort: 9000, targetHost: 'localhost', targetPort: 8080 }
+
+async function saveAndStart(rawDef: Record<string, unknown>, conn = fakeConn()) {
+  const def = (await handler('tunnels:save')({}, rawDef, undefined)) as TunnelDef
+  const net = primeCreateServer()
+  ;(connectSessionClient as Mock).mockResolvedValueOnce(conn)
+  await handler('tunnels:start')({}, def.id)
+  return { def, conn, net }
+}
+
+beforeEach(() => {
+  disposeAllTunnels()
+  windows.length = 0
+  ;(connectSessionClient as Mock).mockClear()
+  vi.spyOn(console, 'error').mockImplementation(() => {})
+})
+
+describe('tunnels:save validation and persistence', () => {
+  it('rejects malformed definitions', () => {
+    const save = handler('tunnels:save')
+    expect(() => save({}, null, undefined)).toThrow(ValidationError)
+    expect(() => save({}, { ...DYNAMIC_DEF, type: 'socks' }, undefined)).toThrow(ValidationError)
+    expect(() => save({}, { ...DYNAMIC_DEF, label: 'x'.repeat(65) }, undefined)).toThrow(ValidationError)
+    expect(() => save({}, { ...DYNAMIC_DEF, listenPort: 0 }, undefined)).toThrow('Invalid listen port')
+    expect(() => save({}, { ...LOCAL_DEF, targetHost: 'bad host!' }, undefined)).toThrow('illegal characters')
+    ;(getSessionById as Mock).mockReturnValueOnce(undefined)
+    expect(() => save({}, DYNAMIC_DEF, undefined)).toThrow(NotFoundError)
+  })
+
+  it('creates, lists, updates in place, and deletes tunnels', async () => {
+    const win = { webContents: { isDestroyed: () => false, send: vi.fn() } }
+    windows.push(win)
+    const created = (await handler('tunnels:save')({}, { ...DYNAMIC_DEF, label: 'proxy' }, undefined)) as TunnelDef
+    expect(created.id).toEqual(expect.any(String))
+    expect(win.webContents.send).toHaveBeenCalledWith('tunnel:changed')
+
+    const listed = listTunnels().find((t) => t.id === created.id)
+    expect(listed).toMatchObject({ label: 'proxy', status: 'stopped', connections: 0 })
+
+    const updated = (await handler('tunnels:save')({}, { ...DYNAMIC_DEF, listenPort: 1081 }, created.id)) as TunnelDef
+    expect(updated.id).toBe(created.id)
+    expect(listTunnels().find((t) => t.id === created.id)?.listenPort).toBe(1081)
+
+    await handler('tunnels:delete')({}, created.id)
+    expect(listTunnels().find((t) => t.id === created.id)).toBeUndefined()
+  })
+
+  it('rejects operations on unknown or malformed tunnel ids', async () => {
+    expect(() => handler('tunnels:delete')({}, 42)).toThrow(ValidationError)
+    await expect(handler('tunnels:start')({}, 'missing')).rejects.toBeInstanceOf(NotFoundError)
+    expect(() => handler('tunnels:stop')({}, 'missing')).toThrow(NotFoundError)
+  })
+})
+
+describe('local forward', () => {
+  it('forwards accepted sockets through the SSH connection', async () => {
+    const { def, conn, net } = await saveAndStart(LOCAL_DEF)
+    expect(net.server.listen).toHaveBeenCalledWith(15432, '127.0.0.1', expect.any(Function))
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('active')
+
+    const socket = fakeSocket()
+    socket.remoteAddress = '127.0.0.1'
+    socket.remotePort = 50000
+    net.connHandler!(socket)
+    expect(conn.client.forwardOut).toHaveBeenCalledWith('127.0.0.1', 50000, 'db.internal', 5432, expect.any(Function))
+
+    const stream = fakeStream()
+    conn.client.forwardOut.mock.calls[0][4](null, stream)
+    expect(socket.pipe).toHaveBeenCalledWith(stream)
+    expect(stream.pipe).toHaveBeenCalledWith(socket)
+    expect(listTunnels().find((t) => t.id === def.id)?.connections).toBe(1)
+  })
+
+  it('destroys the socket when the SSH channel cannot open', async () => {
+    const { conn, net } = await saveAndStart(LOCAL_DEF)
+    const socket = fakeSocket()
+    net.connHandler!(socket)
+    conn.client.forwardOut.mock.calls[0][4](new Error('refused'))
+    expect(socket.destroy).toHaveBeenCalled()
+  })
+
+  it('fails to start when the local port cannot be bound', async () => {
+    const def = (await handler('tunnels:save')({}, LOCAL_DEF, undefined)) as TunnelDef
+    const net = primeCreateServer()
+    net.server.listen.mockImplementation(() => {
+      net.server.emit('error', new Error('EADDRINUSE'))
+    })
+    const conn = fakeConn()
+    ;(connectSessionClient as Mock).mockResolvedValueOnce(conn)
+    await expect(handler('tunnels:start')({}, def.id)).rejects.toThrow('Cannot listen on 127.0.0.1:15432')
+    expect(conn.dispose).toHaveBeenCalled()
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('stopped')
+  })
+
+  it('does not start the same tunnel twice', async () => {
+    const { def } = await saveAndStart(LOCAL_DEF)
+    await handler('tunnels:start')({}, def.id)
+    expect(connectSessionClient).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('dynamic (SOCKS5) forward', () => {
+  function socksClient(net: NetState): FakeSocket {
+    const socket = fakeSocket()
+    net.connHandler!(socket)
+    return socket
+  }
+
+  it('destroys sockets that do not speak SOCKS', async () => {
+    const { net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = socksClient(net)
+    socket.emit('data', Buffer.from([0x04, 0x01])) // SOCKS4, unsupported
+    expect(socket.destroy).toHaveBeenCalled()
+  })
+
+  it('negotiates no-auth and connects an IPv4 CONNECT request', async () => {
+    const { conn, net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = socksClient(net)
+
+    socket.emit('data', Buffer.from([0x05, 0x01, 0x00]))
+    expect(socket.write).toHaveBeenCalledWith(socksGreetingReply())
+
+    socket.emit('data', Buffer.from([0x05, 0x01, 0x00, 0x01, 10, 0, 0, 7, 0x00, 0x50]))
+    expect(conn.client.forwardOut).toHaveBeenCalledWith('127.0.0.1', 0, '10.0.0.7', 80, expect.any(Function))
+
+    const stream = fakeStream()
+    conn.client.forwardOut.mock.calls[0][4](null, stream)
+    expect(socket.write).toHaveBeenCalledWith(socksConnectReply(SOCKS_REPLY.success))
+    expect(socket.pipe).toHaveBeenCalledWith(stream)
+  })
+
+  it('replies with an error code for unsupported SOCKS commands', async () => {
+    const { conn, net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = socksClient(net)
+    socket.emit('data', Buffer.from([0x05, 0x01, 0x00]))
+    socket.emit('data', Buffer.from([0x05, 0x02, 0x00, 0x01, 10, 0, 0, 7, 0x00, 0x50])) // BIND
+    expect(socket.end).toHaveBeenCalledWith(socksConnectReply(SOCKS_REPLY.commandNotSupported))
+    expect(conn.client.forwardOut).not.toHaveBeenCalled()
+  })
+
+  it('replies connection-refused when the SSH channel cannot open', async () => {
+    const { conn, net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = socksClient(net)
+    socket.emit('data', Buffer.from([0x05, 0x01, 0x00]))
+    socket.emit('data', Buffer.from([0x05, 0x01, 0x00, 0x01, 10, 0, 0, 7, 0x00, 0x50]))
+    conn.client.forwardOut.mock.calls[0][4](new Error('no route'))
+    expect(socket.end).toHaveBeenCalledWith(socksConnectReply(SOCKS_REPLY.connectionRefused))
+  })
+
+  it('destroys sockets on socket errors', async () => {
+    const { net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = socksClient(net)
+    socket.emit('error', new Error('reset'))
+    expect(socket.destroy).toHaveBeenCalled()
+  })
+})
+
+describe('remote forward', () => {
+  it('asks the server to listen and pipes accepted connections to the local target', async () => {
+    const conn = fakeConn()
+    conn.client.forwardIn.mockImplementation((_h: string, _p: number, cb: (e?: Error) => void) => cb())
+    const { def } = await saveAndStart(REMOTE_DEF, conn)
+    expect(conn.client.forwardIn).toHaveBeenCalledWith('127.0.0.1', 9000, expect.any(Function))
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('active')
+
+    const channel = fakeStream()
+    const local = fakeSocket()
+    ;(netConnect as Mock).mockReturnValueOnce(local)
+    conn.client.emit('tcp connection', {}, () => channel)
+    expect(netConnect).toHaveBeenCalledWith(8080, 'localhost')
+
+    local.emit('connect')
+    expect(channel.pipe).toHaveBeenCalledWith(local)
+    expect(local.pipe).toHaveBeenCalledWith(channel)
+  })
+
+  it('destroys the channel when the local connection fails', async () => {
+    const conn = fakeConn()
+    conn.client.forwardIn.mockImplementation((_h: string, _p: number, cb: (e?: Error) => void) => cb())
+    await saveAndStart(REMOTE_DEF, conn)
+
+    const channel = fakeStream()
+    const local = fakeSocket()
+    ;(netConnect as Mock).mockReturnValueOnce(local)
+    conn.client.emit('tcp connection', {}, () => channel)
+    local.emit('error', new Error('ECONNREFUSED'))
+    expect(channel.destroy).toHaveBeenCalled()
+  })
+
+  it('rejects when the server refuses the remote listen', async () => {
+    const def = (await handler('tunnels:save')({}, REMOTE_DEF, undefined)) as TunnelDef
+    const conn = fakeConn()
+    conn.client.forwardIn.mockImplementation((_h: string, _p: number, cb: (e?: Error) => void) => cb(new Error('denied')))
+    ;(connectSessionClient as Mock).mockResolvedValueOnce(conn)
+    await expect(handler('tunnels:start')({}, def.id)).rejects.toThrow('Server refused to listen on port 9000')
+    expect(conn.dispose).toHaveBeenCalled()
+  })
+})
+
+describe('lifecycle: stop, SSH drops, disposeAllTunnels', () => {
+  it('tunnels:stop closes the listener, sockets, and connection', async () => {
+    const { def, conn, net } = await saveAndStart(DYNAMIC_DEF)
+    const socket = fakeSocket()
+    net.connHandler!(socket)
+    await handler('tunnels:stop')({}, def.id)
+    expect(net.server.close).toHaveBeenCalled()
+    expect(socket.destroy).toHaveBeenCalled()
+    expect(conn.dispose).toHaveBeenCalled()
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('stopped')
+  })
+
+  it('a dropped SSH connection tears the tunnel down', async () => {
+    const { def, conn, net } = await saveAndStart(DYNAMIC_DEF)
+    conn.client.emit('close')
+    expect(net.server.close).toHaveBeenCalled()
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('stopped')
+  })
+
+  it('an SSH error marks the tunnel as errored but keeps it listed', async () => {
+    const { def, conn } = await saveAndStart(DYNAMIC_DEF)
+    conn.client.emit('error', new Error('keepalive timeout'))
+    const listed = listTunnels().find((t) => t.id === def.id)
+    expect(listed?.status).toBe('error')
+    expect(listed?.error).toBe('keepalive timeout')
+  })
+
+  it('updating an active tunnel stops it first', async () => {
+    const { def, conn } = await saveAndStart(DYNAMIC_DEF)
+    await handler('tunnels:save')({}, { ...DYNAMIC_DEF, listenPort: 1082 }, def.id)
+    expect(conn.dispose).toHaveBeenCalled()
+    expect(listTunnels().find((t) => t.id === def.id)?.status).toBe('stopped')
+  })
+
+  it('disposeAllTunnels stops every active tunnel', async () => {
+    const a = await saveAndStart(DYNAMIC_DEF)
+    const b = await saveAndStart(LOCAL_DEF)
+    disposeAllTunnels()
+    expect(a.conn.dispose).toHaveBeenCalled()
+    expect(b.conn.dispose).toHaveBeenCalled()
+    expect(a.net.server.close).toHaveBeenCalled()
+    expect(b.net.server.close).toHaveBeenCalled()
+    expect(listTunnels().every((t) => t.status === 'stopped')).toBe(true)
+  })
+})
diff --git a/src/main/ipc/database.ts b/src/main/ipc/database.ts
index 9a1e42e..441e19b 100644
--- a/src/main/ipc/database.ts
+++ b/src/main/ipc/database.ts
@@ -1,18 +1,20 @@
 import { ipcMain, IpcMainInvokeEvent } from 'electron'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { Pool as PgPool } from 'pg'
 import mysql from 'mysql2/promise'
 import { ConnectionError, NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
 import { validateHost, validatePort } from './security'
 
 type DbType = 'postgresql' | 'mysql' | 'mariadb'
-type SslMode = 'disable' | 'require' | 'verify-ca' | 'verify-full' | undefined
+type SslMode = 'disable' | 'require' | 'verify-ca' | 'verify-full'
 
 interface QueryResult { columns: string[]; rows: unknown[]; rowCount: number; duration: number }
 
+type QueryParam = string | number | boolean | null
+
 interface DbConnection {
   type: DbType
-  query: (sql: string) => Promise<QueryResult>
+  query: (sql: string, params?: QueryParam[]) => Promise<QueryResult>
   close: () => Promise<void>
   getTables: () => Promise<string[]>
   getTableInfo: (table: string) => Promise<{ columns: { name: string; type: string; nullable: boolean }[] }>
@@ -41,6 +43,19 @@ function validateConnId(id: unknown): string {
   return id
 }
 
+const MAX_QUERY_PARAMS = 256
+
+function validateQueryParams(raw: unknown): QueryParam[] | undefined {
+  if (raw === undefined || raw === null) return undefined
+  if (!Array.isArray(raw) || raw.length > MAX_QUERY_PARAMS) throw new ValidationError('Invalid query parameters')
+  for (const v of raw) {
+    if (v !== null && typeof v !== 'string' && typeof v !== 'number' && typeof v !== 'boolean') {
+      throw new ValidationError('Query parameters must be scalar values')
+    }
+  }
+  return raw as QueryParam[]
+}
+
 function requireOwnedConn(event: IpcMainInvokeEvent, rawId: unknown): DbConnection {
   const id = validateConnId(rawId)
   const entry = connections.get(id)
@@ -66,7 +81,10 @@ function validateConnectConfig(raw: unknown): DbConnectConfig {
   if (typeof c.database !== 'string' || c.database.length === 0 || c.database.length > MAX_DATABASE_LENGTH) {
     throw new ValidationError('Database name is required')
   }
-  const ssl = c.ssl === undefined ? undefined : String(c.ssl)
+  if (c.ssl !== undefined && typeof c.ssl !== 'string') {
+    throw new ValidationError('Invalid SSL mode')
+  }
+  const ssl = c.ssl as string | undefined
   if (ssl !== undefined && !['disable', 'require', 'verify-ca', 'verify-full'].includes(ssl)) {
     throw new ValidationError(`Invalid SSL mode: ${ssl}`)
   }
@@ -77,17 +95,12 @@ function validateConnectConfig(raw: unknown): DbConnectConfig {
     username: c.username,
     password: (c.password as string | undefined) || undefined,
     database: c.database,
-    ssl: ssl as SslMode,
+    ssl: ssl as SslMode | undefined,
   }
 }
 
-function pgSslOption(mode: SslMode): boolean | { rejectUnauthorized: boolean } | undefined {
-  if (mode === 'verify-full' || mode === 'verify-ca') return { rejectUnauthorized: true }
-  if (mode === 'require') return { rejectUnauthorized: false }
-  return undefined
-}
-
-function mysqlSslOption(mode: SslMode): Record<string, unknown> | undefined {
+// Shared by pg and mysql2 — both accept { rejectUnauthorized } for their ssl option.
+function sslOption(mode: SslMode | undefined): { rejectUnauthorized: boolean } | undefined {
   if (mode === 'verify-full' || mode === 'verify-ca') return { rejectUnauthorized: true }
   if (mode === 'require') return { rejectUnauthorized: false }
   return undefined
@@ -100,7 +113,7 @@ async function connectPostgres(config: DbConnectConfig): Promise<DbConnection> {
     user: config.username,
     password: config.password,
     database: config.database,
-    ssl: pgSslOption(config.ssl),
+    ssl: sslOption(config.ssl),
     connectionTimeoutMillis: 20_000,
     idleTimeoutMillis: 30_000,
     max: 4,
@@ -119,9 +132,9 @@ async function connectPostgres(config: DbConnectConfig): Promise<DbConnection> {
 
   return {
     type: 'postgresql',
-    async query(sql: string) {
+    async query(sql: string, params?: QueryParam[]) {
       const start = Date.now()
-      const result = await pool.query(sql)
+      const result = await pool.query(sql, params)
       return {
         columns: result.fields?.map(f => f.name) ?? [],
         rows: result.rows ?? [],
@@ -161,7 +174,7 @@ async function connectMysql(config: DbConnectConfig): Promise<DbConnection> {
     user: config.username,
     password: config.password,
     database: config.database,
-    ssl: mysqlSslOption(config.ssl),
+    ssl: sslOption(config.ssl),
     connectionLimit: 4,
     connectTimeout: 20_000,
     enableKeepAlive: true,
@@ -178,9 +191,9 @@ async function connectMysql(config: DbConnectConfig): Promise<DbConnection> {
 
   return {
     type: config.dbType === 'mariadb' ? 'mariadb' : 'mysql',
-    async query(sql: string) {
+    async query(sql: string, params?: QueryParam[]) {
       const start = Date.now()
-      const [rows, fields] = await pool.query(sql)
+      const [rows, fields] = await pool.query(sql, params)
       const resultRows = Array.isArray(rows) ? rows as unknown[] : []
       const resultFields = Array.isArray(fields) ? fields : []
       return {
@@ -243,14 +256,14 @@ export function registerDatabaseHandlers(): void {
     }
   })
 
-  ipcMain.handle('db:query', async (event, rawId: unknown, sql: unknown) => {
+  ipcMain.handle('db:query', async (event, rawId: unknown, sql: unknown, rawParams: unknown) => {
     if (typeof sql !== 'string' || sql.trim().length === 0) {
       throw new ValidationError('SQL query is required')
     }
     if (Buffer.byteLength(sql, 'utf8') > MAX_SQL_BYTES) {
       throw new ValidationError(`SQL query exceeds ${MAX_SQL_BYTES} bytes`)
     }
-    return requireOwnedConn(event, rawId).query(sql)
+    return requireOwnedConn(event, rawId).query(sql, validateQueryParams(rawParams))
   })
 
   ipcMain.handle('db:tables', async (event, rawId: unknown) => {
diff --git a/src/main/ipc/docker.ts b/src/main/ipc/docker.ts
index bcd50b8..f1da4c4 100644
--- a/src/main/ipc/docker.ts
+++ b/src/main/ipc/docker.ts
@@ -1,6 +1,6 @@
 import { ipcMain, IpcMainInvokeEvent, WebContents } from 'electron'
 import { ClientChannel } from 'ssh2'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { connectSessionClient, ManagedSshConnection } from './sshClients'
 import { ConnectionError, NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
 
@@ -60,6 +60,30 @@ export function parseJsonLines(output: string): Record<string, unknown>[] {
   return rows
 }
 
+// Wires a `docker logs -f` channel to the renderer and returns the stream id.
+function attachLogStream(sender: WebContents, stream: ClientChannel): string {
+  const logId = randomUUID()
+  logStreams.set(logId, { channel: stream, senderId: sender.id })
+
+  const send = (data: Buffer) => {
+    if (!sender.isDestroyed()) sender.send('docker:logChunk', logId, data.toString('utf8'))
+  }
+  // 'error' is typically followed by 'close'; only the first terminal event
+  // may notify, so an error message isn't clobbered by a null from 'close'.
+  let settled = false
+  const finish = (error: string | null) => {
+    if (settled) return
+    settled = true
+    logStreams.delete(logId)
+    if (!sender.isDestroyed()) sender.send('docker:logEnd', logId, error)
+  }
+  stream.on('data', send)
+  stream.stderr.on('data', send)
+  stream.on('close', () => finish(null))
+  stream.on('error', (e: unknown) => finish(toMessage(e)))
+  return logId
+}
+
 function requireSession(event: IpcMainInvokeEvent, rawId: unknown): DockerSession {
   if (typeof rawId !== 'string') throw new ValidationError('Invalid Docker session id')
   const entry = sessions.get(rawId)
@@ -75,15 +99,14 @@ function execCollect(entry: DockerSession, command: string): Promise<string> {
 
       let stdout = ''
       let stderr = ''
-      let truncated = false
       const timer = setTimeout(() => {
         stream.close()
         reject(new ConnectionError('Remote command timed out'))
       }, EXEC_TIMEOUT_MS)
 
       stream.on('data', (d: Buffer) => {
+        // Over-limit output is dropped; parseJsonLines skips the partial tail line.
         if (stdout.length < MAX_OUTPUT_BYTES) stdout += d.toString('utf8')
-        else truncated = true
       })
       stream.stderr.on('data', (d: Buffer) => {
         if (stderr.length < 16 * 1024) stderr += d.toString('utf8')
@@ -91,7 +114,7 @@ function execCollect(entry: DockerSession, command: string): Promise<string> {
       stream.on('close', (code: number | null) => {
         clearTimeout(timer)
         if (code === 0 || (code === null && stdout)) {
-          resolve(truncated ? stdout : stdout)
+          resolve(stdout)
         } else if (code === 127) {
           reject(new ConnectionError('Docker CLI not found on this host'))
         } else {
@@ -187,23 +210,7 @@ export function registerDockerHandlers(): void {
     return new Promise<string>((resolve, reject) => {
       entry.conn.client.exec(`docker logs --tail ${tail} -f ${container} 2>&1`, (err, stream) => {
         if (err) return reject(new ConnectionError(toMessage(err)))
-        const logId = randomUUID()
-        logStreams.set(logId, { channel: stream, senderId: event.sender.id })
-
-        const send = (data: Buffer) => {
-          if (!event.sender.isDestroyed()) event.sender.send('docker:logChunk', logId, data.toString('utf8'))
-        }
-        stream.on('data', send)
-        stream.stderr.on('data', send)
-        stream.on('close', () => {
-          logStreams.delete(logId)
-          if (!event.sender.isDestroyed()) event.sender.send('docker:logEnd', logId, null)
-        })
-        stream.on('error', (e: unknown) => {
-          logStreams.delete(logId)
-          if (!event.sender.isDestroyed()) event.sender.send('docker:logEnd', logId, toMessage(e))
-        })
-        resolve(logId)
+        resolve(attachLogStream(event.sender, stream))
       })
     })
   })
diff --git a/src/main/ipc/k8s.ts b/src/main/ipc/k8s.ts
index ce3ae45..3834842 100644
--- a/src/main/ipc/k8s.ts
+++ b/src/main/ipc/k8s.ts
@@ -1,11 +1,11 @@
 import { app, ipcMain, dialog, BrowserWindow, IpcMainInvokeEvent, IpcMainEvent } from 'electron'
 import * as k8s from '@kubernetes/client-node'
-import * as net from 'net'
-import { PassThrough } from 'stream'
-import { copyFileSync, mkdirSync, statSync } from 'fs'
-import { join, basename, resolve as resolvePath } from 'path'
-import { homedir } from 'os'
-import { createHash, randomUUID } from 'crypto'
+import * as net from 'node:net'
+import { PassThrough } from 'node:stream'
+import { copyFileSync, mkdirSync, statSync } from 'node:fs'
+import { join, basename, resolve as resolvePath } from 'node:path'
+import { homedir } from 'node:os'
+import { createHash, randomUUID } from 'node:crypto'
 import { isUnlocked } from './keychain'
 import { isAllowedKubeconfigPath, registerAllowedKubeconfigDir, validateK8sName, validatePort } from './security'
 import { ConnectionError, NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
@@ -152,6 +152,43 @@ export function disposeK8sSessionsForSender(senderId: number): void {
 
 // ── Handler registration ──────────────────────────────────────────────────────
 
+function startPodForward(
+  kc: k8s.KubeConfig,
+  namespace: string,
+  podName: string,
+  targetPort: number,
+  localPort: unknown,
+  senderId: number,
+  meta: Omit<PfMeta, 'localPort'>,
+): Promise<{ id: string; localPort: number }> {
+  if (localPort !== undefined && localPort !== null && localPort !== 0) {
+    validatePort(localPort, 'local port')
+  }
+  const sessionId = makeId()
+  const forward = new k8s.PortForward(kc)
+  const sockets = new Set<net.Socket>()
+
+  return new Promise<{ id: string; localPort: number }>((resolve, reject) => {
+    const server = net.createServer((socket) => {
+      sockets.add(socket)
+      socket.on('close', () => sockets.delete(socket))
+      socket.on('error', (err) => safeLog(`pf socket ${sessionId}`, err))
+      forward.portForward(namespace, podName, [targetPort], socket, null, socket)
+        .catch((err) => {
+          safeLog(`pf forward ${sessionId}`, err)
+          socket.destroy()
+        })
+    })
+
+    server.on('error', (err) => reject(new ConnectionError(toMessage(err))))
+    server.listen(localPort && Number(localPort) > 0 ? Number(localPort) : 0, '127.0.0.1', () => {
+      const addr = server.address() as net.AddressInfo
+      pfSessions.set(sessionId, { server, sockets, senderId, meta: { ...meta, localPort: addr.port } })
+      resolve({ id: sessionId, localPort: addr.port })
+    })
+  })
+}
+
 export function registerK8sHandlers(): void {
   registerAllowedKubeconfigDir(managedKubeconfigDir())
 
@@ -475,7 +512,7 @@ export function registerK8sHandlers(): void {
   ipcMain.handle('k8s:events', async (_e, context: unknown, namespace: unknown, kubeconfigPath?: unknown) => {
     const { core } = makeClient(context, validateOptionalKubeconfig(kubeconfigPath))
     const res = await core.listNamespacedEvent(validateNamespace(namespace))
-    return res.body.items
+    return [...res.body.items]
       .sort((a, b) => {
         const ta = a.lastTimestamp ? new Date(a.lastTimestamp as unknown as string).getTime() : 0
         const tb = b.lastTimestamp ? new Date(b.lastTimestamp as unknown as string).getTime() : 0
@@ -644,7 +681,7 @@ export function registerK8sHandlers(): void {
   ipcMain.on('k8s:execSend', (event: IpcMainEvent, sessionId: unknown, data: unknown) => {
     if (typeof sessionId !== 'string' || typeof data !== 'string') return
     const entry = execSessions.get(sessionId)
-    if (!entry || entry.senderId !== event.sender.id) return
+    if (entry?.senderId !== event.sender.id) return
     if (Buffer.byteLength(data, 'utf8') > 64 * 1024) return
     entry.stdin.write(data)
   })
@@ -654,7 +691,7 @@ export function registerK8sHandlers(): void {
     if (!Number.isInteger(cols) || !Number.isInteger(rows)) return
     if ((cols as number) < 1 || (cols as number) > 1000 || (rows as number) < 1 || (rows as number) > 1000) return
     const entry = execSessions.get(sessionId)
-    if (!entry || entry.senderId !== event.sender.id) return
+    if (entry?.senderId !== event.sender.id) return
     if (!entry.ws?.send) return
     try {
       const buf = Buffer.alloc(5)
@@ -677,43 +714,6 @@ export function registerK8sHandlers(): void {
 
   // ── Port forwarding ───────────────────────────────────────────────────────────
 
-  function startPodForward(
-    kc: k8s.KubeConfig,
-    namespace: string,
-    podName: string,
-    targetPort: number,
-    localPort: unknown,
-    senderId: number,
-    meta: Omit<PfMeta, 'localPort'>,
-  ): Promise<{ id: string; localPort: number }> {
-    if (localPort !== undefined && localPort !== null && localPort !== 0) {
-      validatePort(localPort, 'local port')
-    }
-    const sessionId = makeId()
-    const forward = new k8s.PortForward(kc)
-    const sockets = new Set<net.Socket>()
-
-    return new Promise<{ id: string; localPort: number }>((resolve, reject) => {
-      const server = net.createServer((socket) => {
-        sockets.add(socket)
-        socket.on('close', () => sockets.delete(socket))
-        socket.on('error', (err) => safeLog(`pf socket ${sessionId}`, err))
-        forward.portForward(namespace, podName, [targetPort], socket, null, socket)
-          .catch((err) => {
-            safeLog(`pf forward ${sessionId}`, err)
-            socket.destroy()
-          })
-      })
-
-      server.on('error', (err) => reject(new ConnectionError(toMessage(err))))
-      server.listen(localPort && Number(localPort) > 0 ? Number(localPort) : 0, '127.0.0.1', () => {
-        const addr = server.address() as net.AddressInfo
-        pfSessions.set(sessionId, { server, sockets, senderId, meta: { ...meta, localPort: addr.port } })
-        resolve({ id: sessionId, localPort: addr.port })
-      })
-    })
-  }
-
   ipcMain.handle('k8s:portForwardStart', async (event: IpcMainInvokeEvent, context: unknown, namespace: unknown, podName: unknown, targetPort: unknown, localPort: unknown, kubeconfigPath?: unknown) => {
     const safePath = validateOptionalKubeconfig(kubeconfigPath)
     const safeNs = validateNamespace(namespace)
diff --git a/src/main/ipc/keychain.ts b/src/main/ipc/keychain.ts
index b0e9a5e..13aaf56 100644
--- a/src/main/ipc/keychain.ts
+++ b/src/main/ipc/keychain.ts
@@ -1,7 +1,7 @@
 import { ipcMain, systemPreferences, BrowserWindow } from 'electron'
 import Store from 'electron-store'
 import keytar from 'keytar'
-import { pbkdf2Sync, randomBytes } from 'crypto'
+import { pbkdf2Sync, randomBytes } from 'node:crypto'
 
 export type AuthMode = 'none' | 'pin' | 'password' | 'biometrics'
 
diff --git a/src/main/ipc/localTerminal.ts b/src/main/ipc/localTerminal.ts
index 7a087cb..51debb8 100644
--- a/src/main/ipc/localTerminal.ts
+++ b/src/main/ipc/localTerminal.ts
@@ -1,7 +1,7 @@
 import { ipcMain, IpcMainEvent, IpcMainInvokeEvent, WebContents } from 'electron'
 import { spawn, IPty } from 'node-pty'
-import { homedir, platform } from 'os'
-import { randomUUID } from 'crypto'
+import { homedir, platform } from 'node:os'
+import { randomUUID } from 'node:crypto'
 import { NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
 
 // Local shell sessions via node-pty: the user's default shell on
diff --git a/src/main/ipc/localfs.ts b/src/main/ipc/localfs.ts
index 89d7284..f843a07 100644
--- a/src/main/ipc/localfs.ts
+++ b/src/main/ipc/localfs.ts
@@ -1,8 +1,8 @@
 import { ipcMain } from 'electron'
-import { readdirSync, statSync } from 'fs'
-import { readFile, writeFile } from 'fs/promises'
-import { homedir } from 'os'
-import { join } from 'path'
+import { readdirSync, statSync } from 'node:fs'
+import { readFile, writeFile } from 'node:fs/promises'
+import { homedir } from 'node:os'
+import { join } from 'node:path'
 import { isInsideHome, isLikelyTextFile } from './security'
 import { ValidationError } from './errors'
 
diff --git a/src/main/ipc/metrics.ts b/src/main/ipc/metrics.ts
index 133fcd3..8550cea 100644
--- a/src/main/ipc/metrics.ts
+++ b/src/main/ipc/metrics.ts
@@ -60,16 +60,16 @@ export function parseMetricsOutput(
   }
   const cpuStat = total > 0 ? { idle, total } : undefined
 
-  const memTotal = parseInt(memStr.match(/MemTotal:\s+(\d+)/)?.[1] ?? '0') * 1024
-  const memAvail = parseInt(memStr.match(/MemAvailable:\s+(\d+)/)?.[1] ?? '0') * 1024
+  const memTotal = Number.parseInt(/MemTotal:\s+(\d+)/.exec(memStr)?.[1] ?? '0') * 1024
+  const memAvail = Number.parseInt(/MemAvailable:\s+(\d+)/.exec(memStr)?.[1] ?? '0') * 1024
 
   // df -kP: filesystem, 1k-blocks, used, available, capacity, mount
   const diskParts = diskStr.trim().split(/\s+/)
-  const diskTotal = (parseInt(diskParts[1] ?? '0') || 0) * 1024
-  const diskUsed = (parseInt(diskParts[2] ?? '0') || 0) * 1024
+  const diskTotal = (Number.parseInt(diskParts[1] ?? '0') || 0) * 1024
+  const diskUsed = (Number.parseInt(diskParts[2] ?? '0') || 0) * 1024
 
-  const load1 = parseFloat(loadStr.trim().split(/\s+/)[0] ?? '0') || 0
-  const uptimeSec = Math.floor(parseFloat(upStr.trim().split(/\s+/)[0] ?? '0')) || 0
+  const load1 = Number.parseFloat(loadStr.trim().split(/\s+/)[0] ?? '0') || 0
+  const uptimeSec = Math.floor(Number.parseFloat(upStr.trim().split(/\s+/)[0] ?? '0')) || 0
 
   return {
     metrics: {
diff --git a/src/main/ipc/rdp.ts b/src/main/ipc/rdp.ts
index 5b028a9..d30292e 100644
--- a/src/main/ipc/rdp.ts
+++ b/src/main/ipc/rdp.ts
@@ -1,8 +1,8 @@
 import { ipcMain, IpcMainEvent, IpcMainInvokeEvent, WebContents } from 'electron'
-import { spawn, ChildProcessWithoutNullStreams } from 'child_process'
-import { join } from 'path'
-import { existsSync } from 'fs'
-import { randomUUID } from 'crypto'
+import { spawn, ChildProcessWithoutNullStreams } from 'node:child_process'
+import { join } from 'node:path'
+import { existsSync } from 'node:fs'
+import { randomUUID } from 'node:crypto'
 import { is } from '@electron-toolkit/utils'
 import { NotFoundError, OwnershipError, ValidationError, ConnectionError, toMessage } from './errors'
 
@@ -102,44 +102,38 @@ function logStray(id: string, entry: RdpSession, stray: Buffer): void {
   )
 }
 
+// Validates the header at the buffer head. Returns null when it is not a
+// plausible frame (bad magic, absurd dimensions, or a dataLen mismatch —
+// e.g. a false "NXF1" matched inside pixel data) so the caller can resync.
+function parseFrameHeader(buffer: Buffer): { width: number; height: number; dataLen: number } | null {
+  if (buffer.toString('ascii', 0, 4) !== MAGIC) return null
+  const width = buffer.readUInt32LE(4)
+  const height = buffer.readUInt32LE(8)
+  const dataLen = buffer.readUInt32LE(12)
+  if (width === 0 || height === 0 || width > 7680 || height > 7680) return null
+  if (dataLen !== width * height * 4 || dataLen > MAX_FRAME_BYTES) return null
+  return { width, height, dataLen }
+}
+
 // Pull every complete frame out of the accumulated buffer and forward it.
 function drainFrames(id: string, entry: RdpSession): void {
   for (;;) {
     if (entry.buffer.length < HEADER_BYTES) return
 
-    if (entry.buffer.toString('ascii', 0, 4) !== MAGIC) {
+    const header = parseFrameHeader(entry.buffer)
+    if (!header) {
       // Non-frame bytes on stdout — recover by skipping to the next frame.
       if (!resyncToMagic(id, entry)) return
       continue
     }
 
-    const width = entry.buffer.readUInt32LE(4)
-    const height = entry.buffer.readUInt32LE(8)
-    const dataLen = entry.buffer.readUInt32LE(12)
-
-    // Validate width/height are reasonable and dataLen matches
-    if (width === 0 || height === 0 || width > 7680 || height > 7680) {
-      if (!resyncToMagic(id, entry)) return
-      continue
-    }
-    if (dataLen !== width * height * 4) {
-      if (!resyncToMagic(id, entry)) return
-      continue
-    }
-
-    if (dataLen > MAX_FRAME_BYTES) {
-      // Almost certainly a false "NXF1" matched inside pixel data — skip past it.
-      if (!resyncToMagic(id, entry)) return
-      continue
-    }
-
-    const total = HEADER_BYTES + dataLen
+    const total = HEADER_BYTES + header.dataLen
     if (entry.buffer.length < total) return // wait for more chunks
 
     const pixels = entry.buffer.subarray(HEADER_BYTES, total)
     if (!entry.sender.isDestroyed()) {
       // Copy out: the backing buffer is about to be sliced/reused.
-      entry.sender.send('rdp:frame', id, width, height, Buffer.from(pixels))
+      entry.sender.send('rdp:frame', id, header.width, header.height, Buffer.from(pixels))
     }
     entry.buffer = entry.buffer.subarray(total)
   }
@@ -155,9 +149,11 @@ export function registerRdpHandlers(): void {
     if (typeof username !== 'string' || !username) throw new ValidationError('Username is required')
     if (typeof password !== 'string') throw new ValidationError('Password is required')
 
-    const port = typeof config.port === 'number' ? config.port : 3389
-    const width = typeof config.width === 'number' ? config.width : 1280
-    const height = typeof config.height === 'number' ? config.height : 800
+    const clamp = (v: unknown, lo: number, hi: number, dflt: number): number =>
+      typeof v === 'number' && Number.isFinite(v) ? Math.min(hi, Math.max(lo, Math.round(v))) : dflt
+    const port = clamp(config.port, 1, 65535, 3389)
+    const width = clamp(config.width, 640, 7680, 1280)
+    const height = clamp(config.height, 480, 7680, 800)
 
     const bin = sidecarPath()
     if (!existsSync(bin)) {
@@ -172,7 +168,13 @@ export function registerRdpHandlers(): void {
       { stdio: ['pipe', 'pipe', 'pipe'] },
     )
 
-    // Write password to stdin instead of passing as command-line argument
+    // Write password to stdin instead of passing as command-line argument.
+    // The error handler matters: if the sidecar dies before reading (bad
+    // binary, instant crash), the write EPIPEs, and an unhandled stream
+    // 'error' would take down the whole main process.
+    proc.stdin.on('error', (err) => {
+      console.error(`[rdp] stdin write failed: ${toMessage(err)}`)
+    })
     proc.stdin.write(password + '\n')
     proc.stdin.end()
 
@@ -180,10 +182,12 @@ export function registerRdpHandlers(): void {
     const entry: RdpSession = { proc, sender: event.sender, buffer: Buffer.alloc(0), resyncs: 0 }
     sessions.set(id, entry)
 
-    // The sidecar prints an authoritative outcome line ("[sidecar] ...") to
-    // stderr alongside FreeRDP's verbose logs. Keep the last one so a failed
-    // connect surfaces *why* in the tab instead of a bare exit code.
+    // The sidecar prints outcome lines ("[sidecar] ...") to stderr alongside
+    // FreeRDP's verbose logs. Failures use a "[sidecar] error: ..." prefix —
+    // prefer those for the close reason so an informational line (cert
+    // fingerprint, "connected") never masks the actual failure.
     let lastSidecarMsg: string | null = null
+    let lastSidecarError: string | null = null
 
     proc.stdout.on('data', (chunk: Buffer) => {
       entry.buffer = entry.buffer.length ? Buffer.concat([entry.buffer, chunk]) : chunk
@@ -195,8 +199,15 @@ export function registerRdpHandlers(): void {
       const text = chunk.toString()
       console.error(`[rdp-sidecar ${id}] ${text.trimEnd()}`)
       for (const line of text.split('\n')) {
-        const m = line.match(/\[sidecar\]\s*(.+?)\s*$/)
-        if (m) lastSidecarMsg = m[1]
+        const m = /\[sidecar\](.*)/.exec(line)
+        if (!m) continue
+        const msg = m[1].trim()
+        if (!msg) continue
+        lastSidecarMsg = msg
+        if (msg.startsWith('error:')) {
+          const detail = msg.slice('error:'.length).trim()
+          if (detail) lastSidecarError = detail
+        }
       }
     })
 
@@ -209,7 +220,7 @@ export function registerRdpHandlers(): void {
       sessions.delete(id)
       if (!event.sender.isDestroyed()) {
         const reason =
-          code === 0 ? null : lastSidecarMsg ?? `sidecar exited (${code})`
+          code === 0 ? null : lastSidecarError ?? lastSidecarMsg ?? `sidecar exited (${code})`
         event.sender.send('rdp:closed', id, reason)
       }
     })
diff --git a/src/main/ipc/redis.ts b/src/main/ipc/redis.ts
index 9ac7ae2..e0726ed 100644
--- a/src/main/ipc/redis.ts
+++ b/src/main/ipc/redis.ts
@@ -1,6 +1,6 @@
 import { ipcMain, IpcMainInvokeEvent } from 'electron'
 import Redis from 'ioredis'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { isBlockedRedisCommand, validateHost, validatePort } from './security'
 import { ConnectionError, NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
 
diff --git a/src/main/ipc/runner.ts b/src/main/ipc/runner.ts
index 15519eb..373529f 100644
--- a/src/main/ipc/runner.ts
+++ b/src/main/ipc/runner.ts
@@ -1,5 +1,5 @@
 import { ipcMain, IpcMainInvokeEvent, WebContents } from 'electron'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { connectSessionClient, ManagedSshConnection } from './sshClients'
 import { getSessionById } from './sessions'
 import { NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
diff --git a/src/main/ipc/security.ts b/src/main/ipc/security.ts
index 4728529..ee5910c 100644
--- a/src/main/ipc/security.ts
+++ b/src/main/ipc/security.ts
@@ -1,6 +1,6 @@
-import { homedir } from 'os'
-import { resolve, normalize } from 'path'
-import { statSync } from 'fs'
+import { homedir } from 'node:os'
+import { resolve, normalize } from 'node:path'
+import { statSync } from 'node:fs'
 
 const MAX_KEY_FILE_SIZE = 64 * 1024
 const MAX_KUBECONFIG_FILE_SIZE = 1024 * 1024
@@ -90,7 +90,7 @@ export function isBlockedRedisCommand(command: string): boolean {
 }
 
 export function getBlockedRedisCommands(): string[] {
-  return [...BLOCKED_REDIS_COMMANDS].sort()
+  return [...BLOCKED_REDIS_COMMANDS].sort((a, b) => a.localeCompare(b))
 }
 
 // Extension check is only a cheap pre-filter to avoid streaming large binaries;
diff --git a/src/main/ipc/sessionTransfer.ts b/src/main/ipc/sessionTransfer.ts
index a9e7d25..4403a78 100644
--- a/src/main/ipc/sessionTransfer.ts
+++ b/src/main/ipc/sessionTransfer.ts
@@ -31,6 +31,24 @@ function readString(value: unknown): string | undefined {
   return typeof value === 'string' && value.trim() ? value : undefined
 }
 
+function applyOptionalFields(session: ImportedSession, r: Record<string, unknown>): void {
+  session.keyPath = readString(r.keyPath)
+  session.group = readString(r.group)
+  session.color = readString(r.color)
+  session.dbType = readString(r.dbType)
+  session.databaseName = readString(r.databaseName)
+  session.sslMode = readString(r.sslMode)
+  session.kubeconfigPath = readString(r.kubeconfigPath)
+  if (Array.isArray(r.tags)) session.tags = r.tags.filter((t): t is string => typeof t === 'string')
+  if (typeof r.isFavorite === 'boolean') session.isFavorite = r.isFavorite
+  if (typeof r.pollingEnabled === 'boolean') session.pollingEnabled = r.pollingEnabled
+  if (typeof r.connectOnStart === 'boolean') session.connectOnStart = r.connectOnStart
+  if (typeof r.pollingIntervalSeconds === 'number' && Number.isFinite(r.pollingIntervalSeconds)) {
+    session.pollingIntervalSeconds = r.pollingIntervalSeconds
+  }
+  if (typeof r.redisDb === 'number' && Number.isInteger(r.redisDb)) session.redisDb = r.redisDb
+}
+
 function sanitizeConnection(raw: unknown): ImportedSession | null {
   if (typeof raw !== 'object' || raw === null) return null
   const r = raw as Record<string, unknown>
@@ -53,22 +71,8 @@ function sanitizeConnection(raw: unknown): ImportedSession | null {
     type,
   }
 
-  session.keyPath = readString(r.keyPath)
-  session.group = readString(r.group)
-  session.color = readString(r.color)
-  session.dbType = readString(r.dbType)
-  session.databaseName = readString(r.databaseName)
-  session.sslMode = readString(r.sslMode)
   session.contextName = contextName
-  session.kubeconfigPath = readString(r.kubeconfigPath)
-  if (Array.isArray(r.tags)) session.tags = r.tags.filter((t): t is string => typeof t === 'string')
-  if (typeof r.isFavorite === 'boolean') session.isFavorite = r.isFavorite
-  if (typeof r.pollingEnabled === 'boolean') session.pollingEnabled = r.pollingEnabled
-  if (typeof r.connectOnStart === 'boolean') session.connectOnStart = r.connectOnStart
-  if (typeof r.pollingIntervalSeconds === 'number' && Number.isFinite(r.pollingIntervalSeconds)) {
-    session.pollingIntervalSeconds = r.pollingIntervalSeconds
-  }
-  if (typeof r.redisDb === 'number' && Number.isInteger(r.redisDb)) session.redisDb = r.redisDb
+  applyOptionalFields(session, r)
 
   return session
 }
diff --git a/src/main/ipc/sessions.ts b/src/main/ipc/sessions.ts
index a38cdbb..056a3a2 100644
--- a/src/main/ipc/sessions.ts
+++ b/src/main/ipc/sessions.ts
@@ -1,7 +1,7 @@
 import { ipcMain, dialog, BrowserWindow } from 'electron'
 import Store from 'electron-store'
-import { randomUUID } from 'crypto'
-import { readFile, writeFile } from 'fs/promises'
+import { randomUUID } from 'node:crypto'
+import { readFile, writeFile } from 'node:fs/promises'
 import { saveCredential, getCredential, deleteCredentials, isUnlocked } from './keychain'
 import { serializeSessions, parseSessionsExport, connectionDedupKey } from './sessionTransfer'
 
diff --git a/src/main/ipc/sftp.ts b/src/main/ipc/sftp.ts
index db5a5ea..3e20381 100644
--- a/src/main/ipc/sftp.ts
+++ b/src/main/ipc/sftp.ts
@@ -1,10 +1,9 @@
 import { ipcMain, IpcMainInvokeEvent } from 'electron'
 import { Client, ClientChannel, SFTPWrapper, Stats } from 'ssh2'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { ConnectionError, NotFoundError, OwnershipError, ValidationError, toMessage } from './errors'
-import { getOwnedSshClient } from './ssh'
+import { getOwnedSshClient, SSH_CONNECT_DEFAULTS, sshConnectOptions } from './ssh'
 import { isInsideHome, isLikelyTextFile, validateHost, validatePort } from './security'
-import { SSH_CONNECT_DEFAULTS, sshConnectOptions } from './ssh'
 import { connectSessionClient, openJumpSocket, ManagedSshConnection } from './sshClients'
 
 interface SftpClient {
@@ -153,7 +152,11 @@ async function openSftp(event: IpcMainInvokeEvent, config: SftpConnectConfig): P
     const client = new Client()
     const clientId = randomUUID()
     let settled = false
-    const settle = (fn: () => void) => { if (settled) return; settled = true; fn() }
+    const settle = (fn: () => void) => {
+      if (settled) return
+      settled = true
+      fn()
+    }
 
     client.on('ready', () => {
       createSftpChannel(client, clientId, true, event.sender.id, upstream).then(
@@ -181,6 +184,47 @@ async function openSftp(event: IpcMainInvokeEvent, config: SftpConnectConfig): P
   })
 }
 
+function listDir(sftp: SFTPWrapper, path: string): Promise<unknown[]> {
+  return new Promise((resolve, reject) => {
+    sftp.readdir(path, (err, list) => {
+      if (err) return reject(new ConnectionError(toMessage(err)))
+      resolve(list.map((f) => ({
+        name: f.filename,
+        size: f.attrs.size,
+        mtime: f.attrs.mtime * 1000,
+        permissions: f.attrs.mode,
+        isDirectory: (f.attrs.mode & 0o170000) === 0o040000,
+      })))
+    })
+  })
+}
+
+function readTextFile(sftp: SFTPWrapper, remotePath: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    sftp.stat(remotePath, (statErr, stats: Stats) => {
+      if (statErr) return reject(new ConnectionError(toMessage(statErr)))
+
+      const filename = remotePath.split('/').pop() ?? ''
+      if (!isLikelyTextFile(filename, stats.size ?? 0)) {
+        return reject(new ValidationError('Cannot open binary file in editor. Use download instead.'))
+      }
+
+      const chunks: Buffer[] = []
+      const stream = sftp.createReadStream(remotePath)
+      stream.on('data', (c: Buffer) => chunks.push(c))
+      stream.on('end', () => {
+        const buf = Buffer.concat(chunks)
+        const sample = buf.subarray(0, 8192)
+        if (sample.includes(0)) {
+          return reject(new ValidationError('File appears to be binary. Use download instead.'))
+        }
+        resolve(buf.toString('utf8'))
+      })
+      stream.on('error', (err: unknown) => reject(new ConnectionError(toMessage(err))))
+    })
+  })
+}
+
 function disposeClient(clientId: string): void {
   const entry = sftpClients.get(clientId)
   if (!entry) return
@@ -205,48 +249,14 @@ export function registerSftpHandlers(): void {
 
   ipcMain.handle('sftp:list', (event, rawClientId: unknown, rawPath: unknown) => {
     const path = validateRemotePath(rawPath)
-    return new Promise((resolve, reject) => {
-      const entry = requireClient(event, rawClientId)
-      entry.sftp.readdir(path, (err, list) => {
-        if (err) return reject(new ConnectionError(toMessage(err)))
-        resolve(list.map((f) => ({
-          name: f.filename,
-          size: f.attrs.size,
-          mtime: f.attrs.mtime * 1000,
-          permissions: f.attrs.mode,
-          isDirectory: (f.attrs.mode & 0o170000) === 0o040000,
-        })))
-      })
-    })
+    const entry = requireClient(event, rawClientId)
+    return listDir(entry.sftp, path)
   })
 
   ipcMain.handle('sftp:readFile', (event, rawClientId: unknown, rawRemotePath: unknown) => {
     const remotePath = validateRemotePath(rawRemotePath)
-    return new Promise((resolve, reject) => {
-      const entry = requireClient(event, rawClientId)
-
-      entry.sftp.stat(remotePath, (statErr, stats: Stats) => {
-        if (statErr) return reject(new ConnectionError(toMessage(statErr)))
-
-        const filename = remotePath.split('/').pop() ?? ''
-        if (!isLikelyTextFile(filename, stats.size ?? 0)) {
-          return reject(new ValidationError('Cannot open binary file in editor. Use download instead.'))
-        }
-
-        const chunks: Buffer[] = []
-        const stream = entry.sftp.createReadStream(remotePath)
-        stream.on('data', (c: Buffer) => chunks.push(c))
-        stream.on('end', () => {
-          const buf = Buffer.concat(chunks)
-          const sample = buf.subarray(0, 8192)
-          if (sample.includes(0)) {
-            return reject(new ValidationError('File appears to be binary. Use download instead.'))
-          }
-          resolve(buf.toString('utf8'))
-        })
-        stream.on('error', (err: unknown) => reject(new ConnectionError(toMessage(err))))
-      })
-    })
+    const entry = requireClient(event, rawClientId)
+    return readTextFile(entry.sftp, remotePath)
   })
 
   ipcMain.handle('sftp:writeFile', (event, rawClientId: unknown, rawRemotePath: unknown, rawContent: unknown) => {
diff --git a/src/main/ipc/ssh.ts b/src/main/ipc/ssh.ts
index c1f43fe..67750f3 100644
--- a/src/main/ipc/ssh.ts
+++ b/src/main/ipc/ssh.ts
@@ -1,6 +1,6 @@
 import { ipcMain, IpcMainEvent, IpcMainInvokeEvent, WebContents } from 'electron'
 import { Client, ClientChannel } from 'ssh2'
-import { randomUUID } from 'crypto'
+import { randomUUID } from 'node:crypto'
 import { ConnectionError, OwnershipError, ValidationError, toMessage } from './errors'
 import { validateHost, validatePort } from './security'
 import {
@@ -146,6 +146,41 @@ function stopMetrics(streamId: string): void {
   prevCpuStats.delete(streamId)
 }
 
+function fetchAndEmit(streamId: string): void {
+  const live = streams.get(streamId)
+  if (!live) { stopMetrics(streamId); return }
+  const timers = metricsTimers.get(streamId)
+  if (!timers || timers.inFlight) return
+  timers.inFlight = true
+
+  live.client.exec(METRICS_COMMAND, (err, s) => {
+    if (err) { timers.inFlight = false; return }
+    let out = ''
+    s.on('data', (d: Buffer) => { out += d.toString() })
+    // stderr is intentionally drained to keep the channel from buffering;
+    // remote `cat`/`grep` may report 'no such file' on non-Linux hosts.
+    s.stderr.on('data', () => {})
+    s.on('close', () => {
+      const t = metricsTimers.get(streamId)
+      if (t) t.inFlight = false
+      try {
+        const { metrics, cpuStat } = parseMetricsOutput(out, prevCpuStats.get(streamId))
+        if (cpuStat) prevCpuStats.set(streamId, cpuStat)
+        sendMetrics(streamId, metrics)
+      } catch (parseErr) {
+        // Best-effort metrics: malformed remote output (non-Linux, BSD, etc.)
+        // must not crash or stop the shell stream.
+        console.error(`[ssh] metrics parse ${streamId}: ${toMessage(parseErr)}`)
+      }
+    })
+    s.on('error', (e: unknown) => {
+      const t = metricsTimers.get(streamId)
+      if (t) t.inFlight = false
+      console.error(`[ssh] metrics exec ${streamId}: ${toMessage(e)}`)
+    })
+  })
+}
+
 function disposeStream(streamId: string): void {
   stopMetrics(streamId)
   const entry = streams.get(streamId)
@@ -162,6 +197,42 @@ export function disposeSshStreamsForSender(senderId: number): void {
   }
 }
 
+// Opens the interactive shell once the client is ready and wires its stream
+// events through to the renderer. `settle` guards against double-settling the
+// connect promise when 'error' fires after 'ready'.
+function openShell(
+  client: Client,
+  streamId: string,
+  sender: WebContents,
+  upstream: ManagedSshConnection | undefined,
+  settle: (fn: () => void) => void,
+  resolve: (id: string) => void,
+  reject: (err: Error) => void,
+): void {
+  client.setNoDelay(true)
+  client.shell({ term: 'xterm-256color' }, (err, stream) => {
+    if (err) {
+      client.end()
+      upstream?.dispose()
+      settle(() => reject(new ConnectionError(toMessage(err))))
+      return
+    }
+    streams.set(streamId, { client, stream, sender, upstream })
+
+    stream.on('data', (data: Buffer) => sendData(streamId, data.toString('utf8')))
+    stream.stderr.on('data', (data: Buffer) => sendData(streamId, data.toString('utf8')))
+
+    stream.on('close', () => {
+      stopMetrics(streamId)
+      sendClosed(streamId)
+      streams.delete(streamId)
+      upstream?.dispose()
+    })
+
+    settle(() => resolve(streamId))
+  })
+}
+
 export function registerSshHandlers(): void {
   ipcMain.handle(
     'ssh:connect',
@@ -186,37 +257,18 @@ export function registerSshHandlers(): void {
         const client = new Client()
         const streamId = randomUUID()
         let settled = false
-        const settle = (fn: () => void) => { if (settled) return; settled = true; fn() }
+        const settle = (fn: () => void) => {
+          if (settled) return
+          settled = true
+          fn()
+        }
 
         client.on('keyboard-interactive', (_name, _instructions, _instructionsLang, prompts, finish) => {
           if (!config.password) { finish([]); return }
           finish(prompts.map(() => config.password ?? ''))
         })
 
-        client.on('ready', () => {
-          client.setNoDelay(true)
-          client.shell({ term: 'xterm-256color' }, (err, stream) => {
-            if (err) {
-              client.end()
-              upstream?.dispose()
-              settle(() => reject(new ConnectionError(toMessage(err))))
-              return
-            }
-            streams.set(streamId, { client, stream, sender: event.sender, upstream })
-
-            stream.on('data', (data: Buffer) => sendData(streamId, data.toString('utf8')))
-            stream.stderr.on('data', (data: Buffer) => sendData(streamId, data.toString('utf8')))
-
-            stream.on('close', () => {
-              stopMetrics(streamId)
-              sendClosed(streamId)
-              streams.delete(streamId)
-              upstream?.dispose()
-            })
-
-            settle(() => resolve(streamId))
-          })
-        })
+        client.on('ready', () => openShell(client, streamId, event.sender, upstream, settle, resolve, reject))
 
         client.on('error', (err) => {
           if (!settled) {
@@ -290,41 +342,6 @@ export function registerSshHandlers(): void {
 
   // ── Metrics ────────────────────────────────────────────────────────────────
 
-  function fetchAndEmit(streamId: string): void {
-    const live = streams.get(streamId)
-    if (!live) { stopMetrics(streamId); return }
-    const timers = metricsTimers.get(streamId)
-    if (!timers || timers.inFlight) return
-    timers.inFlight = true
-
-    live.client.exec(METRICS_COMMAND, (err, s) => {
-      if (err) { timers.inFlight = false; return }
-      let out = ''
-      s.on('data', (d: Buffer) => { out += d.toString() })
-      // stderr is intentionally drained to keep the channel from buffering;
-      // remote `cat`/`grep` may report 'no such file' on non-Linux hosts.
-      s.stderr.on('data', () => {})
-      s.on('close', () => {
-        const t = metricsTimers.get(streamId)
-        if (t) t.inFlight = false
-        try {
-          const { metrics, cpuStat } = parseMetricsOutput(out, prevCpuStats.get(streamId))
-          if (cpuStat) prevCpuStats.set(streamId, cpuStat)
-          sendMetrics(streamId, metrics)
-        } catch (parseErr) {
-          // Best-effort metrics: malformed remote output (non-Linux, BSD, etc.)
-          // must not crash or stop the shell stream.
-          console.error(`[ssh] metrics parse ${streamId}: ${toMessage(parseErr)}`)
-        }
-      })
-      s.on('error', (e: unknown) => {
-        const t = metricsTimers.get(streamId)
-        if (t) t.inFlight = false
-        console.error(`[ssh] metrics exec ${streamId}: ${toMessage(e)}`)
-      })
-    })
-  }
-
   ipcMain.handle('ssh:metrics-start', (event: IpcMainInvokeEvent, rawStreamId: unknown) => {
     const streamId = validateStreamId(rawStreamId)
     const entry = getOwnedStream(event, streamId)
diff --git a/src/main/ipc/sshClients.ts b/src/main/ipc/sshClients.ts
index bd2cb69..041fee6 100644
--- a/src/main/ipc/sshClients.ts
+++ b/src/main/ipc/sshClients.ts
@@ -1,5 +1,5 @@
 import { Client, Algorithms, ClientChannel, ConnectConfig } from 'ssh2'
-import { readFileSync } from 'fs'
+import { readFileSync } from 'node:fs'
 import { getSessionById, Session } from './sessions'
 import { getCredential, isUnlocked } from './keychain'
 import { isAllowedKeyPath } from './security'
diff --git a/src/main/ipc/sshConfig.ts b/src/main/ipc/sshConfig.ts
index 784db28..b665f11 100644
--- a/src/main/ipc/sshConfig.ts
+++ b/src/main/ipc/sshConfig.ts
@@ -1,7 +1,7 @@
 import { ipcMain } from 'electron'
-import { homedir } from 'os'
-import { join } from 'path'
-import { readFile } from 'fs/promises'
+import { homedir } from 'node:os'
+import { join } from 'node:path'
+import { readFile } from 'node:fs/promises'
 
 export interface SshConfigHost {
   alias: string
@@ -31,7 +31,7 @@ function unquote(value: string): string {
 // Splits a config line into its keyword and argument. ssh_config accepts both
 // "Key Value" and "Key=Value" forms.
 function splitDirective(line: string): { key: string; value: string } | null {
-  const match = line.match(/^(\S+?)(?:\s+|\s*=\s*)(.+)$/)
+  const match = /^([^\s=]+)(?:\s*=\s*|\s+)(.+)$/.exec(line)
   if (!match) return null
   return { key: match[1].toLowerCase(), value: match[2].trim() }
 }
@@ -49,6 +49,41 @@ function finalizeBlock(block: HostBlock, out: SshConfigHost[]): void {
   }
 }
 
+// Wildcard and negated Host patterns describe defaults, not servers.
+function parseHostAliases(value: string): string[] {
+  return value
+    .split(/\s+/)
+    .map(unquote)
+    .filter(pattern => pattern && !/[*?!]/.test(pattern))
+}
+
+function applyDirective(block: HostBlock, key: string, value: string): void {
+  switch (key) {
+    case 'hostname':
+      block.hostname = unquote(value)
+      break
+    case 'port': {
+      const port = Number(unquote(value))
+      if (Number.isInteger(port) && port >= 1 && port <= 65535) block.port = port
+      break
+    }
+    case 'user':
+      block.username = unquote(value)
+      break
+    case 'identityfile':
+      // ssh tries identity files in order; the first listed is the primary
+      block.keyPath ??= unquote(value)
+      break
+    case 'proxyjump': {
+      // Multi-hop chains (a,b,c) reduce to the first hop here; deeper
+      // chains resolve recursively if that hop is itself imported.
+      const firstHop = unquote(value).split(',')[0]?.trim()
+      if (firstHop && firstHop.toLowerCase() !== 'none') block.proxyJump = firstHop
+      break
+    }
+  }
+}
+
 /**
  * Extracts concrete host entries from ssh_config content. Wildcard and
  * negated Host patterns are skipped (they describe defaults, not servers),
@@ -70,11 +105,7 @@ export function parseSshConfig(content: string): SshConfigHost[] {
     if (key === 'host') {
       if (block) finalizeBlock(block, hosts)
       inMatchBlock = false
-      const aliases = value
-        .split(/\s+/)
-        .map(unquote)
-        .filter(pattern => pattern && !/[*?!]/.test(pattern))
-      block = { aliases }
+      block = { aliases: parseHostAliases(value) }
       continue
     }
 
@@ -85,32 +116,7 @@ export function parseSshConfig(content: string): SshConfigHost[] {
       continue
     }
 
-    if (inMatchBlock || !block) continue
-
-    switch (key) {
-      case 'hostname':
-        block.hostname = unquote(value)
-        break
-      case 'port': {
-        const port = Number(unquote(value))
-        if (Number.isInteger(port) && port >= 1 && port <= 65535) block.port = port
-        break
-      }
-      case 'user':
-        block.username = unquote(value)
-        break
-      case 'identityfile':
-        // ssh tries identity files in order; the first listed is the primary
-        block.keyPath ??= unquote(value)
-        break
-      case 'proxyjump': {
-        // Multi-hop chains (a,b,c) reduce to the first hop here; deeper
-        // chains resolve recursively if that hop is itself imported.
-        const firstHop = unquote(value).split(',')[0]?.trim()
-        if (firstHop && firstHop.toLowerCase() !== 'none') block.proxyJump = firstHop
-        break
-      }
-    }
+    if (!inMatchBlock && block) applyDirective(block, key, value)
   }
 
   if (block) finalizeBlock(block, hosts)
diff --git a/src/main/ipc/tunnels.ts b/src/main/ipc/tunnels.ts
index 847e0b1..b7a22e3 100644
--- a/src/main/ipc/tunnels.ts
+++ b/src/main/ipc/tunnels.ts
@@ -1,8 +1,8 @@
 import { ipcMain, BrowserWindow } from 'electron'
 import Store from 'electron-store'
-import { createServer, connect as netConnect, Server, Socket } from 'net'
-import { Duplex } from 'stream'
-import { randomUUID } from 'crypto'
+import { createServer, connect as netConnect, Server, Socket } from 'node:net'
+import { Duplex } from 'node:stream'
+import { randomUUID } from 'node:crypto'
 import { connectSessionClient, ManagedSshConnection } from './sshClients'
 import { getSessionById } from './sessions'
 import { NotFoundError, ValidationError, toMessage } from './errors'
@@ -136,30 +136,43 @@ async function startLocalForward(def: TunnelDef, entry: ActiveTunnel): Promise<v
   await listenLocally(server, def.listenPort)
 }
 
+// Second phase of the SOCKS5 handshake: parse the CONNECT request and open
+// the forwarded channel over the SSH connection.
+function handleSocksConnect(entry: ActiveTunnel, socket: Socket, request: Buffer): void {
+  const parsed = parseSocksConnectRequest(request)
+  if ('errorCode' in parsed) {
+    socket.end(socksConnectReply(parsed.errorCode))
+    return
+  }
+  // forwardOut's callback can hang indefinitely on an unresponsive target;
+  // reply connection-refused after a deadline and ignore a late callback.
+  let timedOut = false
+  const timer = setTimeout(() => {
+    timedOut = true
+    socket.end(socksConnectReply(SOCKS_REPLY.connectionRefused))
+  }, 30_000)
+  entry.conn.client.forwardOut(
+    socket.remoteAddress ?? '127.0.0.1',
+    socket.remotePort ?? 0,
+    parsed.host,
+    parsed.port,
+    (err, stream) => {
+      clearTimeout(timer)
+      if (timedOut) { stream?.destroy(); return }
+      if (err) { socket.end(socksConnectReply(SOCKS_REPLY.connectionRefused)); return }
+      socket.write(socksConnectReply(SOCKS_REPLY.success))
+      pipeBoth(socket, stream)
+    },
+  )
+}
+
 async function startDynamicForward(def: TunnelDef, entry: ActiveTunnel): Promise<void> {
   const server = createServer((socket) => {
     trackSocket(entry, socket)
     socket.once('data', (greeting: Buffer) => {
       if (!isSocksGreeting(greeting)) { socket.destroy(); return }
       socket.write(socksGreetingReply())
-      socket.once('data', (request: Buffer) => {
-        const parsed = parseSocksConnectRequest(request)
-        if ('errorCode' in parsed) {
-          socket.end(socksConnectReply(parsed.errorCode))
-          return
-        }
-        entry.conn.client.forwardOut(
-          socket.remoteAddress ?? '127.0.0.1',
-          socket.remotePort ?? 0,
-          parsed.host,
-          parsed.port,
-          (err, stream) => {
-            if (err) { socket.end(socksConnectReply(SOCKS_REPLY.connectionRefused)); return }
-            socket.write(socksConnectReply(SOCKS_REPLY.success))
-            pipeBoth(socket, stream)
-          },
-        )
-      })
+      socket.once('data', (request: Buffer) => handleSocksConnect(entry, socket, request))
     })
     socket.on('error', () => socket.destroy())
   })
@@ -237,7 +250,14 @@ export function listTunnels(): Array<TunnelDef & { status: TunnelStatus | 'stopp
 }
 
 export function disposeAllTunnels(): void {
-  for (const id of [...active.keys()]) stopTunnel(id)
+  for (const id of active.keys()) {
+    try {
+      stopTunnel(id)
+    } catch (e) {
+      // One tunnel failing to clean up must not strand the rest on shutdown
+      console.error(`[tunnels] failed to stop ${id}:`, toMessage(e))
+    }
+  }
 }
 
 export function registerTunnelHandlers(): void {
diff --git a/src/preload/index.d.ts b/src/preload/index.d.ts
index cc4ff4f..45802f9 100644
--- a/src/preload/index.d.ts
+++ b/src/preload/index.d.ts
@@ -161,7 +161,7 @@ declare global {
       database: {
         connect: (config: { dbType: string; host: string; port: number; username: string; password?: string; database: string; ssl?: string }) => Promise<string>
         disconnect: (id: string) => Promise<void>
-        query: (id: string, sql: string) => Promise<{ columns: string[]; rows: any[]; rowCount: number; duration: number }>
+        query: (id: string, sql: string, params?: (string | number | boolean | null)[]) => Promise<{ columns: string[]; rows: any[]; rowCount: number; duration: number }>
         tables: (id: string) => Promise<string[]>
         tableInfo: (id: string, table: string) => Promise<{ columns: { name: string; type: string; nullable: boolean }[] }>
       }
diff --git a/src/preload/index.ts b/src/preload/index.ts
index b1fbd83..0bf2c8d 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -100,7 +100,8 @@ contextBridge.exposeInMainWorld('api', {
     connect: (config: { dbType: string; host: string; port: number; username: string; password?: string; database: string; ssl?: string }) =>
       ipcRenderer.invoke('db:connect', config),
     disconnect: (id: string) => ipcRenderer.invoke('db:disconnect', id),
-    query: (id: string, sql: string) => ipcRenderer.invoke('db:query', id, sql),
+    query: (id: string, sql: string, params?: (string | number | boolean | null)[]) =>
+      ipcRenderer.invoke('db:query', id, sql, params),
     tables: (id: string) => ipcRenderer.invoke('db:tables', id),
     tableInfo: (id: string, table: string) => ipcRenderer.invoke('db:tableInfo', id, table),
   },
diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index 098cbec..78823ac 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -107,7 +107,7 @@ export default function App() {
       // (close tab) are owned by the application menu — see src/main/menu.ts.
       if (meta && /^[1-9]$/.test(e.key)) {
         e.preventDefault()
-        const tab = visibleTabs[parseInt(e.key) - 1]
+        const tab = visibleTabs[Number.parseInt(e.key) - 1]
         if (tab) setActiveTab(tab.id)
       }
     }
diff --git a/src/renderer/src/__tests__/harness.tsx b/src/renderer/src/__tests__/harness.tsx
new file mode 100644
index 0000000..11578a1
--- /dev/null
+++ b/src/renderer/src/__tests__/harness.tsx
@@ -0,0 +1,234 @@
+/**
+ * Shared harness for renderer component tests (jsdom).
+ *
+ * Usage — test files must opt into jsdom since the global vitest env is node:
+ *   // @vitest-environment jsdom
+ *   import { installWindowApi, seedStore, makeSession, makeTab } from '../../__tests__/harness'
+ *
+ * installWindowApi() builds a full vi.fn() mock of the preload bridge with
+ * benign defaults; pass overrides for the calls a test cares about, and use
+ * the returned object to assert on calls or swap resolved values.
+ */
+import { vi } from 'vitest'
+import type { Session, Tab } from '../store'
+import { useAppStore } from '../store'
+
+const unsub = () => () => {}
+
+export function buildWindowApi() {
+  return {
+    platform: 'darwin',
+    sessions: {
+      list: vi.fn().mockResolvedValue([]),
+      create: vi.fn().mockResolvedValue({ id: 's1' }),
+      update: vi.fn().mockResolvedValue(undefined),
+      delete: vi.fn().mockResolvedValue(undefined),
+      getCredentials: vi.fn().mockResolvedValue({ password: 'pw' }),
+      count: vi.fn().mockResolvedValue(0),
+      clearAll: vi.fn().mockResolvedValue(undefined),
+      export: vi.fn().mockResolvedValue({ ok: true }),
+      import: vi.fn().mockResolvedValue({ ok: true }),
+    },
+    sshConfig: { hosts: vi.fn().mockResolvedValue([]) },
+    tunnels: {
+      list: vi.fn().mockResolvedValue([]),
+      save: vi.fn().mockResolvedValue(undefined),
+      delete: vi.fn().mockResolvedValue(undefined),
+      start: vi.fn().mockResolvedValue(undefined),
+      stop: vi.fn().mockResolvedValue(undefined),
+      onChanged: vi.fn().mockImplementation(unsub),
+    },
+    auth: {
+      getMode: vi.fn().mockResolvedValue('none'),
+      isAvailable: vi.fn().mockResolvedValue(true),
+      isUnlocked: vi.fn().mockResolvedValue(true),
+      unlock: vi.fn().mockResolvedValue(true),
+      lock: vi.fn().mockResolvedValue(undefined),
+      setup: vi.fn().mockResolvedValue(true),
+      onLocked: vi.fn().mockImplementation(unsub),
+    },
+    ssh: {
+      connect: vi.fn().mockResolvedValue('stream-1'),
+      send: vi.fn(),
+      resize: vi.fn(),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      onData: vi.fn().mockImplementation(unsub),
+      onClose: vi.fn().mockImplementation(unsub),
+      startMetrics: vi.fn().mockResolvedValue(undefined),
+      stopMetrics: vi.fn(),
+      onMetrics: vi.fn().mockImplementation(unsub),
+    },
+    sftp: {
+      connect: vi.fn().mockResolvedValue('sftp-1'),
+      list: vi.fn().mockResolvedValue([]),
+      readFile: vi.fn().mockResolvedValue(''),
+      writeFile: vi.fn().mockResolvedValue(undefined),
+      download: vi.fn().mockResolvedValue(undefined),
+      upload: vi.fn().mockResolvedValue(undefined),
+      delete: vi.fn().mockResolvedValue(undefined),
+      rename: vi.fn().mockResolvedValue(undefined),
+      mkdir: vi.fn().mockResolvedValue(undefined),
+      rmdir: vi.fn().mockResolvedValue(undefined),
+      chmod: vi.fn().mockResolvedValue(undefined),
+      stat: vi.fn().mockResolvedValue({ size: 0, mtime: 0 }),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+    },
+    database: {
+      connect: vi.fn().mockResolvedValue('db-1'),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      query: vi.fn().mockResolvedValue({ columns: [], rows: [], rowCount: 0, duration: 1 }),
+      tables: vi.fn().mockResolvedValue([]),
+      tableInfo: vi.fn().mockResolvedValue([]),
+    },
+    localfs: {
+      home: vi.fn().mockResolvedValue('/home/user'),
+      list: vi.fn().mockResolvedValue([]),
+      readTextFile: vi.fn().mockResolvedValue(''),
+      writeTextFile: vi.fn().mockResolvedValue(undefined),
+    },
+    fs: { readFile: vi.fn().mockResolvedValue('') },
+    k8s: {
+      contexts: vi.fn().mockResolvedValue([]),
+      contextsDetailed: vi.fn().mockResolvedValue([]),
+      importKubeconfig: vi.fn().mockResolvedValue([]),
+      showFilePicker: vi.fn().mockResolvedValue(null),
+      namespaces: vi.fn().mockResolvedValue(['default']),
+      pods: vi.fn().mockResolvedValue([]),
+      deletePod: vi.fn().mockResolvedValue(undefined),
+      deployments: vi.fn().mockResolvedValue([]),
+      scaleDeployment: vi.fn().mockResolvedValue(undefined),
+      restartDeployment: vi.fn().mockResolvedValue(undefined),
+      statefulsets: vi.fn().mockResolvedValue([]),
+      daemonsets: vi.fn().mockResolvedValue([]),
+      replicasets: vi.fn().mockResolvedValue([]),
+      jobs: vi.fn().mockResolvedValue([]),
+      cronjobs: vi.fn().mockResolvedValue([]),
+      services: vi.fn().mockResolvedValue([]),
+      ingresses: vi.fn().mockResolvedValue([]),
+      configmaps: vi.fn().mockResolvedValue([]),
+      secrets: vi.fn().mockResolvedValue([]),
+      secretDetail: vi.fn().mockResolvedValue({}),
+      nodes: vi.fn().mockResolvedValue([]),
+      events: vi.fn().mockResolvedValue([]),
+      resourceDetail: vi.fn().mockResolvedValue('{}'),
+      logsGet: vi.fn().mockResolvedValue(''),
+      logsStream: vi.fn().mockResolvedValue('log-1'),
+      logsStop: vi.fn().mockResolvedValue(undefined),
+      onLogChunk: vi.fn().mockImplementation(unsub),
+      onLogEnd: vi.fn().mockImplementation(unsub),
+      execStart: vi.fn().mockResolvedValue('exec-1'),
+      execSend: vi.fn(),
+      execResize: vi.fn(),
+      execStop: vi.fn().mockResolvedValue(undefined),
+      onExecData: vi.fn().mockImplementation(unsub),
+      onExecClose: vi.fn().mockImplementation(unsub),
+      portForwardStart: vi.fn().mockResolvedValue({ id: 'pf-1' }),
+      servicePortForwardStart: vi.fn().mockResolvedValue({ id: 'pf-2' }),
+      portForwardStop: vi.fn().mockResolvedValue(undefined),
+      portForwardList: vi.fn().mockResolvedValue([]),
+    },
+    localpty: {
+      start: vi.fn().mockResolvedValue('pty-1'),
+      write: vi.fn(),
+      resize: vi.fn(),
+      kill: vi.fn().mockResolvedValue(undefined),
+      onData: vi.fn().mockImplementation(unsub),
+      onExit: vi.fn().mockImplementation(unsub),
+    },
+    runner: {
+      run: vi.fn().mockResolvedValue('run-1'),
+      cancel: vi.fn().mockResolvedValue(undefined),
+      onOutput: vi.fn().mockImplementation(unsub),
+      onDone: vi.fn().mockImplementation(unsub),
+    },
+    docker: {
+      connect: vi.fn().mockResolvedValue('docker-1'),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      containers: vi.fn().mockResolvedValue([]),
+      stats: vi.fn().mockResolvedValue([]),
+      images: vi.fn().mockResolvedValue([]),
+      info: vi.fn().mockResolvedValue({}),
+      action: vi.fn().mockResolvedValue(undefined),
+      logsStart: vi.fn().mockResolvedValue('dlog-1'),
+      logsStop: vi.fn().mockResolvedValue(undefined),
+      onLogChunk: vi.fn().mockImplementation(unsub),
+      onLogEnd: vi.fn().mockImplementation(unsub),
+    },
+    settings: {
+      get: vi.fn().mockResolvedValue({}),
+      set: vi.fn().mockResolvedValue(undefined),
+      reset: vi.fn().mockResolvedValue(undefined),
+    },
+    redis: {
+      connect: vi.fn().mockResolvedValue('redis-1'),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      info: vi.fn().mockResolvedValue({}),
+      keys: vi.fn().mockResolvedValue([]),
+      get: vi.fn().mockResolvedValue(null),
+      set: vi.fn().mockResolvedValue(undefined),
+      del: vi.fn().mockResolvedValue(undefined),
+      command: vi.fn().mockResolvedValue(''),
+    },
+    rdp: {
+      connect: vi.fn().mockResolvedValue('rdp-1'),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      onFrame: vi.fn().mockImplementation(unsub),
+      onClose: vi.fn().mockImplementation(unsub),
+    },
+    tabs: { onCycle: vi.fn().mockImplementation(unsub) },
+    menu: { on: vi.fn().mockImplementation(unsub) },
+    updater: {
+      version: vi.fn().mockResolvedValue('0.0.0-test'),
+      check: vi.fn().mockResolvedValue(undefined),
+      download: vi.fn().mockResolvedValue(undefined),
+      quitAndInstall: vi.fn().mockResolvedValue(undefined),
+      onStatus: vi.fn().mockImplementation(unsub),
+    },
+  }
+}
+
+export type WindowApiMock = ReturnType<typeof buildWindowApi>
+
+/** Deep-merge overrides into a fresh api mock and install it on window. */
+export function installWindowApi(overrides: Record<string, any> = {}): WindowApiMock {
+  const api = buildWindowApi() as any
+  for (const [ns, fns] of Object.entries(overrides)) {
+    api[ns] = typeof fns === 'object' && fns !== null && !Array.isArray(fns) ? { ...api[ns], ...fns } : fns
+  }
+  ;(window as any).api = api
+  return api
+}
+
+let seq = 0
+
+export function makeSession(overrides: Partial<Session> = {}): Session {
+  seq += 1
+  return {
+    id: `session-${seq}`,
+    label: `Server ${seq}`,
+    host: `host${seq}.example.com`,
+    port: 22,
+    username: 'root',
+    authType: 'password',
+    createdAt: 1700000000000,
+    type: 'ssh',
+    ...overrides,
+  }
+}
+
+export function makeTab(overrides: Partial<Tab> = {}): Tab {
+  seq += 1
+  return {
+    id: `tab-${seq}`,
+    label: `Tab ${seq}`,
+    view: 'terminal' as Tab['view'],
+    status: 'idle',
+    filesOpen: false,
+    ...overrides,
+  }
+}
+
+/** Reset the zustand store and apply partial state for a test. */
+export function seedStore(state: Partial<ReturnType<typeof useAppStore.getState>>) {
+  useAppStore.setState(state as any)
+}
diff --git a/src/renderer/src/components/CommandPalette/CommandPalette.tsx b/src/renderer/src/components/CommandPalette/CommandPalette.tsx
index 6e32440..9f57bb8 100644
--- a/src/renderer/src/components/CommandPalette/CommandPalette.tsx
+++ b/src/renderer/src/components/CommandPalette/CommandPalette.tsx
@@ -193,12 +193,10 @@ export default function CommandPalette({ onClose }: Props) {
   return (
     <div
       className="fixed inset-0 z-50 flex items-start justify-center pt-[16vh] bg-black/50 backdrop-blur-sm animate-fade-in"
-      onClick={onClose}
+      onClick={(e) => { if (e.target === e.currentTarget) onClose() }}
+      onKeyDown={(e) => { if (e.key === 'Escape') onClose() }}
     >
-      <div
-        className="w-[620px] bg-surface/95 backdrop-blur-xl border border-border-strong rounded-2xl shadow-palette overflow-hidden animate-modal-in"
-        onClick={(e) => e.stopPropagation()}
-      >
+      <div className="w-[620px] bg-surface/95 backdrop-blur-xl border border-border-strong rounded-2xl shadow-palette overflow-hidden animate-modal-in">
         {/* Search input */}
         <div className="flex items-center gap-3 px-4 py-3.5 border-b border-border/60">
           <span className="text-text-muted flex-shrink-0">
@@ -328,7 +326,7 @@ export default function CommandPalette({ onClose }: Props) {
   )
 }
 
-function SectionLabel({ children }: { children: React.ReactNode }) {
+function SectionLabel({ children }: Readonly<{ children: React.ReactNode }>) {
   return (
     <div className="px-4 pt-3 pb-1.5">
       <span className="text-2xs font-semibold uppercase tracking-[0.08em] text-text-muted">
@@ -441,7 +439,7 @@ const CommandRow = forwardRef<
   </button>
 ))
 
-function Pip({ connected, connecting }: { connected: boolean; connecting: boolean }) {
+function Pip({ connected, connecting }: Readonly<{ connected: boolean; connecting: boolean }>) {
   if (connecting) {
     return (
       <span className="relative flex items-center justify-center w-2 h-2 flex-shrink-0">
@@ -456,7 +454,7 @@ function Pip({ connected, connecting }: { connected: boolean; connecting: boolea
   return <span className="w-2 h-2 rounded-full border border-text-faint flex-shrink-0" />
 }
 
-function GroupChip({ name }: { name: string }) {
+function GroupChip({ name }: Readonly<{ name: string }>) {
   const groupColors = useAppStore(s => s.groupColors)
   const color = groupColor(name, groupColors)
   return (
@@ -476,12 +474,12 @@ function GroupChip({ name }: { name: string }) {
 
 function HintKey({
   icon, secondIcon, text, label,
-}: {
+}: Readonly<{
   icon?: React.ReactNode
   secondIcon?: React.ReactNode
   text?: string
   label: string
-}) {
+}>) {
   return (
     <div className="flex items-center gap-1.5">
       <div className="flex items-center gap-0.5">
diff --git a/src/renderer/src/components/ConnectionManager/AddConnectionModal.tsx b/src/renderer/src/components/ConnectionManager/AddConnectionModal.tsx
index 766ffb5..73ca8dd 100644
--- a/src/renderer/src/components/ConnectionManager/AddConnectionModal.tsx
+++ b/src/renderer/src/components/ConnectionManager/AddConnectionModal.tsx
@@ -10,7 +10,7 @@ import { ipcErrorMessage } from '../../lib/format'
 interface K8sContextEntry {
   name: string
   server: string
-  source: 'default' | string  // 'default' or file path
+  source: string  // 'default' or a kubeconfig file path
 }
 
 type ConnectionType = 'ssh' | 'sftp' | 'database' | 'kubernetes' | 'redis' | 'rdp'
@@ -138,7 +138,7 @@ export default function AddConnectionModal({ onClose }: Props) {
     switch (type) {
       case 'ssh': return '22'
       case 'sftp': return '22'
-      case 'database': return form.dbType === 'postgresql' ? '5432' : form.dbType === 'mysql' ? '3306' : '5432'
+      case 'database': return form.dbType === 'mysql' || form.dbType === 'mariadb' ? '3306' : '5432'
       case 'redis': return '6379'
       case 'rdp': return '3389'
       default: return '443'
@@ -193,12 +193,35 @@ export default function AddConnectionModal({ onClose }: Props) {
 
   const parsedPort = (): number => {
     const raw = form.port.trim()
-    if (!raw) return parseInt(getDefaultPort(selectedType))
-    return parseInt(raw)
+    if (!raw) return Number.parseInt(getDefaultPort(selectedType))
+    return Number.parseInt(raw)
   }
 
   // One source of truth for "is this form submittable" — Test and Save must
   // never disagree about what a valid connection looks like.
+  const validateTypeFields = (): string | null => {
+    switch (selectedType) {
+      case 'ssh':
+      case 'sftp':
+        if (!form.username.trim()) return 'Username is required'
+        if (form.authType === 'key' && !form.keyPath.trim()) return 'Private key path is required'
+        return null
+      case 'database':
+        if (!form.username.trim()) return 'Username is required'
+        if (!form.databaseName.trim()) return 'Database name is required'
+        return null
+      case 'redis': {
+        const db = Number.parseInt(form.redisDb)
+        if (!Number.isInteger(db) || db < 0 || db > 15) return 'DB index must be 0–15'
+        return null
+      }
+      case 'rdp':
+        return form.username.trim() ? null : 'Username is required'
+      default:
+        return null
+    }
+  }
+
   const validateConfigForm = (): string | null => {
     if (selectedType === 'kubernetes') {
       return k8sSelected ? null : 'Select a context to continue'
@@ -206,22 +229,7 @@ export default function AddConnectionModal({ onClose }: Props) {
     if (!form.host.trim()) return 'Host is required'
     const port = parsedPort()
     if (!Number.isInteger(port) || port < 1 || port > 65535) return 'Port must be between 1 and 65535'
-    if (selectedType === 'ssh' || selectedType === 'sftp') {
-      if (!form.username.trim()) return 'Username is required'
-      if (form.authType === 'key' && !form.keyPath.trim()) return 'Private key path is required'
-    }
-    if (selectedType === 'database') {
-      if (!form.username.trim()) return 'Username is required'
-      if (!form.databaseName.trim()) return 'Database name is required'
-    }
-    if (selectedType === 'redis') {
-      const db = parseInt(form.redisDb)
-      if (!Number.isInteger(db) || db < 0 || db > 15) return 'DB index must be 0–15'
-    }
-    if (selectedType === 'rdp') {
-      if (!form.username.trim()) return 'Username is required'
-    }
-    return null
+    return validateTypeFields()
   }
 
   // When editing without retyping the password, fall back to the stored one
@@ -279,7 +287,7 @@ export default function AddConnectionModal({ onClose }: Props) {
           await window.api.sftp.disconnect(clientId)
         }
       } else if (selectedType === 'redis') {
-        const id = await window.api.redis.connect({ host, port, password, db: parseInt(form.redisDb) })
+        const id = await window.api.redis.connect({ host, port, password, db: Number.parseInt(form.redisDb) })
         await window.api.redis.disconnect(id)
       } else if (selectedType === 'database') {
         const id = await window.api.database.connect({
@@ -303,6 +311,57 @@ export default function AddConnectionModal({ onClose }: Props) {
     }
   }
 
+  const parsedTags = (): string[] =>
+    form.tags ? form.tags.split(',').map((t: string) => t.trim()).filter(Boolean) : []
+
+  const k8sSessionData = (): any => ({
+    type: 'kubernetes',
+    label: form.label.trim() || k8sSelected!.name,
+    host: k8sSelected!.server || k8sSelected!.name,
+    port: 0,
+    username: '',
+    authType: 'password',
+    color: form.color,
+    tags: parsedTags(),
+    contextName: k8sSelected!.name,
+    kubeconfigPath: k8sSelected!.source !== 'default' ? k8sSelected!.source : undefined,
+  })
+
+  const sessionData = (): any => {
+    const includePassword = !editingConnectionId || passwordDirty
+    return {
+      type: selectedType,
+      label: form.label.trim() || undefined,
+      host: form.host.trim(),
+      port: parsedPort(),
+      username: form.username.trim() || undefined,
+      authType: form.authType,
+      password: includePassword && form.authType === 'password' ? form.password : undefined,
+      keyPath: form.authType === 'key' ? form.keyPath.trim() : undefined,
+      jumpHostId: (selectedType === 'ssh' || selectedType === 'sftp') && form.jumpHostId ? form.jumpHostId : undefined,
+      group: form.group || undefined,
+      color: form.color,
+      tags: parsedTags(),
+      pollingEnabled: selectedType === 'ssh' ? form.pollingEnabled : undefined,
+      pollingIntervalSeconds: selectedType === 'ssh' ? Number.parseInt(form.pollingIntervalSeconds) : undefined,
+      connectOnStart: selectedType === 'ssh' ? form.connectOnStart : undefined,
+      dbType: selectedType === 'database' ? form.dbType : undefined,
+      databaseName: selectedType === 'database' ? form.databaseName : undefined,
+      sslMode: selectedType === 'database' ? form.sslMode : undefined,
+      redisDb: selectedType === 'redis' ? Number.parseInt(form.redisDb) : undefined,
+    }
+  }
+
+  const persistSession = async (data: any) => {
+    if (editingConnectionId) {
+      const updated = await window.api.sessions.update(editingConnectionId, data)
+      useAppStore.getState().updateSession(editingConnectionId, updated)
+    } else {
+      const session = await window.api.sessions.create(data)
+      addSession(session)
+    }
+  }
+
   const handleSave = async (e: React.FormEvent) => {
     e.preventDefault()
 
@@ -312,70 +371,9 @@ export default function AddConnectionModal({ onClose }: Props) {
       return setError(invalid)
     }
 
-    if (selectedType === 'kubernetes') {
-      if (!k8sSelected) return setError('Select a context to continue')
-      setSaving(true)
-      try {
-        const data: any = {
-          type: 'kubernetes',
-          label: form.label.trim() || k8sSelected.name,
-          host: k8sSelected.server || k8sSelected.name,
-          port: 0,
-          username: '',
-          authType: 'password',
-          color: form.color,
-          tags: form.tags ? form.tags.split(',').map(t => t.trim()).filter(Boolean) : [],
-          contextName: k8sSelected.name,
-          kubeconfigPath: k8sSelected.source !== 'default' ? k8sSelected.source : undefined,
-        }
-        if (editingConnectionId) {
-          const updated = await window.api.sessions.update(editingConnectionId, data)
-          useAppStore.getState().updateSession(editingConnectionId, updated)
-        } else {
-          const session = await window.api.sessions.create(data)
-          addSession(session)
-        }
-        handleClose()
-      } catch (err: any) {
-        setError(ipcErrorMessage(err, 'Failed to save'))
-      } finally {
-        setSaving(false)
-      }
-      return
-    }
-
     setSaving(true)
     try {
-      const includePassword = !editingConnectionId || passwordDirty
-      const data: any = {
-        type: selectedType,
-        label: form.label.trim() || undefined,
-        host: form.host.trim(),
-        port: parsedPort(),
-        username: form.username.trim() || undefined,
-        authType: form.authType,
-        password: includePassword && form.authType === 'password' ? form.password : undefined,
-        keyPath: form.authType === 'key' ? form.keyPath.trim() : undefined,
-        jumpHostId: (selectedType === 'ssh' || selectedType === 'sftp') && form.jumpHostId ? form.jumpHostId : undefined,
-        group: form.group || undefined,
-        color: form.color,
-        tags: form.tags ? form.tags.split(',').map(t => t.trim()).filter(Boolean) : [],
-        pollingEnabled: selectedType === 'ssh' ? form.pollingEnabled : undefined,
-        pollingIntervalSeconds: selectedType === 'ssh' ? parseInt(form.pollingIntervalSeconds) : undefined,
-        connectOnStart: selectedType === 'ssh' ? form.connectOnStart : undefined,
-        dbType: selectedType === 'database' ? form.dbType : undefined,
-        databaseName: selectedType === 'database' ? form.databaseName : undefined,
-        sslMode: selectedType === 'database' ? form.sslMode : undefined,
-        redisDb: selectedType === 'redis' ? parseInt(form.redisDb) : undefined,
-      }
-
-      if (editingConnectionId) {
-        const updated = await window.api.sessions.update(editingConnectionId, data)
-        useAppStore.getState().updateSession(editingConnectionId, updated)
-      } else {
-        const session = await window.api.sessions.create(data)
-        addSession(session)
-      }
+      await persistSession(selectedType === 'kubernetes' ? k8sSessionData() : sessionData())
       handleClose()
     } catch (err: any) {
       setTestResult(null)
@@ -389,7 +387,8 @@ export default function AddConnectionModal({ onClose }: Props) {
     <div
       className="fixed inset-0 z-50 flex items-center justify-center"
       style={{ background: 'rgba(0,0,0,0.5)' }}
-      onClick={handleClose}
+      onClick={e => { if (e.target === e.currentTarget) handleClose() }}
+      onKeyDown={e => { if (e.key === 'Escape') handleClose() }}
     >
       <div
         className="rounded-xl w-full max-w-lg max-h-[90vh] flex flex-col overflow-hidden"
@@ -398,7 +397,6 @@ export default function AddConnectionModal({ onClose }: Props) {
           border: '1px solid var(--nox-border)',
           boxShadow: '0 20px 60px rgba(0,0,0,0.3)',
         }}
-        onClick={e => e.stopPropagation()}
       >
         {/* Modal header */}
         <div className="px-6 py-4 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)' }}>
@@ -439,7 +437,7 @@ export default function AddConnectionModal({ onClose }: Props) {
                     <div
                       className="w-6 h-6 rounded-full flex items-center justify-center text-[10px] font-bold"
                       style={{
-                        background: done ? '#3B5CCC' : active ? '#3B5CCC' : 'var(--nox-border)',
+                        background: done || active ? '#3B5CCC' : 'var(--nox-border)',
                         color: done || active ? '#fff' : 'var(--nox-text-2)',
                       }}
                     >
@@ -543,7 +541,7 @@ export default function AddConnectionModal({ onClose }: Props) {
                   onMouseLeave={e => { e.currentTarget.style.background = '#3B5CCC' }}
                 >
                   <Check className="w-3.5 h-3.5" />
-                  {saving ? 'Saving…' : editingConnectionId ? 'Save Changes' : 'Save Connection'}
+                  {saveButtonLabel(saving, !!editingConnectionId)}
                 </button>
               </div>
             </>
@@ -555,10 +553,10 @@ export default function AddConnectionModal({ onClose }: Props) {
 }
 
 /* ── Type selector ───────────────────────────────────────────────────────── */
-function TypeSelector({ selected, onSelect }: {
+function TypeSelector({ selected, onSelect }: Readonly<{
   selected: ConnectionType
   onSelect: (t: ConnectionType) => void
-}) {
+}>) {
   // RDP needs the bundled FreeRDP sidecar, which currently ships on macOS only.
   // Hide the type elsewhere so we never offer a connection that can't run.
   const options = TYPE_OPTIONS.filter(o => o.type !== 'rdp' || window.api.platform === 'darwin')
@@ -598,176 +596,368 @@ function TypeSelector({ selected, onSelect }: {
 }
 
 /* ── Config form ─────────────────────────────────────────────────────────── */
-function ConfigForm({ type, form, set, error, testResult, isEditing, hasExistingPassword, k8sContexts, k8sLoading, k8sSelected, onK8sSelect, onK8sImport, onK8sRefresh }: {
-  type: ConnectionType
+function saveButtonLabel(saving: boolean, editing: boolean): string {
+  if (saving) return 'Saving…'
+  return editing ? 'Save Changes' : 'Save Connection'
+}
+
+function storedPasswordPlaceholder(isEditing: boolean, hasExistingPassword: boolean, fallback: string): string {
+  return isEditing && hasExistingPassword ? '••••••••  (leave blank to keep)' : fallback
+}
+
+function PasswordInput({ form, set, placeholder }: Readonly<{ form: any; set: (f: string, v: any) => void; placeholder: string }>) {
+  return (
+    <div className="relative">
+      <FormInput
+        type={form.showPassword ? 'text' : 'password'}
+        placeholder={placeholder}
+        value={form.password}
+        onChange={e => set('password', e.target.value)}
+      />
+      <button
+        type="button"
+        onClick={() => set('showPassword', !form.showPassword)}
+        className="absolute right-2 top-1/2 -translate-y-1/2 p-1 rounded transition-colors"
+        style={{ color: 'var(--nox-text-3)' }}
+        onMouseEnter={e => { e.currentTarget.style.color = 'var(--nox-text-2)' }}
+        onMouseLeave={e => { e.currentTarget.style.color = 'var(--nox-text-3)' }}
+      >
+        {form.showPassword ? <EyeOff className="w-3.5 h-3.5" /> : <Eye className="w-3.5 h-3.5" />}
+      </button>
+    </div>
+  )
+}
+
+function SshFields({ form, set, isEditing, hasExistingPassword, jumpHostCandidates }: Readonly<{
   form: any
   set: (f: string, v: any) => void
-  error: string
-  testResult: 'success' | 'error' | null
   isEditing: boolean
   hasExistingPassword: boolean
+  jumpHostCandidates: { id: string; label?: string; host: string }[]
+}>) {
+  return (
+    <>
+      <FormField label="Username">
+        <FormInput
+          placeholder="root"
+          value={form.username}
+          onChange={e => set('username', e.target.value)}
+        />
+      </FormField>
+
+      <div>
+        <label className="font-['Plus_Jakarta_Sans'] text-[10px] uppercase tracking-wider font-semibold block mb-2" style={{ color: 'var(--nox-text-3)' }}>
+          Authentication Method
+        </label>
+        <div className="flex items-center gap-2">
+          <button
+            type="button"
+            onClick={() => set('authType', 'key')}
+            className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] font-medium transition-colors"
+            style={form.authType === 'key'
+              ? { background: '#3B5CCC', color: '#fff' }
+              : { border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
+          >
+            <Key className="w-3.5 h-3.5" /> Private Key
+          </button>
+          <button
+            type="button"
+            onClick={() => set('authType', 'password')}
+            className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] font-medium transition-colors"
+            style={form.authType === 'password'
+              ? { background: '#3B5CCC', color: '#fff' }
+              : { border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
+          >
+            <Lock className="w-3.5 h-3.5" /> Password
+          </button>
+        </div>
+      </div>
+
+      {form.authType === 'password' && (
+        <FormField label="Password">
+          <PasswordInput form={form} set={set} placeholder={storedPasswordPlaceholder(isEditing, hasExistingPassword, 'Enter password')} />
+        </FormField>
+      )}
+
+      {form.authType === 'key' && (
+        <FormField label="Private Key Path">
+          <FormInput
+            placeholder="~/.ssh/id_ed25519"
+            value={form.keyPath}
+            onChange={e => set('keyPath', e.target.value)}
+          />
+        </FormField>
+      )}
+
+      {jumpHostCandidates.length > 0 && (
+        <FormField label="Connect via (jump host)">
+          <FormSelect value={form.jumpHostId} onChange={e => set('jumpHostId', e.target.value)}>
+            <option value="">None — connect directly</option>
+            {jumpHostCandidates.map(s => (
+              <option key={s.id} value={s.id}>{s.label || s.host}</option>
+            ))}
+          </FormSelect>
+        </FormField>
+      )}
+    </>
+  )
+}
+
+function DatabaseFields({ form, set, isEditing, hasExistingPassword }: Readonly<{
+  form: any
+  set: (f: string, v: any) => void
+  isEditing: boolean
+  hasExistingPassword: boolean
+}>) {
+  return (
+    <>
+      <FormField label="Database Type">
+        <FormSelect value={form.dbType} onChange={e => set('dbType', e.target.value)}>
+          <option value="postgresql">PostgreSQL</option>
+          <option value="mysql">MySQL</option>
+          <option value="mariadb">MariaDB</option>
+        </FormSelect>
+      </FormField>
+      <FormField label="Database Name">
+        <FormInput
+          placeholder="mydb"
+          value={form.databaseName}
+          onChange={e => set('databaseName', e.target.value)}
+        />
+      </FormField>
+      <FormField label="Username">
+        <FormInput
+          placeholder="postgres"
+          value={form.username}
+          onChange={e => set('username', e.target.value)}
+        />
+      </FormField>
+      <FormField label="Password">
+        <FormInput
+          type="password"
+          placeholder={storedPasswordPlaceholder(isEditing, hasExistingPassword, 'Enter password')}
+          value={form.password}
+          onChange={e => set('password', e.target.value)}
+        />
+      </FormField>
+      <FormField label="SSL Mode">
+        <FormSelect value={form.sslMode} onChange={e => set('sslMode', e.target.value)}>
+          <option value="disable">Disable</option>
+          <option value="require">Require</option>
+          <option value="verify-ca">Verify CA</option>
+          <option value="verify-full">Verify Full</option>
+        </FormSelect>
+      </FormField>
+    </>
+  )
+}
+
+function K8sContextList({ k8sContexts, k8sLoading, k8sSelected, dropActive, onK8sSelect }: Readonly<{
+  k8sContexts: K8sContextEntry[]
+  k8sLoading: boolean
+  k8sSelected: K8sContextEntry | null
+  dropActive: boolean
+  onK8sSelect: (ctx: K8sContextEntry) => void
+}>) {
+  if (k8sLoading && k8sContexts.length === 0) {
+    return (
+      <div className="flex items-center justify-center py-8 gap-2" style={{ color: 'var(--nox-text-3)' }}>
+        <RefreshCw className="w-3.5 h-3.5 animate-spin" />
+        <span className="font-['Inter'] text-[12px]">Reading kubeconfig…</span>
+      </div>
+    )
+  }
+  if (k8sContexts.length === 0) {
+    return (
+      <div className="py-8 text-center">
+        {dropActive ? (
+          <>
+            <FileCode2 className="w-6 h-6 mx-auto mb-2 text-[#3B5CCC]" />
+            <p className="font-['Inter'] text-[12px] text-[#3B5CCC] font-medium">Drop to import</p>
+          </>
+        ) : (
+          <>
+            <p className="font-['Inter'] text-[12px]" style={{ color: 'var(--nox-text-3)' }}>No contexts found</p>
+            <p className="font-['Inter'] text-[11px] mt-1" style={{ color: 'var(--nox-text-3)', opacity: 0.6 }}>
+              Click "Import file" or drag a kubeconfig here
+            </p>
+          </>
+        )}
+      </div>
+    )
+  }
+  const defaultContexts = k8sContexts.filter(c => c.source === 'default')
+  const importedFiles = [...new Set(k8sContexts.filter(c => c.source !== 'default').map(c => c.source))]
+  return (
+    <>
+      {dropActive && (
+        <div className="flex items-center justify-center gap-2 py-2 text-[#3B5CCC]" style={{ background: 'var(--nox-active)', borderBottom: '1px solid var(--nox-border)' }}>
+          <FileCode2 className="w-3.5 h-3.5" />
+          <span className="font-['Inter'] text-[11.5px] font-medium">Drop to import file</span>
+        </div>
+      )}
+      {defaultContexts.length > 0 && (
+        <ContextGroup
+          label="Default (~/.kube/config)"
+          contexts={defaultContexts}
+          selected={k8sSelected}
+          onSelect={onK8sSelect}
+        />
+      )}
+      {importedFiles.map(filePath => (
+        <ContextGroup
+          key={filePath}
+          label={filePath.split('/').pop() ?? filePath}
+          labelTitle={filePath}
+          contexts={k8sContexts.filter(c => c.source === filePath)}
+          selected={k8sSelected}
+          onSelect={onK8sSelect}
+        />
+      ))}
+    </>
+  )
+}
+
+function K8sContextForm({ form, set, error, k8sContexts, k8sLoading, k8sSelected, onK8sSelect, onK8sImport, onK8sRefresh }: Readonly<{
+  form: any
+  set: (f: string, v: any) => void
+  error: string
   k8sContexts: K8sContextEntry[]
   k8sLoading: boolean
   k8sSelected: K8sContextEntry | null
   onK8sSelect: (ctx: K8sContextEntry) => void
   onK8sImport: (filePath?: string) => void
   onK8sRefresh: () => void
-}) {
+}>) {
   const [dropActive, setDropActive] = useState(false)
-  const sessions = useAppStore(s => s.sessions)
-  const editingConnectionId = useAppStore(s => s.editingConnectionId)
-  const jumpHostCandidates = sessions.filter(s => (s.type ?? 'ssh') === 'ssh' && s.id !== editingConnectionId)
-  const projectNames = [...new Set(sessions.map(s => s.group).filter(Boolean))] as string[]
 
-  if (type === 'kubernetes') {
-    const defaultContexts = k8sContexts.filter(c => c.source === 'default')
-    const importedFiles = [...new Set(k8sContexts.filter(c => c.source !== 'default').map(c => c.source))]
+  return (
+    <div
+      className="px-6 py-4 space-y-4"
+      onDragOver={e => { e.preventDefault(); setDropActive(true) }}
+      onDragLeave={e => { if (!e.currentTarget.contains(e.relatedTarget as Node)) setDropActive(false) }}
+      onDrop={e => {
+        e.preventDefault()
+        setDropActive(false)
+        const file = e.dataTransfer.files[0]
+        if (!file) return
+        const filePath = (file as any).path as string | undefined
+        if (filePath) onK8sImport(filePath)
+      }}
+      style={dropActive ? { outline: '2px dashed #3B5CCC', outlineOffset: -2, borderRadius: 6 } : undefined}
+    >
+      {/* Header */}
+      <div className="flex items-center justify-between">
+        <div>
+          <p className="font-['Plus_Jakarta_Sans'] font-semibold text-[13.5px]" style={{ color: 'var(--nox-text)' }}>Select a context</p>
+          <p className="font-['Inter'] text-[11.5px] mt-0.5" style={{ color: 'var(--nox-text-2)' }}>
+            Auto-discovered from <code className="font-mono text-[10.5px] px-1 py-0.5 rounded" style={{ background: 'var(--nox-hover)', color: 'var(--nox-text-2)' }}>~/.kube/config</code>
+          </p>
+        </div>
+        <div className="flex items-center gap-2">
+          <button
+            type="button"
+            onClick={onK8sRefresh}
+            disabled={k8sLoading}
+            className="p-1.5 rounded-md transition-colors disabled:opacity-40"
+            style={{ color: 'var(--nox-text-2)' }}
+            onMouseEnter={e => { e.currentTarget.style.background = 'var(--nox-hover)' }}
+            onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}
+            title="Refresh"
+          >
+            <RefreshCw className={`w-3.5 h-3.5 ${k8sLoading ? 'animate-spin' : ''}`} />
+          </button>
+          <button
+            type="button"
+            onClick={() => onK8sImport()}
+            disabled={k8sLoading}
+            className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] transition-colors disabled:opacity-40"
+            style={{ border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
+            onMouseEnter={e => { e.currentTarget.style.background = 'var(--nox-hover)' }}
+            onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}
+          >
+            <FileCode2 className="w-3.5 h-3.5" />
+            Import file
+          </button>
+        </div>
+      </div>
 
-    return (
+      {/* Context list / drop zone */}
       <div
-        className="px-6 py-4 space-y-4"
-        onDragOver={e => { e.preventDefault(); setDropActive(true) }}
-        onDragLeave={e => { if (!e.currentTarget.contains(e.relatedTarget as Node)) setDropActive(false) }}
-        onDrop={async e => {
-          e.preventDefault()
-          setDropActive(false)
-          const file = e.dataTransfer.files[0]
-          if (!file) return
-          const filePath = (file as any).path as string | undefined
-          if (filePath) onK8sImport(filePath)
-        }}
-        style={dropActive ? { outline: '2px dashed #3B5CCC', outlineOffset: -2, borderRadius: 6 } : undefined}
+        className="rounded-md overflow-hidden"
+        style={{ border: dropActive ? '1px dashed #3B5CCC' : '1px solid var(--nox-border)', maxHeight: 280, overflowY: 'auto' }}
       >
-        {/* Header */}
-        <div className="flex items-center justify-between">
-          <div>
-            <p className="font-['Plus_Jakarta_Sans'] font-semibold text-[13.5px]" style={{ color: 'var(--nox-text)' }}>Select a context</p>
-            <p className="font-['Inter'] text-[11.5px] mt-0.5" style={{ color: 'var(--nox-text-2)' }}>
-              Auto-discovered from <code className="font-mono text-[10.5px] px-1 py-0.5 rounded" style={{ background: 'var(--nox-hover)', color: 'var(--nox-text-2)' }}>~/.kube/config</code>
-            </p>
-          </div>
-          <div className="flex items-center gap-2">
-            <button
-              type="button"
-              onClick={onK8sRefresh}
-              disabled={k8sLoading}
-              className="p-1.5 rounded-md transition-colors disabled:opacity-40"
-              style={{ color: 'var(--nox-text-2)' }}
-              onMouseEnter={e => { e.currentTarget.style.background = 'var(--nox-hover)' }}
-              onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}
-              title="Refresh"
-            >
-              <RefreshCw className={`w-3.5 h-3.5 ${k8sLoading ? 'animate-spin' : ''}`} />
-            </button>
-            <button
-              type="button"
-              onClick={() => onK8sImport()}
-              disabled={k8sLoading}
-              className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] transition-colors disabled:opacity-40"
-              style={{ border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
-              onMouseEnter={e => { e.currentTarget.style.background = 'var(--nox-hover)' }}
-              onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}
-            >
-              <FileCode2 className="w-3.5 h-3.5" />
-              Import file
-            </button>
-          </div>
+        <K8sContextList k8sContexts={k8sContexts} k8sLoading={k8sLoading} k8sSelected={k8sSelected} dropActive={dropActive} onK8sSelect={onK8sSelect} />
+      </div>
+
+      {error && (
+        <div className="flex items-center gap-2 px-3 py-2.5 rounded-md" style={{ background: '#FEF2F2', border: '1px solid #FECACA' }}>
+          <span className="text-[#EF4444] text-[12px]">✗</span>
+          <p className="font-['Inter'] text-[12px] text-[#EF4444]">{error}</p>
         </div>
+      )}
 
-        {/* Context list / drop zone */}
-        <div
-          className="rounded-md overflow-hidden"
-          style={{ border: dropActive ? '1px dashed #3B5CCC' : '1px solid var(--nox-border)', maxHeight: 280, overflowY: 'auto' }}
-        >
-          {k8sLoading && k8sContexts.length === 0 ? (
-            <div className="flex items-center justify-center py-8 gap-2" style={{ color: 'var(--nox-text-3)' }}>
-              <RefreshCw className="w-3.5 h-3.5 animate-spin" />
-              <span className="font-['Inter'] text-[12px]">Reading kubeconfig…</span>
-            </div>
-          ) : k8sContexts.length === 0 ? (
-            <div className="py-8 text-center">
-              {dropActive ? (
-                <>
-                  <FileCode2 className="w-6 h-6 mx-auto mb-2 text-[#3B5CCC]" />
-                  <p className="font-['Inter'] text-[12px] text-[#3B5CCC] font-medium">Drop to import</p>
-                </>
-              ) : (
-                <>
-                  <p className="font-['Inter'] text-[12px]" style={{ color: 'var(--nox-text-3)' }}>No contexts found</p>
-                  <p className="font-['Inter'] text-[11px] mt-1" style={{ color: 'var(--nox-text-3)', opacity: 0.6 }}>
-                    Click "Import file" or drag a kubeconfig here
-                  </p>
-                </>
-              )}
-            </div>
-          ) : (
-            <>
-              {dropActive && (
-                <div className="flex items-center justify-center gap-2 py-2 text-[#3B5CCC]" style={{ background: 'var(--nox-active)', borderBottom: '1px solid var(--nox-border)' }}>
-                  <FileCode2 className="w-3.5 h-3.5" />
-                  <span className="font-['Inter'] text-[11.5px] font-medium">Drop to import file</span>
-                </div>
-              )}
-              {defaultContexts.length > 0 && (
-                <ContextGroup
-                  label="Default (~/.kube/config)"
-                  contexts={defaultContexts}
-                  selected={k8sSelected}
-                  onSelect={onK8sSelect}
-                />
-              )}
-              {importedFiles.map(filePath => (
-                <ContextGroup
-                  key={filePath}
-                  label={filePath.split('/').pop() ?? filePath}
-                  labelTitle={filePath}
-                  contexts={k8sContexts.filter(c => c.source === filePath)}
-                  selected={k8sSelected}
-                  onSelect={onK8sSelect}
+      {/* Optional label + color for selected context */}
+      {k8sSelected && (
+        <div className="space-y-3 pt-1">
+          <FormField label="Display Name">
+            <FormInput
+              placeholder={k8sSelected.name}
+              value={form.label}
+              onChange={e => set('label', e.target.value)}
+            />
+          </FormField>
+          <FormField label="Color">
+            <div className="flex items-center gap-2">
+              {COLORS.map(c => (
+                <button
+                  key={c}
+                  type="button"
+                  onClick={() => set('color', c)}
+                  className="w-6 h-6 rounded-full transition-all"
+                  style={{
+                    background: c,
+                    border: form.color === c ? '2px solid var(--nox-text)' : '2px solid transparent',
+                    outline: form.color === c ? '2px solid rgba(128,128,128,0.3)' : 'none',
+                    outlineOffset: 1,
+                  }}
                 />
               ))}
-            </>
-          )}
+            </div>
+          </FormField>
         </div>
+      )}
+    </div>
+  )
+}
 
-        {error && (
-          <div className="flex items-center gap-2 px-3 py-2.5 rounded-md" style={{ background: '#FEF2F2', border: '1px solid #FECACA' }}>
-            <span className="text-[#EF4444] text-[12px]">✗</span>
-            <p className="font-['Inter'] text-[12px] text-[#EF4444]">{error}</p>
-          </div>
-        )}
+function ConfigForm({ type, form, set, error, testResult, isEditing, hasExistingPassword, k8sContexts, k8sLoading, k8sSelected, onK8sSelect, onK8sImport, onK8sRefresh }: Readonly<{
+  type: ConnectionType
+  form: any
+  set: (f: string, v: any) => void
+  error: string
+  testResult: 'success' | 'error' | null
+  isEditing: boolean
+  hasExistingPassword: boolean
+  k8sContexts: K8sContextEntry[]
+  k8sLoading: boolean
+  k8sSelected: K8sContextEntry | null
+  onK8sSelect: (ctx: K8sContextEntry) => void
+  onK8sImport: (filePath?: string) => void
+  onK8sRefresh: () => void
+}>) {
+  const sessions = useAppStore(s => s.sessions)
+  const editingConnectionId = useAppStore(s => s.editingConnectionId)
+  const jumpHostCandidates = sessions.filter(s => (s.type ?? 'ssh') === 'ssh' && s.id !== editingConnectionId)
+  const projectNames = [...new Set(sessions.map(s => s.group).filter(Boolean))] as string[]
 
-        {/* Optional label + color for selected context */}
-        {k8sSelected && (
-          <div className="space-y-3 pt-1">
-            <FormField label="Display Name">
-              <FormInput
-                placeholder={k8sSelected.name}
-                value={form.label}
-                onChange={e => set('label', e.target.value)}
-              />
-            </FormField>
-            <FormField label="Color">
-              <div className="flex items-center gap-2">
-                {COLORS.map(c => (
-                  <button
-                    key={c}
-                    type="button"
-                    onClick={() => set('color', c)}
-                    className="w-6 h-6 rounded-full transition-all"
-                    style={{
-                      background: c,
-                      border: form.color === c ? '2px solid var(--nox-text)' : '2px solid transparent',
-                      outline: form.color === c ? '2px solid rgba(128,128,128,0.3)' : 'none',
-                      outlineOffset: 1,
-                    }}
-                  />
-                ))}
-              </div>
-            </FormField>
-          </div>
-        )}
-      </div>
+  if (type === 'kubernetes') {
+    return (
+      <K8sContextForm
+        form={form} set={set} error={error}
+        k8sContexts={k8sContexts} k8sLoading={k8sLoading} k8sSelected={k8sSelected}
+        onK8sSelect={onK8sSelect} onK8sImport={onK8sImport} onK8sRefresh={onK8sRefresh}
+      />
     )
   }
 
@@ -805,129 +995,11 @@ function ConfigForm({ type, form, set, error, testResult, isEditing, hasExisting
 
       {/* Type-specific fields */}
       {(type === 'ssh' || type === 'sftp') && (
-        <>
-          <FormField label="Username">
-            <FormInput
-              placeholder="root"
-              value={form.username}
-              onChange={e => set('username', e.target.value)}
-            />
-          </FormField>
-
-          <div>
-            <label className="font-['Plus_Jakarta_Sans'] text-[10px] uppercase tracking-wider font-semibold block mb-2" style={{ color: 'var(--nox-text-3)' }}>
-              Authentication Method
-            </label>
-            <div className="flex items-center gap-2">
-              <button
-                type="button"
-                onClick={() => set('authType', 'key')}
-                className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] font-medium transition-colors"
-                style={form.authType === 'key'
-                  ? { background: '#3B5CCC', color: '#fff' }
-                  : { border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
-              >
-                <Key className="w-3.5 h-3.5" /> Private Key
-              </button>
-              <button
-                type="button"
-                onClick={() => set('authType', 'password')}
-                className="flex items-center gap-1.5 px-3 py-1.5 rounded-md font-['Inter'] text-[12px] font-medium transition-colors"
-                style={form.authType === 'password'
-                  ? { background: '#3B5CCC', color: '#fff' }
-                  : { border: '1px solid var(--nox-border)', color: 'var(--nox-text-2)' }}
-              >
-                <Lock className="w-3.5 h-3.5" /> Password
-              </button>
-            </div>
-          </div>
-
-          {form.authType === 'password' && (
-            <FormField label="Password">
-              <div className="relative">
-                <FormInput
-                  type={form.showPassword ? 'text' : 'password'}
-                  placeholder={isEditing && hasExistingPassword ? '••••••••  (leave blank to keep)' : 'Enter password'}
-                  value={form.password}
-                  onChange={e => set('password', e.target.value)}
-                />
-                <button
-                  type="button"
-                  onClick={() => set('showPassword', !form.showPassword)}
-                  className="absolute right-2 top-1/2 -translate-y-1/2 p-1 rounded transition-colors"
-                  style={{ color: 'var(--nox-text-3)' }}
-                  onMouseEnter={e => { e.currentTarget.style.color = 'var(--nox-text-2)' }}
-                  onMouseLeave={e => { e.currentTarget.style.color = 'var(--nox-text-3)' }}
-                >
-                  {form.showPassword ? <EyeOff className="w-3.5 h-3.5" /> : <Eye className="w-3.5 h-3.5" />}
-                </button>
-              </div>
-            </FormField>
-          )}
-
-          {form.authType === 'key' && (
-            <FormField label="Private Key Path">
-              <FormInput
-                placeholder="~/.ssh/id_ed25519"
-                value={form.keyPath}
-                onChange={e => set('keyPath', e.target.value)}
-              />
-            </FormField>
-          )}
-
-          {jumpHostCandidates.length > 0 && (
-            <FormField label="Connect via (jump host)">
-              <FormSelect value={form.jumpHostId} onChange={e => set('jumpHostId', e.target.value)}>
-                <option value="">None — connect directly</option>
-                {jumpHostCandidates.map(s => (
-                  <option key={s.id} value={s.id}>{s.label || s.host}</option>
-                ))}
-              </FormSelect>
-            </FormField>
-          )}
-        </>
+        <SshFields form={form} set={set} isEditing={isEditing} hasExistingPassword={hasExistingPassword} jumpHostCandidates={jumpHostCandidates} />
       )}
 
       {type === 'database' && (
-        <>
-          <FormField label="Database Type">
-            <FormSelect value={form.dbType} onChange={e => set('dbType', e.target.value)}>
-              <option value="postgresql">PostgreSQL</option>
-              <option value="mysql">MySQL</option>
-              <option value="mariadb">MariaDB</option>
-            </FormSelect>
-          </FormField>
-          <FormField label="Database Name">
-            <FormInput
-              placeholder="mydb"
-              value={form.databaseName}
-              onChange={e => set('databaseName', e.target.value)}
-            />
-          </FormField>
-          <FormField label="Username">
-            <FormInput
-              placeholder="postgres"
-              value={form.username}
-              onChange={e => set('username', e.target.value)}
-            />
-          </FormField>
-          <FormField label="Password">
-            <FormInput
-              type="password"
-              placeholder={isEditing && hasExistingPassword ? '••••••••  (leave blank to keep)' : 'Enter password'}
-              value={form.password}
-              onChange={e => set('password', e.target.value)}
-            />
-          </FormField>
-          <FormField label="SSL Mode">
-            <FormSelect value={form.sslMode} onChange={e => set('sslMode', e.target.value)}>
-              <option value="disable">Disable</option>
-              <option value="require">Require</option>
-              <option value="verify-ca">Verify CA</option>
-              <option value="verify-full">Verify Full</option>
-            </FormSelect>
-          </FormField>
-        </>
+        <DatabaseFields form={form} set={set} isEditing={isEditing} hasExistingPassword={hasExistingPassword} />
       )}
 
       {type === 'rdp' && (
@@ -940,24 +1012,7 @@ function ConfigForm({ type, form, set, error, testResult, isEditing, hasExisting
             />
           </FormField>
           <FormField label="Password">
-            <div className="relative">
-              <FormInput
-                type={form.showPassword ? 'text' : 'password'}
-                placeholder={isEditing && hasExistingPassword ? '••••••••  (leave blank to keep)' : 'Enter password'}
-                value={form.password}
-                onChange={e => set('password', e.target.value)}
-              />
-              <button
-                type="button"
-                onClick={() => set('showPassword', !form.showPassword)}
-                className="absolute right-2 top-1/2 -translate-y-1/2 p-1 rounded transition-colors"
-                style={{ color: 'var(--nox-text-3)' }}
-                onMouseEnter={e => { e.currentTarget.style.color = 'var(--nox-text-2)' }}
-                onMouseLeave={e => { e.currentTarget.style.color = 'var(--nox-text-3)' }}
-              >
-                {form.showPassword ? <EyeOff className="w-3.5 h-3.5" /> : <Eye className="w-3.5 h-3.5" />}
-              </button>
-            </div>
+            <PasswordInput form={form} set={set} placeholder={storedPasswordPlaceholder(isEditing, hasExistingPassword, 'Enter password')} />
           </FormField>
         </>
       )}
@@ -967,7 +1022,7 @@ function ConfigForm({ type, form, set, error, testResult, isEditing, hasExisting
           <FormField label="Password (optional)">
             <FormInput
               type="password"
-              placeholder={isEditing && hasExistingPassword ? '••••••••  (leave blank to keep)' : 'Leave blank if no auth'}
+              placeholder={storedPasswordPlaceholder(isEditing, hasExistingPassword, 'Leave blank if no auth')}
               value={form.password}
               onChange={e => set('password', e.target.value)}
             />
@@ -1077,13 +1132,13 @@ function ConfigForm({ type, form, set, error, testResult, isEditing, hasExisting
   )
 }
 
-function ContextGroup({ label, labelTitle, contexts, selected, onSelect }: {
+function ContextGroup({ label, labelTitle, contexts, selected, onSelect }: Readonly<{
   label: string
   labelTitle?: string
   contexts: K8sContextEntry[]
   selected: K8sContextEntry | null
   onSelect: (ctx: K8sContextEntry) => void
-}) {
+}>) {
   return (
     <div>
       <div className="px-3 py-1.5" style={{ background: 'var(--nox-bg)', borderBottom: '1px solid var(--nox-border)' }}>
@@ -1128,13 +1183,15 @@ function ContextGroup({ label, labelTitle, contexts, selected, onSelect }: {
   )
 }
 
-function MiniToggleRow({ on, onToggle, label, description }: {
+function MiniToggleRow({ on, onToggle, label, description }: Readonly<{
   on: boolean; onToggle: () => void; label: string; description: string
-}) {
+}>) {
   return (
     <div className="flex items-center gap-3 p-3 rounded-md" style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}>
-      <div
+      <button
+        type="button"
         className="relative flex-shrink-0 cursor-pointer"
+        aria-pressed={on}
         onClick={onToggle}
       >
         <div className="w-8 h-4 rounded-full transition-colors" style={{ background: on ? '#3B5CCC' : 'var(--nox-border)' }} />
@@ -1142,7 +1199,7 @@ function MiniToggleRow({ on, onToggle, label, description }: {
           className="w-3.5 h-3.5 bg-white rounded-full absolute top-[1px] transition-all shadow-sm"
           style={{ left: on ? 'calc(100% - 14px - 2px)' : 2 }}
         />
-      </div>
+      </button>
       <div>
         <span className="font-['Inter'] text-[12px] font-medium" style={{ color: 'var(--nox-text)' }}>{label}</span>
         <p className="font-['Inter'] text-[10.5px] mt-0.5" style={{ color: 'var(--nox-text-2)' }}>{description}</p>
@@ -1151,7 +1208,7 @@ function MiniToggleRow({ on, onToggle, label, description }: {
   )
 }
 
-function FormField({ label, children }: { label: string; children: React.ReactNode }) {
+function FormField({ label, children }: Readonly<{ label: string; children: React.ReactNode }>) {
   return (
     <div>
       <label className="font-['Plus_Jakarta_Sans'] text-[10px] uppercase tracking-wider font-semibold block mb-1.5" style={{ color: 'var(--nox-text-3)' }}>
@@ -1171,7 +1228,7 @@ function FormInput({ className = '', ...props }: React.InputHTMLAttributes<HTMLI
         background: 'var(--nox-bg)',
         border: '1px solid var(--nox-border)',
         color: 'var(--nox-text)',
-        ...((props as any).style ?? {}),
+        ...(props as any).style,
       }}
     />
   )
diff --git a/src/renderer/src/components/ConnectionManager/ConnectionManager.tsx b/src/renderer/src/components/ConnectionManager/ConnectionManager.tsx
index 5beceb1..3397c88 100644
--- a/src/renderer/src/components/ConnectionManager/ConnectionManager.tsx
+++ b/src/renderer/src/components/ConnectionManager/ConnectionManager.tsx
@@ -2,12 +2,31 @@ import { useState } from 'react'
 import {
   Filter, Search, Plus, Terminal, FolderOpen, Database, Boxes, Layers, Monitor,
   Plug, Pencil, Copy, Trash2, ChevronDown, ChevronUp, Check, FileDown,
+  type LucideProps,
 } from 'lucide-react'
 import { useAppStore, Session } from '../../store'
 import ImportSshConfigModal from './ImportSshConfigModal'
 
 type FilterType = 'ssh' | 'sftp' | 'database' | 'kubernetes' | 'online' | 'offline'
 
+const typeColor: Record<string, string> = {
+  ssh: '#3B5CCC', sftp: '#EC4899', database: '#10B981', kubernetes: '#8B5CF6', redis: '#DC382D', rdp: '#06B6D4',
+}
+const typeLabel: Record<string, string> = {
+  ssh: 'SSH', sftp: 'SFTP', database: 'Database', kubernetes: 'Kubernetes', redis: 'Redis', rdp: 'Remote Desktop',
+}
+
+function TypeIcon({ type, ...props }: Readonly<{ type?: string } & LucideProps>) {
+  switch (type ?? 'ssh') {
+    case 'sftp': return <FolderOpen {...props} />
+    case 'database': return <Database {...props} />
+    case 'kubernetes': return <Boxes {...props} />
+    case 'redis': return <Layers {...props} />
+    case 'rdp': return <Monitor {...props} />
+    default: return <Terminal {...props} />
+  }
+}
+
 export default function ConnectionManager() {
   const { sessions, openTab, removeSession, setShowAddConnection, setEditingConnectionId } = useAppStore()
   const [search, setSearch] = useState('')
@@ -66,24 +85,6 @@ export default function ConnectionManager() {
     openTab(s)
   }
 
-  const typeColor: Record<string, string> = {
-    ssh: '#3B5CCC', sftp: '#EC4899', database: '#10B981', kubernetes: '#8B5CF6', redis: '#DC382D', rdp: '#06B6D4',
-  }
-  const typeLabel: Record<string, string> = {
-    ssh: 'SSH', sftp: 'SFTP', database: 'Database', kubernetes: 'Kubernetes', redis: 'Redis', rdp: 'Remote Desktop',
-  }
-  const TypeIcon = ({ type, ...props }: { type?: string; [k: string]: any }) => {
-    const t = type ?? 'ssh'
-    switch (t) {
-      case 'sftp': return <FolderOpen {...props} />
-      case 'database': return <Database {...props} />
-      case 'kubernetes': return <Boxes {...props} />
-      case 'redis': return <Layers {...props} />
-      case 'rdp': return <Monitor {...props} />
-      default: return <Terminal {...props} />
-    }
-  }
-
   return (
     <div className="h-full overflow-y-auto" style={{ background: 'var(--nox-bg)' }}>
       <div className="p-6">
@@ -137,16 +138,18 @@ export default function ConnectionManager() {
                       onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
                       onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = 'transparent' }}
                     >
-                      <div
+                      <button
+                        type="button"
                         className="w-4 h-4 rounded flex items-center justify-center flex-shrink-0"
                         style={{
                           border: `2px solid ${filters.has(ft) ? '#3B5CCC' : 'var(--nox-border)'}`,
                           background: filters.has(ft) ? '#3B5CCC' : 'transparent',
                         }}
+                        aria-pressed={filters.has(ft)}
                         onClick={() => toggleFilter(ft)}
                       >
                         {filters.has(ft) && <Check className="w-3 h-3 text-white" />}
-                      </div>
+                      </button>
                       <span className="w-2 h-2 rounded-full" style={{ background: typeColor[ft] }} />
                       <span className="font-['Inter'] text-[12.5px]" style={{ color: 'var(--nox-text)' }}>{typeLabel[ft]}</span>
                     </label>
@@ -165,16 +168,18 @@ export default function ConnectionManager() {
                         onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
                         onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = 'transparent' }}
                       >
-                        <div
+                        <button
+                          type="button"
                           className="w-4 h-4 rounded flex items-center justify-center flex-shrink-0"
                           style={{
                             border: `2px solid ${filters.has(ft) ? '#3B5CCC' : 'var(--nox-border)'}`,
                             background: filters.has(ft) ? '#3B5CCC' : 'transparent',
                           }}
+                          aria-pressed={filters.has(ft)}
                           onClick={() => toggleFilter(ft)}
                         >
                           {filters.has(ft) && <Check className="w-3 h-3 text-white" />}
-                        </div>
+                        </button>
                         <span className="w-2 h-2 rounded-full" style={{ background: ft === 'online' ? '#10B981' : 'var(--nox-text-3)' }} />
                         <span className="font-['Inter'] text-[12.5px] capitalize" style={{ color: 'var(--nox-text)' }}>{ft}</span>
                       </label>
diff --git a/src/renderer/src/components/ConnectionManager/ImportSshConfigModal.tsx b/src/renderer/src/components/ConnectionManager/ImportSshConfigModal.tsx
index c26a07b..9de534b 100644
--- a/src/renderer/src/components/ConnectionManager/ImportSshConfigModal.tsx
+++ b/src/renderer/src/components/ConnectionManager/ImportSshConfigModal.tsx
@@ -160,16 +160,18 @@ export default function ImportSshConfigModal({ onClose }: Props) {
                 onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
                 onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = 'transparent' }}
               >
-                <div
+                <button
+                  type="button"
                   className="w-4 h-4 rounded flex items-center justify-center flex-shrink-0"
                   style={{
                     border: `2px solid ${checked ? '#3B5CCC' : 'var(--nox-border)'}`,
                     background: checked ? '#3B5CCC' : 'transparent',
                   }}
+                  aria-pressed={checked}
                   onClick={() => toggle(h.alias)}
                 >
                   {checked && <Check className="w-3 h-3 text-white" />}
-                </div>
+                </button>
                 <Terminal className="w-3.5 h-3.5 flex-shrink-0" style={{ color: '#3B5CCC' }} />
                 <div className="flex-1 min-w-0">
                   <span className="font-['Plus_Jakarta_Sans'] font-semibold text-[12.5px] block truncate" style={{ color: 'var(--nox-text)' }}>
diff --git a/src/renderer/src/components/ConnectionManager/__tests__/AddConnectionModal.test.tsx b/src/renderer/src/components/ConnectionManager/__tests__/AddConnectionModal.test.tsx
new file mode 100644
index 0000000..01d5938
--- /dev/null
+++ b/src/renderer/src/components/ConnectionManager/__tests__/AddConnectionModal.test.tsx
@@ -0,0 +1,526 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor, within } from '@testing-library/react'
+import AddConnectionModal from '../AddConnectionModal'
+import { installWindowApi, makeSession, type WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+const initialState = useAppStore.getState()
+
+let api: WindowApiMock
+let onClose: ReturnType<typeof vi.fn<() => void>>
+
+beforeEach(() => {
+  useAppStore.setState(initialState, true)
+  api = installWindowApi()
+  onClose = vi.fn<() => void>()
+})
+
+function renderModal() {
+  return render(<AddConnectionModal onClose={onClose} />)
+}
+
+/** Pick a connection type on step 1 and advance to the config step. */
+function goToConfig(typeLabel: string) {
+  fireEvent.click(screen.getByText(typeLabel))
+  fireEvent.click(screen.getByText('Next'))
+}
+
+function saveButton() {
+  return screen.getByText('Save Connection')
+}
+
+describe('AddConnectionModal — type step', () => {
+  it('renders all connection types including RDP on darwin', () => {
+    renderModal()
+    expect(screen.getByText('Add New Connection')).toBeTruthy()
+    for (const label of ['SSH Server', 'SFTP Server', 'Database', 'Kubernetes', 'Redis', 'Remote Desktop']) {
+      expect(screen.getByText(label)).toBeTruthy()
+    }
+  })
+
+  it('closes via Cancel, Escape and backdrop click', () => {
+    const { unmount } = renderModal()
+    fireEvent.click(screen.getByText('Cancel'))
+    expect(onClose).toHaveBeenCalledTimes(1)
+    unmount()
+
+    renderModal()
+    fireEvent.keyDown(window, { key: 'Escape' })
+    expect(onClose).toHaveBeenCalledTimes(2)
+  })
+
+  it('navigates to config step and back', () => {
+    renderModal()
+    goToConfig('SSH Server')
+    expect(screen.getByText('Step 2 — Enter connection details')).toBeTruthy()
+    fireEvent.click(screen.getByText('Back'))
+    expect(screen.getByText('Choose a connection type to get started')).toBeTruthy()
+  })
+})
+
+describe('AddConnectionModal — SSH', () => {
+  it('validates host, port, username and key path', async () => {
+    renderModal()
+    goToConfig('SSH Server')
+
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Host is required')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: '10.0.0.1' } })
+    fireEvent.change(screen.getByPlaceholderText('22'), { target: { value: '99999' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Port must be between 1 and 65535')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText('22'), { target: { value: '22' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Username is required')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'admin' } })
+    fireEvent.click(screen.getByText('Private Key'))
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Private key path is required')).toBeTruthy()
+    expect(api.sessions.create).not.toHaveBeenCalled()
+
+    // Switching back to password auth clears the key requirement
+    fireEvent.click(screen.getByText('Password'))
+    expect(screen.getByPlaceholderText('Enter password')).toBeTruthy()
+  })
+
+  it('saves a password-auth connection with tags, group and jump host', async () => {
+    useAppStore.setState({
+      sessions: [makeSession({ id: 'jump-1', label: 'Bastion', type: 'ssh', group: 'Homelab' })],
+    })
+    renderModal()
+    goToConfig('SSH Server')
+
+    fireEvent.change(screen.getByPlaceholderText('e.g. web-server-01'), { target: { value: 'web-01' } })
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: '10.0.0.5' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'deploy' } })
+    fireEvent.change(screen.getByPlaceholderText('Enter password'), { target: { value: 'secret' } })
+    fireEvent.change(screen.getByPlaceholderText('production, web'), { target: { value: 'production, web, ' } })
+    fireEvent.change(screen.getByPlaceholderText('e.g. Homelab'), { target: { value: 'Homelab' } })
+
+    // Jump host dropdown is rendered because another SSH session exists
+    const jumpSelect = screen.getByDisplayValue('None — connect directly')
+    fireEvent.change(jumpSelect, { target: { value: 'jump-1' } })
+
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalledTimes(1))
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      type: 'ssh',
+      label: 'web-01',
+      host: '10.0.0.5',
+      port: 22,
+      username: 'deploy',
+      authType: 'password',
+      password: 'secret',
+      jumpHostId: 'jump-1',
+      group: 'Homelab',
+      tags: ['production', 'web'],
+      pollingEnabled: false,
+      connectOnStart: false,
+    }))
+    expect(onClose).toHaveBeenCalled()
+    expect(useAppStore.getState().sessions.some(s => s.id === 's1')).toBe(true)
+  })
+
+  it('saves a key-auth connection and shows Saving… while pending', async () => {
+    let resolveCreate!: (v: { id: string }) => void
+    api.sessions.create.mockReturnValue(new Promise(res => { resolveCreate = res }))
+    renderModal()
+    goToConfig('SSH Server')
+
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+    fireEvent.click(screen.getByText('Private Key'))
+    fireEvent.change(screen.getByPlaceholderText('~/.ssh/id_ed25519'), { target: { value: '~/.ssh/key' } })
+
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Saving…')).toBeTruthy()
+    resolveCreate({ id: 's1' })
+    await waitFor(() => expect(onClose).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      authType: 'key',
+      keyPath: '~/.ssh/key',
+      password: undefined,
+    }))
+  })
+
+  it('shows the save error when creation fails', async () => {
+    api.sessions.create.mockRejectedValue(new Error('keychain locked'))
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('keychain locked')).toBeTruthy()
+    expect(onClose).not.toHaveBeenCalled()
+  })
+
+  it('toggles the password visibility with the eye button', () => {
+    renderModal()
+    goToConfig('SSH Server')
+    const input = screen.getByPlaceholderText('Enter password') as HTMLInputElement
+    expect(input.type).toBe('password')
+    const eyeButton = input.closest('.relative')!.querySelector('button')!
+    fireEvent.mouseEnter(eyeButton)
+    fireEvent.mouseLeave(eyeButton)
+    fireEvent.click(eyeButton)
+    expect((screen.getByPlaceholderText('Enter password') as HTMLInputElement).type).toBe('text')
+    fireEvent.click(eyeButton)
+    expect((screen.getByPlaceholderText('Enter password') as HTMLInputElement).type).toBe('password')
+  })
+
+  it('toggles polling and connect-on-start via the toggle buttons', async () => {
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+
+    const toggleFor = (label: string) =>
+      screen.getByText(label).parentElement!.parentElement!.querySelector('button')!
+    expect(toggleFor('Enable Dashboard Polling').getAttribute('aria-pressed')).toBe('false')
+    fireEvent.click(toggleFor('Enable Dashboard Polling'))
+    expect(toggleFor('Enable Dashboard Polling').getAttribute('aria-pressed')).toBe('true')
+    fireEvent.click(toggleFor('Connect on App Start'))
+    // Toggle polling back off, then re-enable it
+    fireEvent.click(toggleFor('Enable Dashboard Polling'))
+    fireEvent.click(toggleFor('Enable Dashboard Polling'))
+
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      pollingEnabled: true,
+      connectOnStart: true,
+      pollingIntervalSeconds: 60,
+    }))
+  })
+
+  it('runs Test Connection through ssh connect/disconnect and reports success', async () => {
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+    fireEvent.change(screen.getByPlaceholderText('Enter password'), { target: { value: 'pw' } })
+
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Connection successful!')).toBeTruthy()
+    expect(api.ssh.connect).toHaveBeenCalledWith(expect.objectContaining({
+      host: 'srv', port: 22, username: 'root', password: 'pw',
+    }))
+    expect(api.ssh.disconnect).toHaveBeenCalledWith('stream-1')
+  })
+
+  it('reports a test failure when the key file cannot be read', async () => {
+    api.fs.readFile.mockRejectedValue(new Error('ENOENT'))
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+    fireEvent.click(screen.getByText('Private Key'))
+    fireEvent.change(screen.getByPlaceholderText('~/.ssh/id_ed25519'), { target: { value: '/nope/key' } })
+
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Cannot read private key: /nope/key')).toBeTruthy()
+    expect(screen.getByText('Connection failed. Check your credentials.')).toBeTruthy()
+    expect(api.ssh.connect).not.toHaveBeenCalled()
+  })
+
+  it('surfaces the validation error instead of testing an invalid form', async () => {
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Host is required')).toBeTruthy()
+    expect(api.ssh.connect).not.toHaveBeenCalled()
+  })
+})
+
+describe('AddConnectionModal — SFTP', () => {
+  it('tests connectivity through the sftp bridge', async () => {
+    renderModal()
+    goToConfig('SFTP Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'files.example.com' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'ftp' } })
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Connection successful!')).toBeTruthy()
+    expect(api.sftp.connect).toHaveBeenCalled()
+    expect(api.sftp.disconnect).toHaveBeenCalledWith('sftp-1')
+  })
+})
+
+describe('AddConnectionModal — Database', () => {
+  it('validates database-specific fields', async () => {
+    renderModal()
+    goToConfig('Database')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.30'), { target: { value: 'db-host' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Username is required')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText('postgres'), { target: { value: 'app' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Database name is required')).toBeTruthy()
+  })
+
+  it('saves a mysql connection with ssl mode', async () => {
+    renderModal()
+    goToConfig('Database')
+    // Selecting the Database type reset the port to the postgres default
+    expect((screen.getByPlaceholderText('22') as HTMLInputElement).value).toBe('5432')
+
+    fireEvent.change(screen.getByDisplayValue('PostgreSQL'), { target: { value: 'mysql' } })
+    fireEvent.change(screen.getByDisplayValue('Disable'), { target: { value: 'require' } })
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.30'), { target: { value: 'db-host' } })
+    fireEvent.change(screen.getByPlaceholderText('mydb'), { target: { value: 'appdb' } })
+    fireEvent.change(screen.getByPlaceholderText('postgres'), { target: { value: 'app' } })
+    fireEvent.change(screen.getByPlaceholderText('Enter password'), { target: { value: 'dbpw' } })
+
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      type: 'database',
+      dbType: 'mysql',
+      databaseName: 'appdb',
+      sslMode: 'require',
+      username: 'app',
+      password: 'dbpw',
+    }))
+  })
+
+  it('tests connectivity through the database bridge', async () => {
+    renderModal()
+    goToConfig('Database')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.30'), { target: { value: 'db-host' } })
+    fireEvent.change(screen.getByPlaceholderText('mydb'), { target: { value: 'appdb' } })
+    fireEvent.change(screen.getByPlaceholderText('postgres'), { target: { value: 'app' } })
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Connection successful!')).toBeTruthy()
+    expect(api.database.connect).toHaveBeenCalledWith(expect.objectContaining({
+      dbType: 'postgresql', host: 'db-host', database: 'appdb', username: 'app',
+    }))
+    expect(api.database.disconnect).toHaveBeenCalledWith('db-1')
+  })
+})
+
+describe('AddConnectionModal — Redis', () => {
+  it('rejects an out-of-range db index and saves a valid one', async () => {
+    renderModal()
+    goToConfig('Redis')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'cache' } })
+    fireEvent.change(screen.getByPlaceholderText('0'), { target: { value: '42' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('DB index must be 0–15')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText('0'), { target: { value: '3' } })
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      type: 'redis', host: 'cache', port: 6379, redisDb: 3,
+    }))
+  })
+
+  it('tests connectivity through the redis bridge and surfaces failures', async () => {
+    api.redis.connect.mockRejectedValue(new Error("Error invoking remote method 'redis:connect': Error: NOAUTH"))
+    renderModal()
+    goToConfig('Redis')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'cache' } })
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('NOAUTH')).toBeTruthy()
+    expect(api.redis.connect).toHaveBeenCalledWith(expect.objectContaining({ host: 'cache', port: 6379, db: 0 }))
+  })
+})
+
+describe('AddConnectionModal — RDP', () => {
+  it('requires a username, hides Test Connection and saves', async () => {
+    renderModal()
+    goToConfig('Remote Desktop')
+    expect(screen.queryByText('Test Connection')).toBeNull()
+    expect((screen.getByPlaceholderText('22') as HTMLInputElement).value).toBe('3389')
+
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'win-box' } })
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Username is required')).toBeTruthy()
+
+    fireEvent.change(screen.getByPlaceholderText(/Administrator/), { target: { value: 'Administrator' } })
+    fireEvent.change(screen.getByPlaceholderText('Enter password'), { target: { value: 'winpw' } })
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      type: 'rdp', host: 'win-box', port: 3389, username: 'Administrator', password: 'winpw',
+    }))
+  })
+})
+
+describe('AddConnectionModal — Kubernetes', () => {
+  const ctx = { name: 'prod-cluster', server: 'https://1.2.3.4:6443' }
+
+  it('shows the loading state while contexts are read', async () => {
+    api.k8s.contextsDetailed.mockReturnValue(new Promise(() => {}))
+    renderModal()
+    goToConfig('Kubernetes')
+    expect(await screen.findByText('Reading kubeconfig…')).toBeTruthy()
+  })
+
+  it('shows the empty state and highlights the drop zone on drag-over', async () => {
+    renderModal()
+    goToConfig('Kubernetes')
+    expect(await screen.findByText('No contexts found')).toBeTruthy()
+
+    const zone = screen.getByText('Select a context').closest('.px-6')!
+    fireEvent.dragOver(zone)
+    expect(await screen.findByText('Drop to import')).toBeTruthy()
+  })
+
+  it('requires a selected context before saving', async () => {
+    renderModal()
+    goToConfig('Kubernetes')
+    fireEvent.click(saveButton())
+    expect(await screen.findByText('Select a context to continue')).toBeTruthy()
+    expect(api.sessions.create).not.toHaveBeenCalled()
+  })
+
+  it('lists default contexts, selects one and saves the connection', async () => {
+    api.k8s.contextsDetailed.mockResolvedValue([ctx])
+    renderModal()
+    goToConfig('Kubernetes')
+
+    expect(await screen.findByText('Default (~/.kube/config)')).toBeTruthy()
+    fireEvent.click(await screen.findByText('prod-cluster'))
+    // Selecting reveals the display-name and color pickers
+    const nameInput = await screen.findByPlaceholderText('prod-cluster')
+    fireEvent.change(nameInput, { target: { value: 'Prod' } })
+
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      type: 'kubernetes',
+      label: 'Prod',
+      host: 'https://1.2.3.4:6443',
+      contextName: 'prod-cluster',
+      kubeconfigPath: undefined,
+    }))
+  })
+
+  it('imports a kubeconfig file via the picker and groups its contexts', async () => {
+    api.k8s.showFilePicker.mockResolvedValue('/Users/me/Downloads/kc.yaml')
+    api.k8s.importKubeconfig.mockResolvedValue({
+      path: '/managed/kc.yaml',
+      contexts: [{ name: 'staging-ctx', server: 'https://9.9.9.9' }],
+    })
+    renderModal()
+    goToConfig('Kubernetes')
+    await screen.findByText('No contexts found')
+
+    fireEvent.click(screen.getByText('Import file'))
+    expect(await screen.findByText('staging-ctx')).toBeTruthy()
+    expect(screen.getByText('kc.yaml')).toBeTruthy()
+    expect(api.k8s.importKubeconfig).toHaveBeenCalledWith('/Users/me/Downloads/kc.yaml')
+
+    // Selecting an imported context persists its kubeconfig path
+    fireEvent.click(screen.getByText('staging-ctx'))
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      contextName: 'staging-ctx',
+      kubeconfigPath: '/managed/kc.yaml',
+    }))
+  })
+
+  it('imports a dropped kubeconfig file and reports import failures', async () => {
+    api.k8s.importKubeconfig.mockRejectedValue(new Error('not a kubeconfig'))
+    renderModal()
+    goToConfig('Kubernetes')
+    await screen.findByText('No contexts found')
+
+    const zone = screen.getByText('Select a context').closest('.px-6')!
+    fireEvent.drop(zone, { dataTransfer: { files: [{ path: '/tmp/kc.yaml' }] } })
+    expect(await screen.findByText('not a kubeconfig')).toBeTruthy()
+    expect(api.k8s.importKubeconfig).toHaveBeenCalledWith('/tmp/kc.yaml')
+  })
+
+  it('refreshes default contexts on demand', async () => {
+    renderModal()
+    goToConfig('Kubernetes')
+    await screen.findByText('No contexts found')
+    api.k8s.contextsDetailed.mockResolvedValue([ctx])
+    fireEvent.click(screen.getByTitle('Refresh'))
+    expect(await screen.findByText('prod-cluster')).toBeTruthy()
+    expect(api.k8s.contextsDetailed).toHaveBeenCalledTimes(2)
+  })
+})
+
+describe('AddConnectionModal — editing', () => {
+  const existing = makeSession({
+    id: 'edit-1',
+    label: 'Old Server',
+    host: 'old.example.com',
+    port: 2222,
+    username: 'olduser',
+    authType: 'password',
+    type: 'ssh',
+    hasPassword: true,
+    tags: ['legacy'],
+  })
+
+  beforeEach(() => {
+    useAppStore.setState({ sessions: [existing], editingConnectionId: 'edit-1' })
+  })
+
+  it('opens directly on the config step with prefilled values and stored-password placeholder', () => {
+    renderModal()
+    expect(screen.getByText('Edit Connection')).toBeTruthy()
+    expect((screen.getByPlaceholderText('e.g. web-server-01') as HTMLInputElement).value).toBe('Old Server')
+    expect((screen.getByPlaceholderText('192.168.1.10') as HTMLInputElement).value).toBe('old.example.com')
+    expect(screen.getByPlaceholderText(/leave blank to keep/)).toBeTruthy()
+    expect(screen.getByText('Save Changes')).toBeTruthy()
+  })
+
+  it('tests with the stored credential when the password was not retyped', async () => {
+    renderModal()
+    fireEvent.click(screen.getByText('Test Connection'))
+    expect(await screen.findByText('Connection successful!')).toBeTruthy()
+    expect(api.sessions.getCredentials).toHaveBeenCalledWith('edit-1')
+    expect(api.ssh.connect).toHaveBeenCalledWith(expect.objectContaining({ password: 'pw' }))
+  })
+
+  it('updates the session without resending an untouched password', async () => {
+    api.sessions.update.mockResolvedValue({ ...existing, label: 'Renamed' })
+    renderModal()
+    fireEvent.change(screen.getByPlaceholderText('e.g. web-server-01'), { target: { value: 'Renamed' } })
+    fireEvent.click(screen.getByText('Save Changes'))
+    await waitFor(() => expect(api.sessions.update).toHaveBeenCalledTimes(1))
+    const [id, data] = api.sessions.update.mock.calls[0]
+    expect(id).toBe('edit-1')
+    expect(data).toEqual(expect.objectContaining({ label: 'Renamed', host: 'old.example.com', port: 2222 }))
+    expect(data.password).toBeUndefined()
+    expect(onClose).toHaveBeenCalled()
+    expect(useAppStore.getState().editingConnectionId).toBeNull()
+    expect(useAppStore.getState().sessions[0].label).toBe('Renamed')
+  })
+
+  it('sends a retyped password on save', async () => {
+    api.sessions.update.mockResolvedValue({ ...existing })
+    renderModal()
+    fireEvent.change(screen.getByPlaceholderText(/leave blank to keep/), { target: { value: 'newpw' } })
+    fireEvent.click(screen.getByText('Save Changes'))
+    await waitFor(() => expect(api.sessions.update).toHaveBeenCalled())
+    expect(api.sessions.update.mock.calls[0][1]).toEqual(expect.objectContaining({ password: 'newpw' }))
+  })
+})
+
+describe('AddConnectionModal — color picker', () => {
+  it('marks the picked color as selected in the save payload', async () => {
+    renderModal()
+    goToConfig('SSH Server')
+    fireEvent.change(screen.getByPlaceholderText('192.168.1.10'), { target: { value: 'srv' } })
+    fireEvent.change(screen.getByPlaceholderText('root'), { target: { value: 'root' } })
+
+    const colorField = screen.getByText('Color').parentElement!
+    const swatches = within(colorField as HTMLElement).getAllByRole('button')
+    fireEvent.click(swatches[2]) // #10B981
+
+    fireEvent.click(saveButton())
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({ color: '#10B981' }))
+  })
+})
diff --git a/src/renderer/src/components/ConnectionManager/__tests__/ConnectionManager.test.tsx b/src/renderer/src/components/ConnectionManager/__tests__/ConnectionManager.test.tsx
new file mode 100644
index 0000000..61159ac
--- /dev/null
+++ b/src/renderer/src/components/ConnectionManager/__tests__/ConnectionManager.test.tsx
@@ -0,0 +1,187 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor, within } from '@testing-library/react'
+import ConnectionManager from '../ConnectionManager'
+import { installWindowApi, makeSession, makeTab, type WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+const initialState = useAppStore.getState()
+
+let api: WindowApiMock
+
+const sshSession = makeSession({ id: 'ssh-1', label: 'Web Server', host: 'web.example.com', type: 'ssh', tags: ['prod'] })
+const dbSession = makeSession({ id: 'db-1', label: 'Postgres', host: 'db.example.com', port: 5432, type: 'database' })
+const k8sSession = makeSession({ id: 'k8s-1', label: 'Cluster', host: 'https://k8s', type: 'kubernetes' })
+
+beforeEach(() => {
+  useAppStore.setState(initialState, true)
+  api = installWindowApi()
+  useAppStore.setState({
+    sessions: [sshSession, dbSession, k8sSession],
+    tabs: [makeTab({ sessionId: 'ssh-1', status: 'connected' })],
+  })
+})
+
+/** The filter dropdown renders checkbox-like buttons inside each label. */
+function filterCheckbox(labelText: string) {
+  const dropdown = screen.getByText('Connection Type').parentElement as HTMLElement
+  const label = within(dropdown).getByText(labelText).closest('label') as HTMLElement
+  return label.querySelector('button') as HTMLElement
+}
+
+function openFilterDropdown() {
+  fireEvent.click(screen.getByText(/^Filter/))
+}
+
+function rowNames(): string[] {
+  return screen.getAllByRole('row').slice(1).map(r => (r as HTMLElement).querySelector('td span')?.textContent ?? '')
+}
+
+describe('ConnectionManager', () => {
+  it('lists all connections with type, host and status', () => {
+    render(<ConnectionManager />)
+    expect(screen.getByText('3 connections configured')).toBeTruthy()
+    expect(screen.getByText('Web Server')).toBeTruthy()
+    expect(screen.getByText('web.example.com:22')).toBeTruthy()
+    expect(screen.getByText('Connected')).toBeTruthy()
+    expect(screen.getAllByText('Idle')).toHaveLength(2)
+    expect(screen.getByText('prod')).toBeTruthy()
+  })
+
+  it('filters by search text', () => {
+    render(<ConnectionManager />)
+    fireEvent.change(screen.getByPlaceholderText('Search...'), { target: { value: 'postgres' } })
+    expect(rowNames()).toEqual(['Postgres'])
+    fireEvent.change(screen.getByPlaceholderText('Search...'), { target: { value: 'zzz' } })
+    expect(screen.getByText('No connections match your search.')).toBeTruthy()
+  })
+
+  it('toggles type filters with the mouse', () => {
+    render(<ConnectionManager />)
+    openFilterDropdown()
+    expect(screen.getByText('Connection Type')).toBeTruthy()
+
+    const sshLabel = filterCheckbox('SSH').closest('label') as HTMLElement
+    fireEvent.mouseEnter(sshLabel)
+    fireEvent.mouseLeave(sshLabel)
+
+    fireEvent.click(filterCheckbox('SSH'))
+    expect(screen.getByText('Filter (1)')).toBeTruthy()
+    expect(rowNames()).toEqual(['Web Server'])
+
+    fireEvent.click(filterCheckbox('Database'))
+    expect(screen.getByText('Filter (2)')).toBeTruthy()
+    expect(rowNames()).toEqual(['Web Server', 'Postgres'])
+
+    // Unchecking removes the filter again
+    fireEvent.click(filterCheckbox('SSH'))
+    expect(rowNames()).toEqual(['Postgres'])
+  })
+
+  it('toggles type filters via the checkbox buttons and reflects aria-pressed', () => {
+    render(<ConnectionManager />)
+    openFilterDropdown()
+
+    expect(filterCheckbox('Kubernetes').getAttribute('aria-pressed')).toBe('false')
+    fireEvent.click(filterCheckbox('Kubernetes'))
+    expect(rowNames()).toEqual(['Cluster'])
+    expect(filterCheckbox('Kubernetes').getAttribute('aria-pressed')).toBe('true')
+
+    fireEvent.click(filterCheckbox('Kubernetes'))
+    expect(rowNames()).toEqual(['Web Server', 'Postgres', 'Cluster'])
+    expect(filterCheckbox('Kubernetes').getAttribute('aria-pressed')).toBe('false')
+  })
+
+  it('filters by online/offline status', () => {
+    render(<ConnectionManager />)
+    openFilterDropdown()
+    const dropdown = screen.getByText('Connection Type').parentElement as HTMLElement
+    expect(within(dropdown).getByText('Status')).toBeTruthy()
+
+    const onlineLabel = filterCheckbox('online').closest('label') as HTMLElement
+    fireEvent.mouseEnter(onlineLabel)
+    fireEvent.mouseLeave(onlineLabel)
+
+    fireEvent.click(filterCheckbox('online'))
+    expect(rowNames()).toEqual(['Web Server'])
+
+    fireEvent.click(filterCheckbox('online'))
+    fireEvent.click(filterCheckbox('offline'))
+    expect(rowNames()).toEqual(['Postgres', 'Cluster'])
+
+    // Status filters combine with type filters as an OR
+    fireEvent.click(filterCheckbox('SSH'))
+    expect(rowNames()).toEqual(['Web Server', 'Postgres', 'Cluster'])
+  })
+
+  it('closes and reopens the filter dropdown', () => {
+    render(<ConnectionManager />)
+    openFilterDropdown()
+    expect(screen.getByText('Connection Type')).toBeTruthy()
+    openFilterDropdown()
+    expect(screen.queryByText('Connection Type')).toBeNull()
+  })
+
+  it('opens a tab on Connect but not for kubernetes rows', () => {
+    render(<ConnectionManager />)
+    const connectButtons = screen.getAllByTitle('Connect')
+    fireEvent.click(connectButtons[2]) // Cluster — kubernetes is ignored
+    expect(useAppStore.getState().tabs).toHaveLength(1)
+    fireEvent.click(connectButtons[1]) // Postgres
+    const tabs = useAppStore.getState().tabs
+    expect(tabs).toHaveLength(2)
+    expect(tabs.some(t => t.sessionId === 'db-1' && t.view === 'database')).toBe(true)
+  })
+
+  it('starts editing a connection', () => {
+    render(<ConnectionManager />)
+    fireEvent.click(screen.getAllByTitle('Edit')[1])
+    expect(useAppStore.getState().editingConnectionId).toBe('db-1')
+    expect(useAppStore.getState().showAddConnection).toBe(true)
+  })
+
+  it('duplicates a connection including stored credentials', async () => {
+    useAppStore.setState({ sessions: [{ ...sshSession, hasPassword: true }] })
+    api.sessions.create.mockResolvedValue(makeSession({ id: 'copy-1', label: 'Web Server (copy)' }))
+    render(<ConnectionManager />)
+    fireEvent.click(screen.getByTitle('Duplicate'))
+    await waitFor(() => expect(api.sessions.create).toHaveBeenCalled())
+    expect(api.sessions.getCredentials).toHaveBeenCalledWith('ssh-1')
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      label: 'Web Server (copy)',
+      password: 'pw',
+    }))
+    await waitFor(() => expect(useAppStore.getState().sessions).toHaveLength(2))
+  })
+
+  it('deletes a connection after confirmation', async () => {
+    vi.spyOn(window, 'confirm').mockReturnValue(true)
+    render(<ConnectionManager />)
+    fireEvent.click(screen.getAllByTitle('Delete')[0])
+    await waitFor(() => expect(api.sessions.delete).toHaveBeenCalledWith('ssh-1'))
+    expect(useAppStore.getState().sessions.some(s => s.id === 'ssh-1')).toBe(false)
+  })
+
+  it('does not delete when the confirmation is dismissed', () => {
+    vi.spyOn(window, 'confirm').mockReturnValue(false)
+    render(<ConnectionManager />)
+    fireEvent.click(screen.getAllByTitle('Delete')[0])
+    expect(api.sessions.delete).not.toHaveBeenCalled()
+  })
+
+  it('shows the empty state with an inline Add Connection action', () => {
+    useAppStore.setState({ sessions: [], tabs: [] })
+    render(<ConnectionManager />)
+    expect(screen.getByText('No connections configured yet.')).toBeTruthy()
+    const addButtons = screen.getAllByText('Add Connection')
+    fireEvent.click(addButtons[addButtons.length - 1])
+    expect(useAppStore.getState().showAddConnection).toBe(true)
+  })
+
+  it('opens the SSH-config import modal', async () => {
+    render(<ConnectionManager />)
+    fireEvent.click(screen.getByText('Import'))
+    expect(await screen.findByText('Import from SSH config')).toBeTruthy()
+    expect(api.sshConfig.hosts).toHaveBeenCalled()
+  })
+})
diff --git a/src/renderer/src/components/ConnectionManager/__tests__/ImportSshConfigModal.test.tsx b/src/renderer/src/components/ConnectionManager/__tests__/ImportSshConfigModal.test.tsx
new file mode 100644
index 0000000..0fc6670
--- /dev/null
+++ b/src/renderer/src/components/ConnectionManager/__tests__/ImportSshConfigModal.test.tsx
@@ -0,0 +1,136 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import ImportSshConfigModal from '../ImportSshConfigModal'
+import { installWindowApi, makeSession, type WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+const initialState = useAppStore.getState()
+
+let api: WindowApiMock
+let onClose: ReturnType<typeof vi.fn<() => void>>
+
+const hosts = [
+  { alias: 'web', host: 'web.example.com', port: 22, username: 'root', keyPath: '~/.ssh/id_web' },
+  { alias: 'app', host: 'app.example.com', port: 2222, username: 'deploy', proxyJump: 'web' },
+  { alias: 'legacy', host: 'legacy.example.com', port: 22, username: 'root' },
+]
+
+beforeEach(() => {
+  useAppStore.setState(initialState, true)
+  onClose = vi.fn<() => void>()
+  api = installWindowApi({ sshConfig: { hosts: vi.fn().mockResolvedValue(hosts) } })
+})
+
+/** Each host row is a label whose leading button is the checkbox. */
+function checkboxFor(alias: string) {
+  const label = screen.getByText(alias).closest('label') as HTMLElement
+  return label.querySelector('button') as HTMLElement
+}
+
+describe('ImportSshConfigModal', () => {
+  it('shows a loading state, then the discovered hosts with details', async () => {
+    render(<ImportSshConfigModal onClose={onClose} />)
+    expect(screen.getByText('Reading SSH config…')).toBeTruthy()
+
+    expect(await screen.findByText('web')).toBeTruthy()
+    expect(screen.getByText('root@web.example.com')).toBeTruthy()
+    expect(screen.getByText('deploy@app.example.com:2222')).toBeTruthy()
+    // Key icon carries the key path as tooltip
+    expect(screen.getByTitle('~/.ssh/id_web')).toBeTruthy()
+    // All new hosts preselected
+    expect(screen.getByText('Import (3)')).toBeTruthy()
+  })
+
+  it('marks already-added hosts and leaves them unselected', async () => {
+    useAppStore.setState({
+      sessions: [makeSession({ host: 'legacy.example.com', port: 22, username: 'root', type: 'ssh' })],
+    })
+    render(<ImportSshConfigModal onClose={onClose} />)
+    expect(await screen.findByText('already added')).toBeTruthy()
+    expect(screen.getByText('Import (2)')).toBeTruthy()
+  })
+
+  it('toggles selection by clicking the checkbox and reflects aria-pressed', async () => {
+    render(<ImportSshConfigModal onClose={onClose} />)
+    await screen.findByText('web')
+
+    expect(checkboxFor('web').getAttribute('aria-pressed')).toBe('true')
+    fireEvent.click(checkboxFor('web'))
+    expect(checkboxFor('web').getAttribute('aria-pressed')).toBe('false')
+    expect(screen.getByText('Import (2)')).toBeTruthy()
+
+    fireEvent.click(checkboxFor('app'))
+    expect(screen.getByText('Import (1)')).toBeTruthy()
+
+    fireEvent.click(checkboxFor('legacy'))
+    // Every host deselected — the button loses its count and disables
+    const importButton = screen.getByText('Import', { exact: true }).closest('button') as HTMLButtonElement
+    expect(importButton.disabled).toBe(true)
+
+    // Clicking again re-selects
+    fireEvent.click(checkboxFor('web'))
+    expect(screen.getByText('Import (1)')).toBeTruthy()
+  })
+
+  it('imports the selected hosts and links ProxyJump hops', async () => {
+    let created = 0
+    api.sessions.create.mockImplementation(async (data: any) => ({ id: `new-${++created}`, ...data }))
+    api.sessions.update.mockImplementation(async (_id: string, data: any) => data)
+    render(<ImportSshConfigModal onClose={onClose} />)
+    await screen.findByText('web')
+
+    // Drop 'legacy' so only two are imported
+    fireEvent.click(checkboxFor('legacy'))
+    fireEvent.click(screen.getByText('Import (2)'))
+
+    await waitFor(() => expect(onClose).toHaveBeenCalled())
+    expect(api.sessions.create).toHaveBeenCalledTimes(2)
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      label: 'web', host: 'web.example.com', authType: 'key', keyPath: '~/.ssh/id_web', type: 'ssh',
+    }))
+    expect(api.sessions.create).toHaveBeenCalledWith(expect.objectContaining({
+      label: 'app', host: 'app.example.com', port: 2222, authType: 'password',
+    }))
+    // Second pass wired app -> web as jump host
+    expect(api.sessions.update).toHaveBeenCalledWith('new-2', { jumpHostId: 'new-1' })
+
+    const state = useAppStore.getState()
+    expect(state.sessions).toHaveLength(2)
+    expect(state.notifications.some(n => n.message === 'Imported 2 connections from SSH config')).toBe(true)
+  })
+
+  it('shows an error and re-enables the form when the import fails', async () => {
+    api.sessions.create.mockRejectedValue(new Error('keychain unavailable'))
+    render(<ImportSshConfigModal onClose={onClose} />)
+    await screen.findByText('web')
+    fireEvent.click(screen.getByText('Import (3)'))
+    expect(await screen.findByText('keychain unavailable')).toBeTruthy()
+    expect(onClose).not.toHaveBeenCalled()
+  })
+
+  it('shows the empty state when no hosts are found', async () => {
+    api.sshConfig.hosts.mockResolvedValue([])
+    render(<ImportSshConfigModal onClose={onClose} />)
+    expect(await screen.findByText('No importable hosts found in ~/.ssh/config.')).toBeTruthy()
+  })
+
+  it('shows an error when the SSH config cannot be read', async () => {
+    api.sshConfig.hosts.mockRejectedValue(new Error('EACCES: permission denied'))
+    render(<ImportSshConfigModal onClose={onClose} />)
+    expect(await screen.findByText('EACCES: permission denied')).toBeTruthy()
+  })
+
+  it('closes via the header button and backdrop mousedown', async () => {
+    const { container } = render(<ImportSshConfigModal onClose={onClose} />)
+    await screen.findByText('web')
+    fireEvent.mouseDown(container.firstChild as HTMLElement)
+    expect(onClose).toHaveBeenCalledTimes(1)
+
+    const headerClose = screen.getByText('Import from SSH config')
+      .closest('.flex.items-center.justify-between')!
+      .querySelector('button') as HTMLElement
+    fireEvent.click(headerClose)
+    expect(onClose).toHaveBeenCalledTimes(2)
+  })
+})
diff --git a/src/renderer/src/components/Dashboard/Dashboard.tsx b/src/renderer/src/components/Dashboard/Dashboard.tsx
index 91d429e..205577d 100644
--- a/src/renderer/src/components/Dashboard/Dashboard.tsx
+++ b/src/renderer/src/components/Dashboard/Dashboard.tsx
@@ -4,7 +4,7 @@ import {
   LayoutGrid, Grid2x2, List,
 } from 'lucide-react'
 import { useAppStore, Session } from '../../store'
-import { groupColor } from '../../lib/colors'
+import { groupColor, metricColor } from '../../lib/colors'
 import { CompactServerCard, HealthCard, ServerListRow } from './ServerViews'
 import { ServerContextMenu } from '../ServerContextMenu'
 
@@ -138,7 +138,12 @@ export default function Dashboard() {
     ...projectGroupOrder.filter(g => allGroupNames.includes(g)),
     ...allGroupNames
       .filter(g => !projectGroupOrder.includes(g))
-      .sort((a, b) => (a === 'Ungrouped' ? 1 : b === 'Ungrouped' ? -1 : a.localeCompare(b))),
+      .sort((a, b) => {
+        // 'Ungrouped' always sinks to the bottom.
+        if (a === 'Ungrouped') return 1
+        if (b === 'Ungrouped') return -1
+        return a.localeCompare(b)
+      }),
   ]
 
   useEffect(() => {
@@ -313,7 +318,7 @@ export default function Dashboard() {
                         {connectedInGroup.length}/{groupSessions.length} connected
                       </span>
                       {avgCpu !== null && (
-                        <span className="font-['JetBrains_Mono'] text-[12px] flex-shrink-0" style={{ color: avgCpu >= 80 ? '#EF4444' : avgCpu >= 60 ? '#F59E0B' : '#10B981' }}>
+                        <span className="font-['JetBrains_Mono'] text-[12px] flex-shrink-0" style={{ color: metricColor(avgCpu) }}>
                           {avgCpu}% CPU
                         </span>
                       )}
@@ -418,7 +423,7 @@ export default function Dashboard() {
 }
 
 /* ── Empty state ─────────────────────────────────────────────────────────── */
-function EmptyDashboard({ onAdd }: { onAdd: () => void }) {
+function EmptyDashboard({ onAdd }: Readonly<{ onAdd: () => void }>) {
   return (
     <div className="h-full w-full flex items-center justify-center" style={{ background: 'var(--nox-bg)' }}>
       <div className="text-center max-w-sm">
diff --git a/src/renderer/src/components/Dashboard/ServerViews.tsx b/src/renderer/src/components/Dashboard/ServerViews.tsx
index 58b2cca..a8421c5 100644
--- a/src/renderer/src/components/Dashboard/ServerViews.tsx
+++ b/src/renderer/src/components/Dashboard/ServerViews.tsx
@@ -54,7 +54,8 @@ export function HealthCard({
   const reachability = reachabilityInfo(isConnected)
 
   return (
-    <div
+    <button
+      type="button"
       draggable
       onDragStart={onDragStart}
       onDragOver={e => { e.preventDefault(); onDragOver() }}
@@ -62,7 +63,7 @@ export function HealthCard({
       onDragEnd={onDragEnd}
       onClick={onConnect}
       onContextMenu={onContextMenu}
-      className="rounded-lg overflow-hidden cursor-pointer transition-all hover:shadow-md min-h-[118px]"
+      className="w-full text-left rounded-lg overflow-hidden cursor-pointer transition-all hover:shadow-md min-h-[118px]"
       style={{
         background: 'var(--nox-shell)',
         border: isDropTarget ? `2px dashed ${color}` : '1px solid var(--nox-border)',
@@ -92,8 +93,7 @@ export function HealthCard({
             </div>
             <div className="flex items-center gap-1 flex-shrink-0">
               {!isConnected && (
-                <button
-                  onClick={e => { e.stopPropagation(); onConnect() }}
+                <span
                   className="flex items-center gap-1 px-2 py-1 rounded-md font-['Inter'] text-[10.5px] font-medium transition-colors flex-shrink-0"
                   style={{ background: color + '15', color, border: `1px solid ${color}30` }}
                   onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = color + '25' }}
@@ -101,7 +101,7 @@ export function HealthCard({
                 >
                   <Plug className="w-2.5 h-2.5" />
                   Connect
-                </button>
+                </span>
               )}
             </div>
           </div>
@@ -135,20 +135,41 @@ export function HealthCard({
                 </div>
               )}
             </div>
-          ) : isConnected && metricCapable ? (
-            <div className="space-y-2 animate-pulse">
-              <MetricBar label="CPU" value={0} color={color} sublabel="..." />
-              <MetricBar label="MEM" value={0} color={color} sublabel="waiting for metrics" />
-            </div>
           ) : (
-            <StatusBox metricCapable={metricCapable} isConnected={isConnected} />
+            <MetricsPlaceholder isConnected={isConnected} metricCapable={metricCapable} color={color} />
           )}
         </div>
       </div>
-    </div>
+    </button>
   )
 }
 
+// Like metricColor, but keeps the session accent below the warning thresholds.
+function thresholdColor(value: number, fallback: string): string {
+  if (value >= 80) return '#EF4444'
+  if (value >= 60) return '#F59E0B'
+  return fallback
+}
+
+function MetricsPlaceholder({ isConnected, metricCapable, color }: Readonly<{ isConnected: boolean; metricCapable: boolean; color: string }>) {
+  if (isConnected && metricCapable) {
+    return (
+      <div className="space-y-2 animate-pulse">
+        <MetricBar label="CPU" value={0} color={color} sublabel="..." />
+        <MetricBar label="MEM" value={0} color={color} sublabel="waiting for metrics" />
+      </div>
+    )
+  }
+  return <StatusBox metricCapable={metricCapable} isConnected={isConnected} />
+}
+
+// One-line status for the compact card, in priority order.
+function compactStatus(live: boolean | undefined, isConnected: boolean, metricCapable: boolean, cpuMem: string, reachLabel: string): string {
+  if (live) return cpuMem
+  if (!isConnected) return reachLabel
+  return metricCapable ? 'waiting for metrics' : 'Connected'
+}
+
 export function CompactServerCard({ session, metrics, isConnected, onConnect, onContextMenu }: ServerViewProps) {
   const color = session.color ?? '#3B5CCC'
   const reach = reachabilityInfo(isConnected)
@@ -174,11 +195,7 @@ export function CompactServerCard({ session, metrics, isConnected, onConnect, on
           </span>
         </div>
         <span className="font-mono text-[10.5px] block truncate mt-0.5" style={{ color: 'var(--nox-text-3)' }}>
-          {live
-            ? `cpu ${metrics!.cpu}% · mem ${memPct}%`
-            : isConnected
-              ? (metricCapable ? 'waiting for metrics' : 'Connected')
-              : reach.label}
+          {compactStatus(live, isConnected, metricCapable, `cpu ${metrics?.cpu}% · mem ${memPct}%`, reach.label)}
         </span>
       </div>
     </button>
@@ -193,10 +210,11 @@ export function ServerListRow({ session, metrics, isConnected, onConnect, onCont
   const diskPct = live && metrics?.diskTotal ? Math.round(((metrics.diskUsed ?? 0) / metrics.diskTotal) * 100) : null
 
   return (
-    <div
+    <button
+      type="button"
       onClick={onConnect}
       onContextMenu={onContextMenu}
-      className="group flex items-center gap-3 px-3 cursor-pointer transition-colors"
+      className="group w-full text-left flex items-center gap-3 px-3 cursor-pointer transition-colors"
       style={{ height: 38 }}
       onMouseEnter={e => { e.currentTarget.style.background = 'var(--nox-hover)' }}
       onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}
@@ -223,26 +241,23 @@ export function ServerListRow({ session, metrics, isConnected, onConnect, onCont
 
       <div className="flex items-center gap-1 flex-shrink-0 w-8 justify-end">
         {!isConnected && (
-          <button
+          <span
             title="Connect"
-            onClick={e => { e.stopPropagation(); onConnect() }}
             className="p-1 rounded opacity-0 group-hover:opacity-100 transition-opacity"
             style={{ color }}
           >
             <Plug className="w-3 h-3" />
-          </button>
+          </span>
         )}
       </div>
-    </div>
+    </button>
   )
 }
 
-function StatusBox({ metricCapable, isConnected }: { metricCapable: boolean; isConnected: boolean }) {
-  const text = isConnected
-    ? 'Connected — click to open'
-    : metricCapable
-      ? 'Connect to start live metrics'
-      : 'Click to open'
+function StatusBox({ metricCapable, isConnected }: Readonly<{ metricCapable: boolean; isConnected: boolean }>) {
+  let text = 'Click to open'
+  if (isConnected) text = 'Connected — click to open'
+  else if (metricCapable) text = 'Connect to start live metrics'
   return (
     <div
       className="flex items-center justify-between gap-3 rounded-md px-2.5"
@@ -255,7 +270,7 @@ function StatusBox({ metricCapable, isConnected }: { metricCapable: boolean; isC
   )
 }
 
-function MetricCell({ label, value, pct }: { label: string; value: string | null; pct: number | null }) {
+function MetricCell({ label, value, pct }: Readonly<{ label: string; value: string | null; pct: number | null }>) {
   return (
     <span className="font-mono text-[11px] text-right tabular-nums flex-shrink-0 w-20">
       {value !== null ? (
@@ -270,8 +285,8 @@ function MetricCell({ label, value, pct }: { label: string; value: string | null
   )
 }
 
-function MetricBar({ label, value, color, sublabel }: { label: string; value: number; color: string; sublabel?: string }) {
-  const barColor = value >= 80 ? '#EF4444' : value >= 60 ? '#F59E0B' : color
+function MetricBar({ label, value, color, sublabel }: Readonly<{ label: string; value: number; color: string; sublabel?: string }>) {
+  const barColor = thresholdColor(value, color)
   return (
     <div>
       <div className="flex items-center justify-between mb-0.5">
@@ -292,7 +307,7 @@ function MetricBar({ label, value, color, sublabel }: { label: string; value: nu
   )
 }
 
-function ConnectionTypeIcon({ type }: { type?: string }) {
+function ConnectionTypeIcon({ type }: Readonly<{ type?: string }>) {
   const s = { className: 'w-3.5 h-3.5 flex-shrink-0' }
   switch (type) {
     case 'database': return <Database {...s} style={{ color: '#3B5CCC' }} />
diff --git a/src/renderer/src/components/Dashboard/__tests__/Dashboard.test.tsx b/src/renderer/src/components/Dashboard/__tests__/Dashboard.test.tsx
new file mode 100644
index 0000000..8d0e31e
--- /dev/null
+++ b/src/renderer/src/components/Dashboard/__tests__/Dashboard.test.tsx
@@ -0,0 +1,83 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import Dashboard from '../Dashboard'
+import { installWindowApi, seedStore, makeSession, makeTab } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+describe('Dashboard', () => {
+  beforeEach(() => {
+    installWindowApi()
+    seedStore({
+      sessions: [], tabs: [], activeTabId: null, notifications: [],
+      serverMetrics: {}, projectGroupOrder: [], groupColors: {},
+      showAddConnection: false,
+    })
+  })
+
+  it('shows the empty state and opens the add-connection modal', () => {
+    render(<Dashboard />)
+    expect(screen.getByText('No connections yet')).toBeTruthy()
+    fireEvent.click(screen.getByText('Add Connection'))
+    expect(useAppStore.getState().showAddConnection).toBe(true)
+  })
+
+  it('sorts unsaved groups alphabetically with Ungrouped last', () => {
+    seedStore({
+      sessions: [
+        makeSession({ id: 'z1', label: 'Zed', group: 'Zeta' }),
+        makeSession({ id: 'u1', label: 'Loose' }), // no group → Ungrouped
+        makeSession({ id: 'a1', label: 'Ay', group: 'Alpha' }),
+      ],
+    })
+    const { container } = render(<Dashboard />)
+    const text = container.textContent ?? ''
+    const alpha = text.indexOf('Alpha')
+    const zeta = text.indexOf('Zeta')
+    const ungrouped = text.indexOf('Ungrouped')
+    expect(alpha).toBeGreaterThan(-1)
+    expect(alpha).toBeLessThan(zeta)
+    expect(zeta).toBeLessThan(ungrouped)
+  })
+
+  it('respects the saved project group order before falling back to sort', () => {
+    seedStore({
+      projectGroupOrder: ['Zeta', 'Alpha'],
+      sessions: [
+        makeSession({ id: 'a1', label: 'Ay', group: 'Alpha' }),
+        makeSession({ id: 'z1', label: 'Zed', group: 'Zeta' }),
+      ],
+    })
+    const { container } = render(<Dashboard />)
+    const text = container.textContent ?? ''
+    expect(text.indexOf('Zeta')).toBeLessThan(text.indexOf('Alpha'))
+  })
+
+  it('renders average group CPU with the shared metric color', () => {
+    seedStore({
+      sessions: [makeSession({ id: 's1', label: 'Hot Box', group: 'Prod' })],
+      tabs: [makeTab({ sessionId: 's1', status: 'connected' })],
+      serverMetrics: {
+        s1: { cpu: 85, memUsed: 4e9, memTotal: 8e9, available: true, lastUpdated: Date.now() },
+      },
+    })
+    render(<Dashboard />)
+    const cpu = screen.getByText('85% CPU')
+    expect(cpu).toBeTruthy()
+    // 85% is in the red band
+    expect((cpu as HTMLElement).style.color).toBe('rgb(239, 68, 68)')
+  })
+
+  it('renders a healthy group with green CPU', () => {
+    seedStore({
+      sessions: [makeSession({ id: 's2', label: 'Cool Box', group: 'Prod' })],
+      tabs: [makeTab({ sessionId: 's2', status: 'connected' })],
+      serverMetrics: {
+        s2: { cpu: 12, memUsed: 1e9, memTotal: 8e9, available: true, lastUpdated: Date.now() },
+      },
+    })
+    render(<Dashboard />)
+    const cpu = screen.getByText('12% CPU')
+    expect((cpu as HTMLElement).style.color).toBe('rgb(16, 185, 129)')
+  })
+})
diff --git a/src/renderer/src/components/Dashboard/__tests__/ServerViews.test.tsx b/src/renderer/src/components/Dashboard/__tests__/ServerViews.test.tsx
new file mode 100644
index 0000000..336e80d
--- /dev/null
+++ b/src/renderer/src/components/Dashboard/__tests__/ServerViews.test.tsx
@@ -0,0 +1,254 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import { HealthCard, CompactServerCard, ServerListRow, reachabilityInfo } from '../ServerViews'
+import { makeSession } from '../../../__tests__/harness'
+import type { ServerMetrics } from '../../../store'
+
+function liveMetrics(overrides: Partial<ServerMetrics> = {}): ServerMetrics {
+  return {
+    cpu: 42,
+    memUsed: 4 * 1024 ** 3,
+    memTotal: 8 * 1024 ** 3,
+    diskUsed: 50 * 1024 ** 3,
+    diskTotal: 100 * 1024 ** 3,
+    load1: 1.23,
+    uptimeSec: 86400 * 3,
+    available: true,
+    lastUpdated: Date.now(),
+    cpuHistory: [10, 20, 42],
+    ...overrides,
+  }
+}
+
+const noop = () => {}
+
+const dragProps = {
+  isDropTarget: false,
+  onDragStart: noop,
+  onDragOver: noop,
+  onDrop: noop,
+  onDragEnd: noop,
+}
+
+describe('reachabilityInfo', () => {
+  it('maps connection state to label/color', () => {
+    expect(reachabilityInfo(true)).toEqual({ label: 'Connected', color: '#10B981' })
+    expect(reachabilityInfo(false).label).toBe('Disconnected')
+  })
+})
+
+describe('HealthCard', () => {
+  it('renders live metrics with disk, load and uptime', () => {
+    const session = makeSession({ label: 'Prod 1' })
+    render(
+      <HealthCard
+        session={session}
+        metrics={liveMetrics()}
+        isConnected
+        onConnect={noop}
+        {...dragProps}
+      />
+    )
+    expect(screen.getByText('Prod 1')).toBeTruthy()
+    expect(screen.getByText('Connected')).toBeTruthy()
+    expect(screen.getByText('CPU')).toBeTruthy()
+    expect(screen.getByText('MEM')).toBeTruthy()
+    expect(screen.getByText('DISK')).toBeTruthy()
+    expect(screen.getByText(/load 1\.23/)).toBeTruthy()
+    expect(screen.getByText(/^up /)).toBeTruthy()
+    // Connected cards do not offer a Connect button
+    expect(screen.queryByText('Connect')).toBeNull()
+  })
+
+  it('colors metric bars by warning thresholds', () => {
+    const session = makeSession()
+    const { container } = render(
+      <HealthCard
+        session={session}
+        metrics={liveMetrics({ cpu: 85, memUsed: 6.5 * 1024 ** 3, memTotal: 10 * 1024 ** 3, diskUsed: 10, diskTotal: 100 })}
+        isConnected
+        onConnect={noop}
+        {...dragProps}
+      />
+    )
+    const bars = Array.from(container.querySelectorAll('.h-full.rounded-full')) as HTMLElement[]
+    // cpu 85 → red, mem 65% → amber, disk 10% → session accent
+    expect(bars[0].style.background).toBe('rgb(239, 68, 68)')
+    expect(bars[1].style.background).toBe('rgb(245, 158, 11)')
+    expect(bars[2].style.background).toBe('rgb(59, 92, 204)')
+  })
+
+  it('fires onConnect when the card is clicked', () => {
+    const onConnect = vi.fn()
+    const session = makeSession({ label: 'KeyCard' })
+    render(
+      <HealthCard session={session} metrics={undefined} isConnected={false} onConnect={onConnect} {...dragProps} />
+    )
+    const card = screen.getByText('KeyCard').closest('button') as HTMLElement
+    fireEvent.click(card)
+    expect(onConnect).toHaveBeenCalledTimes(1)
+  })
+
+  it('shows a Connect affordance when disconnected that connects on click', () => {
+    const onConnect = vi.fn()
+    render(
+      <HealthCard session={makeSession()} isConnected={false} onConnect={onConnect} {...dragProps} />
+    )
+    fireEvent.click(screen.getByText('Connect'))
+    expect(onConnect).toHaveBeenCalledTimes(1)
+  })
+
+  it('shows the waiting placeholder when connected without metrics yet', () => {
+    render(
+      <HealthCard session={makeSession({ type: 'ssh' })} isConnected onConnect={noop} {...dragProps} />
+    )
+    expect(screen.getByText('waiting for metrics')).toBeTruthy()
+  })
+
+  it('shows connect hint for disconnected metric-capable hosts', () => {
+    render(
+      <HealthCard session={makeSession()} isConnected={false} onConnect={noop} {...dragProps} />
+    )
+    expect(screen.getByText('Connect to start live metrics')).toBeTruthy()
+  })
+
+  it('shows click-to-open status for non-metric hosts', () => {
+    const { rerender } = render(
+      <HealthCard session={makeSession({ type: 'redis' })} isConnected={false} onConnect={noop} {...dragProps} />
+    )
+    expect(screen.getByText('Click to open')).toBeTruthy()
+    rerender(
+      <HealthCard session={makeSession({ type: 'redis' })} isConnected onConnect={noop} {...dragProps} />
+    )
+    expect(screen.getByText('Connected — click to open')).toBeTruthy()
+  })
+
+  it('handles drag lifecycle and drop-target styling', () => {
+    const onDragStart = vi.fn()
+    const onDragOver = vi.fn()
+    const onDrop = vi.fn()
+    const onDragEnd = vi.fn()
+    const session = makeSession({ label: 'DragCard', color: '#AA00FF' })
+    render(
+      <HealthCard
+        session={session}
+        isConnected={false}
+        onConnect={noop}
+        isDropTarget
+        onDragStart={onDragStart}
+        onDragOver={onDragOver}
+        onDrop={onDrop}
+        onDragEnd={onDragEnd}
+      />
+    )
+    const card = screen.getByText('DragCard').closest('button') as HTMLElement
+    expect(card.style.border).toContain('dashed')
+    fireEvent.dragStart(card)
+    fireEvent.dragOver(card)
+    fireEvent.drop(card)
+    fireEvent.dragEnd(card)
+    expect(onDragStart).toHaveBeenCalledTimes(1)
+    expect(onDragOver).toHaveBeenCalledTimes(1)
+    expect(onDrop).toHaveBeenCalledTimes(1)
+    expect(onDragEnd).toHaveBeenCalledTimes(1)
+  })
+
+  it('calls onContextMenu on right-click', () => {
+    const onContextMenu = vi.fn()
+    render(
+      <HealthCard
+        session={makeSession({ label: 'CtxCard' })}
+        isConnected={false}
+        onConnect={noop}
+        onContextMenu={onContextMenu}
+        {...dragProps}
+      />
+    )
+    fireEvent.contextMenu(screen.getByText('CtxCard').closest('button') as HTMLElement)
+    expect(onContextMenu).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('CompactServerCard', () => {
+  it('shows cpu/mem summary when live', () => {
+    render(
+      <CompactServerCard
+        session={makeSession({ label: 'Compact' })}
+        metrics={liveMetrics({ cpu: 12, memUsed: 1 * 1024 ** 3, memTotal: 4 * 1024 ** 3 })}
+        isConnected
+        onConnect={noop}
+      />
+    )
+    expect(screen.getByText('cpu 12% · mem 25%')).toBeTruthy()
+  })
+
+  it('shows Disconnected when offline', () => {
+    render(
+      <CompactServerCard session={makeSession()} isConnected={false} onConnect={noop} />
+    )
+    expect(screen.getByText('Disconnected')).toBeTruthy()
+  })
+
+  it('shows waiting for metrics when connected without data, and Connected for non-metric types', () => {
+    const { rerender } = render(
+      <CompactServerCard session={makeSession({ type: 'ssh' })} isConnected onConnect={noop} />
+    )
+    expect(screen.getByText('waiting for metrics')).toBeTruthy()
+    rerender(
+      <CompactServerCard session={makeSession({ type: 'database' })} isConnected onConnect={noop} />
+    )
+    expect(screen.getByText('Connected')).toBeTruthy()
+  })
+
+  it('fires onConnect on click', () => {
+    const onConnect = vi.fn()
+    render(<CompactServerCard session={makeSession()} isConnected={false} onConnect={onConnect} />)
+    fireEvent.click(screen.getByRole('button'))
+    expect(onConnect).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('ServerListRow', () => {
+  it('renders live metric cells, uptime and reachability', () => {
+    const session = makeSession({ label: 'RowHost', username: 'admin', host: 'row.example.com' })
+    render(
+      <ServerListRow
+        session={session}
+        metrics={liveMetrics({ cpu: 55 })}
+        isConnected
+        onConnect={noop}
+      />
+    )
+    expect(screen.getByText('RowHost')).toBeTruthy()
+    expect(screen.getByText(/admin@/)).toBeTruthy()
+    expect(screen.getByText('Connected')).toBeTruthy()
+    expect(screen.getByText('55%')).toBeTruthy()
+    expect(screen.getByText('50%')).toBeTruthy() // disk pct
+    expect(screen.getByText(/^up /)).toBeTruthy()
+  })
+
+  it('renders em-dash placeholders when metrics are missing', () => {
+    render(
+      <ServerListRow session={makeSession()} isConnected={false} onConnect={noop} />
+    )
+    expect(screen.getAllByText('—')).toHaveLength(3)
+    expect(screen.getByText('Disconnected')).toBeTruthy()
+  })
+
+  it('fires onConnect when the row is clicked', () => {
+    const onConnect = vi.fn()
+    const session = makeSession({ label: 'RowKeys' })
+    render(<ServerListRow session={session} isConnected={false} onConnect={onConnect} />)
+    const row = screen.getByText('RowKeys').closest('button') as HTMLElement
+    fireEvent.click(row)
+    expect(onConnect).toHaveBeenCalledTimes(1)
+  })
+
+  it('offers a Connect action when disconnected', () => {
+    const onConnect = vi.fn()
+    render(<ServerListRow session={makeSession()} isConnected={false} onConnect={onConnect} />)
+    fireEvent.click(screen.getByTitle('Connect'))
+    expect(onConnect).toHaveBeenCalledTimes(1)
+  })
+})
diff --git a/src/renderer/src/components/Database/DatabaseExplorer.tsx b/src/renderer/src/components/Database/DatabaseExplorer.tsx
index 7de8c02..3279790 100644
--- a/src/renderer/src/components/Database/DatabaseExplorer.tsx
+++ b/src/renderer/src/components/Database/DatabaseExplorer.tsx
@@ -22,7 +22,7 @@ const ISO_DATE_RE = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/
 
 function isJsonString(s: string): boolean {
   if (s.length < 2) return false
-  return (s[0] === '{' && s[s.length - 1] === '}') || (s[0] === '[' && s[s.length - 1] === ']')
+  return (s.startsWith('{') && s.endsWith('}')) || (s.startsWith('[') && s.endsWith(']'))
 }
 
 /* ── Explain plan parsing ─────────────────────────────────────────────── */
@@ -81,7 +81,7 @@ function computeRowDiff(prev: QueryResult | null, next: QueryResult): Set<string
 
 /* ── Main component ───────────────────────────────────────────────────── */
 
-export default function DatabaseExplorer({ tab }: { tab: Tab }) {
+export default function DatabaseExplorer({ tab }: Readonly<{ tab: Tab }>) {
   const sessions = useAppStore(s => s.sessions)
   const updateTab = useAppStore(s => s.updateTab)
   const session = sessions.find(s => s.id === tab.sessionId)
@@ -217,20 +217,42 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
   function exportCsv() {
     if (!results) return
     const h = results.columns.join(',')
-    const rows = results.rows.map(r => results.columns.map(c => { const v = r[c]; if (v == null) return ''; const s = String(v); return s.includes(',') || s.includes('"') || s.includes('\n') ? `"${s.replace(/"/g, '""')}"` : s }).join(',')).join('\n')
+    const rows = results.rows.map(r => results.columns.map(c => {
+      const v = r[c]
+      if (v == null) return ''
+      const s = String(v)
+      return s.includes(',') || s.includes('"') || s.includes('\n') ? `"${s.replaceAll('"', '""')}"` : s
+    }).join(',')).join('\n')
     const blob = new Blob([`${h}\n${rows}`], { type: 'text/csv' }); const a = document.createElement('a'); a.href = URL.createObjectURL(blob); a.download = `${browsingTable || 'query'}-results.csv`; a.click(); URL.revokeObjectURL(a.href); showToast('Exported')
   }
 
+  function pickQuery(q: string) {
+    setSql(q)
+    setActivePanel('results')
+    editorRef.current?.focus()
+  }
+
+  function startCellEdit(row: number, col: string, val: unknown) {
+    if (!browsingTable) return
+    setEditingCell({ row, col })
+    setEditValue(toEditable(val))
+    setTimeout(() => editInputRef.current?.focus(), 0)
+  }
+
   async function commitEdit() {
     if (!clientId || !editingCell || !results || !browsingTable) { setEditingCell(null); return }
     const row = results.rows[editingCell.row]; const col = editingCell.col
     if (String(row[col] ?? '') === editValue) { setEditingCell(null); return }
     const pk = results.columns.includes('id') ? 'id' : results.columns[0]
     const pkVal = row[pk]; if (pkVal == null) { showToast('No primary key to identify row'); setEditingCell(null); return }
-    const newVal = editValue === '' ? 'NULL' : `'${editValue.replace(/'/g, "''")}'`
-    const pkLit = typeof pkVal === 'number' ? pkVal : `'${String(pkVal).replace(/'/g, "''")}'`
+    const dbType = session?.dbType || 'postgresql'
+    const q = (name: string) => quoteIdent(name, dbType)
     try {
-      await window.api.database.query(clientId, `UPDATE "${browsingTable}" SET "${col}" = ${newVal} WHERE "${pk}" = ${pkLit}`)
+      await window.api.database.query(
+        clientId,
+        `UPDATE ${q(browsingTable)} SET ${q(col)} = ${bindPlaceholder(dbType, 1)} WHERE ${q(pk)} = ${bindPlaceholder(dbType, 2)}`,
+        [editValue === '' ? null : editValue, typeof pkVal === 'number' ? pkVal : String(pkVal)],
+      )
       const updated = [...results.rows]; updated[editingCell.row] = { ...row, [col]: editValue === '' ? null : editValue }
       setResults({ ...results, rows: updated }); showToast('Updated')
     } catch (err: any) { showToast(`Update failed: ${err?.message}`) }
@@ -275,7 +297,10 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
 
   function startResize(e: React.MouseEvent) {
     e.preventDefault(); resizingRef.current = true; const startY = e.clientY; const startH = editorHeight
-    const onMove = (ev: MouseEvent) => { if (!resizingRef.current) return; setEditorHeight(Math.max(40, Math.min(400, startH + (ev.clientY - startY)))) }
+    const onMove = (ev: MouseEvent) => {
+      if (!resizingRef.current) return
+      setEditorHeight(Math.max(40, Math.min(400, startH + (ev.clientY - startY))))
+    }
     const onUp = () => { resizingRef.current = false; window.removeEventListener('mousemove', onMove); window.removeEventListener('mouseup', onUp) }
     window.addEventListener('mousemove', onMove); window.addEventListener('mouseup', onUp)
   }
@@ -286,7 +311,9 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
     const { col, dir } = resultSort
     return [...results.rows].sort((a, b) => {
       const av = a[col], bv = b[col]
-      if (av == null && bv == null) return 0; if (av == null) return 1; if (bv == null) return -1
+      if (av == null && bv == null) return 0
+      if (av == null) return 1
+      if (bv == null) return -1
       const cmp = typeof av === 'number' && typeof bv === 'number' ? av - bv : String(av).localeCompare(String(bv))
       return dir === 'asc' ? cmp : -cmp
     })
@@ -296,92 +323,36 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
 
   function toggleJsonExpand(key: string) { setExpandedJson(s => { const n = new Set(s); n.has(key) ? n.delete(key) : n.add(key); return n }) }
 
-  const filteredTables = tableFilter ? tables.filter(t => t.toLowerCase().includes(tableFilter.toLowerCase())) : tables
-  const dbType = session?.dbType === 'mysql' ? 'MySQL' : session?.dbType === 'mariadb' ? 'MariaDB' : 'PostgreSQL'
-  const detailRow = selectedRow !== null && results ? sortedRows[selectedRow] : null
-  const resultsTableWidth = results ? 48 + results.columns.length * 160 : 0
-  const resultsGridColumns = results ? `48px repeat(${results.columns.length}, 160px)` : undefined
+  const filteredTables = filterTables(tables, tableFilter)
+  const dbType = DB_TYPE_LABELS[session?.dbType ?? ''] ?? 'PostgreSQL'
+  const detailRow = getDetailRow(sortedRows, selectedRow)
 
   if (connecting) return <div className="flex items-center justify-center h-full" style={{ background: 'var(--nox-bg)' }}><div className="text-center"><Loader2 className="w-5 h-5 animate-spin mx-auto mb-3" style={{ color: '#3B5CCC' }} /><p className="text-[11px]" style={{ color: 'var(--nox-text-2)' }}>Connecting to {session?.databaseName || session?.host}</p></div></div>
   if (error && !clientId) return <div className="flex items-center justify-center h-full" style={{ background: 'var(--nox-bg)' }}><div className="text-center max-w-md px-6"><AlertTriangle className="w-6 h-6 mx-auto mb-3" style={{ color: '#EF4444' }} /><p className="text-[10px] mb-4 font-mono" style={{ color: 'var(--nox-text-3)' }}>{error}</p><button onClick={connect} className="px-4 py-1.5 rounded text-[11px] text-white" style={{ background: '#3B5CCC' }}>Retry</button></div></div>
 
   return (
     <div className="flex h-full w-full min-w-0 min-h-0 overflow-hidden" style={{ background: 'var(--nox-bg)' }}>
-      {/* Schema sidebar */}
-      <div className="flex flex-col flex-shrink-0 overflow-hidden" style={{ width: 240, borderRight: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
-        <div className="flex items-center gap-2 px-3 flex-shrink-0" style={{ height: 36, borderBottom: '1px solid var(--nox-border)' }}>
-          <Database className="w-3.5 h-3.5" style={{ color: '#3B5CCC' }} />
-          <p className="text-[11px] font-semibold truncate flex-1" style={{ color: 'var(--nox-text)' }}>{session?.databaseName || 'Database'}</p>
-          <button onClick={() => refreshTables()} className="w-5 h-5 flex items-center justify-center rounded" style={{ color: 'var(--nox-text-3)' }}><RefreshCw className="w-3 h-3" /></button>
-        </div>
-        <div className="px-2 py-2 flex-shrink-0">
-          <div className="flex items-center gap-1.5 px-2 py-1 rounded" style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}>
-            <Search className="w-3 h-3" style={{ color: 'var(--nox-text-3)' }} />
-            <input value={tableFilter} onChange={e => setTableFilter(e.target.value)} placeholder="Filter tables…" className="flex-1 bg-transparent text-[10px] font-mono focus:outline-none" style={{ color: 'var(--nox-text)' }} />
-            {tableFilter && <button onClick={() => setTableFilter('')} style={{ color: 'var(--nox-text-3)' }}><X className="w-2.5 h-2.5" /></button>}
-          </div>
-        </div>
-        <div className="px-3 pb-1 flex-shrink-0"><span className="text-[9px] uppercase tracking-wider font-semibold" style={{ color: 'var(--nox-text-3)' }}>Tables ({filteredTables.length})</span></div>
-        <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
-          {filteredTables.map(table => (
-            <div key={table}>
-              <button onClick={() => selectTable(table)}
-                className="w-full flex items-center gap-1.5 px-3 py-[5px] text-left transition-colors"
-                style={{ color: activeTable === table ? 'var(--nox-text)' : 'var(--nox-text-2)', background: activeTable === table ? 'rgba(59,92,204,0.06)' : undefined }}
-                onMouseEnter={e => { if (activeTable !== table) e.currentTarget.style.background = 'var(--nox-hover)' }}
-                onMouseLeave={e => { if (activeTable !== table) e.currentTarget.style.background = '' }}>
-                {activeTable === table ? <ChevronDown className="w-2.5 h-2.5 flex-shrink-0" style={{ color: '#3B5CCC' }} /> : <ChevronRight className="w-2.5 h-2.5 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />}
-                <Table2 className="w-3 h-3 flex-shrink-0" style={{ color: activeTable === table ? '#3B5CCC' : '#8B5CF6' }} />
-                <span className="text-[11px] font-mono truncate">{table}</span>
-              </button>
-              {activeTable === table && tableColumns[table] && (
-                <div className="pb-1">{tableColumns[table].map(col => (
-                  <div key={col.name} className="flex items-center gap-1.5 px-3 pl-8 py-[2px]">
-                    <Hash className="w-2.5 h-2.5 flex-shrink-0" style={{ color: 'var(--nox-text-3)', opacity: 0.3 }} />
-                    <span className="text-[10px] font-mono truncate flex-1" style={{ color: 'var(--nox-text-3)' }}>{col.name}</span>
-                    <span className="text-[9px] font-mono px-1 py-[1px] rounded flex-shrink-0" style={{ color: typeColor(col.type), background: `${typeColor(col.type)}11` }}>{col.type}</span>
-                  </div>
-                ))}</div>
-              )}
-            </div>
-          ))}
-        </div>
-        <div className="px-3 py-2 flex-shrink-0" style={{ borderTop: '1px solid var(--nox-border)' }}>
-          <div className="flex items-center gap-1.5"><Zap className="w-2.5 h-2.5" style={{ color: '#10B981' }} /><span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{dbType} · {session?.host}:{session?.port}</span></div>
-        </div>
-      </div>
+      <SchemaSidebar
+        dbLabel={session?.databaseName || 'Database'}
+        footer={`${dbType} · ${session?.host}:${session?.port}`}
+        tables={filteredTables}
+        tableFilter={tableFilter}
+        setTableFilter={setTableFilter}
+        activeTable={activeTable}
+        tableColumns={tableColumns}
+        onSelect={selectTable}
+        onRefresh={() => refreshTables()}
+      />
 
       {/* Main area */}
       <div className="flex-1 flex flex-col" style={{ minWidth: 0, minHeight: 0, overflow: 'hidden' }}>
-        {/* Toolbar */}
-        <div className="flex items-center gap-2 px-3 flex-shrink-0" style={{ height: 36, borderBottom: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
-          <button onClick={() => runQuery()} disabled={running || !sql.trim()} className="flex items-center gap-1.5 px-3 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ background: running ? 'var(--nox-active)' : '#3B5CCC', color: running ? 'var(--nox-text-2)' : '#fff' }}>
-            {running ? <Loader2 className="w-3 h-3 animate-spin" /> : <Play className="w-3 h-3" />}{running ? 'Running…' : 'Run'}
-          </button>
-          <button onClick={runExplain} disabled={running || explainRunning || !sql.trim()} className="flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ color: activePanel === 'explain' ? '#F59E0B' : 'var(--nox-text-3)', background: activePanel === 'explain' ? 'rgba(245,158,11,0.08)' : undefined }} title="Visualize query execution plan">
-            <Activity className="w-3 h-3" /> Explain
-          </button>
-          <div className="w-px h-4" style={{ background: 'var(--nox-border)' }} />
-          <div className="flex items-center gap-1">
-            <button onClick={watchActive ? stopWatch : startWatch} disabled={!watchActive && (running || !sql.trim())} className="flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ color: watchActive ? '#10B981' : 'var(--nox-text-3)', background: watchActive ? 'rgba(16,185,129,0.08)' : undefined }} title={watchActive ? 'Stop watching' : 'Auto-refresh query results'}>
-              {watchActive ? <EyeOff className="w-3 h-3" /> : <Eye className="w-3 h-3" />} {watchActive ? 'Stop' : 'Watch'}
-            </button>
-            {watchActive && <span className="text-[9px] font-mono tabular-nums px-1.5 py-0.5 rounded-full animate-pulse" style={{ color: '#10B981', background: 'rgba(16,185,129,0.08)' }}>{watchCountdown}s</span>}
-            {!watchActive && (
-              <select value={watchSec} onChange={e => setWatchSec(Number(e.target.value))} className="bg-transparent text-[10px] font-mono focus:outline-none cursor-pointer" style={{ color: 'var(--nox-text-3)' }}>
-                <option value={2}>2s</option>
-                <option value={5}>5s</option>
-                <option value={10}>10s</option>
-                <option value={30}>30s</option>
-              </select>
-            )}
-          </div>
-          <kbd className="text-[9px] px-1.5 py-0.5 rounded font-mono" style={{ color: 'var(--nox-text-3)', background: 'var(--nox-active)' }}>{navigator.platform?.includes('Mac') ? '⌘' : 'Ctrl'}+Enter</kbd>
-          <div className="w-px h-4" style={{ background: 'var(--nox-border)' }} />
-          <button onClick={saveCurrentQuery} disabled={!sql.trim()} className="flex items-center gap-1 px-2 py-1 rounded text-[10px] disabled:opacity-30" style={{ color: 'var(--nox-text-3)' }} title="Save query"><Pin className="w-3 h-3" /> Save</button>
-          <div className="flex-1" />
-          <button onClick={() => { setSql(''); setResults(null); setQueryError(null); setBrowsingTable(null); setActiveTable(null); setExplainTree(null) }} className="flex items-center gap-1 px-2 py-1 rounded text-[10px]" style={{ color: 'var(--nox-text-3)' }}><RotateCcw className="w-3 h-3" /> Clear</button>
-        </div>
+        <ExplorerToolbar
+          running={running} explainRunning={explainRunning} hasSql={!!sql.trim()} activePanel={activePanel}
+          watchActive={watchActive} watchSec={watchSec} watchCountdown={watchCountdown}
+          onRun={() => runQuery()} onExplain={runExplain} onStartWatch={startWatch} onStopWatch={stopWatch}
+          onWatchSecChange={setWatchSec} onSave={saveCurrentQuery}
+          onClear={() => { setSql(''); setResults(null); setQueryError(null); setBrowsingTable(null); setActiveTable(null); setExplainTree(null) }}
+        />
 
         {/* SQL editor */}
         <div className="flex-shrink-0" style={{ height: editorHeight }}>
@@ -389,21 +360,11 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
         </div>
         <div className="h-[3px] flex-shrink-0 cursor-row-resize group" style={{ background: 'var(--nox-border)' }} onMouseDown={startResize}><div className="h-full transition-colors group-hover:bg-[#3B5CCC]" /></div>
 
-        {/* Tabs */}
-        <div className="flex items-center gap-0 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
-          <PanelTab active={activePanel === 'results'} onClick={() => setActivePanel('results')} badge={results ? results.rowCount : undefined}>Results</PanelTab>
-          <PanelTab active={activePanel === 'explain'} onClick={() => setActivePanel('explain')} badge={explainTree ? 1 : undefined}>Explain</PanelTab>
-          <PanelTab active={activePanel === 'history'} onClick={() => setActivePanel('history')} badge={history.length || undefined}>History</PanelTab>
-          <PanelTab active={activePanel === 'saved'} onClick={() => setActivePanel('saved')} badge={savedQueries.length || undefined}>Saved</PanelTab>
-          <div className="flex-1" />
-          {results && activePanel === 'results' && <>
-            <span className="text-[10px] font-mono mr-2" style={{ color: 'var(--nox-text-3)' }}>{results.columns.length} cols · {results.duration}ms</span>
-            <TinyBtn title="Copy" onClick={copyResults}><Copy className="w-3 h-3" /></TinyBtn>
-            <TinyBtn title="CSV" onClick={exportCsv}><Download className="w-3 h-3" /></TinyBtn>
-            <TinyBtn title={detailOpen ? 'Close detail' : 'Row detail'} onClick={() => setDetailOpen(d => !d)} active={detailOpen}>{detailOpen ? <PanelRightClose className="w-3 h-3" /> : <PanelRightOpen className="w-3 h-3" />}</TinyBtn>
-            <div className="w-2" />
-          </>}
-        </div>
+        <ResultsTabsBar
+          activePanel={activePanel} onSelect={setActivePanel} results={results} hasExplain={!!explainTree}
+          historyCount={history.length} savedCount={savedQueries.length} detailOpen={detailOpen}
+          onCopy={copyResults} onExport={exportCsv} onToggleDetail={() => setDetailOpen(d => !d)}
+        />
 
         {/* Panel content */}
         <div style={{ flex: '1 1 0', display: 'flex', minHeight: 0, minWidth: 0 }}>
@@ -420,43 +381,13 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
                 </div>
               )}
               {results && (
-                <div className="flex-1 min-w-0 min-h-0 overflow-hidden">
-                  <div className="w-full h-full overflow-auto" style={{ scrollbarWidth: 'thin' }}>
-                    <div className="text-[11px] font-mono" style={{ width: resultsTableWidth, minWidth: '100%' }}>
-                      <div className="sticky top-0 z-20 grid" style={{ gridTemplateColumns: resultsGridColumns }}>
-                        <div className="text-right px-2 py-2 text-[10px] font-normal sticky left-0 z-30 whitespace-nowrap" style={{ color: 'var(--nox-text-3)', background: 'var(--nox-shell)', borderBottom: '2px solid var(--nox-border)' }}>#</div>
-                        {results.columns.map(col => (
-                          <button key={col} className="text-left px-3 py-2 text-[10px] font-semibold uppercase tracking-wider whitespace-nowrap cursor-pointer select-none overflow-hidden text-ellipsis" style={{ color: resultSort?.col === col ? 'var(--nox-text)' : 'var(--nox-text-2)', background: 'var(--nox-shell)', borderBottom: '2px solid var(--nox-border)' }} onClick={() => toggleResultSort(col)}>
-                            {col}{resultSort?.col === col && <ArrowUpDown className="w-2.5 h-2.5 inline-block ml-1" style={{ transform: resultSort.dir === 'desc' ? 'scaleY(-1)' : undefined }} />}
-                          </button>
-                        ))}
-                      </div>
-                      {sortedRows.map((row, i) => (
-                        <div key={i} onClick={() => setSelectedRow(i === selectedRow ? null : i)} className="grid cursor-default transition-colors" style={{ gridTemplateColumns: resultsGridColumns, background: selectedRow === i ? 'rgba(59,92,204,0.06)' : undefined }} onMouseEnter={e => { if (selectedRow !== i) e.currentTarget.style.background = 'var(--nox-hover)' }} onMouseLeave={e => { if (selectedRow !== i) e.currentTarget.style.background = '' }}>
-                          <div className="text-right px-2 py-[5px] text-[10px] sticky left-0 z-10 whitespace-nowrap" style={{ color: 'var(--nox-text-3)', background: selectedRow === i ? 'rgba(59,92,204,0.06)' : 'var(--nox-bg)', borderBottom: '1px solid var(--nox-border)' }}>{i + 1}</div>
-                          {results.columns.map(col => {
-                            const val = row[col]; const isNull = val == null
-                            const isEditing = editingCell?.row === i && editingCell?.col === col
-                            const cellKey = `${i}-${col}`
-                            return (
-                              <div key={col} className="px-3 py-[5px] whitespace-nowrap overflow-hidden text-ellipsis" style={{ color: isNull ? 'var(--nox-text-3)' : 'var(--nox-text)', borderBottom: '1px solid var(--nox-border)', background: changedCells.has(`${i}-${col}`) ? 'rgba(245,158,11,0.12)' : undefined, transition: 'background 0.5s' }}
-                                onDoubleClick={e => { e.stopPropagation(); if (browsingTable) { setEditingCell({ row: i, col }); setEditValue(isNull ? '' : String(val)); setTimeout(() => editInputRef.current?.focus(), 0) } }}>
-                                {isEditing ? (
-                                  <input ref={editInputRef} value={editValue} onChange={e => setEditValue(e.target.value)}
-                                    onBlur={commitEdit} onKeyDown={e => { if (e.key === 'Enter') commitEdit(); if (e.key === 'Escape') setEditingCell(null) }}
-                                    className="bg-transparent text-[11px] font-mono px-0 py-0 focus:outline-none w-full" style={{ color: 'var(--nox-text)', borderBottom: '1px solid #3B5CCC' }} />
-                                ) : (
-                                  <SmartCell value={val} cellKey={cellKey} expandedJson={expandedJson} onToggleJson={toggleJsonExpand} />
-                                )}
-                              </div>
-                            )
-                          })}
-                        </div>
-                      ))}
-                    </div>
-                    {sortedRows.length === 0 && <div className="flex items-center justify-center py-12"><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>No rows</p></div>}
-                  </div>
-                </div>
+                <ResultsGrid
+                  results={results} sortedRows={sortedRows} resultSort={resultSort} onToggleSort={toggleResultSort}
+                  selectedRow={selectedRow} onSelectRow={setSelectedRow}
+                  editingCell={editingCell} editValue={editValue} setEditValue={setEditValue} editInputRef={editInputRef}
+                  commitEdit={commitEdit} cancelEdit={() => setEditingCell(null)} startCellEdit={startCellEdit}
+                  changedCells={changedCells} expandedJson={expandedJson} onToggleJson={toggleJsonExpand}
+                />
               )}
               {!results && !queryError && !running && (
                 <div className="flex items-center justify-center flex-1 min-h-0 w-full"><div className="text-center"><Database className="w-8 h-8 mx-auto mb-3" style={{ color: 'var(--nox-text-3)', opacity: 0.12 }} /><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>Click a table to browse, or write a query</p></div></div>
@@ -466,25 +397,7 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
 
             {/* Row detail panel */}
             {detailOpen && detailRow && results && (
-              <div className="flex-shrink-0 flex flex-col overflow-hidden" style={{ width: 300, borderLeft: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
-                <div className="flex items-center gap-2 px-3 py-2 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)' }}>
-                  <span className="text-[11px] font-semibold flex-1" style={{ color: 'var(--nox-text)' }}>Row {selectedRow! + 1}</span>
-                  <button onClick={() => setDetailOpen(false)} style={{ color: 'var(--nox-text-3)' }}><X className="w-3 h-3" /></button>
-                </div>
-                <div className="flex-1 overflow-y-auto p-3" style={{ scrollbarWidth: 'thin' }}>
-                  {results.columns.map(col => {
-                    const val = detailRow[col]; const isNull = val == null
-                    const str = isNull ? null : typeof val === 'object' ? JSON.stringify(val, null, 2) : String(val)
-                    return (
-                      <div key={col} className="mb-3">
-                        <p className="text-[9px] uppercase tracking-wider font-semibold mb-0.5" style={{ color: 'var(--nox-text-3)' }}>{col}</p>
-                        {isNull ? <p className="text-[11px] font-mono italic opacity-40" style={{ color: 'var(--nox-text-3)' }}>NULL</p>
-                         : <pre className="text-[11px] font-mono break-all leading-relaxed whitespace-pre-wrap" style={{ color: 'var(--nox-text)' }}>{str}</pre>}
-                      </div>
-                    )
-                  })}
-                </div>
-              </div>
+              <RowDetailPanel columns={results.columns} row={detailRow} rowNumber={selectedRow! + 1} onClose={() => setDetailOpen(false)} />
             )}
           </>}
 
@@ -499,71 +412,334 @@ export default function DatabaseExplorer({ tab }: { tab: Tab }) {
             </div>
           )}
 
-          {/* ── History ──────────────────────────────────────────── */}
-          {activePanel === 'history' && (
-            <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
-              {history.length === 0 ? <div className="flex items-center justify-center h-full"><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>No history</p></div>
-              : history.map((h, i) => (
-                <button key={i} onClick={() => { setSql(h.sql); setActivePanel('results'); editorRef.current?.focus() }}
-                  className="w-full text-left px-4 py-3 transition-colors" style={{ borderBottom: '1px solid var(--nox-border)' }}
-                  onMouseEnter={e => (e.currentTarget.style.background = 'var(--nox-hover)')} onMouseLeave={e => (e.currentTarget.style.background = '')}>
-                  <pre className="text-[11px] font-mono leading-relaxed whitespace-pre-wrap" style={{ color: 'var(--nox-text-2)' }}>{h.sql.length > 200 ? h.sql.slice(0, 200) + '…' : h.sql}</pre>
-                  <div className="flex items-center gap-3 mt-1"><span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{new Date(h.ts).toLocaleTimeString()}</span>{h.duration !== undefined && <span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{h.duration}ms</span>}{h.rows !== undefined && <span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{h.rows} rows</span>}</div>
-                </button>
-              ))}
-            </div>
-          )}
+          {activePanel === 'history' && <HistoryPanel history={history} onPick={pickQuery} />}
+
+          {activePanel === 'saved' && <SavedPanel savedQueries={savedQueries} onPick={pickQuery} />}
+        </div>
+      </div>
+
+      {toast && <div className="fixed bottom-4 right-4 z-50 px-4 py-2 rounded-lg text-[11px] font-medium" style={{ background: 'var(--nox-surface)', border: '1px solid var(--nox-border)', color: '#3B5CCC', boxShadow: '0 8px 24px rgba(0,0,0,0.12)' }}>{toast}</div>}
+    </div>
+  )
+}
+
+const DB_TYPE_LABELS: Record<string, string> = { mysql: 'MySQL', mariadb: 'MariaDB', postgresql: 'PostgreSQL' }
+
+function ExplorerToolbar({ running, explainRunning, hasSql, activePanel, watchActive, watchSec, watchCountdown, onRun, onExplain, onStartWatch, onStopWatch, onWatchSecChange, onSave, onClear }: Readonly<{
+  running: boolean; explainRunning: boolean; hasSql: boolean; activePanel: ActivePanel
+  watchActive: boolean; watchSec: number; watchCountdown: number
+  onRun: () => void; onExplain: () => void; onStartWatch: () => void; onStopWatch: () => void
+  onWatchSecChange: (sec: number) => void; onSave: () => void; onClear: () => void
+}>) {
+  return (
+    <div className="flex items-center gap-2 px-3 flex-shrink-0" style={{ height: 36, borderBottom: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
+      <button onClick={onRun} disabled={running || !hasSql} className="flex items-center gap-1.5 px-3 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ background: running ? 'var(--nox-active)' : '#3B5CCC', color: running ? 'var(--nox-text-2)' : '#fff' }}>
+        {running ? <Loader2 className="w-3 h-3 animate-spin" /> : <Play className="w-3 h-3" />}{running ? 'Running…' : 'Run'}
+      </button>
+      <button onClick={onExplain} disabled={running || explainRunning || !hasSql} className="flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ color: activePanel === 'explain' ? '#F59E0B' : 'var(--nox-text-3)', background: activePanel === 'explain' ? 'rgba(245,158,11,0.08)' : undefined }} title="Visualize query execution plan">
+        <Activity className="w-3 h-3" /> Explain
+      </button>
+      <div className="w-px h-4" style={{ background: 'var(--nox-border)' }} />
+      <WatchControls watchActive={watchActive} watchSec={watchSec} watchCountdown={watchCountdown} running={running} hasSql={hasSql} onStart={onStartWatch} onStop={onStopWatch} onSecChange={onWatchSecChange} />
+      <kbd className="text-[9px] px-1.5 py-0.5 rounded font-mono" style={{ color: 'var(--nox-text-3)', background: 'var(--nox-active)' }}>{navigator.platform?.includes('Mac') ? '⌘' : 'Ctrl'}+Enter</kbd>
+      <div className="w-px h-4" style={{ background: 'var(--nox-border)' }} />
+      <button onClick={onSave} disabled={!hasSql} className="flex items-center gap-1 px-2 py-1 rounded text-[10px] disabled:opacity-30" style={{ color: 'var(--nox-text-3)' }} title="Save query"><Pin className="w-3 h-3" /> Save</button>
+      <div className="flex-1" />
+      <button onClick={onClear} className="flex items-center gap-1 px-2 py-1 rounded text-[10px]" style={{ color: 'var(--nox-text-3)' }}><RotateCcw className="w-3 h-3" /> Clear</button>
+    </div>
+  )
+}
+
+function WatchControls({ watchActive, watchSec, watchCountdown, running, hasSql, onStart, onStop, onSecChange }: Readonly<{
+  watchActive: boolean; watchSec: number; watchCountdown: number; running: boolean; hasSql: boolean
+  onStart: () => void; onStop: () => void; onSecChange: (sec: number) => void
+}>) {
+  return (
+    <div className="flex items-center gap-1">
+      <button onClick={watchActive ? onStop : onStart} disabled={!watchActive && (running || !hasSql)} className="flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium disabled:opacity-30" style={{ color: watchActive ? '#10B981' : 'var(--nox-text-3)', background: watchActive ? 'rgba(16,185,129,0.08)' : undefined }} title={watchActive ? 'Stop watching' : 'Auto-refresh query results'}>
+        {watchActive ? <EyeOff className="w-3 h-3" /> : <Eye className="w-3 h-3" />} {watchActive ? 'Stop' : 'Watch'}
+      </button>
+      {watchActive && <span className="text-[9px] font-mono tabular-nums px-1.5 py-0.5 rounded-full animate-pulse" style={{ color: '#10B981', background: 'rgba(16,185,129,0.08)' }}>{watchCountdown}s</span>}
+      {!watchActive && (
+        <select value={watchSec} onChange={e => onSecChange(Number(e.target.value))} className="bg-transparent text-[10px] font-mono focus:outline-none cursor-pointer" style={{ color: 'var(--nox-text-3)' }}>
+          <option value={2}>2s</option>
+          <option value={5}>5s</option>
+          <option value={10}>10s</option>
+          <option value={30}>30s</option>
+        </select>
+      )}
+    </div>
+  )
+}
+
+function ResultsTabsBar({ activePanel, onSelect, results, hasExplain, historyCount, savedCount, detailOpen, onCopy, onExport, onToggleDetail }: Readonly<{
+  activePanel: ActivePanel; onSelect: (p: ActivePanel) => void; results: QueryResult | null; hasExplain: boolean
+  historyCount: number; savedCount: number; detailOpen: boolean
+  onCopy: () => void; onExport: () => void; onToggleDetail: () => void
+}>) {
+  return (
+    <div className="flex items-center gap-0 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
+      <PanelTab active={activePanel === 'results'} onClick={() => onSelect('results')} badge={results ? results.rowCount : undefined}>Results</PanelTab>
+      <PanelTab active={activePanel === 'explain'} onClick={() => onSelect('explain')} badge={hasExplain ? 1 : undefined}>Explain</PanelTab>
+      <PanelTab active={activePanel === 'history'} onClick={() => onSelect('history')} badge={historyCount || undefined}>History</PanelTab>
+      <PanelTab active={activePanel === 'saved'} onClick={() => onSelect('saved')} badge={savedCount || undefined}>Saved</PanelTab>
+      <div className="flex-1" />
+      {results && activePanel === 'results' && <>
+        <span className="text-[10px] font-mono mr-2" style={{ color: 'var(--nox-text-3)' }}>{results.columns.length} cols · {results.duration}ms</span>
+        <TinyBtn title="Copy" onClick={onCopy}><Copy className="w-3 h-3" /></TinyBtn>
+        <TinyBtn title="CSV" onClick={onExport}><Download className="w-3 h-3" /></TinyBtn>
+        <TinyBtn title={detailOpen ? 'Close detail' : 'Row detail'} onClick={onToggleDetail} active={detailOpen}>{detailOpen ? <PanelRightClose className="w-3 h-3" /> : <PanelRightOpen className="w-3 h-3" />}</TinyBtn>
+        <div className="w-2" />
+      </>}
+    </div>
+  )
+}
 
-          {/* ── Saved ────────────────────────────────────────────── */}
-          {activePanel === 'saved' && (
-            <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
-              {savedQueries.length === 0 ? <div className="flex items-center justify-center h-full"><div className="text-center"><Pin className="w-6 h-6 mx-auto mb-2" style={{ color: 'var(--nox-text-3)', opacity: 0.2 }} /><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>Save queries with the Pin button</p></div></div>
-              : savedQueries.map((q, i) => (
-                <button key={i} onClick={() => { setSql(q.sql); setActivePanel('results'); editorRef.current?.focus() }}
-                  className="w-full text-left px-4 py-3 transition-colors" style={{ borderBottom: '1px solid var(--nox-border)' }}
-                  onMouseEnter={e => (e.currentTarget.style.background = 'var(--nox-hover)')} onMouseLeave={e => (e.currentTarget.style.background = '')}>
-                  <p className="text-[11px] font-medium mb-1" style={{ color: 'var(--nox-text)' }}>{q.label}</p>
-                  <pre className="text-[10px] font-mono truncate" style={{ color: 'var(--nox-text-3)' }}>{q.sql}</pre>
-                </button>
+function ResultsGrid({ results, sortedRows, resultSort, onToggleSort, selectedRow, onSelectRow, editingCell, editValue, setEditValue, editInputRef, commitEdit, cancelEdit, startCellEdit, changedCells, expandedJson, onToggleJson }: Readonly<{
+  results: QueryResult; sortedRows: any[]; resultSort: ResultSort; onToggleSort: (col: string) => void
+  selectedRow: number | null; onSelectRow: (i: number | null) => void
+  editingCell: { row: number; col: string } | null; editValue: string; setEditValue: (v: string) => void
+  editInputRef: React.Ref<HTMLInputElement>; commitEdit: () => void; cancelEdit: () => void
+  startCellEdit: (row: number, col: string, val: unknown) => void
+  changedCells: Set<string>; expandedJson: Set<string>; onToggleJson: (k: string) => void
+}>) {
+  const tableWidth = 48 + results.columns.length * 160
+  const gridColumns = `48px repeat(${results.columns.length}, 160px)`
+  // Result rows have no inherent identity; key on the pk-ish column value,
+  // disambiguating duplicates with an occurrence counter (not the array index).
+  const pkCol = results.columns.includes('id') ? 'id' : results.columns[0]
+  const seen = new Map<string, number>()
+  const rowKeys = sortedRows.map(row => {
+    const base = toEditable(row[pkCol])
+    const n = (seen.get(base) ?? 0) + 1
+    seen.set(base, n)
+    return n > 1 ? `${base}#${n}` : base
+  })
+  return (
+    <div className="flex-1 min-w-0 min-h-0 overflow-hidden">
+      <div className="w-full h-full overflow-auto" style={{ scrollbarWidth: 'thin' }}>
+        <div className="text-[11px] font-mono" style={{ width: tableWidth, minWidth: '100%' }}>
+          <div className="sticky top-0 z-20 grid" style={{ gridTemplateColumns: gridColumns }}>
+            <div className="text-right px-2 py-2 text-[10px] font-normal sticky left-0 z-30 whitespace-nowrap" style={{ color: 'var(--nox-text-3)', background: 'var(--nox-shell)', borderBottom: '2px solid var(--nox-border)' }}>#</div>
+            {results.columns.map(col => (
+              <button key={col} className="text-left px-3 py-2 text-[10px] font-semibold uppercase tracking-wider whitespace-nowrap cursor-pointer select-none overflow-hidden text-ellipsis" style={{ color: resultSort?.col === col ? 'var(--nox-text)' : 'var(--nox-text-2)', background: 'var(--nox-shell)', borderBottom: '2px solid var(--nox-border)' }} onClick={() => onToggleSort(col)}>
+                {col}{resultSort?.col === col && <ArrowUpDown className="w-2.5 h-2.5 inline-block ml-1" style={{ transform: resultSort.dir === 'desc' ? 'scaleY(-1)' : undefined }} />}
+              </button>
+            ))}
+          </div>
+          {/* Rows can contain interactive cells (JsonCell buttons), so the row
+              itself stays a div; keyboard selection goes through the row-number
+              button. The row keydown ignores bubbled events from those child
+              buttons so Enter there doesn't both activate and select. */}
+          {sortedRows.map((row, i) => (
+            <div key={rowKeys[i]}
+              onClick={() => onSelectRow(i === selectedRow ? null : i)}
+              onKeyDown={e => { if (e.target !== e.currentTarget) return; if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onSelectRow(i === selectedRow ? null : i) } }}
+              className="grid cursor-default transition-colors" style={{ gridTemplateColumns: gridColumns, background: selectedRow === i ? 'rgba(59,92,204,0.06)' : undefined }}
+              onMouseEnter={e => { if (selectedRow !== i) e.currentTarget.style.background = 'var(--nox-hover)' }} onMouseLeave={e => { if (selectedRow !== i) e.currentTarget.style.background = '' }}>
+              <button type="button" aria-pressed={selectedRow === i} title={`Select row ${i + 1}`}
+                onClick={e => { e.stopPropagation(); onSelectRow(i === selectedRow ? null : i) }}
+                className="text-right px-2 py-[5px] text-[10px] sticky left-0 z-10 whitespace-nowrap" style={{ color: 'var(--nox-text-3)', background: selectedRow === i ? 'rgba(59,92,204,0.06)' : 'var(--nox-bg)', borderBottom: '1px solid var(--nox-border)' }}>{i + 1}</button>
+              {results.columns.map(col => (
+                <ResultCell key={col} row={row} rowIndex={i} col={col}
+                  editing={editingCell?.row === i && editingCell?.col === col}
+                  changed={changedCells.has(`${i}-${col}`)}
+                  editValue={editValue} setEditValue={setEditValue} editInputRef={editInputRef}
+                  commitEdit={commitEdit} cancelEdit={cancelEdit}
+                  startCellEdit={startCellEdit}
+                  expandedJson={expandedJson} onToggleJson={onToggleJson} />
               ))}
             </div>
-          )}
+          ))}
+        </div>
+        {sortedRows.length === 0 && <div className="flex items-center justify-center py-12"><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>No rows</p></div>}
+      </div>
+    </div>
+  )
+}
+
+function SchemaSidebar({ dbLabel, footer, tables, tableFilter, setTableFilter, activeTable, tableColumns, onSelect, onRefresh }: Readonly<{
+  dbLabel: string; footer: string; tables: string[]; tableFilter: string; setTableFilter: (v: string) => void
+  activeTable: string | null; tableColumns: Record<string, TableColumn[]>; onSelect: (t: string) => void; onRefresh: () => void
+}>) {
+  return (
+    <div className="flex flex-col flex-shrink-0 overflow-hidden" style={{ width: 240, borderRight: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
+      <div className="flex items-center gap-2 px-3 flex-shrink-0" style={{ height: 36, borderBottom: '1px solid var(--nox-border)' }}>
+        <Database className="w-3.5 h-3.5" style={{ color: '#3B5CCC' }} />
+        <p className="text-[11px] font-semibold truncate flex-1" style={{ color: 'var(--nox-text)' }}>{dbLabel}</p>
+        <button onClick={onRefresh} className="w-5 h-5 flex items-center justify-center rounded" style={{ color: 'var(--nox-text-3)' }}><RefreshCw className="w-3 h-3" /></button>
+      </div>
+      <div className="px-2 py-2 flex-shrink-0">
+        <div className="flex items-center gap-1.5 px-2 py-1 rounded" style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}>
+          <Search className="w-3 h-3" style={{ color: 'var(--nox-text-3)' }} />
+          <input value={tableFilter} onChange={e => setTableFilter(e.target.value)} placeholder="Filter tables…" className="flex-1 bg-transparent text-[10px] font-mono focus:outline-none" style={{ color: 'var(--nox-text)' }} />
+          {tableFilter && <button onClick={() => setTableFilter('')} style={{ color: 'var(--nox-text-3)' }}><X className="w-2.5 h-2.5" /></button>}
         </div>
       </div>
+      <div className="px-3 pb-1 flex-shrink-0"><span className="text-[9px] uppercase tracking-wider font-semibold" style={{ color: 'var(--nox-text-3)' }}>Tables ({tables.length})</span></div>
+      <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
+        {tables.map(table => (
+          <div key={table}>
+            <button onClick={() => onSelect(table)}
+              className="w-full flex items-center gap-1.5 px-3 py-[5px] text-left transition-colors"
+              style={{ color: activeTable === table ? 'var(--nox-text)' : 'var(--nox-text-2)', background: activeTable === table ? 'rgba(59,92,204,0.06)' : undefined }}
+              onMouseEnter={e => { if (activeTable !== table) e.currentTarget.style.background = 'var(--nox-hover)' }}
+              onMouseLeave={e => { if (activeTable !== table) e.currentTarget.style.background = '' }}>
+              {activeTable === table ? <ChevronDown className="w-2.5 h-2.5 flex-shrink-0" style={{ color: '#3B5CCC' }} /> : <ChevronRight className="w-2.5 h-2.5 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />}
+              <Table2 className="w-3 h-3 flex-shrink-0" style={{ color: activeTable === table ? '#3B5CCC' : '#8B5CF6' }} />
+              <span className="text-[11px] font-mono truncate">{table}</span>
+            </button>
+            {activeTable === table && tableColumns[table] && (
+              <div className="pb-1">{tableColumns[table].map(col => (
+                <div key={col.name} className="flex items-center gap-1.5 px-3 pl-8 py-[2px]">
+                  <Hash className="w-2.5 h-2.5 flex-shrink-0" style={{ color: 'var(--nox-text-3)', opacity: 0.3 }} />
+                  <span className="text-[10px] font-mono truncate flex-1" style={{ color: 'var(--nox-text-3)' }}>{col.name}</span>
+                  <span className="text-[9px] font-mono px-1 py-[1px] rounded flex-shrink-0" style={{ color: typeColor(col.type), background: `${typeColor(col.type)}11` }}>{col.type}</span>
+                </div>
+              ))}</div>
+            )}
+          </div>
+        ))}
+      </div>
+      <div className="px-3 py-2 flex-shrink-0" style={{ borderTop: '1px solid var(--nox-border)' }}>
+        <div className="flex items-center gap-1.5"><Zap className="w-2.5 h-2.5" style={{ color: '#10B981' }} /><span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{footer}</span></div>
+      </div>
+    </div>
+  )
+}
 
-      {toast && <div className="fixed bottom-4 right-4 z-50 px-4 py-2 rounded-lg text-[11px] font-medium" style={{ background: 'var(--nox-surface)', border: '1px solid var(--nox-border)', color: '#3B5CCC', boxShadow: '0 8px 24px rgba(0,0,0,0.12)' }}>{toast}</div>}
+function ResultCell({ row, rowIndex, col, editing, changed, editValue, setEditValue, editInputRef, commitEdit, cancelEdit, startCellEdit, expandedJson, onToggleJson }: Readonly<{
+  row: any; rowIndex: number; col: string; editing: boolean; changed: boolean
+  editValue: string; setEditValue: (v: string) => void; editInputRef: React.Ref<HTMLInputElement>
+  commitEdit: () => void; cancelEdit: () => void; startCellEdit: (row: number, col: string, val: unknown) => void
+  expandedJson: Set<string>; onToggleJson: (k: string) => void
+}>) {
+  const val = row[col]
+  const isNull = val == null
+  return (
+    <div className="px-3 py-[5px] whitespace-nowrap overflow-hidden text-ellipsis" style={{ color: isNull ? 'var(--nox-text-3)' : 'var(--nox-text)', borderBottom: '1px solid var(--nox-border)', background: changed ? 'rgba(245,158,11,0.12)' : undefined, transition: 'background 0.5s' }}
+      onDoubleClick={e => { e.stopPropagation(); startCellEdit(rowIndex, col, val) }}>
+      {editing ? (
+        <input ref={editInputRef} value={editValue} onChange={e => setEditValue(e.target.value)}
+          onBlur={commitEdit} onKeyDown={e => {
+            if (e.key === 'Enter') commitEdit()
+            if (e.key === 'Escape') cancelEdit()
+          }}
+          className="bg-transparent text-[11px] font-mono px-0 py-0 focus:outline-none w-full" style={{ color: 'var(--nox-text)', borderBottom: '1px solid #3B5CCC' }} />
+      ) : (
+        <SmartCell value={val} cellKey={`${rowIndex}-${col}`} expandedJson={expandedJson} onToggleJson={onToggleJson} />
+      )}
+    </div>
+  )
+}
+
+function RowDetailPanel({ columns, row, rowNumber, onClose }: Readonly<{
+  columns: string[]; row: any; rowNumber: number; onClose: () => void
+}>) {
+  return (
+    <div className="flex-shrink-0 flex flex-col overflow-hidden" style={{ width: 300, borderLeft: '1px solid var(--nox-border)', background: 'var(--nox-shell)' }}>
+      <div className="flex items-center gap-2 px-3 py-2 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)' }}>
+        <span className="text-[11px] font-semibold flex-1" style={{ color: 'var(--nox-text)' }}>Row {rowNumber}</span>
+        <button onClick={onClose} style={{ color: 'var(--nox-text-3)' }}><X className="w-3 h-3" /></button>
+      </div>
+      <div className="flex-1 overflow-y-auto p-3" style={{ scrollbarWidth: 'thin' }}>
+        {columns.map(col => {
+          const val = row[col]
+          if (val == null) {
+            return (
+              <div key={col} className="mb-3">
+                <p className="text-[9px] uppercase tracking-wider font-semibold mb-0.5" style={{ color: 'var(--nox-text-3)' }}>{col}</p>
+                <p className="text-[11px] font-mono italic opacity-40" style={{ color: 'var(--nox-text-3)' }}>NULL</p>
+              </div>
+            )
+          }
+          const str = typeof val === 'object' ? JSON.stringify(val, null, 2) : String(val)
+          return (
+            <div key={col} className="mb-3">
+              <p className="text-[9px] uppercase tracking-wider font-semibold mb-0.5" style={{ color: 'var(--nox-text-3)' }}>{col}</p>
+              <pre className="text-[11px] font-mono break-all leading-relaxed whitespace-pre-wrap" style={{ color: 'var(--nox-text)' }}>{str}</pre>
+            </div>
+          )
+        })}
+      </div>
+    </div>
+  )
+}
+
+function HistoryPanel({ history, onPick }: Readonly<{
+  history: { sql: string; ts: number; duration?: number; rows?: number }[]; onPick: (sql: string) => void
+}>) {
+  if (history.length === 0) {
+    return <div className="flex-1 flex items-center justify-center"><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>No history</p></div>
+  }
+  return (
+    <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
+      {history.map((h, i) => (
+        <button key={`${h.ts}-${i}`} onClick={() => onPick(h.sql)}
+          className="w-full text-left px-4 py-3 transition-colors" style={{ borderBottom: '1px solid var(--nox-border)' }}
+          onMouseEnter={e => (e.currentTarget.style.background = 'var(--nox-hover)')} onMouseLeave={e => (e.currentTarget.style.background = '')}>
+          <pre className="text-[11px] font-mono leading-relaxed whitespace-pre-wrap" style={{ color: 'var(--nox-text-2)' }}>{h.sql.length > 200 ? h.sql.slice(0, 200) + '…' : h.sql}</pre>
+          <div className="flex items-center gap-3 mt-1"><span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{new Date(h.ts).toLocaleTimeString()}</span>{h.duration !== undefined && <span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{h.duration}ms</span>}{h.rows !== undefined && <span className="text-[9px] font-mono" style={{ color: 'var(--nox-text-3)' }}>{h.rows} rows</span>}</div>
+        </button>
+      ))}
+    </div>
+  )
+}
+
+function SavedPanel({ savedQueries, onPick }: Readonly<{ savedQueries: SavedQuery[]; onPick: (sql: string) => void }>) {
+  if (savedQueries.length === 0) {
+    return <div className="flex-1 flex items-center justify-center"><div className="text-center"><Pin className="w-6 h-6 mx-auto mb-2" style={{ color: 'var(--nox-text-3)', opacity: 0.2 }} /><p className="text-[11px]" style={{ color: 'var(--nox-text-3)' }}>Save queries with the Pin button</p></div></div>
+  }
+  return (
+    <div className="flex-1 overflow-y-auto" style={{ scrollbarWidth: 'thin' }}>
+      {savedQueries.map((q) => (
+        <button key={q.ts} onClick={() => onPick(q.sql)}
+          className="w-full text-left px-4 py-3 transition-colors" style={{ borderBottom: '1px solid var(--nox-border)' }}
+          onMouseEnter={e => (e.currentTarget.style.background = 'var(--nox-hover)')} onMouseLeave={e => (e.currentTarget.style.background = '')}>
+          <p className="text-[11px] font-medium mb-1" style={{ color: 'var(--nox-text)' }}>{q.label}</p>
+          <pre className="text-[10px] font-mono truncate" style={{ color: 'var(--nox-text-3)' }}>{q.sql}</pre>
+        </button>
+      ))}
     </div>
   )
 }
 
 /* ── Smart cell renderer ───────────────────────────────────────────────── */
 
-function SmartCell({ value, cellKey, expandedJson, onToggleJson }: {
+// Returns the parsed object for object values / JSON-looking strings, else null.
+function tryParseJsonCell(value: any, str: string): any {
+  if (typeof value === 'object') return value
+  if (!isJsonString(str)) return null
+  try { return JSON.parse(str) } catch { return null }
+}
+
+// JSON object/array — expandable inline
+function JsonCell({ parsed, expanded, onToggle }: Readonly<{ parsed: any; expanded: boolean; onToggle: () => void }>) {
+  return (
+    <span>
+      <button onClick={e => { e.stopPropagation(); onToggle() }}
+        className="inline-flex items-center gap-0.5 px-1 py-[1px] rounded text-[9px] font-mono font-medium"
+        style={{ color: '#8B5CF6', background: 'rgba(139,92,246,0.08)' }}>
+        {Array.isArray(parsed) ? `[${parsed.length}]` : `{${Object.keys(parsed).length}}`}
+        <ChevronRight className="w-2 h-2" style={{ transform: expanded ? 'rotate(90deg)' : undefined, transition: 'transform 0.15s' }} />
+      </button>
+      {expanded && (
+        <pre className="mt-1 text-[10px] font-mono leading-relaxed whitespace-pre-wrap" style={{ color: '#8B5CF6' }}>{JSON.stringify(parsed, null, 2)}</pre>
+      )}
+    </span>
+  )
+}
+
+function SmartCell({ value, cellKey, expandedJson, onToggleJson }: Readonly<{
   value: any; cellKey: string; expandedJson: Set<string>; onToggleJson: (k: string) => void
-}) {
+}>) {
   if (value == null) return <span className="italic opacity-40">NULL</span>
 
   const str = typeof value === 'object' ? JSON.stringify(value) : String(value)
 
-  // JSON object/array — expandable inline
-  if (typeof value === 'object' || isJsonString(str)) {
-    const expanded = expandedJson.has(cellKey)
-    const parsed = typeof value === 'object' ? value : (() => { try { return JSON.parse(str) } catch { return null } })()
-    if (parsed) {
-      return (
-        <span>
-          <button onClick={e => { e.stopPropagation(); onToggleJson(cellKey) }}
-            className="inline-flex items-center gap-0.5 px-1 py-[1px] rounded text-[9px] font-mono font-medium"
-            style={{ color: '#8B5CF6', background: 'rgba(139,92,246,0.08)' }}>
-            {Array.isArray(parsed) ? `[${parsed.length}]` : `{${Object.keys(parsed).length}}`}
-            <ChevronRight className="w-2 h-2" style={{ transform: expanded ? 'rotate(90deg)' : undefined, transition: 'transform 0.15s' }} />
-          </button>
-          {expanded && (
-            <pre className="mt-1 text-[10px] font-mono leading-relaxed whitespace-pre-wrap" style={{ color: '#8B5CF6' }}>{JSON.stringify(parsed, null, 2)}</pre>
-          )}
-        </span>
-      )
-    }
+  const parsed = tryParseJsonCell(value, str)
+  if (parsed) {
+    return <JsonCell parsed={parsed} expanded={expandedJson.has(cellKey)} onToggle={() => onToggleJson(cellKey)} />
   }
 
   // URL — clickable link
@@ -589,7 +765,7 @@ function SmartCell({ value, cellKey, expandedJson, onToggleJson }: {
   // ISO timestamp — show relative time tooltip
   if (ISO_DATE_RE.test(str)) {
     const d = new Date(str)
-    if (!isNaN(d.getTime())) {
+    if (!Number.isNaN(d.getTime())) {
       return (
         <span title={str} style={{ color: '#3B5CCC' }}>
           {d.toLocaleString()} <span className="text-[9px] opacity-50">({relativeTime(d)})</span>
@@ -613,10 +789,16 @@ function SmartCell({ value, cellKey, expandedJson, onToggleJson }: {
 
 /* ── Explain tree visualizer ───────────────────────────────────────────── */
 
-function ExplainTreeView({ node, maxCost, depth }: { node: ExplainNode; maxCost: number; depth: number }) {
+function explainCostColor(costPct: number): string {
+  if (costPct > 70) return '#EF4444'
+  if (costPct > 40) return '#F59E0B'
+  return '#10B981'
+}
+
+function ExplainTreeView({ node, maxCost, depth }: Readonly<{ node: ExplainNode; maxCost: number; depth: number }>) {
   const [expanded, setExpanded] = useState(true)
   const costPct = maxCost > 0 ? Math.max(2, (node.cost / maxCost) * 100) : 0
-  const costColor = costPct > 70 ? '#EF4444' : costPct > 40 ? '#F59E0B' : '#10B981'
+  const costColor = explainCostColor(costPct)
 
   return (
     <div style={{ marginLeft: depth > 0 ? 24 : 0 }}>
@@ -652,15 +834,41 @@ function ExplainTreeView({ node, maxCost, depth }: { node: ExplainNode; maxCost:
       </div>
 
       {expanded && node.children.map((child, i) => (
-        <ExplainTreeView key={i} node={child} maxCost={maxCost} depth={depth + 1} />
+        <ExplainTreeView key={`${child.type}-${child.relation ?? i}`} node={child} maxCost={maxCost} depth={depth + 1} />
       ))}
     </div>
   )
 }
 
+// Identifier quoting per dialect — values themselves always travel as bind
+// parameters, never interpolated into the SQL string.
+function quoteIdent(name: string, dbType: string): string {
+  if (dbType === 'mysql' || dbType === 'mariadb') return '`' + name.replaceAll('`', '``') + '`'
+  return '"' + name.replaceAll('"', '""') + '"'
+}
+
+function bindPlaceholder(dbType: string, n: number): string {
+  return dbType === 'mysql' || dbType === 'mariadb' ? '?' : `$${n}`
+}
+
 /* ── Helpers ────────────────────────────────────────────────────────────── */
 
-function PanelTab({ active, onClick, badge, children }: { active: boolean; onClick: () => void; badge?: number; children: React.ReactNode }) {
+function toEditable(v: unknown): string {
+  if (v == null) return ''
+  if (typeof v === 'object') return JSON.stringify(v)
+  return String(v)
+}
+
+function filterTables(tables: string[], filter: string): string[] {
+  if (!filter) return tables
+  return tables.filter(t => t.toLowerCase().includes(filter.toLowerCase()))
+}
+
+function getDetailRow(rows: any[], selectedRow: number | null): any {
+  return selectedRow === null ? null : rows[selectedRow] ?? null
+}
+
+function PanelTab({ active, onClick, badge, children }: Readonly<{ active: boolean; onClick: () => void; badge?: number; children: React.ReactNode }>) {
   return (
     <button onClick={onClick} className="flex items-center gap-1.5 px-4 py-2 text-[11px] font-medium relative" style={{ color: active ? 'var(--nox-text)' : 'var(--nox-text-3)' }}>
       {children}
@@ -670,7 +878,7 @@ function PanelTab({ active, onClick, badge, children }: { active: boolean; onCli
   )
 }
 
-function TinyBtn({ title, onClick, active, children }: { title: string; onClick: () => void; active?: boolean; children: React.ReactNode }) {
+function TinyBtn({ title, onClick, active, children }: Readonly<{ title: string; onClick: () => void; active?: boolean; children: React.ReactNode }>) {
   return <button onClick={onClick} title={title} className="w-6 h-6 flex items-center justify-center rounded mr-0.5" style={{ color: active ? '#3B5CCC' : 'var(--nox-text-3)' }} onMouseEnter={e => (e.currentTarget.style.background = 'var(--nox-hover)')} onMouseLeave={e => (e.currentTarget.style.background = '')}>{children}</button>
 }
 
diff --git a/src/renderer/src/components/Database/__tests__/DatabaseExplorer.test.tsx b/src/renderer/src/components/Database/__tests__/DatabaseExplorer.test.tsx
new file mode 100644
index 0000000..3959a1e
--- /dev/null
+++ b/src/renderer/src/components/Database/__tests__/DatabaseExplorer.test.tsx
@@ -0,0 +1,664 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { render, screen, fireEvent, waitFor, within, act } from '@testing-library/react'
+import DatabaseExplorer from '../DatabaseExplorer'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+const usersResult = {
+  columns: ['id', 'name', 'active', 'meta'],
+  rows: [
+    { id: 1, name: 'alice', active: true, meta: { role: 'admin' } },
+    { id: 2, name: 'bob', active: false, meta: null },
+  ],
+  rowCount: 2,
+  duration: 12,
+}
+
+const tableInfoResult = {
+  columns: [
+    { name: 'id', type: 'integer', nullable: false },
+    { name: 'name', type: 'varchar', nullable: true },
+    { name: 'created', type: 'timestamp', nullable: true },
+    { name: 'active', type: 'boolean', nullable: false },
+    { name: 'meta', type: 'jsonb', nullable: true },
+    { name: 'uid', type: 'uuid', nullable: true },
+    { name: 'blob', type: 'bytea', nullable: true },
+  ],
+}
+
+function setup(sessionOverrides: Record<string, any> = {}, dbOverrides: Record<string, any> = {}) {
+  const session = makeSession({
+    type: 'database',
+    dbType: 'postgresql',
+    databaseName: 'appdb',
+    host: 'db.example.com',
+    port: 5432,
+    username: 'admin',
+    sslMode: 'disable',
+    ...sessionOverrides,
+  } as any)
+  const tab = makeTab({ sessionId: session.id, view: 'database' as any, label: 'appdb' })
+  const api = installWindowApi({
+    database: {
+      connect: vi.fn().mockResolvedValue('db-1'),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+      query: vi.fn().mockResolvedValue(usersResult),
+      tables: vi.fn().mockResolvedValue(['users', 'orders', 'audit_log']),
+      tableInfo: vi.fn().mockResolvedValue(tableInfoResult),
+      ...dbOverrides,
+    },
+  })
+  seedStore({ sessions: [session], tabs: [tab] } as any)
+  return { session, tab, api }
+}
+
+async function renderConnected(sessionOverrides: Record<string, any> = {}, dbOverrides: Record<string, any> = {}) {
+  const ctx = setup(sessionOverrides, dbOverrides)
+  const utils = render(<DatabaseExplorer tab={ctx.tab} />)
+  await screen.findByText('Tables (3)')
+  return { ...ctx, ...utils }
+}
+
+const editor = () => screen.getByPlaceholderText('SELECT * FROM …') as HTMLTextAreaElement
+
+async function runSql(api: WindowApiMock, sql: string) {
+  fireEvent.change(editor(), { target: { value: sql } })
+  fireEvent.click(screen.getByText('Run'))
+  await waitFor(() => expect(api.database.query).toHaveBeenCalled())
+}
+
+beforeEach(() => {
+  Object.defineProperty(navigator, 'clipboard', {
+    value: { writeText: vi.fn().mockResolvedValue(undefined) },
+    configurable: true,
+  })
+  ;(URL as any).createObjectURL = vi.fn(() => 'blob:test')
+  ;(URL as any).revokeObjectURL = vi.fn()
+})
+
+afterEach(() => {
+  vi.useRealTimers()
+  vi.restoreAllMocks()
+})
+
+describe('DatabaseExplorer — connect flow', () => {
+  it('shows connecting state then the schema sidebar after connect', async () => {
+    const { api, session } = setup()
+    render(<DatabaseExplorer tab={useAppStore.getState().tabs[0]} />)
+    expect(screen.getByText(/Connecting to appdb/)).toBeTruthy()
+    await screen.findByText('Tables (3)')
+    expect(api.sessions.getCredentials).toHaveBeenCalledWith(session.id)
+    expect(api.database.connect).toHaveBeenCalledWith({
+      dbType: 'postgresql',
+      host: 'db.example.com',
+      port: 5432,
+      username: 'admin',
+      password: 'pw',
+      database: 'appdb',
+      ssl: 'disable',
+    })
+    expect(screen.getByText('users')).toBeTruthy()
+    expect(screen.getByText('orders')).toBeTruthy()
+    expect(screen.getByText(/PostgreSQL · db.example.com:5432/)).toBeTruthy()
+    expect(useAppStore.getState().tabs[0].status).toBe('connected')
+  })
+
+  it('shows the error screen when connect fails and retries on click', async () => {
+    const { tab, api } = setup({}, {
+      connect: vi.fn().mockRejectedValueOnce(new Error('ECONNREFUSED')).mockResolvedValue('db-2'),
+    })
+    render(<DatabaseExplorer tab={tab} />)
+    await screen.findByText('ECONNREFUSED')
+    expect(useAppStore.getState().tabs[0].status).toBe('error')
+    fireEvent.click(screen.getByText('Retry'))
+    await screen.findByText('Tables (3)')
+    expect(api.database.connect).toHaveBeenCalledTimes(2)
+  })
+
+  it('maps a locked-vault credential error to a friendly message', async () => {
+    const { tab } = setup()
+    ;(window as any).api.sessions.getCredentials = vi.fn().mockRejectedValue(new Error('vault is locked'))
+    render(<DatabaseExplorer tab={tab} />)
+    expect(await screen.findByText('App is locked — unlock noxed to reconnect')).toBeTruthy()
+  })
+
+  it('disconnects on unmount and logs when disconnect fails', async () => {
+    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const { api, unmount } = await renderConnected()
+    api.database.disconnect.mockRejectedValueOnce(new Error('gone'))
+    unmount()
+    await waitFor(() => expect(api.database.disconnect).toHaveBeenCalledWith('db-1'))
+    await waitFor(() => expect(errSpy).toHaveBeenCalled())
+  })
+})
+
+describe('DatabaseExplorer — sidebar and tables', () => {
+  it('filters tables and clears the filter', async () => {
+    await renderConnected()
+    const filter = screen.getByPlaceholderText('Filter tables…')
+    fireEvent.change(filter, { target: { value: 'ORD' } })
+    expect(screen.getByText('orders')).toBeTruthy()
+    expect(screen.queryByText('users')).toBeNull()
+    const clearBtn = filter.parentElement!.querySelector('button')!
+    fireEvent.click(clearBtn)
+    expect(screen.getByText('users')).toBeTruthy()
+  })
+
+  it('refreshes tables and toasts when refresh fails', async () => {
+    const { api } = await renderConnected()
+    api.database.tables.mockResolvedValueOnce(['users', 'orders', 'audit_log', 'new_table'])
+    const header = screen.getByText('appdb').parentElement!
+    fireEvent.click(header.querySelector('button')!)
+    await screen.findByText('Tables (4)')
+    api.database.tables.mockRejectedValueOnce(new Error('schema read failed'))
+    fireEvent.click(header.querySelector('button')!)
+    expect(await screen.findByText('schema read failed')).toBeTruthy()
+  })
+
+  it('browses a table on click, loads columns with type badges, and collapses on second click', async () => {
+    const { api } = await renderConnected()
+    fireEvent.click(screen.getByText('users'))
+    await waitFor(() =>
+      expect(api.database.query).toHaveBeenCalledWith('db-1', 'SELECT * FROM "users" LIMIT 100')
+    )
+    expect(api.database.tableInfo).toHaveBeenCalledWith('db-1', 'users')
+    await screen.findByText('integer')
+    expect(screen.getByText('varchar')).toBeTruthy()
+    expect(screen.getByText('timestamp')).toBeTruthy()
+    expect(screen.getByText('boolean')).toBeTruthy()
+    expect(screen.getByText('jsonb')).toBeTruthy()
+    expect(screen.getByText('uuid')).toBeTruthy()
+    expect(screen.getByText('bytea')).toBeTruthy()
+    // Grid rendered
+    await screen.findByText('alice')
+    expect((editor() as HTMLTextAreaElement).value).toBe('SELECT * FROM "users" LIMIT 100')
+    // Collapse
+    fireEvent.click(screen.getByText('users'))
+    expect(screen.queryByText('integer')).toBeNull()
+  })
+
+  it('toasts when loading table columns fails', async () => {
+    await renderConnected({}, { tableInfo: vi.fn().mockRejectedValue(new Error('no perms')) })
+    fireEvent.click(screen.getByText('orders'))
+    expect(await screen.findByText('no perms')).toBeTruthy()
+  })
+})
+
+describe('DatabaseExplorer — toolbar and query running', () => {
+  it('disables Run without SQL, runs a query, and records history', async () => {
+    const { api } = await renderConnected()
+    const runBtn = screen.getByText('Run').closest('button')!
+    expect(runBtn.hasAttribute('disabled')).toBe(true)
+    await runSql(api, 'SELECT * FROM users')
+    await screen.findByText('alice')
+    expect(screen.getByText(/4 cols · 12ms/)).toBeTruthy()
+    // history entry
+    fireEvent.click(screen.getByText('History'))
+    // the textarea still holds the same SQL, so target the history <pre> entry
+    const historyEntry = screen.getAllByText('SELECT * FROM users').find(el => el.tagName === 'PRE')!
+    expect(historyEntry).toBeTruthy()
+    expect(screen.getByText('12ms')).toBeTruthy()
+    expect(screen.getByText('2 rows')).toBeTruthy()
+    // picking a history entry restores the SQL and returns to results
+    fireEvent.click(historyEntry)
+    expect(editor().value).toBe('SELECT * FROM users')
+    await screen.findByText('alice')
+  })
+
+  it('runs the query on Ctrl+Enter', async () => {
+    const { api } = await renderConnected()
+    fireEvent.change(editor(), { target: { value: 'SELECT 1' } })
+    fireEvent.keyDown(editor(), { key: 'Enter', ctrlKey: true })
+    await waitFor(() => expect(api.database.query).toHaveBeenCalledWith('db-1', 'SELECT 1'))
+  })
+
+  it('shows the query error panel when a query fails', async () => {
+    const { api } = await renderConnected({}, {
+      query: vi.fn().mockRejectedValue(new Error('syntax error at or near "FRM"')),
+    })
+    await runSql(api, 'SELECT * FRM users')
+    await screen.findByText('syntax error at or near "FRM"')
+  })
+
+  it('shows No rows for an empty result', async () => {
+    const { api } = await renderConnected({}, {
+      query: vi.fn().mockResolvedValue({ columns: ['id'], rows: [], rowCount: 0, duration: 3 }),
+    })
+    await runSql(api, 'SELECT * FROM empty')
+    await screen.findByText('No rows')
+  })
+
+  it('saves a query via prompt and lists it in the Saved panel', async () => {
+    const { api } = await renderConnected()
+    const promptSpy = vi.spyOn(window, 'prompt').mockReturnValue('All users')
+    await runSql(api, 'SELECT * FROM users')
+    fireEvent.click(screen.getByText('Save'))
+    await screen.findByText('Query saved')
+    // cancelled prompt saves nothing
+    promptSpy.mockReturnValueOnce(null)
+    fireEvent.click(screen.getByText('Save'))
+    fireEvent.click(screen.getByText('Saved'))
+    expect(screen.getByText('All users')).toBeTruthy()
+    // picking a saved query restores its SQL
+    fireEvent.click(screen.getByText('All users'))
+    expect(editor().value).toBe('SELECT * FROM users')
+  })
+
+  it('shows the empty Saved panel hint', async () => {
+    await renderConnected()
+    fireEvent.click(screen.getByText('Saved'))
+    expect(screen.getByText('Save queries with the Pin button')).toBeTruthy()
+    fireEvent.click(screen.getByText('History'))
+    expect(screen.getByText('No history')).toBeTruthy()
+  })
+
+  it('clears editor and results with Clear', async () => {
+    const { api } = await renderConnected()
+    await runSql(api, 'SELECT * FROM users')
+    await screen.findByText('alice')
+    fireEvent.click(screen.getByText('Clear'))
+    expect(editor().value).toBe('')
+    expect(screen.queryByText('alice')).toBeNull()
+    expect(screen.getByText('Click a table to browse, or write a query')).toBeTruthy()
+  })
+
+  it('truncates long SQL in the history panel', async () => {
+    const { api } = await renderConnected()
+    const longSql = 'SELECT ' + 'x'.repeat(250)
+    await runSql(api, longSql)
+    fireEvent.click(screen.getByText('History'))
+    expect(screen.getByText((t) => t.endsWith('…') && t.startsWith('SELECT '))).toBeTruthy()
+  })
+})
+
+describe('DatabaseExplorer — results grid', () => {
+  const sortResult = {
+    columns: ['id', 'name'],
+    rows: [
+      { id: 2, name: 'bob' },
+      { id: 1, name: 'alice' },
+      { id: 3, name: null },
+    ],
+    rowCount: 3,
+    duration: 5,
+  }
+
+  function orderOf(container: HTMLElement, a: string, b: string) {
+    const t = container.textContent!
+    return t.indexOf(a) < t.indexOf(b)
+  }
+
+  it('sorts by column ascending, descending, and numerically', async () => {
+    const { api, container } = await renderConnected({}, {
+      query: vi.fn().mockResolvedValue(sortResult),
+    })
+    await runSql(api, 'SELECT * FROM t')
+    await screen.findByText('alice')
+    // unsorted: bob first
+    expect(orderOf(container, 'bob', 'alice')).toBe(true)
+    // sort by name asc
+    fireEvent.click(screen.getByText('name'))
+    expect(orderOf(container, 'alice', 'bob')).toBe(true)
+    // sort by name desc
+    fireEvent.click(screen.getByText('name'))
+    expect(orderOf(container, 'bob', 'alice')).toBe(true)
+    // numeric sort by id asc
+    fireEvent.click(screen.getByText('id'))
+    expect(orderOf(container, 'alice', 'bob')).toBe(true)
+  })
+
+  it('selects rows via click and Enter/Space keydown and shows the detail panel', async () => {
+    const { api } = await renderConnected()
+    await runSql(api, 'SELECT * FROM users')
+    const aliceRow = (await screen.findByText('alice')).closest('div.grid') as HTMLElement
+    fireEvent.click(aliceRow)
+    fireEvent.click(screen.getByTitle('Row detail'))
+    const detail = screen.getByText('Row 1').parentElement!.parentElement as HTMLElement
+    // objects render as one JSON.stringify'd <pre> text node
+    expect(within(detail).getByText(/"role": "admin"/)).toBeTruthy()
+    // deselect via click hides the panel content (getDetailRow returns null)
+    fireEvent.click(aliceRow)
+    expect(screen.queryByText('Row 1')).toBeNull()
+    // select bob via Enter key: NULL meta shown in detail
+    const bobRow = screen.getByText('bob').closest('div.grid') as HTMLElement
+    fireEvent.keyDown(bobRow, { key: 'Enter' })
+    await screen.findByText('Row 2')
+    // deselect via Space key
+    fireEvent.keyDown(bobRow, { key: ' ' })
+    expect(screen.queryByText('Row 2')).toBeNull()
+    // close button
+    fireEvent.keyDown(aliceRow, { key: 'Enter' })
+    const panel = await screen.findByText('Row 1')
+    fireEvent.click(panel.parentElement!.querySelector('button')!)
+    expect(screen.queryByText('Row 1')).toBeNull()
+  })
+
+  it('renders smart cells: URL, hex color, ISO date, boolean, JSON string and expandable object', async () => {
+    const rich = {
+      columns: ['id', 'site', 'color', 'created', 'active', 'meta', 'note', 'empty'],
+      rows: [{
+        id: 1,
+        site: 'https://example.com/page',
+        color: '#ff0000',
+        created: '2024-03-05T10:00:00Z',
+        active: true,
+        meta: { role: 'admin' },
+        note: '[1,2]',
+        empty: null,
+      }],
+      rowCount: 1,
+      duration: 2,
+    }
+    const { api } = await renderConnected({}, { query: vi.fn().mockResolvedValue(rich) })
+    await runSql(api, 'SELECT * FROM rich')
+    // URL link
+    const link = await screen.findByText('https://example.com/page')
+    expect(link.getAttribute('href')).toBe('https://example.com/page')
+    // hex color swatch
+    expect(screen.getByText('#ff0000')).toBeTruthy()
+    // boolean
+    expect(screen.getByText('true')).toBeTruthy()
+    // NULL cell
+    expect(screen.getByText('NULL')).toBeTruthy()
+    // ISO date renders relative time
+    expect(screen.getByText(/\(.*ago\)/)).toBeTruthy()
+    // JSON object cell: badge with key count, expand and collapse
+    const objBadge = screen.getByText('{1}').closest('button')!
+    fireEvent.click(objBadge)
+    expect(screen.getByText(/"role": "admin"/)).toBeTruthy()
+    fireEvent.click(objBadge)
+    expect(screen.queryByText(/"role": "admin"/)).toBeNull()
+    // JSON string cell: array badge
+    expect(screen.getByText('[2]')).toBeTruthy()
+  })
+
+  it('copies results as TSV and exports CSV with escaping', async () => {
+    const res = {
+      columns: ['id', 'name'],
+      rows: [
+        { id: 1, name: 'has,comma' },
+        { id: 2, name: null },
+        { id: 3, name: 'has"quote' },
+      ],
+      rowCount: 3,
+      duration: 1,
+    }
+    const { api } = await renderConnected({}, { query: vi.fn().mockResolvedValue(res) })
+    await runSql(api, 'SELECT * FROM t')
+    await screen.findByText('has,comma')
+    fireEvent.click(screen.getByTitle('Copy'))
+    expect((navigator.clipboard.writeText as any)).toHaveBeenCalledWith(
+      'id\tname\n1\thas,comma\n2\t\n3\thas"quote'
+    )
+    await screen.findByText('Copied')
+    fireEvent.click(screen.getByTitle('CSV'))
+    expect((URL as any).createObjectURL).toHaveBeenCalled()
+    const blob: Blob = (URL as any).createObjectURL.mock.calls[0][0]
+    const text = await blob.text()
+    expect(text).toBe('id,name\n1,"has,comma"\n2,\n3,"has""quote"')
+    await screen.findByText('Exported')
+  })
+
+  it('resizes the editor with the drag handle', async () => {
+    const { container } = await renderConnected()
+    const handle = container.querySelector('.cursor-row-resize') as HTMLElement
+    const editorWrap = editor().parentElement as HTMLElement
+    expect(editorWrap.style.height).toBe('120px')
+    fireEvent.mouseDown(handle, { clientY: 100 })
+    fireEvent.mouseMove(window, { clientY: 180 })
+    expect(editorWrap.style.height).toBe('200px')
+    fireEvent.mouseUp(window)
+    fireEvent.mouseMove(window, { clientY: 400 })
+    expect(editorWrap.style.height).toBe('200px')
+  })
+})
+
+describe('DatabaseExplorer — cell editing', () => {
+  async function browseUsers(dbOverrides: Record<string, any> = {}) {
+    const ctx = await renderConnected({}, dbOverrides)
+    fireEvent.click(screen.getByText('users'))
+    await screen.findByText('alice')
+    return ctx
+  }
+
+  it('edits a cell (object value uses JSON.stringify) and issues an UPDATE', async () => {
+    const { api } = await browseUsers()
+    const metaBadge = screen.getByText('{1}').closest('div')!
+    fireEvent.doubleClick(metaBadge)
+    const input = await screen.findByDisplayValue('{"role":"admin"}')
+    fireEvent.change(input, { target: { value: '{"role":"user"}' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    await waitFor(() =>
+      expect(api.database.query).toHaveBeenCalledWith(
+        'db-1',
+        'UPDATE "users" SET "meta" = $1 WHERE "id" = $2',
+        ['{"role":"user"}', 1],
+      )
+    )
+    await screen.findByText('Updated')
+  })
+
+  it('sets NULL when the edit value is emptied, binding a string pk', async () => {
+    const res = {
+      columns: ['code', 'label'],
+      rows: [{ code: "o'k", label: 'old' }],
+      rowCount: 1,
+      duration: 1,
+    }
+    const query = vi.fn().mockResolvedValue(res)
+    const { api } = await renderConnected({}, { query })
+    fireEvent.click(screen.getByText('users'))
+    const cell = await screen.findByText('old')
+    fireEvent.doubleClick(cell)
+    const input = await screen.findByDisplayValue('old')
+    fireEvent.change(input, { target: { value: '' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    await waitFor(() =>
+      expect(api.database.query).toHaveBeenCalledWith(
+        'db-1',
+        'UPDATE "users" SET "label" = $1 WHERE "code" = $2',
+        [null, "o'k"],
+      )
+    )
+    await screen.findByText('NULL')
+  })
+
+  it('skips the UPDATE when the value is unchanged and cancels on Escape', async () => {
+    const { api } = await browseUsers()
+    const callsBefore = api.database.query.mock.calls.length
+    const cell = screen.getByText('alice')
+    fireEvent.doubleClick(cell)
+    const input = await screen.findByDisplayValue('alice')
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(api.database.query.mock.calls).toHaveLength(callsBefore)
+    // escape path
+    fireEvent.doubleClick(screen.getByText('bob'))
+    const input2 = await screen.findByDisplayValue('bob')
+    fireEvent.keyDown(input2, { key: 'Escape' })
+    await waitFor(() => expect(screen.queryByDisplayValue('bob')).toBeNull())
+    expect(api.database.query.mock.calls).toHaveLength(callsBefore)
+  })
+
+  it('toasts when no primary key identifies the row', async () => {
+    const res = {
+      columns: ['id', 'name'],
+      rows: [{ id: null, name: 'orphan' }],
+      rowCount: 1,
+      duration: 1,
+    }
+    await renderConnected({}, { query: vi.fn().mockResolvedValue(res) })
+    fireEvent.click(screen.getByText('users'))
+    const cell = await screen.findByText('orphan')
+    fireEvent.doubleClick(cell)
+    const input = await screen.findByDisplayValue('orphan')
+    fireEvent.change(input, { target: { value: 'renamed' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(await screen.findByText('No primary key to identify row')).toBeTruthy()
+  })
+
+  it('toasts when the UPDATE fails', async () => {
+    const query = vi.fn().mockImplementation((_id: string, q: string) =>
+      q.startsWith('UPDATE')
+        ? Promise.reject(new Error('permission denied'))
+        : Promise.resolve(usersResult)
+    )
+    await browseUsers({ query })
+    fireEvent.doubleClick(screen.getByText('alice'))
+    const input = await screen.findByDisplayValue('alice')
+    fireEvent.change(input, { target: { value: 'alicia' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(await screen.findByText('Update failed: permission denied')).toBeTruthy()
+  })
+
+  it('does not open the editor when results did not come from browsing a table', async () => {
+    const { api } = await renderConnected()
+    await runSql(api, 'SELECT * FROM users')
+    const cell = await screen.findByText('alice')
+    fireEvent.doubleClick(cell)
+    expect(screen.queryByDisplayValue('alice')).toBeNull()
+  })
+})
+
+describe('DatabaseExplorer — explain', () => {
+  const pgPlan = {
+    'Node Type': 'Seq Scan',
+    'Relation Name': 'users',
+    'Total Cost': 100,
+    'Plan Rows': 50,
+    'Plan Width': 8,
+    'Actual Total Time': 1.23,
+    'Actual Rows': 48,
+    Plans: [
+      { 'Node Type': 'Index Scan', 'Total Cost': 30, 'Plan Rows': 10 },
+      { 'Node Type': 'Sort', 'Total Cost': 80, 'Plan Rows': 20 },
+    ],
+  }
+
+  it('shows the empty explain panel hint', async () => {
+    await renderConnected()
+    fireEvent.click(screen.getAllByText('Explain')[1])
+    expect(screen.getByText(/to visualize the execution plan/)).toBeTruthy()
+  })
+
+  it('runs EXPLAIN for postgres and renders the plan tree', async () => {
+    const query = vi.fn().mockImplementation((_id: string, q: string) =>
+      q.startsWith('EXPLAIN')
+        ? Promise.resolve({ columns: ['QUERY PLAN'], rows: [{ 'QUERY PLAN': [{ Plan: pgPlan }] }], rowCount: 1, duration: 4 })
+        : Promise.resolve(usersResult)
+    )
+    const { api } = await renderConnected({}, { query })
+    fireEvent.change(editor(), { target: { value: 'SELECT * FROM users' } })
+    fireEvent.click(screen.getByTitle('Visualize query execution plan'))
+    await screen.findByText('Seq Scan')
+    expect(api.database.query).toHaveBeenCalledWith(
+      'db-1',
+      'EXPLAIN (FORMAT JSON, ANALYZE, BUFFERS) SELECT * FROM users'
+    )
+    expect(screen.getByText('on users')).toBeTruthy()
+    expect(screen.getByText('cost 100.0')).toBeTruthy()
+    expect(screen.getByText('est. 50 rows')).toBeTruthy()
+    expect(screen.getByText('width 8')).toBeTruthy()
+    expect(screen.getByText('actual 1.23ms')).toBeTruthy()
+    expect(screen.getByText('actual 48 rows')).toBeTruthy()
+    expect(screen.getByText('Index Scan')).toBeTruthy()
+    expect(screen.getByText('Sort')).toBeTruthy()
+    // collapse root node hides children
+    const rootRow = screen.getByText('Seq Scan').closest('.group') as HTMLElement
+    fireEvent.click(rootRow.querySelector('button')!)
+    expect(screen.queryByText('Index Scan')).toBeNull()
+  })
+
+  it('runs EXPLAIN FORMAT=JSON for mysql sessions', async () => {
+    const mysqlPlan = { nodeType: 'table_scan', totalCost: 5, planRows: 3 }
+    const query = vi.fn().mockImplementation((_id: string, q: string) =>
+      q.startsWith('EXPLAIN')
+        ? Promise.resolve({ columns: ['EXPLAIN'], rows: [{ EXPLAIN: JSON.stringify(mysqlPlan) }], rowCount: 1, duration: 2 })
+        : Promise.resolve(usersResult)
+    )
+    const { api } = await renderConnected({ dbType: 'mysql' }, { query })
+    expect(screen.getByText(/MySQL ·/)).toBeTruthy()
+    fireEvent.change(editor(), { target: { value: 'SELECT 1' } })
+    fireEvent.click(screen.getByTitle('Visualize query execution plan'))
+    await screen.findByText('table_scan')
+    expect(api.database.query).toHaveBeenCalledWith('db-1', 'EXPLAIN FORMAT=JSON SELECT 1')
+    expect(screen.getByText('cost 5.0')).toBeTruthy()
+  })
+
+  it('toasts when explain fails', async () => {
+    const query = vi.fn().mockRejectedValue(new Error('cannot explain'))
+    await renderConnected({}, { query })
+    fireEvent.change(editor(), { target: { value: 'SELECT 1' } })
+    fireEvent.click(screen.getByTitle('Visualize query execution plan'))
+    expect(await screen.findByText('Explain failed: cannot explain')).toBeTruthy()
+  })
+})
+
+describe('DatabaseExplorer — watch mode', () => {
+  it('polls the query on an interval, highlights changed and added cells, then clears', async () => {
+    let call = 0
+    const base = { columns: ['id', 'name'], rowCount: 1, duration: 1 }
+    const query = vi.fn().mockImplementation(() => {
+      call += 1
+      if (call <= 1) return Promise.resolve({ ...base, rows: [{ id: 1, name: 'alice' }] })
+      if (call === 2) return Promise.resolve({ ...base, rows: [{ id: 1, name: 'alicia' }] })
+      return Promise.resolve({ ...base, rows: [{ id: 1, name: 'alicia' }, { id: 2, name: 'bob' }], rowCount: 2 })
+    })
+    const { api } = await renderConnected({}, { query })
+    await runSql(api, 'SELECT * FROM users')
+    await screen.findByText('alice')
+
+    vi.useFakeTimers()
+    // pick a 2s interval
+    fireEvent.change(screen.getByDisplayValue('5s'), { target: { value: '2' } })
+    fireEvent.click(screen.getByText('Watch'))
+    expect(screen.getByText('2s')).toBeTruthy()
+
+    // countdown ticks down
+    await act(async () => { await vi.advanceTimersByTimeAsync(1000) })
+    expect(screen.getByText('1s')).toBeTruthy()
+
+    // first tick: changed cell highlighted
+    await act(async () => { await vi.advanceTimersByTimeAsync(1000) })
+    const changed = screen.getByText('alicia').closest('div') as HTMLElement
+    expect(changed.style.background).toContain('245')
+
+    // highlight clears after 3s (next tick at 4s adds a row first)
+    await act(async () => { await vi.advanceTimersByTimeAsync(2000) })
+    // findBy* hangs under fake timers — the advance above already flushed the tick
+    const added = screen.getByText('bob').closest('div') as HTMLElement
+    expect(added.style.background).toContain('245')
+
+    // stop watching
+    fireEvent.click(screen.getByText('Stop'))
+    expect(screen.getByText('Watch')).toBeTruthy()
+    const callsAfterStop = api.database.query.mock.calls.length
+    await act(async () => { await vi.advanceTimersByTimeAsync(6000) })
+    expect(api.database.query.mock.calls).toHaveLength(callsAfterStop)
+    expect((screen.getByText('bob').closest('div') as HTMLElement).style.background).not.toContain('245')
+  })
+
+  it('keeps polling silently through query errors and clears timers on unmount', async () => {
+    let calls = 0
+    const query = vi.fn().mockImplementation(() => {
+      calls += 1
+      return calls === 2 ? Promise.reject(new Error('boom')) : Promise.resolve(usersResult)
+    })
+    const { api, unmount } = await renderConnected({}, { query })
+    await runSql(api, 'SELECT * FROM users')
+    await screen.findByText('alice')
+
+    vi.useFakeTimers()
+    fireEvent.click(screen.getByText('Watch'))
+    await act(async () => { await vi.advanceTimersByTimeAsync(5000) })
+    // errored tick is silent — results still shown
+    expect(screen.getByText('alice')).toBeTruthy()
+    await act(async () => { await vi.advanceTimersByTimeAsync(5000) })
+    expect(api.database.query.mock.calls.length).toBeGreaterThanOrEqual(3)
+    // unmount while watch is active clears intervals
+    unmount()
+    const after = api.database.query.mock.calls.length
+    await act(async () => { await vi.advanceTimersByTimeAsync(10000) })
+    expect(api.database.query.mock.calls).toHaveLength(after)
+  })
+})
diff --git a/src/renderer/src/components/Docker/DockerDashboard.tsx b/src/renderer/src/components/Docker/DockerDashboard.tsx
index 6073b9b..96b5819 100644
--- a/src/renderer/src/components/Docker/DockerDashboard.tsx
+++ b/src/renderer/src/components/Docker/DockerDashboard.tsx
@@ -4,6 +4,7 @@ import {
   Boxes, AlertTriangle, ChevronRight, ChevronDown, HardDrive,
 } from 'lucide-react'
 import { useAppStore, Tab } from '../../store'
+import { containerStateColor } from '../../lib/colors'
 import DockerLogsModal from './DockerLogsModal'
 
 interface ContainerRow {
@@ -259,16 +260,16 @@ export default function DockerDashboard({ tab }: Props) {
   )
 }
 
-function ContainerTableRow({ container, stat, last, busy, onAction, onLogs }: {
+function ContainerTableRow({ container, stat, last, busy, onAction, onLogs }: Readonly<{
   container: ContainerRow
   stat?: StatsRow
   last: boolean
   busy: boolean
   onAction: (action: 'start' | 'stop' | 'restart' | 'rm') => void
   onLogs: () => void
-}) {
+}>) {
   const isRunning = container.State === 'running'
-  const stateColor = isRunning ? '#10B981' : container.State === 'exited' ? 'var(--nox-text-3)' : '#F59E0B'
+  const stateColor = containerStateColor(container.State)
 
   return (
     <tr
@@ -322,12 +323,12 @@ function ContainerTableRow({ container, stat, last, busy, onAction, onLogs }: {
   )
 }
 
-function RowAction({ title, onClick, danger, children }: {
+function RowAction({ title, onClick, danger, children }: Readonly<{
   title: string
   onClick: () => void
   danger?: boolean
   children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       title={title}
diff --git a/src/renderer/src/components/Docker/DockerLogsModal.tsx b/src/renderer/src/components/Docker/DockerLogsModal.tsx
index c69e60d..72147d7 100644
--- a/src/renderer/src/components/Docker/DockerLogsModal.tsx
+++ b/src/renderer/src/components/Docker/DockerLogsModal.tsx
@@ -87,7 +87,7 @@ export default function DockerLogsModal({ dockerId, containerName, containerId,
           <div className="ml-auto flex items-center gap-2">
             <select
               value={tail}
-              onChange={e => setTail(parseInt(e.target.value))}
+              onChange={e => setTail(Number.parseInt(e.target.value))}
               className="rounded px-2 py-1 text-[11px] font-mono focus:outline-none"
               style={{ background: 'rgba(255,255,255,0.06)', color: 'rgba(255,255,255,0.7)', border: '1px solid rgba(255,255,255,0.1)' }}
             >
diff --git a/src/renderer/src/components/Docker/__tests__/DockerDashboard.test.tsx b/src/renderer/src/components/Docker/__tests__/DockerDashboard.test.tsx
new file mode 100644
index 0000000..45c9950
--- /dev/null
+++ b/src/renderer/src/components/Docker/__tests__/DockerDashboard.test.tsx
@@ -0,0 +1,67 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import DockerDashboard from '../DockerDashboard'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+
+const containers = [
+  { ID: 'c1', Names: 'web', Image: 'nginx:latest', State: 'running', Status: 'Up 2 hours', Ports: '80/tcp' },
+  { ID: 'c2', Names: 'worker', Image: 'app:1', State: 'exited', Status: 'Exited (0)', Ports: '' },
+  { ID: 'c3', Names: 'flaky', Image: 'app:2', State: 'restarting', Status: 'Restarting', Ports: '' },
+]
+
+const stats = [{ Name: 'web', CPUPerc: '3.14%', MemUsage: '120MiB / 1GiB' }]
+
+let api: WindowApiMock
+
+describe('DockerDashboard', () => {
+  beforeEach(() => {
+    api = installWindowApi({
+      docker: {
+        containers: vi.fn().mockResolvedValue(containers),
+        stats: vi.fn().mockResolvedValue(stats),
+        images: vi.fn().mockResolvedValue([]),
+      },
+    })
+    const session = makeSession({ id: 'ssh-1', label: 'Host', host: 'h1.example.com' })
+    seedStore({ sessions: [session], tabs: [], notifications: [] })
+  })
+
+  function renderDashboard() {
+    const tab = makeTab({ view: 'docker', sessionId: 'ssh-1', status: 'connected' })
+    return render(<DockerDashboard tab={tab} />)
+  }
+
+  it('lists containers with per-state coloring once connected', async () => {
+    renderDashboard()
+    expect(screen.getByText('Connecting over SSH…')).toBeTruthy()
+
+    await waitFor(() => expect(screen.getByText('web')).toBeTruthy())
+    expect(screen.getByText('worker')).toBeTruthy()
+    expect(screen.getByText('flaky')).toBeTruthy()
+
+    // running → green, exited → muted, anything else → amber
+    expect((screen.getByText('Up 2 hours') as HTMLElement).style.color).toBe('rgb(16, 185, 129)')
+    expect((screen.getByText('Exited (0)') as HTMLElement).style.color).toBe('var(--nox-text-3)')
+    expect((screen.getByText('Restarting') as HTMLElement).style.color).toBe('rgb(245, 158, 11)')
+
+    // Running container shows stats
+    expect(screen.getByText('3.14%')).toBeTruthy()
+    expect(screen.getByText('1 running / 3 containers', { exact: false })).toBeTruthy()
+  })
+
+  it('starts a stopped container through the row action', async () => {
+    renderDashboard()
+    await waitFor(() => expect(screen.getByText('worker')).toBeTruthy())
+
+    fireEvent.click(screen.getAllByTitle('Start')[0])
+    await waitFor(() => expect(api.docker.action).toHaveBeenCalledWith('docker-1', 'c2', 'start'))
+  })
+
+  it('surfaces connection failures', async () => {
+    api.docker.connect.mockRejectedValueOnce(new Error('no docker daemon'))
+    renderDashboard()
+    await waitFor(() => expect(screen.getByText('Docker unavailable')).toBeTruthy())
+    expect(screen.getByText('no docker daemon')).toBeTruthy()
+  })
+})
diff --git a/src/renderer/src/components/Editor/EditorTab.tsx b/src/renderer/src/components/Editor/EditorTab.tsx
index ab52dd9..4acf269 100644
--- a/src/renderer/src/components/Editor/EditorTab.tsx
+++ b/src/renderer/src/components/Editor/EditorTab.tsx
@@ -5,7 +5,7 @@ import { ipcErrorMessage } from '../../lib/format'
 import { connectSftp } from '../../lib/sftpConnect'
 import CodeEditor from './CodeEditor'
 
-export default function EditorTab({ tab }: { tab: Tab }) {
+export default function EditorTab({ tab }: Readonly<{ tab: Tab }>) {
   const sessions = useAppStore(s => s.sessions)
   const updateTab = useAppStore(s => s.updateTab)
   const addNotification = useAppStore(s => s.addNotification)
@@ -20,7 +20,7 @@ export default function EditorTab({ tab }: { tab: Tab }) {
   const clientRef = useRef<string | null>(null)
   const contentRef = useRef<string>('')
   // Latest save() lives in a ref so the global Cmd+S listener never goes stale
-  const saveRef = useRef<() => void>(() => {})
+  const saveRef = useRef<() => Promise<void> | void>(() => {})
 
   const isRemote = file?.source === 'remote'
 
@@ -157,14 +157,21 @@ export default function EditorTab({ tab }: { tab: Tab }) {
             : { color: 'var(--nox-text-3)', border: '1px solid transparent' }}
         >
           {saving ? <Loader2 className="w-3 h-3 animate-spin" /> : <Save className="w-3 h-3" />}
-          {saving ? 'Saving' : tab.isDirty ? 'Save' : 'Saved'}
+          {saveLabel(saving, !!tab.isDirty)}
         </button>
       </div>
 
       {/* Body */}
-      {loading && content === null ? (
-        <CenteredMessage icon={<Loader2 className="w-5 h-5 animate-spin" style={{ color: '#3B5CCC' }} />} />
-      ) : error ? (
+      {renderBody(file.path)}
+    </div>
+  )
+
+  function renderBody(filePath: string) {
+    if (loading && content === null) {
+      return <CenteredMessage icon={<Loader2 className="w-5 h-5 animate-spin" style={{ color: '#3B5CCC' }} />} />
+    }
+    if (error) {
+      return (
         <div className="flex-1 flex items-center justify-center">
           <div className="text-center max-w-sm px-6">
             <AlertTriangle className="w-6 h-6 mx-auto mb-2" style={{ color: '#EF4444' }} />
@@ -178,21 +185,27 @@ export default function EditorTab({ tab }: { tab: Tab }) {
             </button>
           </div>
         </div>
-      ) : (
-        <div className="flex-1 min-h-0">
-          <CodeEditor
-            value={content ?? ''}
-            filename={file.path}
-            onChange={handleChange}
-            onSave={save}
-          />
-        </div>
-      )}
-    </div>
-  )
+      )
+    }
+    return (
+      <div className="flex-1 min-h-0">
+        <CodeEditor
+          value={content ?? ''}
+          filename={filePath}
+          onChange={handleChange}
+          onSave={save}
+        />
+      </div>
+    )
+  }
+}
+
+function saveLabel(saving: boolean, dirty: boolean): string {
+  if (saving) return 'Saving'
+  return dirty ? 'Save' : 'Saved'
 }
 
-function CenteredMessage({ icon, text }: { icon: React.ReactNode; text?: string }) {
+function CenteredMessage({ icon, text }: Readonly<{ icon: React.ReactNode; text?: string }>) {
   return (
     <div className="flex-1 flex flex-col items-center justify-center gap-2 h-full">
       {icon}
diff --git a/src/renderer/src/components/Editor/__tests__/EditorTab.test.tsx b/src/renderer/src/components/Editor/__tests__/EditorTab.test.tsx
new file mode 100644
index 0000000..b5b34e4
--- /dev/null
+++ b/src/renderer/src/components/Editor/__tests__/EditorTab.test.tsx
@@ -0,0 +1,137 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import EditorTab from '../EditorTab'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore, Tab } from '../../../store'
+
+// CodeMirror is far too heavy for jsdom — stub it with hooks into the props.
+vi.mock('../CodeEditor', () => ({
+  default: ({ value, onChange, onSave }: { value: string; onChange: (v: string) => void; onSave: () => void }) => (
+    <div data-testid="code-editor">
+      <span data-testid="editor-value">{value}</span>
+      <button data-testid="editor-change" onClick={() => onChange('changed content')}>change</button>
+      <button data-testid="editor-save" onClick={onSave}>save</button>
+    </div>
+  ),
+}))
+
+let api: WindowApiMock
+
+function localTab(overrides: Partial<Tab> = {}): Tab {
+  return makeTab({
+    id: 'ed-1',
+    view: 'editor',
+    label: 'notes.md',
+    editorFile: { source: 'local', path: '/home/user/notes.md' },
+    ...overrides,
+  })
+}
+
+describe('EditorTab', () => {
+  beforeEach(() => {
+    api = installWindowApi({
+      localfs: { readTextFile: vi.fn().mockResolvedValue('hello world') },
+    })
+    seedStore({ sessions: [], tabs: [], activeTabId: null, notifications: [] })
+  })
+
+  it('shows a message when the tab has no file', () => {
+    render(<EditorTab tab={makeTab({ view: 'editor' })} />)
+    expect(screen.getByText('This editor tab has no file associated with it')).toBeTruthy()
+  })
+
+  it('loads a local file into the editor and shows Saved when clean', async () => {
+    const tab = localTab()
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<EditorTab tab={tab} />)
+
+    await waitFor(() => expect(screen.getByTestId('editor-value').textContent).toBe('hello world'))
+    expect(screen.getByText('Saved')).toBeTruthy()
+    expect(screen.getByText('local')).toBeTruthy()
+    expect(screen.getByText('/home/user/notes.md')).toBeTruthy()
+  })
+
+  it('marks the tab dirty when the editor content changes', async () => {
+    const tab = localTab()
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<EditorTab tab={tab} />)
+    await waitFor(() => expect(screen.getByTestId('code-editor')).toBeTruthy())
+
+    fireEvent.click(screen.getByTestId('editor-change'))
+    expect(useAppStore.getState().tabs[0].isDirty).toBe(true)
+  })
+
+  it('saves through the header button, flipping Save → Saving → clean', async () => {
+    const tab = localTab({ isDirty: true })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+
+    let resolveWrite: () => void = () => {}
+    api.localfs.writeTextFile.mockReturnValueOnce(new Promise<void>(res => { resolveWrite = res }))
+
+    render(<EditorTab tab={tab} />)
+    await waitFor(() => expect(screen.getByTestId('code-editor')).toBeTruthy())
+
+    fireEvent.click(screen.getByText('Save'))
+    await waitFor(() => expect(screen.getByText('Saving')).toBeTruthy())
+
+    resolveWrite()
+    await waitFor(() => expect(useAppStore.getState().tabs[0].isDirty).toBe(false))
+    expect(api.localfs.writeTextFile).toHaveBeenCalledWith('/home/user/notes.md', 'hello world')
+  })
+
+  it('saves via Cmd+S when the tab is active', async () => {
+    const tab = localTab({ isDirty: true })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<EditorTab tab={tab} />)
+    await waitFor(() => expect(screen.getByTestId('code-editor')).toBeTruthy())
+
+    fireEvent.keyDown(window, { key: 's', metaKey: true })
+    await waitFor(() => expect(api.localfs.writeTextFile).toHaveBeenCalled())
+  })
+
+  it('reports save failures as notifications', async () => {
+    const tab = localTab({ isDirty: true })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    api.localfs.writeTextFile.mockRejectedValueOnce(new Error('disk full'))
+
+    render(<EditorTab tab={tab} />)
+    await waitFor(() => expect(screen.getByTestId('code-editor')).toBeTruthy())
+
+    fireEvent.click(screen.getByText('Save'))
+    await waitFor(() => {
+      const notes = useAppStore.getState().notifications
+      expect(notes.some(n => n.message.includes('disk full'))).toBe(true)
+    })
+  })
+
+  it('shows the error state with retry when loading fails', async () => {
+    api.localfs.readTextFile
+      .mockRejectedValueOnce(new Error('no such file'))
+      .mockResolvedValueOnce('recovered')
+    const tab = localTab()
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<EditorTab tab={tab} />)
+
+    await waitFor(() => expect(screen.getByText('no such file')).toBeTruthy())
+    expect(useAppStore.getState().tabs[0].status).toBe('error')
+
+    fireEvent.click(screen.getByText('Retry'))
+    await waitFor(() => expect(screen.getByTestId('editor-value').textContent).toBe('recovered'))
+  })
+
+  it('opens remote files over the terminal SFTP stream', async () => {
+    const session = makeSession({ id: 'srv-1', host: 'remote.example.com' })
+    api.sftp.readFile.mockResolvedValue('remote text')
+    const tab = makeTab({
+      id: 'ed-2', view: 'editor', label: 'app.conf', sessionId: 'srv-1', streamId: 'stream-7',
+      editorFile: { source: 'remote', path: '/etc/app.conf' },
+    })
+    seedStore({ sessions: [session], tabs: [tab], activeTabId: tab.id })
+
+    render(<EditorTab tab={tab} />)
+    await waitFor(() => expect(screen.getByTestId('editor-value').textContent).toBe('remote text'))
+    expect(screen.getByText('remote.example.com')).toBeTruthy()
+    expect(api.sftp.connect).toHaveBeenCalledWith(expect.objectContaining({ streamId: 'stream-7' }))
+  })
+})
diff --git a/src/renderer/src/components/K8s/K8sDashboard.tsx b/src/renderer/src/components/K8s/K8sDashboard.tsx
index 3f79dad..3eefaf3 100644
--- a/src/renderer/src/components/K8s/K8sDashboard.tsx
+++ b/src/renderer/src/components/K8s/K8sDashboard.tsx
@@ -25,7 +25,25 @@ interface DetailTarget { kind: string; name: string } // singular kind for IPC
 interface ScaleTarget { name: string; current: number }
 interface DeleteTarget { kind: ResourceKind; name: string }
 
-export default function K8sDashboard({ context, kubeconfigPath, tabId }: { context: string; kubeconfigPath?: string; tabId?: string }) {
+function restartsColor(restarts: number): string {
+  if (restarts > 5) return '#EF4444'
+  if (restarts > 0) return '#F59E0B'
+  return 'var(--nox-text-2)'
+}
+
+function jobDotColor(j: { failed: number; active: number }): string {
+  if (j.failed > 0) return '#EF4444'
+  if (j.active > 0) return '#F59E0B'
+  return '#10B981'
+}
+
+function connStateOf(error: string | null, loading: boolean, empty: boolean): { label: string; color: string } {
+  if (error) return { label: 'Connection error', color: '#EF4444' }
+  if (loading && empty) return { label: 'Loading…', color: '#F59E0B' }
+  return { label: 'Connected', color: '#10B981' }
+}
+
+export default function K8sDashboard({ context, kubeconfigPath, tabId }: Readonly<{ context: string; kubeconfigPath?: string; tabId?: string }>) {
   const [namespaces, setNamespaces] = useState<string[]>([])
   const [namespace, setNamespace] = useState('default')
   const [kind, setKind] = useState<ResourceKind>('pods')
@@ -155,11 +173,8 @@ export default function K8sDashboard({ context, kubeconfigPath, tabId }: { conte
     : data
 
   const count = data.length
-  const connState = error
-    ? { label: 'Connection error', color: '#EF4444' }
-    : loading && data.length === 0
-      ? { label: 'Loading…', color: '#F59E0B' }
-      : { label: 'Connected', color: '#10B981' }
+  const connState = connStateOf(error, loading, data.length === 0)
+  const countFor = (k: ResourceKind) => (kind === k ? data.length : undefined)
 
   // Keep the tab-bar dot honest: a failing cluster should not show as connected
   const updateTab = useAppStore(s => s.updateTab)
@@ -242,49 +257,49 @@ export default function K8sDashboard({ context, kubeconfigPath, tabId }: { conte
             {/* Workloads */}
             <SideSection label="Workloads" open={workloadsOpen} onToggle={() => setWorkloadsOpen(o => !o)}>
               <NavItem dot label="Pods"
-                count={kind === 'pods' ? data.length : undefined}
+                count={countFor('pods')}
                 active={kind === 'pods'} onClick={() => switchKind('pods')} />
               <NavItem dot label="Deployments"
-                count={kind === 'deployments' ? data.length : undefined}
+                count={countFor('deployments')}
                 active={kind === 'deployments'} onClick={() => switchKind('deployments')} />
               <NavItem dot label="StatefulSets"
-                count={kind === 'statefulsets' ? data.length : undefined}
+                count={countFor('statefulsets')}
                 active={kind === 'statefulsets'} onClick={() => switchKind('statefulsets')} />
               <NavItem dot label="DaemonSets"
-                count={kind === 'daemonsets' ? data.length : undefined}
+                count={countFor('daemonsets')}
                 active={kind === 'daemonsets'} onClick={() => switchKind('daemonsets')} />
               <NavItem dot label="ReplicaSets"
-                count={kind === 'replicasets' ? data.length : undefined}
+                count={countFor('replicasets')}
                 active={kind === 'replicasets'} onClick={() => switchKind('replicasets')} />
               <NavItem dot label="Jobs"
-                count={kind === 'jobs' ? data.length : undefined}
+                count={countFor('jobs')}
                 active={kind === 'jobs'} onClick={() => switchKind('jobs')} />
               <NavItem dot label="CronJobs"
-                count={kind === 'cronjobs' ? data.length : undefined}
+                count={countFor('cronjobs')}
                 active={kind === 'cronjobs'} onClick={() => switchKind('cronjobs')} />
             </SideSection>
 
             <SideSection label="Network">
               <NavItem dot label="Services"
-                count={kind === 'services' ? data.length : undefined}
+                count={countFor('services')}
                 active={kind === 'services'} onClick={() => switchKind('services')} />
               <NavItem dot label="Ingresses"
-                count={kind === 'ingresses' ? data.length : undefined}
+                count={countFor('ingresses')}
                 active={kind === 'ingresses'} onClick={() => switchKind('ingresses')} />
             </SideSection>
 
             <SideSection label="Config">
               <NavItem dot label="ConfigMaps"
-                count={kind === 'configmaps' ? data.length : undefined}
+                count={countFor('configmaps')}
                 active={kind === 'configmaps'} onClick={() => switchKind('configmaps')} />
               <NavItem dot label="Secrets"
-                count={kind === 'secrets' ? data.length : undefined}
+                count={countFor('secrets')}
                 active={kind === 'secrets'} onClick={() => switchKind('secrets')} />
             </SideSection>
 
             <SideSection label="Infrastructure" collapsed>
               <NavItem icon={<Server className="w-3.5 h-3.5" />} label="Nodes"
-                count={kind === 'nodes' ? data.length : undefined}
+                count={countFor('nodes')}
                 active={kind === 'nodes'} onClick={() => switchKind('nodes')} />
             </SideSection>
           </nav>
@@ -507,12 +522,12 @@ function ResourceTable(props: TableProps) {
 
 // ── Pods ──────────────────────────────────────────────────────────────────────
 
-function PodsTable({ rows, onLogs, onExec, onDetail, onDelete, onPortForward }: TableProps) {
+function PodsTable({ rows, onLogs, onExec, onDetail, onDelete, onPortForward }: Readonly<Pick<TableProps, 'rows' | 'onLogs' | 'onExec' | 'onDetail' | 'onDelete' | 'onPortForward'>>) {
   function promptPortForward(podName: string) {
     const raw = prompt('Container port to forward:')
     if (!raw) return
-    const port = parseInt(raw, 10)
-    if (!isNaN(port) && port >= 1 && port <= 65535) onPortForward(podName, port)
+    const port = Number.parseInt(raw, 10)
+    if (!Number.isNaN(port) && port >= 1 && port <= 65535) onPortForward(podName, port)
   }
   return (
     <table className="w-full">
@@ -534,7 +549,7 @@ function PodsTable({ rows, onLogs, onExec, onDetail, onDelete, onPortForward }:
             <Td><PodStatusBadge status={pod.status} /></Td>
             <Td>
               <span className="font-['JetBrains_Mono'] text-[12px]"
-                style={{ color: pod.restarts > 5 ? '#EF4444' : pod.restarts > 0 ? '#F59E0B' : 'var(--nox-text-2)' }}>
+                style={{ color: restartsColor(pod.restarts) }}>
                 {pod.restarts}
               </span>
             </Td>
@@ -565,7 +580,7 @@ function PodsTable({ rows, onLogs, onExec, onDetail, onDelete, onPortForward }:
 
 // ── Deployments ───────────────────────────────────────────────────────────────
 
-function DeploymentsTable({ rows, onDetail, onScale, onRestart }: TableProps) {
+function DeploymentsTable({ rows, onDetail, onScale, onRestart }: Readonly<Pick<TableProps, 'rows' | 'onDetail' | 'onScale' | 'onRestart'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -576,7 +591,7 @@ function DeploymentsTable({ rows, onDetail, onScale, onRestart }: TableProps) {
       <tbody>
         {rows.map(d => {
           const [ready, total] = d.ready.split('/').map(Number)
-          const healthy = !isNaN(ready) && !isNaN(total) && ready === total
+          const healthy = !Number.isNaN(ready) && !Number.isNaN(total) && ready === total
           return (
             <Tr key={d.name} onClick={() => onDetail({ kind: 'deployment', name: d.name })}>
               <Td>
@@ -608,7 +623,7 @@ function DeploymentsTable({ rows, onDetail, onScale, onRestart }: TableProps) {
 
 // ── StatefulSets ──────────────────────────────────────────────────────────────
 
-function StatefulSetsTable({ rows, onDetail, onScale }: TableProps) {
+function StatefulSetsTable({ rows, onDetail, onScale }: Readonly<Pick<TableProps, 'rows' | 'onDetail' | 'onScale'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -619,7 +634,7 @@ function StatefulSetsTable({ rows, onDetail, onScale }: TableProps) {
       <tbody>
         {rows.map(s => {
           const [ready, total] = s.ready.split('/').map(Number)
-          const healthy = !isNaN(ready) && !isNaN(total) && ready >= total
+          const healthy = !Number.isNaN(ready) && !Number.isNaN(total) && ready >= total
           return (
             <Tr key={s.name} onClick={() => onDetail({ kind: 'statefulset', name: s.name })}>
               <Td>
@@ -645,7 +660,7 @@ function StatefulSetsTable({ rows, onDetail, onScale }: TableProps) {
 
 // ── DaemonSets ────────────────────────────────────────────────────────────────
 
-function DaemonSetsTable({ rows, onDetail }: TableProps) {
+function DaemonSetsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -675,7 +690,7 @@ function DaemonSetsTable({ rows, onDetail }: TableProps) {
 
 // ── ReplicaSets ───────────────────────────────────────────────────────────────
 
-function ReplicaSetsTable({ rows, onDetail }: TableProps) {
+function ReplicaSetsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -704,7 +719,7 @@ function ReplicaSetsTable({ rows, onDetail }: TableProps) {
 
 // ── Jobs ──────────────────────────────────────────────────────────────────────
 
-function JobsTable({ rows, onDetail }: TableProps) {
+function JobsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -717,7 +732,7 @@ function JobsTable({ rows, onDetail }: TableProps) {
           <Tr key={j.name} onClick={() => onDetail({ kind: 'job', name: j.name })}>
             <Td>
               <div className="flex items-center gap-2">
-                <span className="w-1.5 h-1.5 rounded-full" style={{ background: j.failed > 0 ? '#EF4444' : j.active > 0 ? '#F59E0B' : '#10B981' }} />
+                <span className="w-1.5 h-1.5 rounded-full" style={{ background: jobDotColor(j) }} />
                 <Mono>{j.name}</Mono>
               </div>
             </Td>
@@ -734,7 +749,7 @@ function JobsTable({ rows, onDetail }: TableProps) {
 
 // ── CronJobs ──────────────────────────────────────────────────────────────────
 
-function CronJobsTable({ rows, onDetail }: TableProps) {
+function CronJobsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -764,7 +779,7 @@ function CronJobsTable({ rows, onDetail }: TableProps) {
 
 // ── Services ──────────────────────────────────────────────────────────────────
 
-function ServicesTable({ rows, onDetail, onServicePortForward }: TableProps) {
+function ServicesTable({ rows, onDetail, onServicePortForward }: Readonly<Pick<TableProps, 'rows' | 'onDetail' | 'onServicePortForward'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -784,8 +799,8 @@ function ServicesTable({ rows, onDetail, onServicePortForward }: TableProps) {
             <Td align="right" stopPropagation>
               {svc.ports && (
                 <ActionBtn title="Port forward" onClick={() => {
-                  const port = parseInt(svc.ports.split(',')[0])
-                  if (!isNaN(port)) onServicePortForward(svc.name, port)
+                  const port = Number.parseInt(svc.ports.split(',')[0])
+                  if (!Number.isNaN(port)) onServicePortForward(svc.name, port)
                 }}>
                   <ExternalLink className="w-3.5 h-3.5" />
                 </ActionBtn>
@@ -800,7 +815,7 @@ function ServicesTable({ rows, onDetail, onServicePortForward }: TableProps) {
 
 // ── Ingresses ─────────────────────────────────────────────────────────────────
 
-function IngressesTable({ rows, onDetail }: TableProps) {
+function IngressesTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -825,7 +840,7 @@ function IngressesTable({ rows, onDetail }: TableProps) {
 
 // ── ConfigMaps ────────────────────────────────────────────────────────────────
 
-function ConfigMapsTable({ rows, onDetail }: TableProps) {
+function ConfigMapsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -853,7 +868,7 @@ function ConfigMapsTable({ rows, onDetail }: TableProps) {
 
 // ── Secrets ───────────────────────────────────────────────────────────────────
 
-function SecretsTable({ rows, onDetail }: TableProps) {
+function SecretsTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -887,7 +902,7 @@ function SecretsTable({ rows, onDetail }: TableProps) {
 
 // ── Nodes ─────────────────────────────────────────────────────────────────────
 
-function NodesTable({ rows, onDetail }: TableProps) {
+function NodesTable({ rows, onDetail }: Readonly<Pick<TableProps, 'rows' | 'onDetail'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -920,7 +935,7 @@ function NodesTable({ rows, onDetail }: TableProps) {
 
 // ── Events ────────────────────────────────────────────────────────────────────
 
-function EventsTable({ rows }: TableProps) {
+function EventsTable({ rows }: Readonly<Pick<TableProps, 'rows'>>) {
   return (
     <table className="w-full">
       <thead>
@@ -960,7 +975,7 @@ function EventsTable({ rows }: TableProps) {
 
 // ── Scale modal ───────────────────────────────────────────────────────────────
 
-function ScaleModal({ name, current, onConfirm, onClose }: { name: string; current: number; onConfirm: (r: number) => void; onClose: () => void }) {
+function ScaleModal({ name, current, onConfirm, onClose }: Readonly<{ name: string; current: number; onConfirm: (r: number) => void; onClose: () => void }>) {
   const [replicas, setReplicas] = useState(current)
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center" style={{ background: 'rgba(0,0,0,0.6)' }}>
@@ -981,7 +996,7 @@ function ScaleModal({ name, current, onConfirm, onClose }: { name: string; curre
             type="number"
             min={0}
             value={replicas}
-            onChange={e => setReplicas(Math.max(0, parseInt(e.target.value) || 0))}
+            onChange={e => setReplicas(Math.max(0, Number.parseInt(e.target.value) || 0))}
             className="flex-1 text-center rounded-md px-3 py-2 font-['JetBrains_Mono'] text-[16px] font-semibold focus:outline-none focus:ring-2 focus:ring-[#8B5CF6]"
             style={{ background: 'var(--nox-shell)', border: '1px solid var(--nox-border)', color: 'var(--nox-text)' }}
           />
@@ -1016,7 +1031,7 @@ function ScaleModal({ name, current, onConfirm, onClose }: { name: string; curre
 
 // ── Delete modal ──────────────────────────────────────────────────────────────
 
-function DeleteModal({ kind, name, onConfirm, onClose }: { kind: ResourceKind; name: string; onConfirm: () => void; onClose: () => void }) {
+function DeleteModal({ kind, name, onConfirm, onClose }: Readonly<{ kind: ResourceKind; name: string; onConfirm: () => void; onClose: () => void }>) {
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center" style={{ background: 'rgba(0,0,0,0.6)' }}>
       <div className="rounded-xl p-6 w-[360px] shadow-2xl" style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}>
@@ -1050,10 +1065,10 @@ function DeleteModal({ kind, name, onConfirm, onClose }: { kind: ResourceKind; n
 
 // ── Sidebar helpers ───────────────────────────────────────────────────────────
 
-function SideSection({ label, children, open: openProp, onToggle, collapsed }: {
+function SideSection({ label, children, open: openProp, onToggle, collapsed }: Readonly<{
   label: string; children?: React.ReactNode; open?: boolean; onToggle?: () => void; collapsed?: boolean
-}) {
-  const [open, setOpen] = useState(openProp !== undefined ? openProp : !collapsed)
+}>) {
+  const [open, setOpen] = useState(openProp ?? !collapsed)
   const isControlled = openProp !== undefined
   const toggle = () => { if (isControlled) onToggle?.(); else setOpen(o => !o) }
   const isOpen = isControlled ? openProp : open
@@ -1073,9 +1088,9 @@ function SideSection({ label, children, open: openProp, onToggle, collapsed }: {
   )
 }
 
-function NavItem({ icon, dot, label, count, active, onClick, disabled }: {
+function NavItem({ icon, dot, label, count, active, onClick, disabled }: Readonly<{
   icon?: React.ReactNode; dot?: boolean; label: string; count?: number; active: boolean; onClick?: () => void; disabled?: boolean
-}) {
+}>) {
   return (
     <button
       onClick={onClick}
@@ -1110,7 +1125,7 @@ function NavItem({ icon, dot, label, count, active, onClick, disabled }: {
 
 // ── Table primitives ──────────────────────────────────────────────────────────
 
-function Th({ children, align }: { children: React.ReactNode; align?: 'right' }) {
+function Th({ children, align }: Readonly<{ children: React.ReactNode; align?: 'right' }>) {
   return (
     <th className={`px-4 py-2.5 font-['Plus_Jakarta_Sans'] text-[10.5px] uppercase tracking-wider font-semibold ${align === 'right' ? 'text-right' : 'text-left'}`}
       style={{ color: 'var(--nox-text-3)', whiteSpace: 'nowrap' }}>
@@ -1119,7 +1134,7 @@ function Th({ children, align }: { children: React.ReactNode; align?: 'right' })
   )
 }
 
-function Td({ children, align, stopPropagation }: { children: React.ReactNode; align?: 'right'; stopPropagation?: boolean }) {
+function Td({ children, align, stopPropagation }: Readonly<{ children: React.ReactNode; align?: 'right'; stopPropagation?: boolean }>) {
   return (
     <td className={`px-4 py-2.5 ${align === 'right' ? 'text-right' : ''}`}
       style={{ verticalAlign: 'middle' }}
@@ -1129,7 +1144,7 @@ function Td({ children, align, stopPropagation }: { children: React.ReactNode; a
   )
 }
 
-function Tr({ children, onClick }: { children: React.ReactNode; onClick?: () => void }) {
+function Tr({ children, onClick }: Readonly<{ children: React.ReactNode; onClick?: () => void }>) {
   return (
     <tr
       onClick={onClick}
@@ -1143,7 +1158,7 @@ function Tr({ children, onClick }: { children: React.ReactNode; onClick?: () =>
   )
 }
 
-function Mono({ children, color }: { children: React.ReactNode; color?: string }) {
+function Mono({ children, color }: Readonly<{ children: React.ReactNode; color?: string }>) {
   return (
     <span className="font-['JetBrains_Mono'] text-[12px]" style={{ color: color ?? 'var(--nox-text)' }}>
       {children}
@@ -1151,7 +1166,7 @@ function Mono({ children, color }: { children: React.ReactNode; color?: string }
   )
 }
 
-function ActionBtn({ children, title, danger, onClick }: { children: React.ReactNode; title?: string; danger?: boolean; onClick?: () => void }) {
+function ActionBtn({ children, title, danger, onClick }: Readonly<{ children: React.ReactNode; title?: string; danger?: boolean; onClick?: () => void }>) {
   return (
     <button
       className="p-1 rounded transition-colors"
@@ -1168,7 +1183,7 @@ function ActionBtn({ children, title, danger, onClick }: { children: React.React
 
 // ── Status badges ─────────────────────────────────────────────────────────────
 
-function PodStatusBadge({ status }: { status: string }) {
+function PodStatusBadge({ status }: Readonly<{ status: string }>) {
   const color = podStatusColor(status)
   return (
     <span className="inline-flex items-center gap-1.5 px-2 py-0.5 rounded-md font-['Inter'] text-[11.5px] font-medium"
@@ -1179,7 +1194,7 @@ function PodStatusBadge({ status }: { status: string }) {
   )
 }
 
-function ServiceTypeBadge({ type }: { type: string }) {
+function ServiceTypeBadge({ type }: Readonly<{ type: string }>) {
   const colorMap: Record<string, string> = {
     LoadBalancer: '#8B5CF6', NodePort: '#F59E0B', ClusterIP: '#6B7280', ExternalName: '#06b6d4',
   }
@@ -1194,7 +1209,7 @@ function ServiceTypeBadge({ type }: { type: string }) {
 
 // ── Utilities ─────────────────────────────────────────────────────────────────
 
-function AgeCell({ age }: { age: string | null | Date }) {
+function AgeCell({ age }: Readonly<{ age: string | null | Date }>) {
   if (!age) return <span className="font-['Inter'] text-[12px]" style={{ color: 'var(--nox-text-3)' }}>—</span>
   try {
     const date = typeof age === 'string' ? new Date(age) : age
@@ -1224,7 +1239,7 @@ function kindTitle(kind: ResourceKind): string {
   return map[kind] ?? kind
 }
 
-function TableSkeleton({ cols }: { cols: number }) {
+function TableSkeleton({ cols }: Readonly<{ cols: number }>) {
   return (
     <div className="p-5 space-y-2">
       {Array.from({ length: 6 }).map((_, i) => (
@@ -1238,7 +1253,7 @@ function TableSkeleton({ cols }: { cols: number }) {
   )
 }
 
-function EmptyState({ kind }: { kind: ResourceKind }) {
+function EmptyState({ kind }: Readonly<{ kind: ResourceKind }>) {
   return (
     <div className="flex flex-col items-center justify-center py-20 gap-2">
       <div className="w-10 h-10 rounded-xl flex items-center justify-center mb-1"
@@ -1251,7 +1266,7 @@ function EmptyState({ kind }: { kind: ResourceKind }) {
   )
 }
 
-function ErrorBanner({ message, onRetry }: { message: string; onRetry: () => void }) {
+function ErrorBanner({ message, onRetry }: Readonly<{ message: string; onRetry: () => void }>) {
   return (
     <div className="m-5 rounded-md p-4 flex items-start gap-3" style={{ background: 'rgba(239,68,68,0.06)', border: '1px solid rgba(239,68,68,0.25)' }}>
       <AlertTriangle className="w-4 h-4 text-[#EF4444] flex-shrink-0 mt-0.5" />
diff --git a/src/renderer/src/components/K8s/ResourceDetailModal.tsx b/src/renderer/src/components/K8s/ResourceDetailModal.tsx
index 8b98fb8..2f6776a 100644
--- a/src/renderer/src/components/K8s/ResourceDetailModal.tsx
+++ b/src/renderer/src/components/K8s/ResourceDetailModal.tsx
@@ -10,7 +10,68 @@ interface Props {
   onClose: () => void
 }
 
-export default function ResourceDetailModal({ context, namespace, kind, name, kubeconfigPath, onClose }: Props) {
+// JSON token matchers (sticky, tried in order at each position by colorize).
+const STRING_RE = /"(?:\\.|[^\\"])*"/y
+const KEY_SUFFIX_RE = /\s*:/y
+const KEYWORD_RE = /true|false|null/y
+const NUMBER_RE = /-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?/y
+
+function matchAt(re: RegExp, text: string, index: number): string | null {
+  re.lastIndex = index
+  const m = re.exec(text)
+  return m ? m[0] : null
+}
+
+function isWordChar(ch: string | undefined): boolean {
+  return ch !== undefined && /\w/.test(ch)
+}
+
+// Returns the JSON token starting at `index` and its color, or null.
+function tokenAt(text: string, index: number): { text: string; color: string } | null {
+  const str = matchAt(STRING_RE, text, index)
+  if (str) {
+    const keySuffix = matchAt(KEY_SUFFIX_RE, text, index + str.length)
+    if (keySuffix) return { text: str + keySuffix, color: '#9d6ff8' }
+    return { text: str, color: '#10b981' }
+  }
+  if (!isWordChar(text[index - 1])) {
+    const kw = matchAt(KEYWORD_RE, text, index)
+    if (kw && !isWordChar(text[index + kw.length])) {
+      return { text: kw, color: kw === 'null' ? '#EF4444' : '#06b6d4' }
+    }
+  }
+  const num = matchAt(NUMBER_RE, text, index)
+  if (num) return { text: num, color: '#f59e0b' }
+  return null
+}
+
+const HTML_ESCAPES: Record<string, string> = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }
+
+function escapeHtml(text: string): string {
+  return text.replace(/[&<>"']/g, ch => HTML_ESCAPES[ch])
+}
+
+// Simple JSON syntax coloring: single left-to-right pass so already-emitted
+// <span> markup is never re-matched. The result feeds dangerouslySetInnerHTML,
+// so every character of the (untrusted) resource JSON is HTML-escaped — only
+// the generated spans (with colors from the fixed internal set) are markup.
+function colorize(raw: string): string {
+  let out = ''
+  let i = 0
+  while (i < raw.length) {
+    const token = tokenAt(raw, i)
+    if (token) {
+      out += `<span style="color:${token.color}">${escapeHtml(token.text)}</span>`
+      i += token.text.length
+    } else {
+      out += escapeHtml(raw[i])
+      i++
+    }
+  }
+  return out
+}
+
+export default function ResourceDetailModal({ context, namespace, kind, name, kubeconfigPath, onClose }: Readonly<Props>) {
   const [json, setJson] = useState('')
   const [loading, setLoading] = useState(true)
   const [copied, setCopied] = useState(false)
@@ -35,20 +96,6 @@ export default function ResourceDetailModal({ context, namespace, kind, name, ku
     setTimeout(() => setCopied(false), 2000)
   }
 
-  // Simple JSON syntax coloring
-  function colorize(raw: string): string {
-    return raw
-      .replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, (match) => {
-        if (/^"/.test(match)) {
-          if (/:$/.test(match)) return `<span style="color:#9d6ff8">${match}</span>`
-          return `<span style="color:#10b981">${match}</span>`
-        }
-        if (/true|false/.test(match)) return `<span style="color:#06b6d4">${match}</span>`
-        if (/null/.test(match)) return `<span style="color:#EF4444">${match}</span>`
-        return `<span style="color:#f59e0b">${match}</span>`
-      })
-  }
-
   return (
     <div
       className="fixed inset-0 z-50 flex items-center justify-center"
diff --git a/src/renderer/src/components/K8s/__tests__/K8sDashboard.test.tsx b/src/renderer/src/components/K8s/__tests__/K8sDashboard.test.tsx
new file mode 100644
index 0000000..5a1855f
--- /dev/null
+++ b/src/renderer/src/components/K8s/__tests__/K8sDashboard.test.tsx
@@ -0,0 +1,366 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, waitFor, fireEvent, cleanup } from '@testing-library/react'
+import { useAppStore } from '../../../store'
+import { installWindowApi, seedStore, makeTab } from '../../../__tests__/harness'
+
+// Keep the dashboard shallow: the pod modals stream logs / open PTYs, which is
+// out of scope here. Mocking sibling modules inside this test file is allowed.
+vi.mock('../PodLogsModal', () => ({
+  default: ({ pod, onClose }: { pod: string; onClose: () => void }) => (
+    <div>
+      stub-logs:{pod}
+      <button onClick={onClose}>close-logs</button>
+    </div>
+  ),
+}))
+vi.mock('../PodExecModal', () => ({
+  default: ({ pod }: { pod: string }) => <div>stub-exec:{pod}</div>,
+}))
+vi.mock('../ResourceDetailModal', () => ({
+  default: ({ kind, name }: { kind: string; name: string }) => <div>stub-detail:{kind}:{name}</div>,
+}))
+
+import K8sDashboard from '../K8sDashboard'
+
+const now = Date.now()
+const ago = (ms: number) => new Date(now - ms).toISOString()
+
+const PODS = [
+  { name: 'web-1', ready: '1/1', status: 'Running', restarts: 0, age: ago(30_000), node: 'node-a', containers: ['app'] },
+  { name: 'web-2', ready: '1/1', status: 'Running', restarts: 3, age: ago(2 * 3600_000), node: 'node-b', containers: ['app'] },
+  { name: 'crash-pod', ready: '0/1', status: 'CrashLoopBackOff', restarts: 7, age: ago(3 * 86_400_000), node: '', containers: [] },
+]
+const DEPLOYMENTS = [
+  { name: 'api', ready: '2/2', available: 2, age: ago(600_000), replicas: 2 },
+  { name: 'worker', ready: '1/2', available: 1, age: ago(600_000), replicas: 2 },
+]
+const JOBS = [
+  { name: 'ok-job', completions: '1/1', active: 0, failed: 0, age: ago(60_000) },
+  { name: 'active-job', completions: '0/1', active: 1, failed: 0, age: ago(60_000) },
+  { name: 'failed-job', completions: '0/1', active: 0, failed: 2, age: ago(60_000) },
+]
+
+function k8sData() {
+  return {
+    namespaces: vi.fn().mockResolvedValue(['default', 'kube-system']),
+    pods: vi.fn().mockResolvedValue(PODS),
+    deployments: vi.fn().mockResolvedValue(DEPLOYMENTS),
+    statefulsets: vi.fn().mockResolvedValue([{ name: 'db-ss', ready: '1/1', age: ago(60_000), replicas: 1 }]),
+    daemonsets: vi.fn().mockResolvedValue([{ name: 'log-ds', desired: 2, ready: 1, available: 1, age: ago(60_000) }]),
+    replicasets: vi.fn().mockResolvedValue([{ name: 'api-rs', desired: 1, ready: 1, age: ago(60_000) }]),
+    jobs: vi.fn().mockResolvedValue(JOBS),
+    cronjobs: vi.fn().mockResolvedValue([
+      { name: 'backup-cj', schedule: '0 0 * * *', lastSchedule: null, active: 0, age: ago(60_000), suspended: true },
+    ]),
+    services: vi.fn().mockResolvedValue([
+      { name: 'svc-web', type: 'LoadBalancer', clusterIP: '10.0.0.1', externalIP: '1.2.3.4', ports: '80/TCP,443/TCP', age: ago(60_000) },
+      { name: 'svc-int', type: 'ClusterIP', clusterIP: '10.0.0.2', externalIP: '', ports: '', age: ago(60_000) },
+    ]),
+    ingresses: vi.fn().mockResolvedValue([
+      { name: 'ing-a', hosts: 'app.example.com', address: '', ingressClass: 'nginx', age: ago(60_000) },
+    ]),
+    configmaps: vi.fn().mockResolvedValue([{ name: 'cm-app', keys: 2, age: ago(60_000) }]),
+    secrets: vi.fn().mockResolvedValue([{ name: 'sec-tls', type: 'kubernetes.io/tls', keys: 1, age: ago(60_000) }]),
+    nodes: vi.fn().mockResolvedValue([
+      { name: 'node-a', status: 'Ready', roles: 'control-plane', cpu: '8', memory: '16Gi', kubeletVersion: 'v1.30.0', age: ago(86_400_000) },
+      { name: 'node-b', status: 'NotReady', roles: 'worker', cpu: '4', memory: '8Gi', kubeletVersion: 'v1.30.0', age: ago(86_400_000) },
+    ]),
+    events: vi.fn().mockResolvedValue([
+      { name: 'ev-1', type: 'Warning', reason: 'BackOff', object: 'pod/web-1', message: 'restarting container', count: 4, age: ago(60_000) },
+      { name: 'ev-2', type: 'Normal', reason: 'Pulled', object: 'pod/web-2', message: 'image pulled', count: 1, age: ago(60_000) },
+    ]),
+    portForwardStart: vi.fn().mockResolvedValue({ id: 'pf-1', localPort: 50123 }),
+    servicePortForwardStart: vi.fn().mockResolvedValue({ id: 'pf-2', localPort: 50456 }),
+    portForwardList: vi.fn().mockResolvedValue([]),
+  }
+}
+
+function setup(
+  k8sOverrides: Record<string, unknown> = {},
+  props: Partial<React.ComponentProps<typeof K8sDashboard>> = {},
+) {
+  const api = installWindowApi({ k8s: { ...k8sData(), ...k8sOverrides } })
+  seedStore({ sessions: [], tabs: [], activeTabId: null })
+  const utils = render(<K8sDashboard context="test-ctx" {...props} />)
+  return { api, ...utils }
+}
+
+async function podsLoaded() {
+  await waitFor(() => expect(screen.getByText('web-1')).toBeTruthy())
+}
+
+beforeEach(() => {
+  cleanup()
+})
+
+describe('K8sDashboard — pods and connection state', () => {
+  it('loads pods for the default namespace and shows connected state', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    expect(api.k8s.pods).toHaveBeenCalledWith('test-ctx', 'default', undefined)
+    expect(screen.getAllByText('Connected').length).toBeGreaterThan(0)
+    expect(screen.getByText('Namespace: default · 3 pods')).toBeTruthy()
+    // restart counts across color thresholds
+    expect(screen.getAllByText('0').length).toBeGreaterThan(0)
+    expect(screen.getAllByText('3').length).toBeGreaterThan(0)
+    expect(screen.getAllByText('7').length).toBeGreaterThan(0)
+    // age buckets: seconds / hours / days
+    expect(screen.getByText('30s')).toBeTruthy()
+    expect(screen.getByText('2h')).toBeTruthy()
+    expect(screen.getByText('3d')).toBeTruthy()
+  })
+
+  it('marks the owning tab connected once loaded', async () => {
+    const tab = makeTab({ view: 'k8s', k8sContext: 'test-ctx', status: 'connecting' })
+    installWindowApi({ k8s: k8sData() })
+    seedStore({ sessions: [], tabs: [tab], activeTabId: tab.id })
+    render(<K8sDashboard context="test-ctx" tabId={tab.id} />)
+    await podsLoaded()
+    await waitFor(() => expect(useAppStore.getState().tabs[0].status).toBe('connected'))
+  })
+
+  it('switches namespace and refetches', async () => {
+    const { api, container } = setup()
+    await podsLoaded()
+    fireEvent.change(container.querySelector('select')!, { target: { value: 'kube-system' } })
+    await waitFor(() => expect(api.k8s.pods).toHaveBeenCalledWith('test-ctx', 'kube-system', undefined))
+  })
+
+  it('filters rows by name', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.change(screen.getByPlaceholderText('Filter pods…'), { target: { value: 'crash' } })
+    expect(screen.queryByText('web-1')).toBeNull()
+    expect(screen.getByText('crash-pod')).toBeTruthy()
+  })
+
+  it('shows an error banner and error tab status when the fetch fails, then retries', async () => {
+    const tab = makeTab({ view: 'k8s', k8sContext: 'test-ctx' })
+    const pods = vi.fn().mockRejectedValueOnce(new Error('cluster unreachable')).mockResolvedValue(PODS)
+    installWindowApi({ k8s: { ...k8sData(), pods } })
+    seedStore({ sessions: [], tabs: [tab], activeTabId: tab.id })
+    render(<K8sDashboard context="test-ctx" tabId={tab.id} />)
+    await waitFor(() => expect(screen.getByText('Cluster request failed')).toBeTruthy())
+    expect(screen.getByText('cluster unreachable')).toBeTruthy()
+    expect(screen.getAllByText('Connection error').length).toBeGreaterThan(0)
+    // The tab status is written by a passive useEffect, which can flush after
+    // the banner's commit — poll instead of asserting synchronously.
+    await waitFor(() => expect(useAppStore.getState().tabs[0].status).toBe('error'))
+    fireEvent.click(screen.getByText('Retry'))
+    await podsLoaded()
+  })
+
+  it('shows the empty state when there are no resources', async () => {
+    setup({ pods: vi.fn().mockResolvedValue([]) })
+    await waitFor(() => expect(screen.getByText('No pods found')).toBeTruthy())
+    expect(screen.getByText('in this namespace')).toBeTruthy()
+  })
+
+  it('surfaces namespace loading failures', async () => {
+    setup({ namespaces: vi.fn().mockRejectedValue(new Error('forbidden')) })
+    await waitFor(() => expect(screen.getByText('Cluster request failed')).toBeTruthy())
+  })
+})
+
+describe('K8sDashboard — resource kind switching', () => {
+  it('renders deployments with health coloring and actions', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Deployments'))
+    await waitFor(() => expect(screen.getByText('api')).toBeTruthy())
+    expect(api.k8s.deployments).toHaveBeenCalled()
+    expect(screen.getByText('2/2')).toBeTruthy()
+    expect(screen.getByText('1/2')).toBeTruthy()
+    // restart rollout
+    fireEvent.click(screen.getAllByTitle('Restart rollout')[0])
+    await waitFor(() =>
+      expect(api.k8s.restartDeployment).toHaveBeenCalledWith('test-ctx', 'default', 'api', undefined),
+    )
+  })
+
+  it('scales a deployment through the scale modal', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Deployments'))
+    await waitFor(() => expect(screen.getByText('api')).toBeTruthy())
+    fireEvent.click(screen.getAllByTitle('Scale')[0])
+    expect(screen.getByText('Scale Deployment')).toBeTruthy()
+    // + / − and direct input. The plus button is icon-only (no title/aria-label),
+    // so anchor on the replica input it renders immediately after.
+    const input = screen.getByDisplayValue('2') as HTMLInputElement
+    fireEvent.click(input.nextElementSibling as HTMLElement)
+    expect(input.value).toBe('3')
+    fireEvent.change(input, { target: { value: '5' } })
+    fireEvent.click(screen.getByText('Scale to 5'))
+    await waitFor(() =>
+      expect(api.k8s.scaleDeployment).toHaveBeenCalledWith('test-ctx', 'default', 'api', 5, undefined),
+    )
+  })
+
+  it('cancels the scale modal', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Deployments'))
+    await waitFor(() => expect(screen.getByText('api')).toBeTruthy())
+    fireEvent.click(screen.getAllByTitle('Scale')[0])
+    fireEvent.click(screen.getByText('Cancel'))
+    expect(screen.queryByText('Scale Deployment')).toBeNull()
+  })
+
+  it('renders statefulsets, daemonsets and replicasets', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('StatefulSets'))
+    await waitFor(() => expect(screen.getByText('db-ss')).toBeTruthy())
+    fireEvent.click(screen.getByText('DaemonSets'))
+    await waitFor(() => expect(screen.getByText('log-ds')).toBeTruthy())
+    fireEvent.click(screen.getByText('ReplicaSets'))
+    await waitFor(() => expect(screen.getByText('api-rs')).toBeTruthy())
+  })
+
+  it('renders jobs with dot colors for ok/active/failed and cronjobs', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Jobs'))
+    await waitFor(() => expect(screen.getByText('ok-job')).toBeTruthy())
+    expect(screen.getByText('active-job')).toBeTruthy()
+    expect(screen.getByText('failed-job')).toBeTruthy()
+    fireEvent.click(screen.getByText('CronJobs'))
+    await waitFor(() => expect(screen.getByText('backup-cj')).toBeTruthy())
+    expect(screen.getByText('0 0 * * *')).toBeTruthy()
+    expect(screen.getByText('—')).toBeTruthy() // null lastSchedule
+  })
+
+  it('renders services with type badges and starts a service port forward', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Services'))
+    await waitFor(() => expect(screen.getByText('svc-web')).toBeTruthy())
+    expect(screen.getByText('LoadBalancer')).toBeTruthy()
+    expect(screen.getByText('ClusterIP')).toBeTruthy()
+    fireEvent.click(screen.getByTitle('Port forward'))
+    await waitFor(() =>
+      expect(api.k8s.servicePortForwardStart).toHaveBeenCalledWith('test-ctx', 'default', 'svc-web', 80, 0, undefined),
+    )
+    await waitFor(() => expect(screen.getByText('Port Forwards')).toBeTruthy())
+    expect(screen.getByText(/:50456 → svc-web:80/)).toBeTruthy()
+  })
+
+  it('renders ingresses, configmaps and secrets', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Ingresses'))
+    await waitFor(() => expect(screen.getByText('ing-a')).toBeTruthy())
+    expect(screen.getByText('Pending')).toBeTruthy() // no address
+    fireEvent.click(screen.getByText('ConfigMaps'))
+    await waitFor(() => expect(screen.getByText('cm-app')).toBeTruthy())
+    expect(screen.getByText('2 keys')).toBeTruthy()
+    fireEvent.click(screen.getByText('Secrets'))
+    await waitFor(() => expect(screen.getByText('sec-tls')).toBeTruthy())
+    expect(screen.getByText('1 key')).toBeTruthy()
+  })
+
+  it('renders nodes (behind the collapsed Infrastructure section) and events', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Infrastructure')) // collapsed by default
+    fireEvent.click(screen.getByText('Nodes'))
+    await waitFor(() => expect(screen.getByText('node-a')).toBeTruthy())
+    expect(api.k8s.nodes).toHaveBeenCalledWith('test-ctx', undefined)
+    expect(screen.getByText('Ready')).toBeTruthy()
+    expect(screen.getByText('NotReady')).toBeTruthy()
+    expect(screen.getAllByText('2 nodes').length).toBeGreaterThan(0) // subtitle + status bar
+    fireEvent.click(screen.getByText('Events'))
+    await waitFor(() => expect(screen.getByText('BackOff')).toBeTruthy())
+    expect(screen.getByText('Warning')).toBeTruthy()
+    expect(screen.getByText('restarting container')).toBeTruthy()
+  })
+
+  it('collapses and reopens the Workloads section', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('Workloads'))
+    expect(screen.queryByText('Deployments')).toBeNull()
+    fireEvent.click(screen.getByText('Workloads'))
+    expect(screen.getByText('Deployments')).toBeTruthy()
+  })
+})
+
+describe('K8sDashboard — pod actions', () => {
+  it('opens logs and exec modals for a pod', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getAllByTitle('View Logs')[0])
+    expect(screen.getByText('stub-logs:web-1')).toBeTruthy()
+    fireEvent.click(screen.getByText('close-logs'))
+    expect(screen.queryByText('stub-logs:web-1')).toBeNull()
+    fireEvent.click(screen.getAllByTitle('Shell')[0])
+    expect(screen.getByText('stub-exec:web-1')).toBeTruthy()
+  })
+
+  it('opens the resource detail modal when a row is clicked', async () => {
+    setup()
+    await podsLoaded()
+    fireEvent.click(screen.getByText('web-1'))
+    expect(screen.getByText('stub-detail:pod:web-1')).toBeTruthy()
+  })
+
+  it('deletes a pod after confirming the modal', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getAllByTitle('Delete')[0])
+    expect(screen.getByText('Delete Pod')).toBeTruthy()
+    fireEvent.click(screen.getByText('Delete'))
+    await waitFor(() =>
+      expect(api.k8s.deletePod).toHaveBeenCalledWith('test-ctx', 'default', 'web-1', undefined),
+    )
+    await waitFor(() => expect(screen.queryByText('web-1')).toBeNull())
+  })
+
+  it('cancels pod deletion', async () => {
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getAllByTitle('Delete')[0])
+    fireEvent.click(screen.getByText('Cancel'))
+    expect(api.k8s.deletePod).not.toHaveBeenCalled()
+    expect(screen.getByText('web-1')).toBeTruthy()
+  })
+
+  it('starts a pod port forward via the prompt and stops it', async () => {
+    vi.stubGlobal('prompt', vi.fn(() => '8080'))
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getAllByTitle('Port forward')[0])
+    await waitFor(() =>
+      expect(api.k8s.portForwardStart).toHaveBeenCalledWith('test-ctx', 'default', 'web-1', 8080, 0, undefined),
+    )
+    await waitFor(() => expect(screen.getByText(/:50123 → web-1:8080/)).toBeTruthy())
+    expect(screen.getByText('1 port forward active')).toBeTruthy()
+    fireEvent.click(screen.getByTitle('Stop'))
+    await waitFor(() => expect(api.k8s.portForwardStop).toHaveBeenCalledWith('pf-1'))
+    await waitFor(() => expect(screen.queryByText('Port Forwards')).toBeNull())
+    vi.unstubAllGlobals()
+  })
+
+  it('ignores invalid port forward input', async () => {
+    vi.stubGlobal('prompt', vi.fn(() => 'not-a-port'))
+    const { api } = setup()
+    await podsLoaded()
+    fireEvent.click(screen.getAllByTitle('Port forward')[0])
+    expect(api.k8s.portForwardStart).not.toHaveBeenCalled()
+    vi.unstubAllGlobals()
+  })
+
+  it('rehydrates port forwards for this context from the main process', async () => {
+    setup({
+      portForwardList: vi.fn().mockResolvedValue([
+        { id: 'pf-a', context: 'test-ctx', localPort: 40001, podName: 'web-1', targetPort: 80 },
+        { id: 'pf-b', context: 'other-ctx', localPort: 40002, podName: 'zzz', targetPort: 81 },
+      ]),
+    })
+    await podsLoaded()
+    await waitFor(() => expect(screen.getByText(/:40001 → web-1:80/)).toBeTruthy())
+    expect(screen.queryByText(/:40002/)).toBeNull()
+  })
+})
diff --git a/src/renderer/src/components/K8s/__tests__/ResourceDetailModal.test.tsx b/src/renderer/src/components/K8s/__tests__/ResourceDetailModal.test.tsx
new file mode 100644
index 0000000..a4eefe7
--- /dev/null
+++ b/src/renderer/src/components/K8s/__tests__/ResourceDetailModal.test.tsx
@@ -0,0 +1,149 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, waitFor, fireEvent, cleanup } from '@testing-library/react'
+import ResourceDetailModal from '../ResourceDetailModal'
+import { installWindowApi } from '../../../__tests__/harness'
+
+/** Render the modal with the k8s IPC returning `raw`, and return the <pre> innerHTML. */
+async function renderColorized(raw: string) {
+  installWindowApi({ k8s: { resourceDetail: vi.fn().mockResolvedValue(raw) } })
+  const { container } = render(
+    <ResourceDetailModal context="ctx" namespace="default" kind="pod" name="my-pod" onClose={vi.fn()} />,
+  )
+  await waitFor(() => expect(container.querySelector('pre')).toBeTruthy())
+  return container.querySelector('pre')!.innerHTML
+}
+
+beforeEach(() => {
+  cleanup()
+})
+
+describe('ResourceDetailModal — colorize tokenizer', () => {
+  it('colors object keys (string followed by colon) purple, including the colon', async () => {
+    const html = await renderColorized('{"name": "web"}')
+    expect(html).toContain('<span style="color:#9d6ff8">"name":</span>')
+  })
+
+  it('colors plain string values green', async () => {
+    const html = await renderColorized('{"kind": "Pod"}')
+    expect(html).toContain('<span style="color:#10b981">"Pod"</span>')
+  })
+
+  it('handles escaped quotes inside strings as a single token', async () => {
+    const html = await renderColorized('{"msg": "say \\"hi\\" now"}')
+    expect(html).toContain('<span style="color:#10b981">"say \\"hi\\" now"</span>')
+  })
+
+  it('treats a string with escapes followed by a colon as a key', async () => {
+    const html = await renderColorized('{"a\\"b": 1}')
+    expect(html).toContain('<span style="color:#9d6ff8">"a\\"b":</span>')
+  })
+
+  it('colors integer, negative, decimal and exponent numbers amber', async () => {
+    const html = await renderColorized('[42, -3.14, 1e5, 2.5E-3, -7e+2]')
+    for (const n of ['42', '-3.14', '1e5', '2.5E-3', '-7e+2']) {
+      expect(html).toContain(`<span style="color:#f59e0b">${n}</span>`)
+    }
+  })
+
+  it('colors true/false cyan and null red', async () => {
+    const html = await renderColorized('{"a": true, "b": false, "c": null}')
+    expect(html).toContain('<span style="color:#06b6d4">true</span>')
+    expect(html).toContain('<span style="color:#06b6d4">false</span>')
+    expect(html).toContain('<span style="color:#EF4444">null</span>')
+  })
+
+  it('does not colorize keywords glued to trailing word characters (nullable)', async () => {
+    const html = await renderColorized('nullable')
+    expect(html).not.toContain('<span style="color:#EF4444">')
+    expect(html).toContain('nullable')
+  })
+
+  it('does not colorize keywords preceded by a word character (anull, xtrue)', async () => {
+    const html = await renderColorized('anull xtrue')
+    expect(html).not.toContain('color:#EF4444')
+    expect(html).not.toContain('color:#06b6d4')
+  })
+
+  it('colorizes keywords bounded by punctuation', async () => {
+    const html = await renderColorized('[true,null]')
+    expect(html).toContain('<span style="color:#06b6d4">true</span>')
+    expect(html).toContain('<span style="color:#EF4444">null</span>')
+  })
+
+  it('does not treat keywords inside strings as bare keywords', async () => {
+    const html = await renderColorized('{"v": "null"}')
+    // the quoted "null" is a string token, not the red null keyword
+    expect(html).toContain('<span style="color:#10b981">"null"</span>')
+    expect(html).not.toContain('<span style="color:#EF4444">null</span>')
+  })
+
+  it('leaves structural characters uncolored', async () => {
+    const html = await renderColorized('{"a": [1]}')
+    // braces/brackets are emitted outside spans
+    expect(html).toMatch(/\{.*\}/s)
+    expect(html).toContain('[')
+    expect(html).toContain(']')
+  })
+})
+
+describe('ResourceDetailModal — component behavior', () => {
+  it('shows the kind label and name in the header', async () => {
+    installWindowApi({ k8s: { resourceDetail: vi.fn().mockResolvedValue('{}') } })
+    render(
+      <ResourceDetailModal context="ctx" namespace="ns1" kind="deployment" name="api" onClose={vi.fn()} />,
+    )
+    await waitFor(() => expect(screen.getByText('Deployment — api')).toBeTruthy())
+    expect(screen.getByText('ns1')).toBeTruthy()
+  })
+
+  it('falls back to the raw kind when unmapped', async () => {
+    installWindowApi({ k8s: { resourceDetail: vi.fn().mockResolvedValue('{}') } })
+    render(
+      <ResourceDetailModal context="ctx" namespace="ns1" kind="mystery" name="x" onClose={vi.fn()} />,
+    )
+    await waitFor(() => expect(screen.getByText('mystery — x')).toBeTruthy())
+  })
+
+  it('renders an error message when the IPC call fails', async () => {
+    installWindowApi({ k8s: { resourceDetail: vi.fn().mockRejectedValue(new Error('boom')) } })
+    const { container } = render(
+      <ResourceDetailModal context="ctx" namespace="ns" kind="pod" name="p" onClose={vi.fn()} />,
+    )
+    await waitFor(() => expect(container.querySelector('pre')?.textContent).toContain('Error: boom'))
+  })
+
+  it('copies the JSON to the clipboard', async () => {
+    const writeText = vi.fn().mockResolvedValue(undefined)
+    Object.defineProperty(navigator, 'clipboard', { value: { writeText }, configurable: true })
+    installWindowApi({ k8s: { resourceDetail: vi.fn().mockResolvedValue('{"a":1}') } })
+    render(<ResourceDetailModal context="ctx" namespace="ns" kind="pod" name="p" onClose={vi.fn()} />)
+    await waitFor(() => expect(screen.getByTitle('Copy JSON')).toBeTruthy())
+    fireEvent.click(screen.getByTitle('Copy JSON'))
+    await waitFor(() => expect(writeText).toHaveBeenCalledWith('{"a":1}'))
+  })
+
+  it('closes when clicking the backdrop but not the panel', async () => {
+    const onClose = vi.fn()
+    installWindowApi({ k8s: { resourceDetail: vi.fn().mockResolvedValue('{}') } })
+    const { container } = render(
+      <ResourceDetailModal context="ctx" namespace="ns" kind="pod" name="p" onClose={onClose} />,
+    )
+    await waitFor(() => expect(container.querySelector('pre')).toBeTruthy())
+    const panel = container.querySelector('pre')!
+    fireEvent.mouseDown(panel)
+    expect(onClose).not.toHaveBeenCalled()
+    const backdrop = container.firstElementChild as HTMLElement
+    fireEvent.mouseDown(backdrop)
+    expect(onClose).toHaveBeenCalledTimes(1)
+  })
+
+  it('refreshes via the refresh button', async () => {
+    const resourceDetail = vi.fn().mockResolvedValue('{"a":1}')
+    installWindowApi({ k8s: { resourceDetail } })
+    render(<ResourceDetailModal context="ctx" namespace="ns" kind="pod" name="p" onClose={vi.fn()} />)
+    await waitFor(() => expect(screen.getByTitle('Refresh')).toBeTruthy())
+    fireEvent.click(screen.getByTitle('Refresh'))
+    await waitFor(() => expect(resourceDetail).toHaveBeenCalledTimes(2))
+  })
+})
diff --git a/src/renderer/src/components/K8sIcon.tsx b/src/renderer/src/components/K8sIcon.tsx
index d1b530b..25284bb 100644
--- a/src/renderer/src/components/K8sIcon.tsx
+++ b/src/renderer/src/components/K8sIcon.tsx
@@ -1,10 +1,11 @@
 // Kubernetes logo wheel. Brand-colored by default; pass `color` for a
 // monochrome outline that sits alongside other line icons.
-export default function K8sIcon({ size = 16, className = '', color }: { size?: number; className?: string; color?: string }) {
+export default function K8sIcon({ size = 16, className = '', color }: Readonly<{ size?: number; className?: string; color?: string }>) {
   const spokes = Array.from({ length: 7 }).map((_, i) => {
     const angle = (i * 360) / 7 - 90
     const rad = (angle * Math.PI) / 180
     return {
+      angle,
       x1: 24 + 7 * Math.cos(rad),
       y1: 24 + 7 * Math.sin(rad),
       x2: 24 + 16 * Math.cos(rad),
@@ -18,8 +19,8 @@ export default function K8sIcon({ size = 16, className = '', color }: { size?: n
     return (
       <svg width={size} height={size} viewBox="0 0 48 48" fill="none" className={className} xmlns="http://www.w3.org/2000/svg">
         <circle cx="24" cy="24" r="20.5" stroke={color} strokeWidth="3" fill="none" />
-        {spokes.map((s, i) => (
-          <line key={i} x1={s.x1} y1={s.y1} x2={s.x2} y2={s.y2} stroke={color} strokeWidth="2.4" strokeLinecap="round" />
+        {spokes.map(s => (
+          <line key={s.angle} x1={s.x1} y1={s.y1} x2={s.x2} y2={s.y2} stroke={color} strokeWidth="2.4" strokeLinecap="round" />
         ))}
         <circle cx="24" cy="24" r="4.5" fill={color} />
       </svg>
@@ -29,13 +30,13 @@ export default function K8sIcon({ size = 16, className = '', color }: { size?: n
   return (
     <svg width={size} height={size} viewBox="0 0 48 48" fill="none" className={className} xmlns="http://www.w3.org/2000/svg">
       <circle cx="24" cy="24" r="22" fill="#326CE5" />
-      {spokes.map((s, i) => (
-        <line key={i} x1={s.x1} y1={s.y1} x2={s.x2} y2={s.y2} stroke="white" strokeWidth="2.2" strokeLinecap="round" />
+      {spokes.map(s => (
+        <line key={s.angle} x1={s.x1} y1={s.y1} x2={s.x2} y2={s.y2} stroke="white" strokeWidth="2.2" strokeLinecap="round" />
       ))}
       <circle cx="24" cy="24" r="5.5" fill="white" />
       <circle cx="24" cy="24" r="3" fill="#326CE5" />
-      {spokes.map((s, i) => (
-        <circle key={i} cx={s.tipX} cy={s.tipY} r="2.2" fill="white" />
+      {spokes.map(s => (
+        <circle key={s.angle} cx={s.tipX} cy={s.tipY} r="2.2" fill="white" />
       ))}
     </svg>
   )
diff --git a/src/renderer/src/components/MainContent.tsx b/src/renderer/src/components/MainContent.tsx
index b25d82c..2144451 100644
--- a/src/renderer/src/components/MainContent.tsx
+++ b/src/renderer/src/components/MainContent.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { useAppStore } from '../store'
+import { useAppStore, Tab } from '../store'
 import TerminalView from './Terminal/TerminalView'
 import SftpBrowser from './SFTP/SftpBrowser'
 import K8sDashboard from './K8s/K8sDashboard'
@@ -58,12 +58,68 @@ const PANE_GRIDS: Record<number, React.CSSProperties> = {
   4: { gridTemplateColumns: '1fr 1fr', gridTemplateRows: '1fr 1fr' },
 }
 
-export default function MainContent() {
+// Single-view tabs; terminal tabs are special-cased for split panes below.
+function viewContent(tab: Tab): React.ReactNode {
+  switch (tab.view) {
+    case 'k8s':
+      return tab.k8sContext
+        ? <K8sDashboard context={tab.k8sContext} kubeconfigPath={tab.kubeconfigPath} tabId={tab.id} />
+        : null
+    case 'sftp': return <SftpBrowser tab={tab} />
+    case 'database': return <DatabaseExplorer tab={tab} />
+    case 'redis': return <RedisExplorer tab={tab} />
+    case 'dashboard': return <Dashboard />
+    case 'connections': return <ConnectionManager />
+    case 'editor': return <EditorTab tab={tab} />
+    case 'settings': return <Settings />
+    case 'tunnels': return <TunnelsView />
+    case 'docker': return <DockerDashboard tab={tab} />
+    case 'runner': return <RunnerView />
+    case 'local-term': return <LocalTerminalView tab={tab} />
+    case 'rdp': return <RdpView tab={tab} />
+    default: return null
+  }
+}
+
+function TerminalPanes({ tab, style }: Readonly<{ tab: Tab; style: React.CSSProperties }>) {
   const tabs = useAppStore(s => s.tabs)
-  const activeTabId = useAppStore(s => s.activeTabId)
   const focusedPaneId = useAppStore(s => s.focusedPaneId)
   const setFocusedPane = useAppStore(s => s.setFocusedPane)
 
+  const panes = [tab, ...tabs.filter(p => p.paneOf === tab.id)]
+  const split = panes.length > 1
+  return (
+    <div style={style}>
+      <div
+        className="flex-1 min-w-0 min-h-0 overflow-hidden h-full"
+        style={split
+          ? { display: 'grid', gap: 1, background: 'var(--nox-border)', ...PANE_GRIDS[Math.min(panes.length, 4)] }
+          : { display: 'flex', flexDirection: 'column' }}
+      >
+        {panes.map((pane, i) => (
+          <div
+            key={pane.id}
+            className="relative flex-1 min-w-0 min-h-0 overflow-hidden"
+            style={{
+              ...(split && panes.length === 3 && i === 2 ? { gridColumn: 'span 2' } : {}),
+              ...(split && focusedPaneId === pane.id ? { boxShadow: 'inset 0 0 0 1px rgba(124,58,237,0.45)' } : {}),
+            }}
+            onMouseDownCapture={() => { if (split) setFocusedPane(pane.id) }}
+          >
+            <TabErrorBoundary>
+              <TerminalView tab={pane} />
+            </TabErrorBoundary>
+          </div>
+        ))}
+      </div>
+    </div>
+  )
+}
+
+export default function MainContent() {
+  const tabs = useAppStore(s => s.tabs)
+  const activeTabId = useAppStore(s => s.activeTabId)
+
   // Keep every open tab mounted so switching views does not tear down live
   // terminal, database, SFTP, Redis, or K8s connections.
   return (
@@ -71,9 +127,8 @@ export default function MainContent() {
       {tabs.map(tab => {
         if (tab.paneOf) return null // rendered inside the parent's grid
 
-        const isActive = tab.id === activeTabId
         const style: React.CSSProperties = {
-          display: isActive ? 'flex' : 'none',
+          display: tab.id === activeTabId ? 'flex' : 'none',
           position: 'absolute',
           inset: 0,
           overflow: 'hidden',
@@ -81,168 +136,15 @@ export default function MainContent() {
           minHeight: 0,
         }
 
-        if (tab.view === 'terminal') {
-          const panes = [tab, ...tabs.filter(p => p.paneOf === tab.id)]
-          const split = panes.length > 1
-          return (
-            <div key={tab.id} style={style}>
-              <div
-                className="flex-1 min-w-0 min-h-0 overflow-hidden h-full"
-                style={split
-                  ? { display: 'grid', gap: 1, background: 'var(--nox-border)', ...PANE_GRIDS[Math.min(panes.length, 4)] }
-                  : { display: 'flex', flexDirection: 'column' }}
-              >
-                {panes.map((pane, i) => (
-                  <div
-                    key={pane.id}
-                    className="relative flex-1 min-w-0 min-h-0 overflow-hidden"
-                    style={{
-                      ...(split && panes.length === 3 && i === 2 ? { gridColumn: 'span 2' } : {}),
-                      ...(split && focusedPaneId === pane.id ? { boxShadow: 'inset 0 0 0 1px rgba(124,58,237,0.45)' } : {}),
-                    }}
-                    onMouseDownCapture={() => { if (split) setFocusedPane(pane.id) }}
-                  >
-                    <TabErrorBoundary>
-                      <TerminalView tab={pane} />
-                    </TabErrorBoundary>
-                  </div>
-                ))}
-              </div>
-            </div>
-          )
-        }
-
-        if (tab.view === 'k8s' && tab.k8sContext) {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <K8sDashboard context={tab.k8sContext} kubeconfigPath={tab.kubeconfigPath} tabId={tab.id} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'sftp') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <SftpBrowser tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'database') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <DatabaseExplorer tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
+        if (tab.view === 'terminal') return <TerminalPanes key={tab.id} tab={tab} style={style} />
 
-        if (tab.view === 'redis') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <RedisExplorer tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'dashboard') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <Dashboard />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'connections') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <ConnectionManager />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'editor') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <EditorTab tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'settings') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <Settings />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'tunnels') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <TunnelsView />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'docker') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <DockerDashboard tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'runner') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <RunnerView />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'local-term') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <LocalTerminalView tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        if (tab.view === 'rdp') {
-          return (
-            <div key={tab.id} style={style}>
-              <TabErrorBoundary>
-                <RdpView tab={tab} />
-              </TabErrorBoundary>
-            </div>
-          )
-        }
-
-        return null
+        const content = viewContent(tab)
+        if (!content) return null
+        return (
+          <div key={tab.id} style={style}>
+            <TabErrorBoundary>{content}</TabErrorBoundary>
+          </div>
+        )
       })}
     </div>
   )
diff --git a/src/renderer/src/components/Notifications/NotificationHost.tsx b/src/renderer/src/components/Notifications/NotificationHost.tsx
index 9d28de9..eba0a0a 100644
--- a/src/renderer/src/components/Notifications/NotificationHost.tsx
+++ b/src/renderer/src/components/Notifications/NotificationHost.tsx
@@ -26,7 +26,7 @@ export default function NotificationHost() {
   )
 }
 
-function Toast({ notification, onDismiss }: { notification: AppNotification; onDismiss: () => void }) {
+function Toast({ notification, onDismiss }: Readonly<{ notification: AppNotification; onDismiss: () => void }>) {
   const { color, icon } = TYPE_STYLES[notification.type]
 
   useEffect(() => {
diff --git a/src/renderer/src/components/RDP/RdpView.tsx b/src/renderer/src/components/RDP/RdpView.tsx
index c80a0f0..f41f410 100644
--- a/src/renderer/src/components/RDP/RdpView.tsx
+++ b/src/renderer/src/components/RDP/RdpView.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import type { Tab } from '../../store'
 import { useAppStore } from '../../store'
 
@@ -10,8 +10,9 @@ import { useAppStore } from '../../store'
 
 type Status = 'connecting' | 'connected' | 'error' | 'closed'
 
-export default function RdpView({ tab }: { tab: Tab }) {
+export default function RdpView({ tab }: Readonly<{ tab: Tab }>) {
   const canvasRef = useRef<HTMLCanvasElement>(null)
+  const containerRef = useRef<HTMLDivElement>(null)
   const sessions = useAppStore((s) => s.sessions)
   const [status, setStatus] = useState<Status>('connecting')
   const [message, setMessage] = useState<string>('')
@@ -25,31 +26,44 @@ export default function RdpView({ tab }: { tab: Tab }) {
     }
 
     let rdpId: string | null = null
-    let pendingId: string | null = null
     let disposed = false
+    let rafId = 0
+    // Latest frame wins: frames can arrive faster than we can paint 4MB of
+    // pixels, so we stash the newest one and blit at most once per
+    // animation frame instead of letting putImageData calls pile up.
+    let latest: { width: number; height: number; pixels: Uint8Array } | null = null
     const offFns: Array<() => void> = []
 
-    const paint = (id: string, width: number, height: number, pixels: Uint8Array) => {
-      if (id !== rdpId) return
+    const blit = () => {
+      rafId = 0
+      const frame = latest
+      latest = null
+      if (!frame || disposed) return
       const canvas = canvasRef.current
       if (!canvas) return
-      if (canvas.width !== width || canvas.height !== height) {
-        canvas.width = width
-        canvas.height = height
+      if (canvas.width !== frame.width || canvas.height !== frame.height) {
+        canvas.width = frame.width
+        canvas.height = frame.height
       }
       const ctx = canvas.getContext('2d')
       if (!ctx) return
       // pixels is RGBA (sidecar already swizzled + forced alpha). Copy into a
       // fresh clamped array so ImageData gets a plain ArrayBuffer-backed view.
-      const img = new ImageData(new Uint8ClampedArray(pixels), width, height)
+      const img = new ImageData(new Uint8ClampedArray(frame.pixels), frame.width, frame.height)
       ctx.putImageData(img, 0, 0)
-      if (status !== 'connected') setStatus('connected')
+      setStatus((s) => (s === 'connected' ? s : 'connected'))
+    }
+
+    const paint = (id: string, width: number, height: number, pixels: Uint8Array) => {
+      if (id !== rdpId) return
+      latest = { width, height, pixels }
+      if (!rafId) rafId = requestAnimationFrame(blit)
     }
 
-    offFns.push(window.api.rdp.onFrame(paint))
     offFns.push(
+      window.api.rdp.onFrame(paint),
       window.api.rdp.onClose((id, error) => {
-        if (id !== rdpId && id !== pendingId) return
+        if (id !== rdpId) return
         setStatus(error ? 'error' : 'closed')
         if (error) setMessage(error)
       }),
@@ -59,21 +73,32 @@ export default function RdpView({ tab }: { tab: Tab }) {
       try {
         const { password } = await window.api.sessions.getCredentials(session.id)
         if (disposed) return
+        if (!password) {
+          // The sidecar can't prompt; an empty password would just fail NLA
+          // with a confusing "sign-in failed". Say what's actually wrong.
+          setStatus('error')
+          setMessage('No password saved for this connection. Edit it and add one.')
+          return
+        }
+        // Ask for a desktop matching the pane so the image isn't scaled.
+        // Even numbers keep RDP codecs happy; fall back to 1280×800 if the
+        // pane hasn't laid out yet.
+        const rect = containerRef.current?.getBoundingClientRect()
+        const even = (n: number) => Math.floor(n / 2) * 2
         const id = await window.api.rdp.connect({
           host: session.host,
           // RDP connections store 3389; fall back for non-RDP hosts opened ad hoc.
           port: session.port || 3389,
           username: session.username,
-          password: password ?? '',
-          width: 1280,
-          height: 800,
+          password,
+          width: rect && rect.width >= 640 ? even(rect.width) : 1280,
+          height: rect && rect.height >= 480 ? even(rect.height) : 800,
         })
         if (disposed) {
           // Component was unmounted while connect was in progress
           window.api.rdp.disconnect(id).catch(() => {})
         } else {
           rdpId = id
-          pendingId = null
         }
       } catch (err) {
         if (!disposed) {
@@ -85,6 +110,7 @@ export default function RdpView({ tab }: { tab: Tab }) {
 
     return () => {
       disposed = true
+      if (rafId) cancelAnimationFrame(rafId)
       offFns.forEach((off) => off())
       if (rdpId) window.api.rdp.disconnect(rdpId).catch(() => {})
     }
@@ -93,6 +119,7 @@ export default function RdpView({ tab }: { tab: Tab }) {
 
   return (
     <div
+      ref={containerRef}
       className="flex flex-col h-full w-full items-center justify-center overflow-hidden"
       style={{ background: '#000' }}
     >
diff --git a/src/renderer/src/components/RDP/__tests__/RdpView.test.tsx b/src/renderer/src/components/RDP/__tests__/RdpView.test.tsx
new file mode 100644
index 0000000..70de898
--- /dev/null
+++ b/src/renderer/src/components/RDP/__tests__/RdpView.test.tsx
@@ -0,0 +1,181 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { render, screen, waitFor, act, cleanup } from '@testing-library/react'
+import RdpView from '../RdpView'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+
+// jsdom has no canvas: return a stub 2d context so blit() can run.
+const putImageData = vi.fn()
+const ctxStub = { putImageData } as unknown as CanvasRenderingContext2D
+
+// Minimal ImageData for environments where jsdom does not provide one.
+class FakeImageData {
+  data: Uint8ClampedArray
+  width: number
+  height: number
+  constructor(data: Uint8ClampedArray, width: number, height: number) {
+    this.data = data
+    this.width = width
+    this.height = height
+  }
+}
+
+type FrameCb = (id: string, width: number, height: number, pixels: Uint8Array) => void
+type CloseCb = (id: string, error?: string) => void
+
+function setup(opts: {
+  session?: ReturnType<typeof makeSession> | null
+  password?: string
+  connectImpl?: (...args: unknown[]) => Promise<string>
+} = {}) {
+  const session = opts.session === undefined ? makeSession({ type: 'rdp', port: 3389 }) : opts.session
+  let frameCb: FrameCb = () => {}
+  let closeCb: CloseCb = () => {}
+  const api = installWindowApi({
+    sessions: { getCredentials: vi.fn().mockResolvedValue({ password: opts.password ?? 'secret' }) },
+    rdp: {
+      connect: vi.fn(opts.connectImpl ?? (() => Promise.resolve('rdp-1'))),
+      onFrame: vi.fn((cb: FrameCb) => { frameCb = cb; return () => {} }),
+      onClose: vi.fn((cb: CloseCb) => { closeCb = cb; return () => {} }),
+    },
+  })
+  seedStore({ sessions: session ? [session] : [] })
+  const tab = makeTab({ view: 'rdp', sessionId: session?.id ?? 'missing' })
+  const utils = render(<RdpView tab={tab} />)
+  return { api, tab, session, getFrameCb: () => frameCb, getCloseCb: () => closeCb, ...utils }
+}
+
+async function flushConnect(api: WindowApiMock) {
+  await waitFor(() => expect(api.rdp.connect).toHaveBeenCalled())
+  await act(async () => {}) // let rdpId assignment settle
+}
+
+beforeEach(() => {
+  cleanup()
+  putImageData.mockClear()
+  vi.stubGlobal('requestAnimationFrame', (cb: FrameRequestCallback) => { cb(0); return 1 })
+  vi.stubGlobal('cancelAnimationFrame', () => {})
+  if (!(globalThis as any).ImageData) vi.stubGlobal('ImageData', FakeImageData)
+  HTMLCanvasElement.prototype.getContext = vi.fn().mockReturnValue(ctxStub) as any
+})
+
+afterEach(() => {
+  vi.unstubAllGlobals()
+})
+
+describe('RdpView', () => {
+  it('errors when the tab has no associated session', () => {
+    setup({ session: null })
+    expect(screen.getByText('RDP connection failed')).toBeTruthy()
+    expect(screen.getByText('No connection associated with this tab')).toBeTruthy()
+  })
+
+  it('errors when no password is saved (no connect attempt)', async () => {
+    const { api } = setup({ password: '' })
+    await waitFor(() =>
+      expect(screen.getByText('No password saved for this connection. Edit it and add one.')).toBeTruthy(),
+    )
+    expect(api.rdp.connect).not.toHaveBeenCalled()
+  })
+
+  it('connects with session credentials and fallback geometry', async () => {
+    const { api, session } = setup()
+    await flushConnect(api)
+    expect(api.rdp.connect).toHaveBeenCalledWith({
+      host: session!.host,
+      port: 3389,
+      username: session!.username,
+      password: 'secret',
+      width: 1280, // pane not laid out in jsdom → fallback
+      height: 800,
+    })
+    expect(screen.getByText('Connecting to RDP host…')).toBeTruthy()
+  })
+
+  it('falls back to port 3389 when the session has no port', async () => {
+    const { api } = setup({ session: makeSession({ type: 'rdp', port: 0 }) })
+    await flushConnect(api)
+    expect(api.rdp.connect.mock.calls[0][0].port).toBe(3389)
+  })
+
+  it('paints incoming frames to the canvas and flips to connected', async () => {
+    const { api, getFrameCb, container } = setup()
+    await flushConnect(api)
+    const pixels = new Uint8Array(2 * 2 * 4)
+    act(() => { getFrameCb()('rdp-1', 2, 2, pixels) })
+    expect(putImageData).toHaveBeenCalledTimes(1)
+    const canvas = container.querySelector('canvas')!
+    expect(canvas.width).toBe(2)
+    expect(canvas.height).toBe(2)
+    expect(canvas.style.display).toBe('block')
+    expect(screen.queryByText('Connecting to RDP host…')).toBeNull()
+  })
+
+  it('ignores frames for other rdp session ids', async () => {
+    const { api, getFrameCb } = setup()
+    await flushConnect(api)
+    act(() => { getFrameCb()('other-id', 2, 2, new Uint8Array(16)) })
+    expect(putImageData).not.toHaveBeenCalled()
+    expect(screen.getByText('Connecting to RDP host…')).toBeTruthy()
+  })
+
+  it('coalesces multiple frames per animation frame (latest wins)', async () => {
+    let rafCb: FrameRequestCallback | null = null
+    vi.stubGlobal('requestAnimationFrame', (cb: FrameRequestCallback) => { rafCb = cb; return 1 })
+    const { api, getFrameCb, container } = setup()
+    await flushConnect(api)
+    act(() => {
+      getFrameCb()('rdp-1', 2, 2, new Uint8Array(16))
+      getFrameCb()('rdp-1', 4, 4, new Uint8Array(64))
+    })
+    act(() => { rafCb!(0) })
+    expect(putImageData).toHaveBeenCalledTimes(1)
+    expect(container.querySelector('canvas')!.width).toBe(4)
+  })
+
+  it('shows an error when the sidecar closes with an error', async () => {
+    const { api, getCloseCb } = setup()
+    await flushConnect(api)
+    act(() => { getCloseCb()('rdp-1', 'NLA sign-in failed') })
+    expect(screen.getByText('RDP connection failed')).toBeTruthy()
+    expect(screen.getByText('NLA sign-in failed')).toBeTruthy()
+  })
+
+  it('shows session ended on a clean close', async () => {
+    const { api, getCloseCb } = setup()
+    await flushConnect(api)
+    act(() => { getCloseCb()('rdp-1') })
+    expect(screen.getByText('RDP session ended')).toBeTruthy()
+  })
+
+  it('ignores close events for other ids', async () => {
+    const { api, getCloseCb } = setup()
+    await flushConnect(api)
+    act(() => { getCloseCb()('someone-else', 'boom') })
+    expect(screen.getByText('Connecting to RDP host…')).toBeTruthy()
+  })
+
+  it('surfaces connect failures', async () => {
+    setup({ connectImpl: () => Promise.reject(new Error('sidecar missing')) })
+    await waitFor(() => expect(screen.getByText('RDP connection failed')).toBeTruthy())
+    expect(screen.getByText('sidecar missing')).toBeTruthy()
+  })
+
+  it('disconnects the session on unmount', async () => {
+    const { api, unmount } = setup()
+    await flushConnect(api)
+    unmount()
+    expect(api.rdp.disconnect).toHaveBeenCalledWith('rdp-1')
+  })
+
+  it('disconnects immediately when unmounted while connect is in flight', async () => {
+    let resolveConnect: (id: string) => void = () => {}
+    const { api, unmount } = setup({
+      connectImpl: () => new Promise<string>(res => { resolveConnect = res }),
+    })
+    await waitFor(() => expect(api.rdp.connect).toHaveBeenCalled())
+    unmount()
+    await act(async () => { resolveConnect('late-id') })
+    await waitFor(() => expect(api.rdp.disconnect).toHaveBeenCalledWith('late-id'))
+  })
+})
diff --git a/src/renderer/src/components/Redis/RedisExplorer.tsx b/src/renderer/src/components/Redis/RedisExplorer.tsx
index 30240b6..6510d9d 100644
--- a/src/renderer/src/components/Redis/RedisExplorer.tsx
+++ b/src/renderer/src/components/Redis/RedisExplorer.tsx
@@ -13,7 +13,7 @@ interface KeyValue {
   ttl: number
 }
 
-export default function RedisExplorer({ tab }: { tab: Tab }) {
+export default function RedisExplorer({ tab }: Readonly<{ tab: Tab }>) {
   const { sessions, updateTab } = useAppStore()
   const session = sessions.find(s => s.id === tab.sessionId)
   const [clientId, setClientId] = useState<string | null>(null)
@@ -78,7 +78,7 @@ export default function RedisExplorer({ tab }: { tab: Tab }) {
     setLoadingKeys(true)
     try {
       const result = await window.api.redis.keys(id, pat || '*')
-      setKeys((result as string[]).sort().map(k => ({ key: k })))
+      setKeys((result as string[]).sort((a, b) => a.localeCompare(b)).map(k => ({ key: k })))
     } catch (e: any) {
       setError(e.message)
     } finally {
@@ -192,163 +192,225 @@ export default function RedisExplorer({ tab }: { tab: Tab }) {
 
       {activeTab === 'browser' ? (
         <div className="flex flex-1 overflow-hidden">
-          {/* Key list */}
+          <KeyListPane
+            keys={keys}
+            pattern={pattern}
+            setPattern={setPattern}
+            loadingKeys={loadingKeys}
+            selectedKey={selectedKey}
+            onQuery={() => { if (clientId) loadKeys(clientId, pattern) }}
+            onSelect={selectKey}
+            onDelete={handleDelete}
+          />
+          <ValuePane
+            selectedKey={selectedKey}
+            keyValue={keyValue}
+            loadingValue={loadingValue}
+            onClose={() => { setSelectedKey(null); setKeyValue(null) }}
+          />
+        </div>
+      ) : (
+        <CliPane
+          cmdHistory={cmdHistory}
+          cmdInput={cmdInput}
+          setCmdInput={setCmdInput}
+          onSubmit={handleCommand}
+          inputRef={cmdRef}
+        />
+      )}
+    </div>
+  )
+}
+
+function KeyListPane({ keys, pattern, setPattern, loadingKeys, selectedKey, onQuery, onSelect, onDelete }: Readonly<{
+  keys: KeyEntry[]
+  pattern: string
+  setPattern: (p: string) => void
+  loadingKeys: boolean
+  selectedKey: string | null
+  onQuery: () => void
+  onSelect: (key: string) => void
+  onDelete: (key: string) => void
+}>) {
+  return (
+    <div
+      className="flex flex-col flex-shrink-0 overflow-hidden"
+      style={{ width: 260, borderRight: '1px solid var(--nox-border)' }}
+    >
+      <div className="p-3 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)' }}>
+        <div className="flex items-center gap-2">
           <div
-            className="flex flex-col flex-shrink-0 overflow-hidden"
-            style={{ width: 260, borderRight: '1px solid var(--nox-border)' }}
+            className="flex items-center gap-1.5 flex-1 rounded px-2 py-1.5"
+            style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}
           >
-            <div className="p-3 flex-shrink-0" style={{ borderBottom: '1px solid var(--nox-border)' }}>
-              <div className="flex items-center gap-2">
-                <div
-                  className="flex items-center gap-1.5 flex-1 rounded px-2 py-1.5"
-                  style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}
-                >
-                  <Search className="w-3 h-3 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />
-                  <input
-                    value={pattern}
-                    onChange={e => setPattern(e.target.value)}
-                    onKeyDown={e => { if (e.key === 'Enter' && clientId) loadKeys(clientId, pattern) }}
-                    placeholder="Pattern (e.g. user:*)"
-                    className="flex-1 bg-transparent outline-none font-['Inter'] text-[11.5px]"
-                    style={{ color: 'var(--nox-text)' }}
-                  />
-                </div>
-                <button
-                  onClick={() => clientId && loadKeys(clientId, pattern)}
-                  className="p-1.5 rounded transition-colors"
-                  style={{ color: 'var(--nox-text-2)' }}
-                >
-                  <RefreshCw className={`w-3.5 h-3.5 ${loadingKeys ? 'animate-spin' : ''}`} />
-                </button>
-              </div>
-            </div>
+            <Search className="w-3 h-3 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />
+            <input
+              value={pattern}
+              onChange={e => setPattern(e.target.value)}
+              onKeyDown={e => { if (e.key === 'Enter') onQuery() }}
+              placeholder="Pattern (e.g. user:*)"
+              className="flex-1 bg-transparent outline-none font-['Inter'] text-[11.5px]"
+              style={{ color: 'var(--nox-text)' }}
+            />
+          </div>
+          <button
+            onClick={onQuery}
+            className="p-1.5 rounded transition-colors"
+            style={{ color: 'var(--nox-text-2)' }}
+          >
+            <RefreshCw className={`w-3.5 h-3.5 ${loadingKeys ? 'animate-spin' : ''}`} />
+          </button>
+        </div>
+      </div>
 
-            <div className="flex-1 overflow-y-auto">
-              {keys.length === 0 ? (
-                <div className="p-4 text-center">
-                  <p className="font-['Inter'] text-[11.5px]" style={{ color: 'var(--nox-text-3)' }}>
-                    {loadingKeys ? 'Loading…' : 'No keys found'}
-                  </p>
-                </div>
-              ) : (
-                keys.map(({ key }) => (
-                  <div
-                    key={key}
-                    onClick={() => selectKey(key)}
-                    className="group flex items-center gap-2 px-3 py-2 cursor-pointer transition-colors"
-                    style={{
-                      background: selectedKey === key ? '#DC382D18' : 'transparent',
-                      borderLeft: selectedKey === key ? '2px solid #DC382D' : '2px solid transparent',
-                    }}
-                    onMouseEnter={e => { if (selectedKey !== key) (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
-                    onMouseLeave={e => { if (selectedKey !== key) (e.currentTarget as HTMLElement).style.background = 'transparent' }}
-                  >
-                    <span
-                      className="font-mono text-[11px] flex-1 truncate"
-                      style={{ color: selectedKey === key ? '#DC382D' : 'var(--nox-text)' }}
-                    >
-                      {key}
-                    </span>
-                    <button
-                      onClick={e => { e.stopPropagation(); handleDelete(key) }}
-                      className="opacity-0 group-hover:opacity-100 p-0.5 rounded transition-opacity"
-                      style={{ color: '#EF4444' }}
-                    >
-                      <Trash2 className="w-3 h-3" />
-                    </button>
-                  </div>
-                ))
-              )}
-            </div>
+      <div className="flex-1 overflow-y-auto">
+        {keys.length === 0 ? (
+          <div className="p-4 text-center">
+            <p className="font-['Inter'] text-[11.5px]" style={{ color: 'var(--nox-text-3)' }}>
+              {loadingKeys ? 'Loading…' : 'No keys found'}
+            </p>
           </div>
+        ) : (
+          keys.map(({ key }) => (
+            <div
+              key={key}
+              className="group flex items-center gap-2 pr-3 transition-colors"
+              style={{
+                background: selectedKey === key ? '#DC382D18' : 'transparent',
+                borderLeft: selectedKey === key ? '2px solid #DC382D' : '2px solid transparent',
+              }}
+              onMouseEnter={e => { if (selectedKey !== key) (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
+              onMouseLeave={e => { if (selectedKey !== key) (e.currentTarget as HTMLElement).style.background = 'transparent' }}
+            >
+              <button
+                type="button"
+                onClick={() => onSelect(key)}
+                className="flex-1 min-w-0 flex items-center text-left pl-3 py-2 cursor-pointer"
+              >
+                <span
+                  className="font-mono text-[11px] flex-1 truncate"
+                  style={{ color: selectedKey === key ? '#DC382D' : 'var(--nox-text)' }}
+                >
+                  {key}
+                </span>
+              </button>
+              <button
+                type="button"
+                onClick={() => onDelete(key)}
+                className="opacity-0 group-hover:opacity-100 p-0.5 rounded transition-opacity"
+                style={{ color: '#EF4444' }}
+              >
+                <Trash2 className="w-3 h-3" />
+              </button>
+            </div>
+          ))
+        )}
+      </div>
+    </div>
+  )
+}
 
-          {/* Value viewer */}
-          <div className="flex-1 overflow-hidden flex flex-col">
-            {!selectedKey ? (
-              <div className="h-full flex items-center justify-center">
-                <p className="font-['Inter'] text-[13px]" style={{ color: 'var(--nox-text-3)' }}>
-                  Select a key to view its value
-                </p>
-              </div>
-            ) : (
-              <div className="flex flex-col h-full overflow-hidden">
-                <div
-                  className="px-5 py-3 flex items-center justify-between flex-shrink-0"
-                  style={{ borderBottom: '1px solid var(--nox-border)' }}
+function ValuePane({ selectedKey, keyValue, loadingValue, onClose }: Readonly<{
+  selectedKey: string | null
+  keyValue: KeyValue | null
+  loadingValue: boolean
+  onClose: () => void
+}>) {
+  if (!selectedKey) {
+    return (
+      <div className="flex-1 overflow-hidden flex flex-col">
+        <div className="h-full flex items-center justify-center">
+          <p className="font-['Inter'] text-[13px]" style={{ color: 'var(--nox-text-3)' }}>
+            Select a key to view its value
+          </p>
+        </div>
+      </div>
+    )
+  }
+  return (
+    <div className="flex-1 overflow-hidden flex flex-col">
+      <div className="flex flex-col h-full overflow-hidden">
+        <div
+          className="px-5 py-3 flex items-center justify-between flex-shrink-0"
+          style={{ borderBottom: '1px solid var(--nox-border)' }}
+        >
+          <div className="flex items-center gap-3">
+            <span className="font-mono text-[13px] font-medium" style={{ color: 'var(--nox-text)' }}>{selectedKey}</span>
+            {keyValue && (
+              <>
+                <span
+                  className="font-['Inter'] text-[10px] px-1.5 py-0.5 rounded uppercase tracking-wide"
+                  style={{ background: '#DC382D20', color: '#DC382D' }}
                 >
-                  <div className="flex items-center gap-3">
-                    <span className="font-mono text-[13px] font-medium" style={{ color: 'var(--nox-text)' }}>{selectedKey}</span>
-                    {keyValue && (
-                      <>
-                        <span
-                          className="font-['Inter'] text-[10px] px-1.5 py-0.5 rounded uppercase tracking-wide"
-                          style={{ background: '#DC382D20', color: '#DC382D' }}
-                        >
-                          {keyValue.type}
-                        </span>
-                        <span className="font-['Inter'] text-[11px]" style={{ color: 'var(--nox-text-3)' }}>
-                          TTL: {keyValue.ttl === -1 ? 'No expiry' : `${keyValue.ttl}s`}
-                        </span>
-                      </>
-                    )}
-                  </div>
-                  <button onClick={() => { setSelectedKey(null); setKeyValue(null) }}>
-                    <X className="w-4 h-4" style={{ color: 'var(--nox-text-3)' }} />
-                  </button>
-                </div>
-                <div className="flex-1 overflow-y-auto p-5">
-                  {loadingValue ? (
-                    <div className="flex items-center gap-2" style={{ color: 'var(--nox-text-3)' }}>
-                      <Loader className="w-3.5 h-3.5 animate-spin" />
-                      <span className="font-['Inter'] text-[12px]">Loading…</span>
-                    </div>
-                  ) : keyValue ? (
-                    <ValueViewer value={keyValue} />
-                  ) : null}
-                </div>
-              </div>
+                  {keyValue.type}
+                </span>
+                <span className="font-['Inter'] text-[11px]" style={{ color: 'var(--nox-text-3)' }}>
+                  TTL: {keyValue.ttl === -1 ? 'No expiry' : `${keyValue.ttl}s`}
+                </span>
+              </>
             )}
           </div>
+          <button onClick={onClose}>
+            <X className="w-4 h-4" style={{ color: 'var(--nox-text-3)' }} />
+          </button>
         </div>
-      ) : (
-        /* CLI tab */
-        <div className="flex flex-col flex-1 overflow-hidden">
-          <div className="flex-1 overflow-y-auto p-4 font-mono text-[12px]" style={{ background: '#0D1117' }}>
-            {cmdHistory.length === 0 ? (
-              <p style={{ color: 'rgba(255,255,255,0.3)' }}>Type a Redis command below (e.g. INFO, DBSIZE, SET key value)</p>
-            ) : (
-              cmdHistory.map((h, i) => (
-                <div key={i} className="mb-3">
-                  <div style={{ color: '#DC382D' }}>
-                    <span style={{ color: 'rgba(255,255,255,0.4)' }}>{'>'} </span>{h.cmd}
-                  </div>
-                  <pre className="mt-1 whitespace-pre-wrap" style={{ color: '#E6EDF3', paddingLeft: 14 }}>{h.result}</pre>
-                </div>
-              ))
-            )}
-          </div>
-          <div
-            className="flex items-center gap-2 px-4 py-3 flex-shrink-0"
-            style={{ background: '#161B22', borderTop: '1px solid #30363D' }}
-          >
-            <span style={{ color: '#DC382D', fontFamily: 'monospace' }}>{'>'}</span>
-            <input
-              ref={cmdRef}
-              value={cmdInput}
-              onChange={e => setCmdInput(e.target.value)}
-              onKeyDown={e => { if (e.key === 'Enter') handleCommand() }}
-              placeholder="Enter command…"
-              className="flex-1 bg-transparent outline-none font-mono text-[12px]"
-              style={{ color: '#E6EDF3' }}
-            />
-          </div>
+        <div className="flex-1 overflow-y-auto p-5">
+          {loadingValue && (
+            <div className="flex items-center gap-2" style={{ color: 'var(--nox-text-3)' }}>
+              <Loader className="w-3.5 h-3.5 animate-spin" />
+              <span className="font-['Inter'] text-[12px]">Loading…</span>
+            </div>
+          )}
+          {!loadingValue && keyValue && <ValueViewer value={keyValue} />}
         </div>
-      )}
+      </div>
+    </div>
+  )
+}
+
+function CliPane({ cmdHistory, cmdInput, setCmdInput, onSubmit, inputRef }: Readonly<{
+  cmdHistory: { cmd: string; result: string }[]
+  cmdInput: string
+  setCmdInput: (v: string) => void
+  onSubmit: () => void
+  inputRef: React.Ref<HTMLInputElement>
+}>) {
+  return (
+    <div className="flex flex-col flex-1 overflow-hidden">
+      <div className="flex-1 overflow-y-auto p-4 font-mono text-[12px]" style={{ background: '#0D1117' }}>
+        {cmdHistory.length === 0 ? (
+          <p style={{ color: 'rgba(255,255,255,0.3)' }}>Type a Redis command below (e.g. INFO, DBSIZE, SET key value)</p>
+        ) : (
+          cmdHistory.map((h, i) => (
+            <div key={`${i}-${h.cmd}`} className="mb-3">
+              <div style={{ color: '#DC382D' }}>
+                <span style={{ color: 'rgba(255,255,255,0.4)' }}>{'>'} </span>{h.cmd}
+              </div>
+              <pre className="mt-1 whitespace-pre-wrap" style={{ color: '#E6EDF3', paddingLeft: 14 }}>{h.result}</pre>
+            </div>
+          ))
+        )}
+      </div>
+      <div
+        className="flex items-center gap-2 px-4 py-3 flex-shrink-0"
+        style={{ background: '#161B22', borderTop: '1px solid #30363D' }}
+      >
+        <span style={{ color: '#DC382D', fontFamily: 'monospace' }}>{'>'}</span>
+        <input
+          ref={inputRef}
+          value={cmdInput}
+          onChange={e => setCmdInput(e.target.value)}
+          onKeyDown={e => { if (e.key === 'Enter') onSubmit() }}
+          placeholder="Enter command…"
+          className="flex-1 bg-transparent outline-none font-mono text-[12px]"
+          style={{ color: '#E6EDF3' }}
+        />
+      </div>
     </div>
   )
 }
 
-function ValueViewer({ value }: { value: KeyValue }) {
+function ValueViewer({ value }: Readonly<{ value: KeyValue }>) {
   if (value.type === 'string') {
     return (
       <div
diff --git a/src/renderer/src/components/Redis/__tests__/RedisExplorer.test.tsx b/src/renderer/src/components/Redis/__tests__/RedisExplorer.test.tsx
new file mode 100644
index 0000000..8571791
--- /dev/null
+++ b/src/renderer/src/components/Redis/__tests__/RedisExplorer.test.tsx
@@ -0,0 +1,172 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import RedisExplorer from '../RedisExplorer'
+import { installWindowApi, seedStore, makeSession, makeTab } from '../../../__tests__/harness'
+
+const KEY_VALUES: Record<string, { type: string; value: any; ttl: number }> = {
+  'user:1': { type: 'string', value: 'hello world', ttl: -1 },
+  'user:profile': { type: 'hash', value: { name: 'sean', role: 'admin' }, ttl: 3600 },
+  'queue:jobs': { type: 'list', value: ['job-a', 'job-b'], ttl: -1 },
+  'scores': { type: 'zset', value: [{ member: 'a', score: 1 }], ttl: -1 },
+}
+
+function setup(overrides: Record<string, any> = {}) {
+  const session = makeSession({ label: 'Cache', type: 'redis', port: 6379, redisDb: 2 })
+  const tab = makeTab({ view: 'redis', sessionId: session.id })
+  seedStore({ sessions: [session], tabs: [tab], activeTabId: tab.id })
+  const api = installWindowApi({
+    redis: {
+      connect: vi.fn().mockResolvedValue('redis-1'),
+      keys: vi.fn().mockResolvedValue(Object.keys(KEY_VALUES)),
+      get: vi.fn().mockImplementation(async (_id: string, key: string) => KEY_VALUES[key]),
+      del: vi.fn().mockResolvedValue(undefined),
+      command: vi.fn().mockResolvedValue(42),
+      disconnect: vi.fn().mockResolvedValue(undefined),
+    },
+    ...overrides,
+  })
+  const utils = render(<RedisExplorer tab={tab} />)
+  return { session, tab, api, ...utils }
+}
+
+describe('RedisExplorer', () => {
+  beforeEach(() => {
+    seedStore({ sessions: [], tabs: [], activeTabId: null })
+  })
+
+  it('connects with stored credentials and lists sorted keys', async () => {
+    const { api, session, tab } = setup()
+    expect(await screen.findByText('4 keys')).toBeTruthy()
+    expect(api.sessions.getCredentials).toHaveBeenCalledWith(tab.sessionId)
+    expect(api.redis.connect).toHaveBeenCalledWith({
+      host: session.host,
+      port: 6379,
+      password: 'pw',
+      db: 2,
+    })
+    expect(screen.getByText('Redis · DB 2')).toBeTruthy()
+    expect(screen.getByText('Cache')).toBeTruthy()
+    expect(screen.getByText('user:1')).toBeTruthy()
+    expect(screen.getByText('Select a key to view its value')).toBeTruthy()
+  })
+
+  it('selects a string key on click and shows type, TTL and value', async () => {
+    const { api } = setup()
+    fireEvent.click(await screen.findByText('user:1'))
+    expect(await screen.findByText('hello world')).toBeTruthy()
+    expect(api.redis.get).toHaveBeenCalledWith('redis-1', 'user:1')
+    expect(screen.getByText('string')).toBeTruthy()
+    expect(screen.getByText('TTL: No expiry')).toBeTruthy()
+    // Close the value pane
+    const header = screen.getAllByText('user:1').find(el => el.classList.contains('font-medium'))!
+    fireEvent.click(header.closest('div')!.parentElement!.querySelector('button:last-of-type') as HTMLElement)
+    expect(await screen.findByText('Select a key to view its value')).toBeTruthy()
+  })
+
+  it('selects hash and list keys through the key row buttons', async () => {
+    const { api } = setup()
+    const row = (await screen.findByText('user:profile')).closest('button') as HTMLElement
+    fireEvent.click(row)
+    expect(await screen.findByText('sean')).toBeTruthy()
+    expect(screen.getByText('TTL: 3600s')).toBeTruthy()
+    expect(screen.getByText('name')).toBeTruthy()
+
+    const listRow = screen.getByText('queue:jobs').closest('button') as HTMLElement
+    fireEvent.click(listRow)
+    expect(await screen.findByText('job-a')).toBeTruthy()
+    expect(screen.getByText('job-b')).toBeTruthy()
+    expect(api.redis.get).toHaveBeenCalledTimes(2)
+  })
+
+  it('renders unknown types as JSON', async () => {
+    setup()
+    fireEvent.click(await screen.findByText('scores'))
+    expect(await screen.findByText('zset')).toBeTruthy()
+    expect(screen.getByText(/"member": "a"/)).toBeTruthy()
+  })
+
+  it('deletes a key and clears the value pane if it was selected', async () => {
+    const { api } = setup()
+    fireEvent.click(await screen.findByText('user:1'))
+    await screen.findByText('hello world')
+    // The key button and its sibling delete button live in the same row container
+    const keyButton = screen.getAllByText('user:1')[0].closest('button') as HTMLElement
+    fireEvent.click(keyButton.nextElementSibling as HTMLElement)
+    await waitFor(() => expect(api.redis.del).toHaveBeenCalledWith('redis-1', 'user:1'))
+    expect(screen.queryByText('hello world')).toBeNull()
+    expect(await screen.findByText('3 keys')).toBeTruthy()
+  })
+
+  it('re-queries keys with the search pattern on Enter', async () => {
+    const { api } = setup()
+    const input = await screen.findByPlaceholderText('Pattern (e.g. user:*)')
+    api.redis.keys.mockResolvedValueOnce(['user:1', 'user:profile'])
+    fireEvent.change(input, { target: { value: 'user:*' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    await waitFor(() => expect(api.redis.keys).toHaveBeenLastCalledWith('redis-1', 'user:*'))
+    expect(await screen.findByText('2 keys')).toBeTruthy()
+    expect(screen.queryByText('queue:jobs')).toBeNull()
+  })
+
+  it('runs CLI commands and records results and errors', async () => {
+    const { api } = setup()
+    await screen.findByText('4 keys')
+    fireEvent.click(screen.getByText('CLI'))
+    expect(screen.getByText(/Type a Redis command below/)).toBeTruthy()
+
+    const input = screen.getByPlaceholderText('Enter command…')
+    fireEvent.change(input, { target: { value: 'DBSIZE' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(await screen.findByText('DBSIZE')).toBeTruthy()
+    expect(screen.getByText('42')).toBeTruthy()
+    expect(api.redis.command).toHaveBeenCalledWith('redis-1', 'DBSIZE')
+
+    api.redis.command.mockRejectedValueOnce(new Error('unknown command'))
+    fireEvent.change(input, { target: { value: 'BOGUS' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(await screen.findByText('ERR: unknown command')).toBeTruthy()
+
+    // Back to the browser tab
+    fireEvent.click(screen.getByText('Key Browser'))
+    expect(screen.getByText('user:1')).toBeTruthy()
+  })
+
+  it('renders the retry screen when the initial connection fails, then recovers', async () => {
+    const session = makeSession({ label: 'Broken', type: 'redis' })
+    const tab = makeTab({ view: 'redis', sessionId: session.id })
+    seedStore({ sessions: [session], tabs: [tab], activeTabId: tab.id })
+    const api = installWindowApi({
+      redis: {
+        connect: vi.fn().mockRejectedValueOnce(new Error('ECONNREFUSED')).mockResolvedValue('redis-2'),
+        keys: vi.fn().mockResolvedValue(['a']),
+        get: vi.fn().mockResolvedValue({ type: 'string', value: 'x', ttl: -1 }),
+      },
+    })
+    render(<RedisExplorer tab={tab} />)
+    expect(await screen.findByText('ECONNREFUSED')).toBeTruthy()
+    fireEvent.click(screen.getByText('Retry'))
+    expect(await screen.findByText('1 keys')).toBeTruthy()
+    expect(api.redis.connect).toHaveBeenCalledTimes(2)
+  })
+
+  it('maps locked-keychain credential errors to a friendly message', async () => {
+    const session = makeSession({ type: 'redis' })
+    const tab = makeTab({ view: 'redis', sessionId: session.id })
+    seedStore({ sessions: [session], tabs: [tab], activeTabId: tab.id })
+    installWindowApi({
+      sessions: {
+        getCredentials: vi.fn().mockRejectedValue(new Error('credential store is locked')),
+      },
+    })
+    render(<RedisExplorer tab={tab} />)
+    expect(await screen.findByText('App is locked — unlock noxed to reconnect')).toBeTruthy()
+  })
+
+  it('disconnects the client on unmount', async () => {
+    const { api, unmount } = setup()
+    await screen.findByText('4 keys')
+    unmount()
+    await waitFor(() => expect(api.redis.disconnect).toHaveBeenCalledWith('redis-1'))
+  })
+})
diff --git a/src/renderer/src/components/Runner/RunnerView.tsx b/src/renderer/src/components/Runner/RunnerView.tsx
index 8faaa22..8c98461 100644
--- a/src/renderer/src/components/Runner/RunnerView.tsx
+++ b/src/renderer/src/components/Runner/RunnerView.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from 'react'
+import { useEffect, useMemo, useRef, useState } from 'react'
 import { Check, ChevronDown, ChevronRight, Loader2, Play, Square, TerminalSquare } from 'lucide-react'
 import { useAppStore, Session } from '../../store'
 
@@ -19,35 +19,42 @@ export default function RunnerView() {
   const [selected, setSelected] = useState<Set<string>>(new Set())
   const [command, setCommand] = useState('')
   const [results, setResults] = useState<Map<string, HostResult>>(new Map())
-  const [running, setRunning] = useState(false)
+  const running = useMemo(() => [...results.values()].some(v => v.state === 'running'), [results])
   const runIdRef = useRef<string | null>(null)
 
+  const applyOutput = (sessionId: string, data: string) => {
+    setResults(prev => {
+      const next = new Map(prev)
+      const r = next.get(sessionId)
+      if (r) next.set(sessionId, { ...r, output: r.output + data })
+      return next
+    })
+  }
+
+  const applyDone = (sessionId: string, exitCode: number | null, error: string | null) => {
+    setResults(prev => {
+      const next = new Map(prev)
+      const r = next.get(sessionId)
+      if (r) {
+        next.set(sessionId, {
+          ...r,
+          state: error || exitCode !== 0 ? 'failed' : 'done',
+          exitCode,
+          error,
+        })
+      }
+      return next
+    })
+  }
+
   useEffect(() => {
     const offOutput = window.api.runner.onOutput((runId, sessionId, data) => {
       if (runId !== runIdRef.current) return
-      setResults(prev => {
-        const next = new Map(prev)
-        const r = next.get(sessionId)
-        if (r) next.set(sessionId, { ...r, output: r.output + data })
-        return next
-      })
+      applyOutput(sessionId, data)
     })
     const offDone = window.api.runner.onDone((runId, sessionId, exitCode, error) => {
       if (runId !== runIdRef.current) return
-      setResults(prev => {
-        const next = new Map(prev)
-        const r = next.get(sessionId)
-        if (r) {
-          next.set(sessionId, {
-            ...r,
-            state: error || exitCode !== 0 ? 'failed' : 'done',
-            exitCode,
-            error,
-          })
-        }
-        setRunning([...next.values()].some(v => v.state === 'running'))
-        return next
-      })
+      applyDone(sessionId, exitCode, error)
     })
     return () => {
       offOutput()
@@ -73,11 +80,9 @@ export default function RunnerView() {
     if (!command.trim() || selected.size === 0 || running) return
     const ids = [...selected]
     setResults(new Map(ids.map(id => [id, { state: 'running' as HostState, output: '', exitCode: null, error: null }])))
-    setRunning(true)
     try {
       runIdRef.current = await window.api.runner.run(ids, command)
     } catch (err: any) {
-      setRunning(false)
       setResults(new Map())
       addNotification({ type: 'error', message: err?.message ?? 'Run failed' })
     }
@@ -93,7 +98,6 @@ export default function RunnerView() {
       }
       return next
     })
-    setRunning(false)
   }
 
   const sessionById = (id: string) => sessions.find(s => s.id === id)
@@ -127,7 +131,9 @@ export default function RunnerView() {
                 onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
                 onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = 'transparent' }}
               >
-                <div
+                <button
+                  type="button"
+                  aria-pressed={checked}
                   className="w-4 h-4 rounded flex items-center justify-center flex-shrink-0"
                   style={{
                     border: `2px solid ${checked ? '#3B5CCC' : 'var(--nox-border)'}`,
@@ -136,7 +142,7 @@ export default function RunnerView() {
                   onClick={() => toggle(s.id)}
                 >
                   {checked && <Check className="w-3 h-3 text-white" />}
-                </div>
+                </button>
                 <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: s.color ?? '#3B5CCC' }} />
                 <span className="font-['Inter'] text-[12px] truncate" style={{ color: 'var(--nox-text)' }}>
                   {s.label || s.host}
@@ -218,15 +224,23 @@ export default function RunnerView() {
   )
 }
 
-function HostResultCard({ session, result }: { session?: Session; result: HostResult }) {
+function resultBadge(result: HostResult): { text: string; color: string } {
+  if (result.state === 'running') return { text: 'running', color: '#3B5CCC' }
+  if (result.state === 'done') return { text: 'exit 0', color: '#10B981' }
+  return { text: result.error ? 'error' : `exit ${result.exitCode}`, color: '#EF4444' }
+}
+
+function resultText(result: HostResult): string {
+  if (result.error) return result.error
+  if (result.output) return result.output
+  return result.state === 'running' ? '…' : '(no output)'
+}
+
+function HostResultCard({ session, result }: Readonly<{ session?: Session; result: HostResult }>) {
   const [open, setOpen] = useState(true)
   const label = session ? (session.label || session.host) : 'unknown host'
 
-  const badge = result.state === 'running'
-    ? { text: 'running', color: '#3B5CCC' }
-    : result.state === 'done'
-      ? { text: 'exit 0', color: '#10B981' }
-      : { text: result.error ? 'error' : `exit ${result.exitCode}`, color: '#EF4444' }
+  const badge = resultBadge(result)
 
   return (
     <div className="rounded-md overflow-hidden" style={{ background: 'var(--nox-shell)', border: '1px solid var(--nox-border)' }}>
@@ -252,7 +266,7 @@ function HostResultCard({ session, result }: { session?: Session; result: HostRe
           className="m-0 px-4 py-3 font-mono text-[11.5px] leading-relaxed whitespace-pre-wrap break-all max-h-72 overflow-y-auto select-text"
           style={{ background: 'var(--nox-bg)', color: 'var(--nox-text-2)', borderTop: '1px solid var(--nox-border)' }}
         >
-          {result.error ? result.error : result.output || (result.state === 'running' ? '…' : '(no output)')}
+          {resultText(result)}
         </pre>
       )}
     </div>
diff --git a/src/renderer/src/components/Runner/__tests__/RunnerView.test.tsx b/src/renderer/src/components/Runner/__tests__/RunnerView.test.tsx
new file mode 100644
index 0000000..339cc8f
--- /dev/null
+++ b/src/renderer/src/components/Runner/__tests__/RunnerView.test.tsx
@@ -0,0 +1,175 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent, waitFor, act } from '@testing-library/react'
+import RunnerView from '../RunnerView'
+import { installWindowApi, seedStore, makeSession, type WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+type OutputCb = (runId: string, sessionId: string, data: string) => void
+type DoneCb = (runId: string, sessionId: string, exitCode: number | null, error: string | null) => void
+
+function setup(runResult: 'ok' | 'fail' = 'ok') {
+  const host1 = makeSession({ label: 'web-1', type: 'ssh' })
+  const host2 = makeSession({ label: 'web-2', type: 'ssh' })
+  const redis = makeSession({ label: 'cache', type: 'redis' })
+  seedStore({ sessions: [host1, host2, redis], notifications: [] })
+
+  let outputCb: OutputCb = () => {}
+  let doneCb: DoneCb = () => {}
+  const api = installWindowApi({
+    runner: {
+      run:
+        runResult === 'ok'
+          ? vi.fn().mockResolvedValue('run-1')
+          : vi.fn().mockRejectedValue(new Error('spawn failed')),
+      cancel: vi.fn().mockResolvedValue(undefined),
+      onOutput: vi.fn().mockImplementation((cb: OutputCb) => {
+        outputCb = cb
+        return () => {}
+      }),
+      onDone: vi.fn().mockImplementation((cb: DoneCb) => {
+        doneCb = cb
+        return () => {}
+      }),
+    },
+  })
+  render(<RunnerView />)
+  return { host1, host2, redis, api, emitOutput: (...a: Parameters<OutputCb>) => outputCb(...a), emitDone: (...a: Parameters<DoneCb>) => doneCb(...a) }
+}
+
+function checkboxFor(label: string): HTMLElement {
+  return screen.getByText(label).closest('label')!.querySelector('button') as HTMLElement
+}
+
+async function startRun(host1: ReturnType<typeof makeSession>, api: WindowApiMock, command = 'uptime') {
+  fireEvent.click(checkboxFor(host1.label))
+  fireEvent.change(screen.getByPlaceholderText(/runs on every selected host/), { target: { value: command } })
+  fireEvent.click(screen.getByText('Run'))
+  await waitFor(() => expect(api.runner.run).toHaveBeenCalledWith([host1.id], command))
+}
+
+describe('RunnerView', () => {
+  beforeEach(() => {
+    seedStore({ sessions: [], notifications: [] })
+  })
+
+  it('lists only SSH hosts and shows the empty state', () => {
+    setup()
+    expect(screen.getByText('Hosts (0/2)')).toBeTruthy()
+    expect(screen.getByText('web-1')).toBeTruthy()
+    expect(screen.getByText('web-2')).toBeTruthy()
+    expect(screen.queryByText('cache')).toBeNull()
+    expect(screen.getByText('Run a command across your fleet')).toBeTruthy()
+  })
+
+  it('toggles hosts via the checkbox button and reflects state in aria-pressed', () => {
+    setup()
+    const box = checkboxFor('web-1')
+    expect(box.getAttribute('aria-pressed')).toBe('false')
+    fireEvent.click(box)
+    expect(screen.getByText('Hosts (1/2)')).toBeTruthy()
+    expect(box.getAttribute('aria-pressed')).toBe('true')
+    fireEvent.click(box)
+    expect(screen.getByText('Hosts (0/2)')).toBeTruthy()
+    expect(box.getAttribute('aria-pressed')).toBe('false')
+  })
+
+  it('selects all / none via the header toggle', () => {
+    setup()
+    fireEvent.click(screen.getByText('All'))
+    expect(screen.getByText('Hosts (2/2)')).toBeTruthy()
+    fireEvent.click(screen.getByText('None'))
+    expect(screen.getByText('Hosts (0/2)')).toBeTruthy()
+  })
+
+  it('runs a command and streams output/exit codes into result cards', async () => {
+    const { host1, host2, api, emitOutput, emitDone } = setup()
+    fireEvent.click(screen.getByText('All'))
+    fireEvent.change(screen.getByPlaceholderText(/runs on every selected host/), { target: { value: 'uptime' } })
+    fireEvent.click(screen.getByText('Run'))
+
+    await waitFor(() => expect(api.runner.run).toHaveBeenCalledWith([host1.id, host2.id], 'uptime'))
+    expect(screen.getAllByText('running')).toHaveLength(2)
+
+    // Output for a stale run id is ignored
+    act(() => emitOutput('stale-run', host1.id, 'IGNORED'))
+    expect(screen.queryByText(/IGNORED/)).toBeNull()
+
+    act(() => {
+      emitOutput('run-1', host1.id, 'load average: 0.1')
+      emitOutput('run-1', host1.id, '\nmore')
+    })
+    expect(screen.getByText(/load average: 0\.1/)).toBeTruthy()
+
+    act(() => emitDone('run-1', host1.id, 0, null))
+    expect(screen.getByText('exit 0')).toBeTruthy()
+    expect(screen.getByText('Cancel')).toBeTruthy() // still running host2
+
+    act(() => emitDone('run-1', host2.id, 3, null))
+    expect(screen.getByText('exit 3')).toBeTruthy()
+    // Everything finished — Run button returns
+    expect(screen.getByText('Run')).toBeTruthy()
+
+    // Stale done is ignored too
+    act(() => emitDone('other', host1.id, 1, null))
+    expect(screen.getByText('exit 0')).toBeTruthy()
+  })
+
+  it('marks a host as error when done reports an error message', async () => {
+    const { host1, api, emitDone } = setup()
+    await startRun(host1, api)
+    act(() => emitDone('run-1', host1.id, null, 'ssh: connection refused'))
+    expect(screen.getByText('error')).toBeTruthy()
+    expect(screen.getByText('ssh: connection refused')).toBeTruthy()
+  })
+
+  it('supports Cmd+Enter to run and collapsing a result card', async () => {
+    const { host1, api, emitOutput } = setup()
+    fireEvent.click(checkboxFor('web-1'))
+    const input = screen.getByPlaceholderText(/runs on every selected host/)
+    fireEvent.change(input, { target: { value: 'whoami' } })
+    fireEvent.keyDown(input, { key: 'Enter', metaKey: true })
+    await waitFor(() => expect(api.runner.run).toHaveBeenCalledWith([host1.id], 'whoami'))
+
+    act(() => emitOutput('run-1', host1.id, 'root'))
+    expect(screen.getByText('root')).toBeTruthy()
+    // Collapse the card header — the pre disappears. The sidebar label is not
+    // inside a <button>, so closest('button') isolates the result-card header.
+    const cardHeader = () =>
+      screen.getAllByText('web-1').map(el => el.closest('button')).find(b => b !== null) as HTMLElement
+    fireEvent.click(cardHeader())
+    expect(screen.queryByText('root')).toBeNull()
+    // Reopen
+    fireEvent.click(cardHeader())
+    expect(screen.getByText('root')).toBeTruthy()
+  })
+
+  it('cancel marks running hosts as failed with Cancelled', async () => {
+    const { host1, api } = setup()
+    await startRun(host1, api)
+    fireEvent.click(screen.getByText('Cancel'))
+    await waitFor(() => expect(api.runner.cancel).toHaveBeenCalledWith('run-1'))
+    expect(await screen.findByText('Cancelled')).toBeTruthy()
+    expect(screen.getByText('error')).toBeTruthy()
+  })
+
+  it('does not run without a command or selection', () => {
+    const { api } = setup()
+    const runBtn = screen.getByText('Run').closest('button') as HTMLButtonElement
+    expect(runBtn.disabled).toBe(true)
+    fireEvent.click(runBtn)
+    expect(api.runner.run).not.toHaveBeenCalled()
+  })
+
+  it('surfaces run failures as a notification and clears results', async () => {
+    setup('fail')
+    fireEvent.click(checkboxFor('web-1'))
+    fireEvent.change(screen.getByPlaceholderText(/runs on every selected host/), { target: { value: 'uptime' } })
+    fireEvent.click(screen.getByText('Run'))
+    await waitFor(() => {
+      const notes = useAppStore.getState().notifications
+      expect(notes.some(n => n.type === 'error' && n.message === 'spawn failed')).toBe(true)
+    })
+    expect(screen.getByText('Run a command across your fleet')).toBeTruthy()
+  })
+})
diff --git a/src/renderer/src/components/SFTP/FilesDrawer.tsx b/src/renderer/src/components/SFTP/FilesDrawer.tsx
index 3ad6166..0451ea7 100644
--- a/src/renderer/src/components/SFTP/FilesDrawer.tsx
+++ b/src/renderer/src/components/SFTP/FilesDrawer.tsx
@@ -1,6 +1,5 @@
 import { useState, useEffect, useRef, useCallback } from 'react'
-import { Tab } from '../../store'
-import { useAppStore } from '../../store'
+import { Tab, useAppStore } from '../../store'
 import { formatFileSize, ipcErrorMessage, joinPath } from '../../lib/format'
 import { connectSftp } from '../../lib/sftpConnect'
 import {
@@ -77,7 +76,7 @@ export default function FilesDrawer({ tab, onClose }: Props) {
     setError(null)
     try {
       const result: SftpEntry[] = await window.api.sftp.list(id, dir)
-      setEntries(result.sort((a, b) => {
+      setEntries([...result].sort((a, b) => {
         if (a.isDirectory !== b.isDirectory) return a.isDirectory ? -1 : 1
         return a.name.localeCompare(b.name)
       }))
@@ -307,23 +306,22 @@ export default function FilesDrawer({ tab, onClose }: Props) {
         className="flex items-center px-3 py-2 flex-shrink-0"
         style={{ borderTop: '1px solid var(--nox-border)', minHeight: 32, background: 'var(--nox-shell)' }}
       >
-        {toast ? (
-          <p className="text-2xs break-words line-clamp-2" style={{ color: '#3B5CCC' }}>{toast}</p>
-        ) : !connecting && !error ? (
+        {toast && <p className="text-2xs break-words line-clamp-2" style={{ color: '#3B5CCC' }}>{toast}</p>}
+        {!toast && !connecting && !error && (
           <span className="text-2xs font-mono truncate" style={{ color: 'var(--nox-text-3)' }}>
             {entries.length} item{entries.length !== 1 ? 's' : ''}
           </span>
-        ) : null}
+        )}
       </div>
     </div>
   )
 }
 
 /* ── Breadcrumb ───────────────────────────────────────────────────────────── */
-function Breadcrumb({ segments, onNavigate }: {
+function Breadcrumb({ segments, onNavigate }: Readonly<{
   segments: string[]
   onNavigate: (idx: number) => void
-}) {
+}>) {
   if (segments.length === 0) {
     return (
       <span className="text-2xs font-mono" style={{ color: 'var(--nox-text-3)' }}>/</span>
@@ -368,11 +366,11 @@ function Breadcrumb({ segments, onNavigate }: {
 }
 
 /* ── Header button ────────────────────────────────────────────────────────── */
-function HeaderButton({ title, onClick, children }: {
+function HeaderButton({ title, onClick, children }: Readonly<{
   title: string
   onClick: () => void
   children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       onClick={onClick}
@@ -394,14 +392,14 @@ function HeaderButton({ title, onClick, children }: {
 }
 
 /* ── File row ─────────────────────────────────────────────────────────────── */
-function FileRow({ entry, onNavigate, onOpen, onDownload, onDelete, onRename }: {
+function FileRow({ entry, onNavigate, onOpen, onDownload, onDelete, onRename }: Readonly<{
   entry: SftpEntry
   onNavigate: () => void
   onOpen: () => void
   onDownload: () => void
   onDelete: () => void
   onRename: () => void
-}) {
+}>) {
   const isDir = entry.isDirectory
 
   return (
@@ -466,9 +464,9 @@ function FileRow({ entry, onNavigate, onOpen, onDownload, onDelete, onRename }:
   )
 }
 
-function RowButton({ onClick, title, children }: {
+function RowButton({ onClick, title, children }: Readonly<{
   onClick: () => void; title: string; children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       onClick={(e) => { e.stopPropagation(); onClick() }}
@@ -490,7 +488,7 @@ function RowButton({ onClick, title, children }: {
 }
 
 /* ── State components ─────────────────────────────────────────────────────── */
-function ConnectingState({ host }: { host?: string }) {
+function ConnectingState({ host }: Readonly<{ host?: string }>) {
   return (
     <div className="flex flex-col items-center justify-center flex-1 gap-3 px-6">
       <div className="relative w-6 h-6">
@@ -508,7 +506,7 @@ function ConnectingState({ host }: { host?: string }) {
   )
 }
 
-function ErrorState({ message, onRetry }: { message: string; onRetry: () => void }) {
+function ErrorState({ message, onRetry }: Readonly<{ message: string; onRetry: () => void }>) {
   return (
     <div className="flex flex-col items-center justify-center flex-1 gap-3 px-5 text-center">
       <div
diff --git a/src/renderer/src/components/SFTP/SftpBrowser.tsx b/src/renderer/src/components/SFTP/SftpBrowser.tsx
index 4ab8703..abe494f 100644
--- a/src/renderer/src/components/SFTP/SftpBrowser.tsx
+++ b/src/renderer/src/components/SFTP/SftpBrowser.tsx
@@ -21,7 +21,13 @@ const DEFAULT_DATE_FORMAT = 'YYYY-MM-DD HH:mm'
 const INIT: PaneState = { path: '/', entries: [], loading: false, selected: new Set(), sortKey: 'name', sortDir: 'asc', showHidden: false, error: null }
 let xferId = 0
 
-export default function SftpBrowser({ tab }: { tab: Tab }) {
+function compareBy(sortKey: SortKey, a: FileEntry, b: FileEntry): number {
+  if (sortKey === 'name') return a.name.localeCompare(b.name)
+  if (sortKey === 'size') return a.size - b.size
+  return a.mtime - b.mtime
+}
+
+export default function SftpBrowser({ tab }: Readonly<{ tab: Tab }>) {
   const sessions = useAppStore(s => s.sessions)
   const updateTab = useAppStore(s => s.updateTab)
   const addNotification = useAppStore(s => s.addNotification)
@@ -85,9 +91,10 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
     setTransfers(t => [{ id, name, direction: dir, status: 'active' }, ...t])
     return id
   }
+  const removeTransfer = (id: number) => setTransfers(t => t.filter(x => x.id !== id))
   const finishTransfer = (id: number, name: string, direction: 'up' | 'down', error?: string) => {
     setTransfers(t => t.map(x => x.id === id ? { ...x, status: error ? 'error' : 'done', error } : x))
-    setTimeout(() => setTransfers(t => t.filter(x => x.id !== id)), error ? 5000 : 2000)
+    setTimeout(() => removeTransfer(id), error ? 5000 : 2000)
     window.api.settings.get().then((cfg: { transferAlerts?: unknown }) => {
       if (cfg.transferAlerts !== true) return
       const verb = direction === 'up' ? 'Upload' : 'Download'
@@ -106,7 +113,7 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
       const id = await connectSftp(session, tab.streamId)
       setClientId(id); clientRef.current = id
       updateTab(tab.id, { status: 'connected' }); setConnecting(false)
-      loadRemote(id, '/'); loadLocal(undefined)
+      loadRemote(id, '/'); loadLocal()
     } catch (err: any) {
       setConnError(ipcErrorMessage(err, 'SFTP connection failed'))
       updateTab(tab.id, { status: 'error', errorMessage: err?.message }); setConnecting(false)
@@ -141,7 +148,7 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
   function sorted(p: PaneState): FileEntry[] {
     return p.entries.filter(e => p.showHidden || !e.name.startsWith('.')).sort((a, b) => {
       if (a.isDirectory !== b.isDirectory) return a.isDirectory ? -1 : 1
-      let c = p.sortKey === 'name' ? a.name.localeCompare(b.name) : p.sortKey === 'size' ? a.size - b.size : a.mtime - b.mtime
+      const c = compareBy(p.sortKey, a, b)
       return p.sortDir === 'asc' ? c : -c
     })
   }
@@ -157,8 +164,19 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
     else uP(s, { selected: new Set([name]) })
   }
 
-  function navUp(s: Side) { const parts = gP(s).path.split('/').filter(Boolean); parts.pop(); const np = parts.length ? `/${parts.join('/')}` : '/'; s === 'local' ? loadLocal(np) : clientId && loadRemote(clientId, np) }
-  function navInto(s: Side, e: FileEntry) { if (!e.isDirectory) return; s === 'local' ? loadLocal(e.path || joinPath(local.path, e.name)) : clientId && loadRemote(clientId, joinPath(remote.path, e.name)) }
+  function navUp(s: Side) {
+    const parts = gP(s).path.split('/').filter(Boolean)
+    parts.pop()
+    const np = parts.length ? `/${parts.join('/')}` : '/'
+    if (s === 'local') loadLocal(np)
+    else if (clientId) loadRemote(clientId, np)
+  }
+
+  function navInto(s: Side, e: FileEntry) {
+    if (!e.isDirectory) return
+    if (s === 'local') loadLocal(e.path || joinPath(local.path, e.name))
+    else if (clientId) loadRemote(clientId, joinPath(remote.path, e.name))
+  }
 
   async function doUpload(files: FileEntry[]) {
     if (!clientId) return
@@ -300,7 +318,7 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
 
       <div ref={containerRef} className="flex flex-1 min-h-0 relative">
         {/* LOCAL */}
-        <div style={{ width: `${splitPct}%` }} className="flex flex-col overflow-hidden" onClick={() => setFocusedPane('local')}>
+        <div style={{ width: `${splitPct}%` }} className="flex flex-col overflow-hidden" onClick={() => setFocusedPane('local')} onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') setFocusedPane('local') }}>
           <PaneChrome side="local" label="Local" icon={<HardDrive className="w-3.5 h-3.5" />} pane={local} focused={focusedPane === 'local'} onNavUp={() => navUp('local')} onRefresh={() => loadLocal(local.path)} onMkdir={() => handleMkdir('local')} onToggleHidden={() => uL({ showHidden: !local.showHidden })} />
           <FileTable pane={local} visible={lv} side="local" diffMap={diffMap} dateFormat={dateFormat} onToggleSort={k => toggleSort('local', k)} onSelect={(n, e) => handleSelect('local', n, e)} onClear={() => uL({ selected: new Set() })} onNavUp={() => navUp('local')} onNavInto={e => navInto('local', e)} onDragStart={(e, ev) => onDragStart('local', e, ev)} onDrop={e => onPaneDrop('local', e)} onDoubleClickFile={openLocalFile} />
         </div>
@@ -312,7 +330,7 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
         </div>
 
         {/* REMOTE */}
-        <div style={{ width: `${100 - splitPct}%` }} className="flex flex-col overflow-hidden" onClick={() => setFocusedPane('remote')}>
+        <div style={{ width: `${100 - splitPct}%` }} className="flex flex-col overflow-hidden" onClick={() => setFocusedPane('remote')} onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') setFocusedPane('remote') }}>
           <PaneChrome side="remote" label={session?.host || 'Remote'} icon={<Server className="w-3.5 h-3.5" />} pane={remote} focused={focusedPane === 'remote'} onNavUp={() => navUp('remote')} onRefresh={() => clientId && loadRemote(clientId, remote.path)} onMkdir={() => handleMkdir('remote')} onToggleHidden={() => uR({ showHidden: !remote.showHidden })} />
           <FileTable pane={remote} visible={rv} side="remote" diffMap={diffMap} dateFormat={dateFormat} onToggleSort={k => toggleSort('remote', k)} onSelect={(n, e) => handleSelect('remote', n, e)} onClear={() => uR({ selected: new Set() })} onNavUp={() => navUp('remote')} onNavInto={e => navInto('remote', e)} onDelete={handleDelete} onRename={handleRename} onDragStart={(e, ev) => onDragStart('remote', e, ev)} onDrop={e => onPaneDrop('remote', e)} onDoubleClickFile={openFile} />
         </div>
@@ -353,8 +371,8 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
 
       {/* Quick Look overlay */}
       {(quickLook || quickLookLoading) && (
-        <div className="absolute inset-0 z-50 flex items-center justify-center" style={{ background: 'rgba(0,0,0,0.5)', backdropFilter: 'blur(4px)' }} onClick={() => setQuickLook(null)}>
-          <div className="rounded-lg overflow-hidden shadow-2xl flex flex-col" style={{ width: 560, maxHeight: '70vh', background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }} onClick={e => e.stopPropagation()}>
+        <div className="absolute inset-0 z-50 flex items-center justify-center" style={{ background: 'rgba(0,0,0,0.5)', backdropFilter: 'blur(4px)' }} onClick={e => { if (e.target === e.currentTarget) setQuickLook(null) }} onKeyDown={e => { if (e.key === 'Escape') setQuickLook(null) }}>
+          <div className="rounded-lg overflow-hidden shadow-2xl flex flex-col" style={{ width: 560, maxHeight: '70vh', background: 'var(--nox-bg)', border: '1px solid var(--nox-border)' }}>
             {quickLookLoading ? (
               <div className="flex items-center justify-center py-16"><Loader2 className="w-5 h-5 animate-spin" style={{ color: '#3B5CCC' }} /></div>
             ) : quickLook && (<>
@@ -376,10 +394,10 @@ export default function SftpBrowser({ tab }: { tab: Tab }) {
   )
 }
 
-function PaneChrome({ side, label, icon, pane, focused, onNavUp, onRefresh, onMkdir, onToggleHidden }: {
+function PaneChrome({ side, label, icon, pane, focused, onNavUp, onRefresh, onMkdir, onToggleHidden }: Readonly<{
   side: Side; label: string; icon: React.ReactNode; pane: PaneState; focused: boolean
   onNavUp: () => void; onRefresh: () => void; onMkdir: () => void; onToggleHidden: () => void
-}) {
+}>) {
   const segs = pane.path === '/' ? [] : pane.path.split('/').filter(Boolean)
   return (<>
     <div className="flex items-center gap-2 px-3 flex-shrink-0" style={{ height: 32, borderBottom: '1px solid var(--nox-border)', background: focused ? 'var(--nox-shell)' : 'var(--nox-bg)' }}>
@@ -396,12 +414,12 @@ function PaneChrome({ side, label, icon, pane, focused, onNavUp, onRefresh, onMk
   </>)
 }
 
-function FileTable({ pane, visible, side, diffMap, dateFormat, onToggleSort, onSelect, onClear, onNavUp, onNavInto, onDelete, onRename, onDragStart, onDrop, onDoubleClickFile }: {
+function FileTable({ pane, visible, side, diffMap, dateFormat, onToggleSort, onSelect, onClear, onNavUp, onNavInto, onDelete, onRename, onDragStart, onDrop, onDoubleClickFile }: Readonly<{
   pane: PaneState; visible: FileEntry[]; side: Side; diffMap: Map<string, string> | null; dateFormat: string; onToggleSort: (k: SortKey) => void; onSelect: (n: string, e: React.MouseEvent) => void; onClear: () => void; onNavUp: () => void; onNavInto: (e: FileEntry) => void; onDelete?: (e: FileEntry[]) => void; onRename?: (e: FileEntry) => void; onDragStart: (e: FileEntry, ev: React.DragEvent) => void; onDrop: (e: React.DragEvent) => void; onDoubleClickFile: (e: FileEntry) => void
-}) {
+}>) {
   const [dragOver, setDragOver] = useState(false)
   return (
-    <div className="flex-1 overflow-auto relative" style={{ scrollbarWidth: 'thin', scrollbarColor: 'var(--nox-border) transparent' }} onClick={e => { if (e.target === e.currentTarget) onClear() }} onDragOver={e => { e.preventDefault(); setDragOver(true) }} onDragLeave={() => setDragOver(false)} onDrop={e => { setDragOver(false); onDrop(e) }}>
+    <div className="flex-1 overflow-auto relative" style={{ scrollbarWidth: 'thin', scrollbarColor: 'var(--nox-border) transparent' }} onClick={e => { if (e.target === e.currentTarget) onClear() }} onKeyDown={e => { if (e.key === 'Escape') onClear() }} onDragOver={e => { e.preventDefault(); setDragOver(true) }} onDragLeave={() => setDragOver(false)} onDrop={e => { setDragOver(false); onDrop(e) }}>
       {dragOver && <div className="absolute inset-0 z-50 flex items-center justify-center pointer-events-none" style={{ background: 'rgba(59,92,204,0.05)', border: '2px dashed rgba(59,92,204,0.25)' }}><span className="text-[11px] font-medium" style={{ color: '#3B5CCC' }}>Drop to {side === 'remote' ? 'upload' : 'download'}</span></div>}
       <table className="w-full border-collapse text-[11px] font-mono" style={{ tableLayout: 'fixed' }}>
         <colgroup><col /><col style={{ width: 70 }} /><col style={{ width: 130 }} />{onRename && <col style={{ width: 50 }} />}</colgroup>
@@ -415,30 +433,46 @@ function FileTable({ pane, visible, side, diffMap, dateFormat, onToggleSort, onS
           {pane.path !== '/' && <tr className="cursor-default" onClick={onNavUp} onDoubleClick={onNavUp}><td colSpan={onRename ? 4 : 3} className="px-2 py-[4px]" style={{ color: 'var(--nox-text-3)' }}><span className="flex items-center gap-1.5"><ChevronUp className="w-3 h-3" /> ..</span></td></tr>}
           {visible.length === 0 && !pane.loading && !pane.error && <tr><td colSpan={onRename ? 4 : 3} className="text-center py-8" style={{ color: 'var(--nox-text-3)' }}>Empty</td></tr>}
           {pane.error && <tr><td colSpan={onRename ? 4 : 3} className="text-center py-6" style={{ color: '#EF4444' }}>{pane.error}</td></tr>}
-          {visible.map(entry => {
-            const sel = pane.selected.has(entry.name)
-            const diff = diffMap?.get(entry.name)
-            const diffBg = diff === 'local-only' ? 'rgba(16,185,129,0.06)' : diff === 'remote-only' ? 'rgba(139,92,246,0.06)' : diff === 'different' ? 'rgba(245,158,11,0.06)' : undefined
-            const diffDot = diff === 'local-only' ? '#10B981' : diff === 'remote-only' ? '#8B5CF6' : diff === 'different' ? '#F59E0B' : null
-            return (
-              <tr key={entry.name} draggable onDragStart={e => onDragStart(entry, e)} onClick={e => { e.stopPropagation(); onSelect(entry.name, e) }} onDoubleClick={() => entry.isDirectory ? onNavInto(entry) : onDoubleClickFile(entry)} className="group cursor-default transition-colors" style={{ background: sel ? 'rgba(59,92,204,0.08)' : diffBg }} onMouseEnter={e => { if (!sel) e.currentTarget.style.background = sel ? 'rgba(59,92,204,0.08)' : 'var(--nox-hover)' }} onMouseLeave={e => { if (!sel) e.currentTarget.style.background = diffBg || '' }}>
-                <td className="px-2 py-[4px] truncate"><span className="flex items-center gap-1.5 min-w-0">{diffDot && <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: diffDot }} />}{entry.isDirectory ? <FolderOpen className="w-3 h-3 flex-shrink-0" style={{ color: '#8B5CF6' }} /> : <File className="w-3 h-3 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />}<span className="truncate" style={{ color: entry.isDirectory ? 'var(--nox-text)' : 'var(--nox-text-2)' }}>{entry.name}</span></span></td>
-                <td className="px-2 py-[4px] text-right" style={{ color: 'var(--nox-text-3)' }}>{entry.isDirectory ? '—' : formatFileSize(entry.size)}</td>
-                <td className="px-2 py-[4px]" style={{ color: 'var(--nox-text-3)', fontSize: 10 }}>{formatDate(entry.mtime, dateFormat)}</td>
-                {onRename && <td className="px-1 py-[4px]"><span className="flex items-center gap-0 opacity-0 group-hover:opacity-100 transition-opacity"><button title="Rename" onClick={e => { e.stopPropagation(); onRename(entry) }} className="w-4 h-4 flex items-center justify-center rounded" style={{ color: 'var(--nox-text-3)' }}><Pencil className="w-2.5 h-2.5" /></button>{onDelete && <button title="Delete" onClick={e => { e.stopPropagation(); onDelete([entry]) }} className="w-4 h-4 flex items-center justify-center rounded" style={{ color: '#EF4444' }}><Trash2 className="w-2.5 h-2.5" /></button>}</span></td>}
-              </tr>)
-          })}
+          {visible.map(entry => (
+            <FileRow key={entry.name} entry={entry} sel={pane.selected.has(entry.name)} diff={diffMap?.get(entry.name)}
+              dateFormat={dateFormat} onSelect={onSelect} onNavInto={onNavInto} onDoubleClickFile={onDoubleClickFile}
+              onDragStart={onDragStart} onRename={onRename} onDelete={onDelete} />
+          ))}
         </tbody>
       </table>
     </div>
   )
 }
 
-function Th({ label, sk, pane, onSort, align }: { label: string; sk: SortKey; pane: PaneState; onSort: (k: SortKey) => void; align?: 'right' }) {
+const DIFF_BG: Record<string, string> = {
+  'local-only': 'rgba(16,185,129,0.06)', 'remote-only': 'rgba(139,92,246,0.06)', different: 'rgba(245,158,11,0.06)',
+}
+const DIFF_DOT: Record<string, string> = {
+  'local-only': '#10B981', 'remote-only': '#8B5CF6', different: '#F59E0B',
+}
+
+function FileRow({ entry, sel, diff, dateFormat, onSelect, onNavInto, onDoubleClickFile, onDragStart, onRename, onDelete }: Readonly<{
+  entry: FileEntry; sel: boolean; diff: string | undefined; dateFormat: string
+  onSelect: (n: string, e: React.MouseEvent) => void; onNavInto: (e: FileEntry) => void; onDoubleClickFile: (e: FileEntry) => void
+  onDragStart: (e: FileEntry, ev: React.DragEvent) => void; onRename?: (e: FileEntry) => void; onDelete?: (e: FileEntry[]) => void
+}>) {
+  const diffBg = diff ? DIFF_BG[diff] : undefined
+  const diffDot = diff ? DIFF_DOT[diff] : undefined
+  return (
+    <tr draggable onDragStart={e => onDragStart(entry, e)} onClick={e => { e.stopPropagation(); onSelect(entry.name, e) }} onDoubleClick={() => entry.isDirectory ? onNavInto(entry) : onDoubleClickFile(entry)} className="group cursor-default transition-colors" style={{ background: sel ? 'rgba(59,92,204,0.08)' : diffBg }} onMouseEnter={e => { if (!sel) e.currentTarget.style.background = 'var(--nox-hover)' }} onMouseLeave={e => { if (!sel) e.currentTarget.style.background = diffBg || '' }}>
+      <td className="px-2 py-[4px] truncate"><span className="flex items-center gap-1.5 min-w-0">{diffDot && <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: diffDot }} />}{entry.isDirectory ? <FolderOpen className="w-3 h-3 flex-shrink-0" style={{ color: '#8B5CF6' }} /> : <File className="w-3 h-3 flex-shrink-0" style={{ color: 'var(--nox-text-3)' }} />}<span className="truncate" style={{ color: entry.isDirectory ? 'var(--nox-text)' : 'var(--nox-text-2)' }}>{entry.name}</span></span></td>
+      <td className="px-2 py-[4px] text-right" style={{ color: 'var(--nox-text-3)' }}>{entry.isDirectory ? '—' : formatFileSize(entry.size)}</td>
+      <td className="px-2 py-[4px]" style={{ color: 'var(--nox-text-3)', fontSize: 10 }}>{formatDate(entry.mtime, dateFormat)}</td>
+      {onRename && <td className="px-1 py-[4px]"><span className="flex items-center gap-0 opacity-0 group-hover:opacity-100 transition-opacity"><button title="Rename" onClick={e => { e.stopPropagation(); onRename(entry) }} className="w-4 h-4 flex items-center justify-center rounded" style={{ color: 'var(--nox-text-3)' }}><Pencil className="w-2.5 h-2.5" /></button>{onDelete && <button title="Delete" onClick={e => { e.stopPropagation(); onDelete([entry]) }} className="w-4 h-4 flex items-center justify-center rounded" style={{ color: '#EF4444' }}><Trash2 className="w-2.5 h-2.5" /></button>}</span></td>}
+    </tr>
+  )
+}
+
+function Th({ label, sk, pane, onSort, align }: Readonly<{ label: string; sk: SortKey; pane: PaneState; onSort: (k: SortKey) => void; align?: 'right' }>) {
   const active = pane.sortKey === sk
   return <th className="px-2 py-1.5 text-[9px] uppercase tracking-wider font-semibold cursor-pointer select-none whitespace-nowrap" style={{ textAlign: align || 'left', background: 'var(--nox-shell)', borderBottom: '1px solid var(--nox-border)', color: active ? 'var(--nox-text)' : 'var(--nox-text-3)' }} onClick={() => onSort(sk)}>{label}{active && <ArrowUpDown className="w-2 h-2 inline-block ml-0.5" style={{ transform: pane.sortDir === 'desc' ? 'scaleY(-1)' : undefined }} />}</th>
 }
 
-function Btn({ title, onClick, disabled, active, children }: { title: string; onClick: () => void; disabled?: boolean; active?: boolean; children: React.ReactNode }) {
+function Btn({ title, onClick, disabled, active, children }: Readonly<{ title: string; onClick: () => void; disabled?: boolean; active?: boolean; children: React.ReactNode }>) {
   return <button onClick={onClick} title={title} disabled={disabled} className="w-5 h-5 flex items-center justify-center rounded transition-colors disabled:opacity-25" style={{ color: active ? '#3B5CCC' : 'var(--nox-text-3)' }} onMouseEnter={e => { if (!disabled) e.currentTarget.style.background = 'var(--nox-hover)' }} onMouseLeave={e => { e.currentTarget.style.background = '' }}>{children}</button>
 }
diff --git a/src/renderer/src/components/SFTP/__tests__/FilesDrawer.test.tsx b/src/renderer/src/components/SFTP/__tests__/FilesDrawer.test.tsx
new file mode 100644
index 0000000..ed3137e
--- /dev/null
+++ b/src/renderer/src/components/SFTP/__tests__/FilesDrawer.test.tsx
@@ -0,0 +1,57 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import FilesDrawer from '../FilesDrawer'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+
+const entries = [
+  { name: 'zeta.txt', size: 2048, mtime: 0, isDirectory: false },
+  { name: 'etc', size: 0, mtime: 0, isDirectory: true },
+  { name: 'alpha.txt', size: 10, mtime: 0, isDirectory: false },
+]
+
+let api: WindowApiMock
+
+describe('FilesDrawer', () => {
+  beforeEach(() => {
+    api = installWindowApi({ sftp: { list: vi.fn().mockResolvedValue(entries) } })
+    seedStore({
+      sessions: [makeSession({ id: 's1', host: 'files.example.com' })],
+      tabs: [], notifications: [],
+    })
+  })
+
+  function renderDrawer() {
+    const tab = makeTab({ sessionId: 's1', streamId: 'stream-1' })
+    return render(<FilesDrawer tab={tab} onClose={vi.fn()} />)
+  }
+
+  it('lists directory entries with directories first, then files alphabetically', async () => {
+    const { container } = renderDrawer()
+    await waitFor(() => expect(screen.getByText('alpha.txt')).toBeTruthy())
+
+    const text = container.textContent ?? ''
+    const dir = text.indexOf('etc')
+    const a = text.indexOf('alpha.txt')
+    const z = text.indexOf('zeta.txt')
+    expect(dir).toBeLessThan(a)
+    expect(a).toBeLessThan(z)
+
+    // Footer shows the entry count
+    expect(screen.getByText('3 items')).toBeTruthy()
+  })
+
+  it('navigates into directories', async () => {
+    renderDrawer()
+    await waitFor(() => expect(screen.getByText('etc')).toBeTruthy())
+
+    fireEvent.click(screen.getByTitle('Open'))
+    await waitFor(() => expect(api.sftp.list).toHaveBeenCalledWith('sftp-1', '/etc'))
+  })
+
+  it('shows the connection error state when SFTP fails', async () => {
+    api.sftp.connect.mockRejectedValueOnce(new Error('auth failed'))
+    renderDrawer()
+    await waitFor(() => expect(screen.getByText('auth failed')).toBeTruthy())
+  })
+})
diff --git a/src/renderer/src/components/SFTP/__tests__/SftpBrowser.test.tsx b/src/renderer/src/components/SFTP/__tests__/SftpBrowser.test.tsx
new file mode 100644
index 0000000..69a5efd
--- /dev/null
+++ b/src/renderer/src/components/SFTP/__tests__/SftpBrowser.test.tsx
@@ -0,0 +1,338 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, waitFor, fireEvent, cleanup } from '@testing-library/react'
+import SftpBrowser from '../SftpBrowser'
+import { installWindowApi, seedStore, makeSession, makeTab } from '../../../__tests__/harness'
+
+interface Entry { name: string; size: number; mtime: number; permissions: number; isDirectory: boolean }
+const f = (name: string, size = 0, mtime = 0, isDirectory = false): Entry =>
+  ({ name, size, mtime, permissions: 0o644, isDirectory })
+
+const LOCAL_ENTRIES = [f('docs', 0, 0, true), f('notes.txt', 300, 1000), f('big.log', 900, 500), f('.env', 10, 1)]
+const REMOTE_ENTRIES = [f('etc', 0, 0, true), f('alpha.txt', 50, 900), f('zeta.txt', 5, 100), f('.bashrc', 1, 1)]
+
+function setup(overrides: Record<string, any> = {}) {
+  const api = installWindowApi({
+    localfs: {
+      home: vi.fn().mockResolvedValue('/home/user'),
+      list: vi.fn().mockResolvedValue(LOCAL_ENTRIES),
+      readTextFile: vi.fn().mockResolvedValue('local file contents'),
+    },
+    sftp: {
+      connect: vi.fn().mockResolvedValue('sftp-1'),
+      list: vi.fn().mockResolvedValue(REMOTE_ENTRIES),
+      readFile: vi.fn().mockResolvedValue('remote file contents'),
+    },
+    ...overrides,
+  })
+  const session = makeSession({ type: 'sftp' })
+  seedStore({ sessions: [session], tabs: [], activeTabId: null })
+  // streamId → connectSftp piggybacks on the live SSH stream, no credential lookup
+  const tab = makeTab({ view: 'sftp', sessionId: session.id, streamId: 'stream-1' })
+  const utils = render(<SftpBrowser tab={tab} />)
+  return { api, session, tab, ...utils }
+}
+
+/** First-column names of a pane's table (0 = local, 1 = remote). */
+function paneNames(container: HTMLElement, idx: 0 | 1): string[] {
+  const table = container.querySelectorAll('table')[idx]
+  return [...table.querySelectorAll('tbody tr td:first-child')].map(td => td.textContent ?? '')
+}
+
+async function ready() {
+  await waitFor(() => expect(screen.getByText('alpha.txt')).toBeTruthy())
+}
+
+beforeEach(() => {
+  cleanup()
+})
+
+describe('SftpBrowser — connect and listing', () => {
+  it('connects and renders both panes with directories first and hidden files filtered', async () => {
+    const { container } = setup()
+    await ready()
+    const remote = paneNames(container, 1)
+    expect(remote[0]).toContain('etc')
+    expect(remote.join()).toContain('alpha.txt')
+    expect(remote.join()).toContain('zeta.txt')
+    expect(remote.join()).not.toContain('.bashrc')
+    const local = paneNames(container, 0)
+    expect(local.some(n => n.includes('docs'))).toBe(true)
+    expect(local.join()).not.toContain('.env')
+    // status bar counts exclude hidden files
+    expect(screen.getByText('3 items')).toBeTruthy()
+    expect(screen.getByText('3 items · /')).toBeTruthy()
+  })
+
+  it('shows hidden files when the eye toggle is flipped', async () => {
+    setup()
+    await ready()
+    expect(screen.queryByText('.bashrc')).toBeNull()
+    fireEvent.click(screen.getAllByTitle('Hidden files')[1]) // remote pane
+    expect(screen.getByText('.bashrc')).toBeTruthy()
+    fireEvent.click(screen.getAllByTitle('Hidden files')[0]) // local pane
+    expect(screen.getByText('.env')).toBeTruthy()
+  })
+
+  it('shows a retry screen when the connection fails, and retries', async () => {
+    const connect = vi.fn().mockRejectedValueOnce(new Error('auth failed')).mockResolvedValue('sftp-1')
+    setup({ sftp: { connect, list: vi.fn().mockResolvedValue(REMOTE_ENTRIES) } })
+    await waitFor(() => expect(screen.getByText('auth failed')).toBeTruthy())
+    fireEvent.click(screen.getByText('Retry'))
+    await waitFor(() => expect(screen.getByText('alpha.txt')).toBeTruthy())
+    expect(connect).toHaveBeenCalledTimes(2)
+  })
+
+  it('surfaces a remote listing error inside the pane', async () => {
+    setup({
+      sftp: {
+        connect: vi.fn().mockResolvedValue('sftp-1'),
+        list: vi.fn().mockRejectedValue(new Error('permission denied')),
+      },
+    })
+    await waitFor(() => expect(screen.getByText('permission denied')).toBeTruthy())
+  })
+})
+
+describe('SftpBrowser — sorting', () => {
+  it('sorts by size ascending, then descending on second click', async () => {
+    const { container } = setup()
+    await ready()
+    const sizeHeader = screen.getAllByText('Size')[1] // remote table
+    fireEvent.click(sizeHeader)
+    let names = paneNames(container, 1)
+    expect(names.findIndex(n => n.includes('zeta.txt'))).toBeLessThan(names.findIndex(n => n.includes('alpha.txt')))
+    // directories always sort first
+    expect(names[0]).toContain('etc')
+    fireEvent.click(sizeHeader)
+    names = paneNames(container, 1)
+    expect(names.findIndex(n => n.includes('alpha.txt'))).toBeLessThan(names.findIndex(n => n.includes('zeta.txt')))
+  })
+
+  it('sorts by modified time', async () => {
+    const { container } = setup()
+    await ready()
+    fireEvent.click(screen.getAllByText('Modified')[1])
+    const names = paneNames(container, 1)
+    // zeta mtime 100 < alpha mtime 900
+    expect(names.findIndex(n => n.includes('zeta.txt'))).toBeLessThan(names.findIndex(n => n.includes('alpha.txt')))
+  })
+
+  it('sorts by name descending after toggling the name column', async () => {
+    const { container } = setup()
+    await ready()
+    fireEvent.click(screen.getAllByText('Name')[1]) // already name asc → flips to desc
+    const names = paneNames(container, 1)
+    expect(names.findIndex(n => n.includes('zeta.txt'))).toBeLessThan(names.findIndex(n => n.includes('alpha.txt')))
+  })
+})
+
+describe('SftpBrowser — navigation', () => {
+  it('descends into a directory on double click and back up via ..', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.doubleClick(screen.getByText('etc'))
+    await waitFor(() => expect(api.sftp.list).toHaveBeenCalledWith('sftp-1', '/etc'))
+    // ".." row appears once path is not root (local pane already shows one for /home/user)
+    const ups = await screen.findAllByText('..')
+    fireEvent.click(ups[ups.length - 1]) // remote pane is rendered last
+    await waitFor(() => expect(api.sftp.list).toHaveBeenLastCalledWith('sftp-1', '/'))
+  })
+
+  it('navigates the local pane up from the home directory', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getAllByTitle('Up')[0]) // local pane, path /home/user
+    await waitFor(() => expect(api.localfs.list).toHaveBeenCalledWith('/home'))
+  })
+
+  it('disables the Up button at the remote root', async () => {
+    setup()
+    await ready()
+    const up = screen.getAllByTitle('Up')[1] as HTMLButtonElement
+    expect(up.disabled).toBe(true)
+  })
+})
+
+describe('SftpBrowser — selection and transfers', () => {
+  it('downloads the selected remote file', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.click(screen.getByText('Download'))
+    await waitFor(() =>
+      expect(api.sftp.download).toHaveBeenCalledWith('sftp-1', '/alpha.txt', '/home/user/alpha.txt'),
+    )
+  })
+
+  it('extends the selection with meta-click and downloads both', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.click(screen.getByText('zeta.txt'), { metaKey: true })
+    fireEvent.click(screen.getByText('Download'))
+    await waitFor(() => expect(api.sftp.download).toHaveBeenCalledTimes(2))
+  })
+
+  it('selects a range with shift-click', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.click(screen.getByText('zeta.txt'), { shiftKey: true })
+    fireEvent.click(screen.getByText('Download'))
+    await waitFor(() => expect(api.sftp.download).toHaveBeenCalledTimes(2))
+  })
+
+  it('uploads a selected local file and shows the transfer in the queue', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByText('notes.txt'))
+    fireEvent.click(screen.getByText('Upload'))
+    await waitFor(() =>
+      expect(api.sftp.upload).toHaveBeenCalledWith('sftp-1', '/home/user/notes.txt', '/notes.txt'),
+    )
+    // transfer row rendered in the queue (name appears twice: table + queue)
+    await waitFor(() => expect(screen.getAllByText('notes.txt').length).toBeGreaterThan(1))
+  })
+
+  it('marks a failed upload and shows the error', async () => {
+    setup({
+      sftp: {
+        connect: vi.fn().mockResolvedValue('sftp-1'),
+        list: vi.fn().mockResolvedValue(REMOTE_ENTRIES),
+        upload: vi.fn().mockRejectedValue(new Error('disk full')),
+      },
+    })
+    await ready()
+    fireEvent.click(screen.getByText('notes.txt'))
+    fireEvent.click(screen.getByText('Upload'))
+    await waitFor(() => expect(screen.getByText('disk full')).toBeTruthy())
+  })
+
+  it('meta-click on a selected row deselects it', async () => {
+    setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.click(screen.getByText('alpha.txt'), { metaKey: true })
+    const download = screen.getByText('Download').closest('button') as HTMLButtonElement
+    expect(download.disabled).toBe(true)
+  })
+})
+
+describe('SftpBrowser — quick look', () => {
+  it('opens the remote quick look with Space and closes with Escape', async () => {
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.keyDown(document.body, { key: ' ' })
+    await waitFor(() => expect(screen.getByText('remote file contents')).toBeTruthy())
+    expect(api.sftp.readFile).toHaveBeenCalledWith('sftp-1', '/alpha.txt')
+    expect(screen.getByText('Press Space to close · Esc to dismiss')).toBeTruthy()
+    fireEvent.keyDown(document.body, { key: 'Escape' })
+    await waitFor(() => expect(screen.queryByText('remote file contents')).toBeNull())
+  })
+
+  it('reads local files for quick look when the local pane is focused', async () => {
+    const { api, container } = setup()
+    await ready()
+    // focus local pane, then select a local file
+    fireEvent.click(container.querySelectorAll('table')[0])
+    fireEvent.click(screen.getByText('notes.txt'))
+    fireEvent.keyDown(document.body, { key: ' ' })
+    await waitFor(() => expect(screen.getByText('local file contents')).toBeTruthy())
+    expect(api.localfs.readTextFile).toHaveBeenCalledWith('/home/user/notes.txt')
+  })
+
+  it('falls back to a placeholder for unreadable files', async () => {
+    setup({
+      sftp: {
+        connect: vi.fn().mockResolvedValue('sftp-1'),
+        list: vi.fn().mockResolvedValue(REMOTE_ENTRIES),
+        readFile: vi.fn().mockRejectedValue(new Error('binary')),
+      },
+    })
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.keyDown(document.body, { key: ' ' })
+    await waitFor(() => expect(screen.getByText('(binary or unreadable file)')).toBeTruthy())
+  })
+
+  it('pressing Space again on the same file closes the overlay', async () => {
+    setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.keyDown(document.body, { key: ' ' })
+    await waitFor(() => expect(screen.getByText('remote file contents')).toBeTruthy())
+    fireEvent.keyDown(document.body, { key: ' ' })
+    await waitFor(() => expect(screen.queryByText('remote file contents')).toBeNull())
+  })
+
+  it('closes via the X button', async () => {
+    setup()
+    await ready()
+    fireEvent.click(screen.getByText('alpha.txt'))
+    fireEvent.keyDown(document.body, { key: ' ' })
+    const pre = await screen.findByText('remote file contents')
+    const overlayHeader = pre.previousElementSibling as HTMLElement
+    fireEvent.click(overlayHeader.querySelector('button')!)
+    await waitFor(() => expect(screen.queryByText('remote file contents')).toBeNull())
+  })
+})
+
+describe('SftpBrowser — diff mode and file management', () => {
+  it('toggles diff mode and shows the legend', async () => {
+    // overlapping names so all diff states occur
+    setup({
+      localfs: {
+        home: vi.fn().mockResolvedValue('/home/user'),
+        list: vi.fn().mockResolvedValue([f('same.txt', 10, 1), f('changed.txt', 20, 1), f('onlylocal.txt', 5, 1)]),
+      },
+      sftp: {
+        connect: vi.fn().mockResolvedValue('sftp-1'),
+        list: vi.fn().mockResolvedValue([f('same.txt', 10, 1), f('changed.txt', 99, 1), f('onlyremote.txt', 7, 1)]),
+      },
+    })
+    await waitFor(() => expect(screen.getByText('onlyremote.txt')).toBeTruthy())
+    fireEvent.click(screen.getByText('Diff'))
+    expect(screen.getByText('local only')).toBeTruthy()
+    expect(screen.getByText('remote only')).toBeTruthy()
+    expect(screen.getByText('different')).toBeTruthy()
+  })
+
+  it('creates a remote folder via prompt', async () => {
+    vi.stubGlobal('prompt', vi.fn(() => 'newdir'))
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getByTitle('New folder'))
+    await waitFor(() => expect(api.sftp.mkdir).toHaveBeenCalledWith('sftp-1', '/newdir'))
+    vi.unstubAllGlobals()
+  })
+
+  it('renames a remote file via the row action', async () => {
+    vi.stubGlobal('prompt', vi.fn(() => 'renamed.txt'))
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getAllByTitle('Rename')[1]) // row 0 is the etc dir; row 1 is alpha.txt
+    await waitFor(() =>
+      expect(api.sftp.rename).toHaveBeenCalledWith('sftp-1', '/alpha.txt', '/renamed.txt'),
+    )
+    vi.unstubAllGlobals()
+  })
+
+  it('deletes a remote file after confirmation', async () => {
+    vi.stubGlobal('confirm', vi.fn(() => true))
+    const { api } = setup()
+    await ready()
+    fireEvent.click(screen.getAllByTitle('Delete')[1]) // row 0 is the etc dir; row 1 is alpha.txt
+    await waitFor(() => expect(api.sftp.delete).toHaveBeenCalledWith('sftp-1', '/alpha.txt'))
+    vi.unstubAllGlobals()
+  })
+
+  it('refreshes the remote pane via the refresh button', async () => {
+    const { api } = setup()
+    await ready()
+    const before = api.sftp.list.mock.calls.length
+    fireEvent.click(screen.getAllByTitle('Refresh')[1])
+    await waitFor(() => expect(api.sftp.list.mock.calls.length).toBeGreaterThan(before))
+  })
+})
diff --git a/src/renderer/src/components/ServerContextMenu.tsx b/src/renderer/src/components/ServerContextMenu.tsx
index 7ea69c4..c9a569e 100644
--- a/src/renderer/src/components/ServerContextMenu.tsx
+++ b/src/renderer/src/components/ServerContextMenu.tsx
@@ -35,9 +35,9 @@ export function useMenuBehavior(x: number, y: number, onClose: () => void) {
   return { menuRef, pos }
 }
 
-export function MenuItem({ icon, label, onClick, danger, hasSubmenu }: {
+export function MenuItem({ icon, label, onClick, danger, hasSubmenu }: Readonly<{
   icon: React.ReactNode; label: string; onClick: () => void; danger?: boolean; hasSubmenu?: boolean
-}) {
+}>) {
   return (
     <button
       onClick={onClick}
@@ -53,7 +53,7 @@ export function MenuItem({ icon, label, onClick, danger, hasSubmenu }: {
   )
 }
 
-export function ServerContextMenu({ x, y, session, allGroups, onEdit, onRename, onColorChange, onFavorite, onMoveToProject, onDelete, onClose, onOpenDocker, onOpenRdp }: {
+export function ServerContextMenu({ x, y, session, allGroups, onEdit, onRename, onColorChange, onFavorite, onMoveToProject, onDelete, onClose, onOpenDocker, onOpenRdp }: Readonly<{
   x: number; y: number; session: Session
   allGroups: string[]
   onEdit: () => void
@@ -65,7 +65,7 @@ export function ServerContextMenu({ x, y, session, allGroups, onEdit, onRename,
   onClose: () => void
   onOpenDocker?: () => void
   onOpenRdp?: () => void
-}) {
+}>) {
   const [showMoveMenu, setShowMoveMenu] = useState(false)
   const groupColors = useAppStore(s => s.groupColors)
   const [newProjectName, setNewProjectName] = useState('')
diff --git a/src/renderer/src/components/Settings/Settings.tsx b/src/renderer/src/components/Settings/Settings.tsx
index 876cba9..bae6712 100644
--- a/src/renderer/src/components/Settings/Settings.tsx
+++ b/src/renderer/src/components/Settings/Settings.tsx
@@ -82,7 +82,7 @@ export default function Settings() {
 }
 
 /* ── Toggle switch ───────────────────────────────────────────────────────── */
-function Toggle({ on, onChange }: { on: boolean; onChange: (v: boolean) => void }) {
+function Toggle({ on, onChange }: Readonly<{ on: boolean; onChange: (v: boolean) => void }>) {
   return (
     <button
       onClick={() => onChange(!on)}
@@ -101,7 +101,7 @@ function Toggle({ on, onChange }: { on: boolean; onChange: (v: boolean) => void
 const Divider = () => <div style={{ borderTop: '1px solid var(--nox-border)' }} />
 
 /* ── Small bordered action button ────────────────────────────────────────── */
-function ActionButton({ icon, label, onClick }: { icon: React.ReactNode; label: string; onClick: () => void }) {
+function ActionButton({ icon, label, onClick }: Readonly<{ icon: React.ReactNode; label: string; onClick: () => void }>) {
   return (
     <button
       onClick={onClick}
@@ -117,7 +117,7 @@ function ActionButton({ icon, label, onClick }: { icon: React.ReactNode; label:
 }
 
 /* ── Section card ────────────────────────────────────────────────────────── */
-function Card({ label, children }: { label: string; children: React.ReactNode }) {
+function Card({ label, children }: Readonly<{ label: string; children: React.ReactNode }>) {
   return (
     <div
       className="rounded-md p-5"
@@ -137,11 +137,11 @@ function Card({ label, children }: { label: string; children: React.ReactNode })
 }
 
 /* ── Row ─────────────────────────────────────────────────────────────────── */
-function Row({ label, description, children }: {
+function Row({ label, description, children }: Readonly<{
   label: string
   description?: string
   children: React.ReactNode
-}) {
+}>) {
   return (
     <div className="flex items-center justify-between gap-4">
       <div className="min-w-0">
@@ -155,7 +155,7 @@ function Row({ label, description, children }: {
   )
 }
 
-function Select({ options, value, onChange }: { options: string[]; value: string; onChange: (v: string) => void }) {
+function Select({ options, value, onChange }: Readonly<{ options: string[]; value: string; onChange: (v: string) => void }>) {
   return (
     <select
       value={value}
@@ -207,8 +207,10 @@ function GeneralSettings() {
       const result = await window.api.sessions.import()
       if (result.canceled) return
       setSessions(await window.api.sessions.list())
-      const skippedNote = result.skipped > 0 ? ` (${result.skipped} duplicate${result.skipped !== 1 ? 's' : ''} skipped)` : ''
-      addNotification({ type: 'success', message: `Imported ${result.imported} connection${result.imported !== 1 ? 's' : ''}${skippedNote}` })
+      const dupWord = result.skipped === 1 ? 'duplicate' : 'duplicates'
+      const skippedNote = result.skipped > 0 ? ` (${result.skipped} ${dupWord} skipped)` : ''
+      const connWord = result.imported === 1 ? 'connection' : 'connections'
+      addNotification({ type: 'success', message: `Imported ${result.imported} ${connWord}${skippedNote}` })
     } catch (err: any) {
       addNotification({ type: 'error', message: err?.message ?? 'Import failed' })
     }
@@ -310,7 +312,7 @@ function GeneralSettings() {
 }
 
 /* ── Security settings ───────────────────────────────────────────────────── */
-function SecuritySettings({ onClear }: { onClear: () => void }) {
+function SecuritySettings({ onClear }: Readonly<{ onClear: () => void }>) {
   const { settings, loaded, update } = useSettings()
   const [showAuthModal, setShowAuthModal] = useState(false)
   const [currentMode, setCurrentMode] = useState<'none' | 'pin' | 'password' | 'biometrics' | null>(null)
@@ -458,8 +460,8 @@ function TerminalSettings() {
     setScrollbackDraft(raw)
     if (scrollbackTimer.current) clearTimeout(scrollbackTimer.current)
     scrollbackTimer.current = setTimeout(() => {
-      const n = parseInt(raw, 10)
-      if (!isNaN(n) && n >= 100 && n <= 100000) update('scrollbackSize', n)
+      const n = Number.parseInt(raw, 10)
+      if (!Number.isNaN(n) && n >= 100 && n <= 100000) update('scrollbackSize', n)
     }, 600)
   }
 
@@ -581,11 +583,15 @@ function AboutSettings() {
     }
   })()
 
-  const statusColor =
-    status?.state === 'error' ? '#EF4444'
-    : status?.state === 'not-available' ? '#10B981'
-    : status?.state === 'available' || status?.state === 'downloaded' ? '#3B5CCC'
-    : 'var(--nox-text-2)'
+  const statusColor = (() => {
+    switch (status?.state) {
+      case 'error': return '#EF4444'
+      case 'not-available': return '#10B981'
+      case 'available':
+      case 'downloaded': return '#3B5CCC'
+      default: return 'var(--nox-text-2)'
+    }
+  })()
 
   // Primary action depends on where we are: download is opt-in, not automatic.
   const action = (() => {
@@ -685,15 +691,102 @@ function AboutSettings() {
 /* ── Change auth modal ───────────────────────────────────────────────────── */
 type AuthMode = 'none' | 'pin' | 'password' | 'biometrics'
 
+type AuthStep = 'verify' | 'select' | 'set'
+
+function authModalTitle(step: AuthStep, selectedMode: AuthMode | null): string {
+  if (step === 'verify') return 'Confirm Your Identity'
+  if (step === 'select') return 'Choose Lock Method'
+  return `Set New ${selectedMode === 'pin' ? 'PIN' : 'Password'}`
+}
+
+function authModalSubtitle(step: AuthStep, selectedMode: AuthMode | null): string {
+  if (step === 'verify') return 'Enter your current credential to continue'
+  if (step === 'select') return 'How should noxed lock on startup?'
+  return selectedMode === 'pin' ? 'Choose a 4-digit PIN' : 'Choose a strong password'
+}
+
+function BiometricVerify({ loading, error, onRetry }: Readonly<{
+  loading: boolean; error: string; onRetry: () => void
+}>) {
+  return (
+    <div className="flex flex-col items-center gap-4">
+      <div
+        className="w-16 h-16 rounded-2xl flex items-center justify-center"
+        style={{ background: 'var(--nox-surface)', border: '1px solid var(--nox-border)' }}
+      >
+        <Fingerprint
+          className="w-9 h-9"
+          style={{ color: loading ? '#3B5CCC' : 'var(--nox-text-2)' }}
+        />
+      </div>
+      <p className="font-['Inter'] text-[12.5px] text-center" style={{ color: 'var(--nox-text-2)' }}>
+        {loading ? 'Waiting for Touch ID…' : 'Place your finger on the sensor'}
+      </p>
+      {error && <p className="font-['Inter'] text-[12px] text-[#EF4444] text-center">{error}</p>}
+      {!loading && (
+        <button
+          onClick={onRetry}
+          className="w-full py-2 rounded-lg font-['Inter'] text-[13px] font-semibold text-white"
+          style={{ background: '#3B5CCC' }}
+        >
+          Try Again
+        </button>
+      )}
+    </div>
+  )
+}
+
+function SetPasswordInput({ loading, error, newCredential, confirmCredential, showNew, onNewChange, onConfirmChange, onToggleShow, onSubmit }: Readonly<{
+  loading: boolean; error: string; newCredential: string; confirmCredential: string; showNew: boolean
+  onNewChange: (v: string) => void; onConfirmChange: (v: string) => void; onToggleShow: () => void; onSubmit: () => void
+}>) {
+  return (
+    <div className="space-y-3">
+      <div className="relative">
+        <input
+          type={showNew ? 'text' : 'password'}
+          value={newCredential}
+          onChange={e => onNewChange(e.target.value)}
+          placeholder="New password"
+          autoFocus
+          className="w-full rounded-lg px-4 py-2.5 font-['Inter'] text-[13px] focus:outline-none focus:ring-2 focus:ring-[#3B5CCC]"
+          style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)', color: 'var(--nox-text)' }}
+        />
+        <button type="button" onClick={onToggleShow} className="absolute right-3 top-1/2 -translate-y-1/2" style={{ color: 'var(--nox-text-3)' }}>
+          {showNew ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
+        </button>
+      </div>
+      <input
+        type="password"
+        value={confirmCredential}
+        onChange={e => onConfirmChange(e.target.value)}
+        onKeyDown={e => { if (e.key === 'Enter') onSubmit() }}
+        placeholder="Confirm password"
+        className="w-full rounded-lg px-4 py-2.5 font-['Inter'] text-[13px] focus:outline-none focus:ring-2 focus:ring-[#3B5CCC]"
+        style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)', color: 'var(--nox-text)' }}
+      />
+      {error && <p className="font-['Inter'] text-[12px] text-[#EF4444]">{error}</p>}
+      <button
+        onClick={onSubmit}
+        disabled={loading || !newCredential || !confirmCredential}
+        className="w-full py-2.5 rounded-lg font-['Inter'] text-[13px] font-semibold text-white transition-all disabled:opacity-40"
+        style={{ background: '#3B5CCC' }}
+      >
+        {loading ? 'Saving…' : 'Set Password'}
+      </button>
+    </div>
+  )
+}
+
 function ChangeAuthModal({
   currentMode,
   onClose,
   onDone,
-}: {
+}: Readonly<{
   currentMode: AuthMode
   onClose: () => void
   onDone: (mode: AuthMode) => void
-}) {
+}>) {
   // step: 'verify' (verify current) → 'select' (pick new mode) → 'set' (enter new credential)
   const [step, setStep] = useState<'verify' | 'select' | 'set'>(
     currentMode === 'none' ? 'select' : 'verify'
@@ -780,11 +873,13 @@ function ChangeAuthModal({
     }
   }
 
-  const handleSetSubmit = async () => {
+  // `confirmPin` carries the just-completed confirm digits from SetPinInput —
+  // the `confirmDigits` state may not be committed yet when submit fires.
+  const handleSetSubmit = async (confirmPin?: string[]) => {
     if (!selectedMode) return
     if (selectedMode === 'pin') {
       const pin = newDigits.join('')
-      const conf = confirmDigits.join('')
+      const conf = (confirmPin ?? confirmDigits).join('')
       if (pin.length !== 4) { setError('Enter a 4-digit PIN'); return }
       if (pin !== conf) { setError('PINs do not match'); setConfirmDigits([]); setPinPhase('enter'); setNewDigits([]); return }
       applyNewMode(selectedMode, pin)
@@ -796,7 +891,11 @@ function ChangeAuthModal({
   }
 
   return (
-    <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={e => { if (e.target === e.currentTarget) onClose() }}>
+    <div
+      className="fixed inset-0 bg-black/50 flex items-center justify-center z-50"
+      onClick={e => { if (e.target === e.currentTarget) onClose() }}
+      onKeyDown={e => { if (e.key === 'Escape') onClose() }}
+    >
       <div
         className="rounded-xl shadow-2xl w-full max-w-sm mx-4 overflow-hidden"
         style={{ background: 'var(--nox-shell)', border: '1px solid var(--nox-border)' }}
@@ -804,40 +903,17 @@ function ChangeAuthModal({
         {/* Header */}
         <div className="px-6 pt-5 pb-4" style={{ borderBottom: '1px solid var(--nox-border)' }}>
           <h2 className="font-['Plus_Jakarta_Sans'] font-bold text-[17px]" style={{ color: 'var(--nox-text)' }}>
-            {step === 'verify' ? 'Confirm Your Identity' : step === 'select' ? 'Choose Lock Method' : 'Set New ' + (selectedMode === 'pin' ? 'PIN' : 'Password')}
+            {authModalTitle(step, selectedMode)}
           </h2>
           <p className="font-['Inter'] text-[12px] mt-0.5" style={{ color: 'var(--nox-text-2)' }}>
-            {step === 'verify' ? 'Enter your current credential to continue' : step === 'select' ? 'How should noxed lock on startup?' : selectedMode === 'pin' ? 'Choose a 4-digit PIN' : 'Choose a strong password'}
+            {authModalSubtitle(step, selectedMode)}
           </p>
         </div>
 
         <div className="p-6 space-y-4">
           {/* ── VERIFY STEP ── */}
           {step === 'verify' && currentMode === 'biometrics' && (
-            <div className="flex flex-col items-center gap-4">
-              <div
-                className="w-16 h-16 rounded-2xl flex items-center justify-center"
-                style={{ background: 'var(--nox-surface)', border: '1px solid var(--nox-border)' }}
-              >
-                <Fingerprint
-                  className="w-9 h-9"
-                  style={{ color: loading ? '#3B5CCC' : 'var(--nox-text-2)' }}
-                />
-              </div>
-              <p className="font-['Inter'] text-[12.5px] text-center" style={{ color: 'var(--nox-text-2)' }}>
-                {loading ? 'Waiting for Touch ID…' : 'Place your finger on the sensor'}
-              </p>
-              {error && <p className="font-['Inter'] text-[12px] text-[#EF4444] text-center">{error}</p>}
-              {!loading && (
-                <button
-                  onClick={handleBiometricVerify}
-                  className="w-full py-2 rounded-lg font-['Inter'] text-[13px] font-semibold text-white"
-                  style={{ background: '#3B5CCC' }}
-                >
-                  Try Again
-                </button>
-              )}
-            </div>
+            <BiometricVerify loading={loading} error={error} onRetry={handleBiometricVerify} />
           )}
 
           {step === 'verify' && currentMode === 'pin' && (
@@ -912,40 +988,17 @@ function ChangeAuthModal({
           )}
 
           {step === 'set' && selectedMode === 'password' && (
-            <div className="space-y-3">
-              <div className="relative">
-                <input
-                  type={showNew ? 'text' : 'password'}
-                  value={newCredential}
-                  onChange={e => setNewCredential(e.target.value)}
-                  placeholder="New password"
-                  autoFocus
-                  className="w-full rounded-lg px-4 py-2.5 font-['Inter'] text-[13px] focus:outline-none focus:ring-2 focus:ring-[#3B5CCC]"
-                  style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)', color: 'var(--nox-text)' }}
-                />
-                <button type="button" onClick={() => setShowNew(s => !s)} className="absolute right-3 top-1/2 -translate-y-1/2" style={{ color: 'var(--nox-text-3)' }}>
-                  {showNew ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
-                </button>
-              </div>
-              <input
-                type="password"
-                value={confirmCredential}
-                onChange={e => setConfirmCredential(e.target.value)}
-                onKeyDown={e => { if (e.key === 'Enter') handleSetSubmit() }}
-                placeholder="Confirm password"
-                className="w-full rounded-lg px-4 py-2.5 font-['Inter'] text-[13px] focus:outline-none focus:ring-2 focus:ring-[#3B5CCC]"
-                style={{ background: 'var(--nox-bg)', border: '1px solid var(--nox-border)', color: 'var(--nox-text)' }}
-              />
-              {error && <p className="font-['Inter'] text-[12px] text-[#EF4444]">{error}</p>}
-              <button
-                onClick={handleSetSubmit}
-                disabled={loading || !newCredential || !confirmCredential}
-                className="w-full py-2.5 rounded-lg font-['Inter'] text-[13px] font-semibold text-white transition-all disabled:opacity-40"
-                style={{ background: '#3B5CCC' }}
-              >
-                {loading ? 'Saving…' : 'Set Password'}
-              </button>
-            </div>
+            <SetPasswordInput
+              loading={loading}
+              error={error}
+              newCredential={newCredential}
+              confirmCredential={confirmCredential}
+              showNew={showNew}
+              onNewChange={setNewCredential}
+              onConfirmChange={setConfirmCredential}
+              onToggleShow={() => setShowNew(s => !s)}
+              onSubmit={() => handleSetSubmit()}
+            />
           )}
         </div>
 
@@ -967,19 +1020,28 @@ function ChangeAuthModal({
 }
 
 /* ── Verify PIN input (compact numpad for modal) ─────────────────────────── */
-function VerifyPinInput({ loading, error, onSubmit }: {
+function VerifyPinInput({ loading, error, onSubmit }: Readonly<{
   loading: boolean; error: string; onSubmit: (pin: string) => void
-}) {
+}>) {
   const [digits, setDigits] = useState<string[]>([])
 
+  const pressKey = (key: string) => {
+    if (key === '⌫') {
+      setDigits(d => d.slice(0, -1))
+      return
+    }
+    if (loading || digits.length >= 4) return
+    const next = [...digits, key]
+    setDigits(next)
+    if (next.length === 4) {
+      setTimeout(() => { onSubmit(next.join('')); setDigits([]) }, 80)
+    }
+  }
+
   useEffect(() => {
     const handler = (e: KeyboardEvent) => {
       if (loading) return
-      if (/^[0-9]$/.test(e.key) && digits.length < 4) {
-        const next = [...digits, e.key]
-        setDigits(next)
-        if (next.length === 4) { onSubmit(next.join('')); setDigits([]) }
-      }
+      if (/^\d$/.test(e.key)) pressKey(e.key)
       if (e.key === 'Backspace') setDigits(d => d.slice(0, -1))
     }
     window.addEventListener('keydown', handler)
@@ -996,17 +1058,12 @@ function VerifyPinInput({ loading, error, onSubmit }: {
       </div>
       {error && <p className="font-['Inter'] text-[12px] text-[#EF4444] text-center">{error}</p>}
       <div className="grid grid-cols-3 gap-2 w-full">
-        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key, i) => {
-          if (key === '') return <div key={i} />
+        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key) => {
+          if (key === '') return <div key="numpad-gap" />
           const isDel = key === '⌫'
           return (
             <button key={key}
-              onClick={() => isDel ? setDigits(d => d.slice(0,-1)) : (() => {
-                if (loading || digits.length >= 4) return
-                const next = [...digits, key]
-                setDigits(next)
-                if (next.length === 4) { setTimeout(() => { onSubmit(next.join('')); setDigits([]) }, 80) }
-              })()}
+              onClick={() => pressKey(key)}
               disabled={loading}
               className="h-11 rounded-lg font-['Plus_Jakarta_Sans'] text-[16px] font-semibold transition-all active:scale-95 disabled:opacity-40"
               style={{
@@ -1023,9 +1080,9 @@ function VerifyPinInput({ loading, error, onSubmit }: {
 }
 
 /* ── Verify password input ───────────────────────────────────────────────── */
-function VerifyPasswordInput({ loading, error, show, onToggleShow, onSubmit }: {
+function VerifyPasswordInput({ loading, error, show, onToggleShow, onSubmit }: Readonly<{
   loading: boolean; error: string; show: boolean; onToggleShow: () => void; onSubmit: (v: string) => void
-}) {
+}>) {
   const [value, setValue] = useState('')
   const ref = useRef<HTMLInputElement>(null)
   useEffect(() => { ref.current?.focus() }, [])
@@ -1060,7 +1117,7 @@ function VerifyPasswordInput({ loading, error, show, onToggleShow, onSubmit }: {
 }
 
 /* ── Set PIN input (two-phase: enter + confirm) ──────────────────────────── */
-function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnterChange, onConfirmChange, onPhaseChange, onSubmit }: {
+function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnterChange, onConfirmChange, onPhaseChange, onSubmit }: Readonly<{
   phase: 'enter' | 'confirm'
   enterDigits: string[]
   confirmDigits: string[]
@@ -1069,28 +1126,11 @@ function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnte
   onEnterChange: (d: string[]) => void
   onConfirmChange: (d: string[]) => void
   onPhaseChange: (p: 'enter' | 'confirm') => void
-  onSubmit: () => void
-}) {
+  onSubmit: (confirmPin: string[]) => void
+}>) {
   const digits = phase === 'enter' ? enterDigits : confirmDigits
   const setDigits = phase === 'enter' ? onEnterChange : onConfirmChange
 
-  useEffect(() => {
-    const handler = (e: KeyboardEvent) => {
-      if (loading) return
-      if (/^[0-9]$/.test(e.key) && digits.length < 4) {
-        const next = [...digits, e.key]
-        setDigits(next)
-        if (next.length === 4) {
-          if (phase === 'enter') { onPhaseChange('confirm') }
-          else { onSubmit() }
-        }
-      }
-      if (e.key === 'Backspace') setDigits(digits.slice(0, -1))
-    }
-    window.addEventListener('keydown', handler)
-    return () => window.removeEventListener('keydown', handler)
-  }, [digits, loading, phase])
-
   const pressKey = (key: string) => {
     if (loading || digits.length >= 4) return
     const next = [...digits, key]
@@ -1098,11 +1138,21 @@ function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnte
     if (next.length === 4) {
       setTimeout(() => {
         if (phase === 'enter') { onPhaseChange('confirm') }
-        else { onSubmit() }
+        else { onSubmit(next) }
       }, 80)
     }
   }
 
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (loading) return
+      if (/^[0-9]$/.test(e.key)) pressKey(e.key)
+      if (e.key === 'Backspace') setDigits(digits.slice(0, -1))
+    }
+    window.addEventListener('keydown', handler)
+    return () => window.removeEventListener('keydown', handler)
+  }, [digits, loading, phase])
+
   return (
     <div className="flex flex-col items-center gap-4">
       <p className="font-['Inter'] text-[12px]" style={{ color: 'var(--nox-text-2)' }}>
@@ -1116,8 +1166,8 @@ function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnte
       </div>
       {error && <p className="font-['Inter'] text-[12px] text-[#EF4444] text-center">{error}</p>}
       <div className="grid grid-cols-3 gap-2 w-full">
-        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key, i) => {
-          if (key === '') return <div key={i} />
+        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key) => {
+          if (key === '') return <div key="numpad-gap" />
           const isDel = key === '⌫'
           return (
             <button key={key}
@@ -1138,12 +1188,20 @@ function SetPinInput({ phase, enterDigits, confirmDigits, loading, error, onEnte
 }
 
 /* ── Clear credentials modal ─────────────────────────────────────────────── */
-function ClearCredentialsModal({ onCancel, onConfirm }: { onCancel: () => void; onConfirm: () => void }) {
+function ClearCredentialsModal({ onCancel, onConfirm }: Readonly<{ onCancel: () => void; onConfirm: () => Promise<void> }>) {
   const [clearing, setClearing] = useState(false)
+  const [error, setError] = useState('')
 
   const handleConfirm = async () => {
     setClearing(true)
-    await onConfirm()
+    setError('')
+    try {
+      await onConfirm()
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to clear credentials')
+    } finally {
+      setClearing(false)
+    }
   }
 
   return (
@@ -1167,6 +1225,7 @@ function ClearCredentialsModal({ onCancel, onConfirm }: { onCancel: () => void;
           <p className="font-['Inter'] text-[13px] mb-6" style={{ color: 'var(--nox-text-2)' }}>
             This will permanently delete all stored passwords, SSH keys, database credentials, and connection configurations. Your data cannot be recovered after this action.
           </p>
+          {error && <p className="font-['Inter'] text-[12px] text-[#EF4444] mb-4">{error}</p>}
           <div className="flex items-center justify-end gap-3">
             <button
               onClick={onCancel}
diff --git a/src/renderer/src/components/Settings/__tests__/Settings.test.tsx b/src/renderer/src/components/Settings/__tests__/Settings.test.tsx
new file mode 100644
index 0000000..b41a3bd
--- /dev/null
+++ b/src/renderer/src/components/Settings/__tests__/Settings.test.tsx
@@ -0,0 +1,359 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent, waitFor, within, act } from '@testing-library/react'
+import Settings from '../Settings'
+import { installWindowApi, seedStore } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+type AuthMode = 'none' | 'pin' | 'password' | 'biometrics'
+
+function setup(opts: { authMode?: AuthMode; touchIdAvailable?: boolean } = {}) {
+  let saved: Record<string, any> = {}
+  const api = installWindowApi({
+    settings: {
+      get: vi.fn().mockImplementation(async () => saved),
+      set: vi.fn().mockImplementation(async (key: string, value: unknown) => {
+        saved = { ...saved, [key]: value }
+        return saved
+      }),
+    },
+    auth: {
+      getMode: vi.fn().mockResolvedValue(opts.authMode ?? 'password'),
+      isAvailable: vi.fn().mockResolvedValue(opts.touchIdAvailable ?? true),
+      unlock: vi.fn().mockResolvedValue({ success: true }),
+      setup: vi.fn().mockResolvedValue({ success: true }),
+    },
+    sessions: {
+      count: vi.fn().mockResolvedValue(3),
+      export: vi.fn().mockResolvedValue({ exported: 2, canceled: false }),
+      import: vi.fn().mockResolvedValue({ imported: 1, skipped: 2, canceled: false }),
+    },
+  })
+  render(<Settings />)
+  return api
+}
+
+/** Root element of a settings Row, for scoping queries to that row. */
+function rowFor(label: string): HTMLElement {
+  return screen.getByText(label).closest('div')!.parentElement as HTMLElement
+}
+
+/** The auth-modal overlay, for scoping numpad/button queries. */
+function modalRoot(): HTMLElement {
+  return document.querySelector('.fixed.inset-0') as HTMLElement
+}
+
+async function openSecurityTab() {
+  fireEvent.click(screen.getByRole('button', { name: 'Security' }))
+  await screen.findByText('Lock Method')
+}
+
+describe('Settings — General', () => {
+  beforeEach(() => seedStore({ notifications: [], sessions: [], updateStatus: null }))
+
+  it('updates display and connection preferences', async () => {
+    const api = setup()
+    await screen.findByRole('heading', { name: 'General' })
+
+    const dateSelect = within(rowFor('Date Format')).getByRole('combobox')
+    fireEvent.change(dateSelect, { target: { value: 'DD/MM/YYYY HH:mm' } })
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('dateFormat', 'DD/MM/YYYY HH:mm'))
+
+    fireEvent.click(screen.getByText('Collapsed'))
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('sidebarDefault', 'collapsed'))
+    fireEvent.click(screen.getByText('Expanded'))
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('sidebarDefault', 'expanded'))
+
+    // Toggle starts on (default true) → click turns it off
+    fireEvent.click(within(rowFor('Confirm Before Closing Tabs')).getByRole('button'))
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('confirmClose', false))
+
+    const keepalive = within(rowFor('Keep Connections Alive')).getByRole('combobox')
+    fireEvent.change(keepalive, { target: { value: 'Off' } })
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('sshKeepalive', 'Off'))
+  })
+
+  it('exports connections and reports the result', async () => {
+    const api = setup()
+    await screen.findByRole('heading', { name: 'General' })
+    // Hover feedback on the bordered action button
+    const exportBtn = screen.getByText('Export').closest('button') as HTMLElement
+    fireEvent.mouseEnter(exportBtn)
+    expect(exportBtn.style.background).toBe('var(--nox-hover)')
+    fireEvent.mouseLeave(exportBtn)
+    expect(exportBtn.style.background).toBe('transparent')
+    fireEvent.click(screen.getByText('Export'))
+    await waitFor(() => {
+      expect(useAppStore.getState().notifications.some(n => n.message === 'Exported 2 connections')).toBe(true)
+    })
+
+    api.sessions.export.mockRejectedValueOnce(new Error('disk full'))
+    fireEvent.click(screen.getByText('Export'))
+    await waitFor(() => {
+      expect(useAppStore.getState().notifications.some(n => n.type === 'error' && n.message === 'disk full')).toBe(true)
+    })
+  })
+
+  it('imports connections, refreshes the session list and notes duplicates', async () => {
+    const api = setup()
+    await screen.findByRole('heading', { name: 'General' })
+    fireEvent.click(screen.getByText('Import'))
+    await waitFor(() => {
+      expect(useAppStore.getState().notifications.some(n => n.message === 'Imported 1 connection (2 duplicates skipped)')).toBe(true)
+    })
+    expect(api.sessions.list).toHaveBeenCalled()
+
+    // A canceled dialog produces no notification
+    const before = useAppStore.getState().notifications.length
+    api.sessions.import.mockResolvedValueOnce({ canceled: true, imported: 0, skipped: 0 })
+    fireEvent.click(screen.getByText('Import'))
+    await waitFor(() => expect(api.sessions.import).toHaveBeenCalledTimes(2))
+    expect(useAppStore.getState().notifications).toHaveLength(before)
+  })
+})
+
+describe('Settings — Terminal', () => {
+  beforeEach(() => seedStore({ notifications: [], updateStatus: null }))
+
+  it('steps the font size and toggles behavior switches', async () => {
+    const api = setup()
+    fireEvent.click(screen.getByRole('button', { name: 'Terminal' }))
+    await screen.findByText('Font Size')
+
+    const fontRow = rowFor('Font Size')
+    const [minus, plus] = within(fontRow).getAllByRole('button')
+    fireEvent.click(plus)
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('terminalFontSize', 15))
+    fireEvent.click(minus)
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('terminalFontSize', 14))
+
+    fireEvent.click(within(rowFor('Copy on Select')).getByRole('button'))
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('copyOnSelect', true))
+  })
+})
+
+describe('Settings — About', () => {
+  beforeEach(() => seedStore({ notifications: [], updateStatus: null }))
+
+  it('shows the version and checks for updates when idle', async () => {
+    const api = setup()
+    fireEvent.click(screen.getByRole('button', { name: 'About' }))
+    expect(await screen.findByText('0.0.0-test')).toBeTruthy()
+    fireEvent.click(screen.getByText('Check for Updates'))
+    expect(api.updater.check).toHaveBeenCalledTimes(1)
+  })
+
+  it('walks the updater states: checking, available, downloading, downloaded, latest, error', async () => {
+    const api = setup()
+    fireEvent.click(screen.getByRole('button', { name: 'About' }))
+    await screen.findByText('0.0.0-test')
+
+    act(() => seedStore({ updateStatus: { state: 'checking' } }))
+    expect(screen.getByText('Checking for updates…')).toBeTruthy()
+    expect((screen.getByText('Check for Updates').closest('button') as HTMLButtonElement).disabled).toBe(true)
+
+    act(() => seedStore({ updateStatus: { state: 'available', version: '1.2.3' } }))
+    expect(screen.getByText('Version 1.2.3 is available')).toBeTruthy()
+    fireEvent.click(screen.getByText('Download v1.2.3'))
+    expect(api.updater.download).toHaveBeenCalledTimes(1)
+
+    act(() => seedStore({ updateStatus: { state: 'downloading', percent: 55 } }))
+    expect(screen.getByText('Downloading update… 55%')).toBeTruthy()
+
+    act(() => seedStore({ updateStatus: { state: 'downloaded', version: '1.2.3' } }))
+    expect(screen.getByText('Update v1.2.3 is ready to install')).toBeTruthy()
+    fireEvent.click(screen.getByText('Restart & Install'))
+    expect(api.updater.quitAndInstall).toHaveBeenCalledTimes(1)
+
+    act(() => seedStore({ updateStatus: { state: 'not-available', version: '0.1.0' } }))
+    expect(screen.getByText("You're on the latest version")).toBeTruthy()
+
+    act(() => seedStore({ updateStatus: { state: 'error', message: 'network unreachable' } }))
+    expect(screen.getByText('network unreachable')).toBeTruthy()
+  })
+})
+
+describe('Settings — Security', () => {
+  beforeEach(() => seedStore({ notifications: [], updateStatus: null }))
+
+  it('shows the current lock method, credential count and auto-lock select', async () => {
+    const api = setup({ authMode: 'password' })
+    await openSecurityTab()
+    expect(await screen.findByText('Password')).toBeTruthy()
+    expect(await screen.findByText('3')).toBeTruthy()
+    const select = within(rowFor('Auto-lock Timeout')).getByRole('combobox')
+    fireEvent.change(select, { target: { value: 'Never' } })
+    await waitFor(() => expect(api.settings.set).toHaveBeenCalledWith('autoLockTimeout', 'Never'))
+  })
+
+  it('clears all credentials through the confirmation modal', async () => {
+    const api = setup()
+    await openSecurityTab()
+    fireEvent.click(screen.getByText('Clear All'))
+    expect(screen.getByText('Clear All Credentials?')).toBeTruthy()
+
+    // Cancel first
+    fireEvent.click(screen.getByText('Cancel'))
+    expect(screen.queryByText('Clear All Credentials?')).toBeNull()
+    expect(api.sessions.clearAll).not.toHaveBeenCalled()
+
+    fireEvent.click(screen.getByText('Clear All'))
+    fireEvent.click(screen.getByText('Yes, Clear All'))
+    await waitFor(() => expect(api.sessions.clearAll).toHaveBeenCalledTimes(1))
+    await waitFor(() => expect(screen.queryByText('Clear All Credentials?')).toBeNull())
+  })
+
+  it('verifies a password, then walks the two-phase PIN entry', async () => {
+    const api = setup({ authMode: 'password' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('Password'))
+    expect(screen.getByText('Confirm Your Identity')).toBeTruthy()
+
+    const input = screen.getByPlaceholderText('Current password') as HTMLInputElement
+    expect(input.type).toBe('password')
+    // Eye toggle reveals the credential
+    fireEvent.click(input.parentElement!.querySelector('button[type="button"]') as HTMLElement)
+    expect((screen.getByPlaceholderText('Current password') as HTMLInputElement).type).toBe('text')
+
+    fireEvent.change(screen.getByPlaceholderText('Current password'), { target: { value: 'hunter2' } })
+    fireEvent.keyDown(screen.getByPlaceholderText('Current password'), { key: 'Enter' })
+    expect(await screen.findByText('Choose Lock Method')).toBeTruthy()
+    expect(api.auth.unlock).toHaveBeenCalledWith('hunter2')
+
+    fireEvent.click(screen.getByText('PIN'))
+    expect(await screen.findByText('Set New PIN')).toBeTruthy()
+    expect(screen.getByText('Enter new PIN')).toBeTruthy()
+
+    // Type 12, backspace, then 234 → PIN 1234, phase flips to confirm
+    for (const key of ['1', '2', 'Backspace', '2', '3', '4']) {
+      fireEvent.keyDown(window, { key })
+    }
+    expect(await screen.findByText('Confirm new PIN')).toBeTruthy()
+    // Confirm the matching PIN via the numpad — setup is called with the
+    // verified password and the flow advances past PIN entry.
+    const modal = modalRoot()
+    fireEvent.click(within(modal).getByText('⌫')) // no-op delete on empty confirm
+    for (const d of ['1', '2', '3', '4']) fireEvent.click(within(modal).getByText(d))
+    await waitFor(() => expect(api.auth.setup).toHaveBeenCalledWith('pin', '1234', 'hunter2'))
+    await waitFor(() => expect(screen.queryByText('Set New PIN')).toBeNull())
+    expect(screen.queryByText('Enter new PIN')).toBeNull()
+  })
+
+  it('rejects mismatched PINs and restarts entry', async () => {
+    setup({ authMode: 'none' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('None'))
+    // Mode 'none' skips verification straight to selection
+    expect(screen.getByText('Choose Lock Method')).toBeTruthy()
+    fireEvent.click(within(modalRoot()).getByText('PIN'))
+    await screen.findByText('Enter new PIN')
+
+    for (const key of ['1', '1', '1', '1']) fireEvent.keyDown(window, { key })
+    await screen.findByText('Confirm new PIN')
+    for (const key of ['2', '2', '2', '2']) fireEvent.keyDown(window, { key })
+    expect(await screen.findByText('PINs do not match')).toBeTruthy()
+    expect(screen.getByText('Enter new PIN')).toBeTruthy()
+  })
+
+  it('sets a new password, catching mismatches first', async () => {
+    const api = setup({ authMode: 'none' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('None'))
+    fireEvent.click(within(modalRoot()).getByText('Password'))
+    expect(await screen.findByText('Set New Password')).toBeTruthy()
+
+    const newInput = screen.getByPlaceholderText('New password') as HTMLInputElement
+    const confirmInput = screen.getByPlaceholderText('Confirm password')
+    // Eye toggle on the new-password field
+    expect(newInput.type).toBe('password')
+    fireEvent.click(newInput.parentElement!.querySelector('button[type="button"]') as HTMLElement)
+    expect((screen.getByPlaceholderText('New password') as HTMLInputElement).type).toBe('text')
+
+    fireEvent.change(newInput, { target: { value: 'abc123' } })
+    fireEvent.change(confirmInput, { target: { value: 'zzz' } })
+    fireEvent.click(screen.getByText('Set Password'))
+    expect(await screen.findByText('Passwords do not match')).toBeTruthy()
+    expect(api.auth.setup).not.toHaveBeenCalled()
+
+    fireEvent.change(screen.getByPlaceholderText('Confirm password'), { target: { value: 'abc123' } })
+    fireEvent.keyDown(screen.getByPlaceholderText('Confirm password'), { key: 'Enter' })
+    await waitFor(() => expect(api.auth.setup).toHaveBeenCalledWith('password', 'abc123', undefined))
+    await waitFor(() => expect(screen.queryByText('Set New Password')).toBeNull())
+  })
+
+  it('verifies an existing PIN on the numpad, including failures and backspace', async () => {
+    const api = setup({ authMode: 'pin' })
+    api.auth.unlock.mockResolvedValueOnce({ success: false, error: 'Wrong PIN' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('PIN'))
+    expect(screen.getByText('Confirm Your Identity')).toBeTruthy()
+
+    const modal = modalRoot()
+    // Punch in a digit, delete it with ⌫, then complete a wrong PIN
+    fireEvent.click(within(modal).getByText('9'))
+    fireEvent.click(within(modal).getByText('⌫'))
+    for (const d of ['1', '1', '1', '2']) fireEvent.click(within(modal).getByText(d))
+    expect(await screen.findByText('Wrong PIN')).toBeTruthy()
+    expect(api.auth.unlock).toHaveBeenCalledWith('1112')
+
+    // Retry with the correct PIN via the keyboard path
+    for (const key of ['4', '3', '2', '1']) fireEvent.keyDown(window, { key })
+    expect(await screen.findByText('Choose Lock Method')).toBeTruthy()
+    expect(api.auth.unlock).toHaveBeenLastCalledWith('4321')
+  })
+
+  it('auto-triggers Touch ID verification and supports retry after failure', async () => {
+    const api = setup({ authMode: 'biometrics' })
+    api.auth.unlock.mockResolvedValueOnce({ success: false, error: 'Touch ID cancelled' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('Touch ID'))
+
+    expect(await screen.findByText('Touch ID cancelled')).toBeTruthy()
+    expect(screen.getByText('Place your finger on the sensor')).toBeTruthy()
+    fireEvent.click(screen.getByText('Try Again'))
+    expect(await screen.findByText('Choose Lock Method')).toBeTruthy()
+    expect(api.auth.unlock).toHaveBeenCalledTimes(2)
+  })
+
+  it('applies mode "none" directly and surfaces setup failures', async () => {
+    const api = setup({ authMode: 'none' })
+    api.auth.setup.mockResolvedValueOnce({ success: false, error: 'keychain unavailable' })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('None'))
+    fireEvent.click(within(modalRoot()).getByText('None'))
+    expect(await screen.findByText('keychain unavailable')).toBeTruthy()
+
+    // Second attempt succeeds and closes the modal
+    fireEvent.click(within(modalRoot()).getByText('None'))
+    await waitFor(() => expect(api.auth.setup).toHaveBeenLastCalledWith('none', undefined, undefined))
+    await waitFor(() => expect(screen.queryByText('Choose Lock Method')).toBeNull())
+  })
+
+  it('disables the Touch ID option when the sensor is unavailable', async () => {
+    setup({ authMode: 'none', touchIdAvailable: false })
+    await openSecurityTab()
+    fireEvent.click(await screen.findByText('None'))
+    const option = within(modalRoot()).getByText('Not available on this Mac').closest('button') as HTMLButtonElement
+    expect(option.disabled).toBe(true)
+  })
+
+  it('closes the modal via Cancel, backdrop click and Escape', async () => {
+    setup({ authMode: 'none' })
+    await openSecurityTab()
+
+    fireEvent.click(await screen.findByText('None'))
+    const cancel = within(modalRoot()).getByText('Cancel')
+    fireEvent.mouseEnter(cancel)
+    fireEvent.mouseLeave(cancel)
+    fireEvent.click(cancel)
+    expect(screen.queryByText('Choose Lock Method')).toBeNull()
+
+    fireEvent.click(screen.getByText('None'))
+    fireEvent.click(modalRoot())
+    expect(screen.queryByText('Choose Lock Method')).toBeNull()
+
+    fireEvent.click(screen.getByText('None'))
+    fireEvent.keyDown(modalRoot(), { key: 'Escape' })
+    expect(screen.queryByText('Choose Lock Method')).toBeNull()
+  })
+})
diff --git a/src/renderer/src/components/Sidebar/Sidebar.tsx b/src/renderer/src/components/Sidebar/Sidebar.tsx
index 9ab1aac..1a37abe 100644
--- a/src/renderer/src/components/Sidebar/Sidebar.tsx
+++ b/src/renderer/src/components/Sidebar/Sidebar.tsx
@@ -277,7 +277,7 @@ export default function Sidebar() {
       </div>
 
       {/* Context menu */}
-      {ctxMenu && ctxMenu.session && (
+      {ctxMenu?.session && (
         <ServerContextMenu
           x={ctxMenu.x}
           y={ctxMenu.y}
@@ -311,7 +311,7 @@ export default function Sidebar() {
 }
 
 /* ── Draggable section ───────────────────────────────────────────────────── */
-function DraggableSection({ label, sessions, connectedIds, renamingId, onContextMenu, onOpen, onRename, onRenameCancel, onReorder }: {
+function DraggableSection({ label, sessions, connectedIds, renamingId, onContextMenu, onOpen, onRename, onRenameCancel, onReorder }: Readonly<{
   label: string
   sessions: Session[]
   connectedIds: Set<string | undefined>
@@ -321,7 +321,7 @@ function DraggableSection({ label, sessions, connectedIds, renamingId, onContext
   onRename: (s: Session, label: string) => void
   onRenameCancel: () => void
   onReorder: (ids: string[]) => void
-}) {
+}>) {
   const dragSrc = useRef<string | null>(null)
   const [dragOver, setDragOver] = useState<string | null>(null)
   const [order, setOrder] = useState<string[]>([])
@@ -383,23 +383,24 @@ function DraggableSection({ label, sessions, connectedIds, renamingId, onContext
 }
 
 /* ── Nav item ────────────────────────────────────────────────────────────── */
-function NavItem({ icon, label, active, onClick }: { icon: React.ReactNode; label: string; active: boolean; onClick: () => void }) {
+function NavItem({ icon, label, active, onClick }: Readonly<{ icon: React.ReactNode; label: string; active: boolean; onClick: () => void }>) {
   return (
-    <div
+    <button
+      type="button"
       onClick={onClick}
-      className="flex items-center gap-2 px-2 py-1.5 rounded-md cursor-pointer mb-0.5 transition-colors"
+      className="w-full text-left flex items-center gap-2 px-2 py-1.5 rounded-md cursor-pointer mb-0.5 transition-colors"
       style={active ? { background: 'var(--nox-active)', color: 'var(--nox-active-t)' } : { color: 'var(--nox-text)' }}
       onMouseEnter={e => { if (!active) (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
       onMouseLeave={e => { if (!active) (e.currentTarget as HTMLElement).style.background = '' }}
     >
       <span style={{ color: active ? 'var(--nox-active-t)' : 'var(--nox-text-2)' }}>{icon}</span>
       <span className="font-['Inter'] text-[12.5px]" style={{ fontWeight: active ? 500 : 400 }}>{label}</span>
-    </div>
+    </button>
   )
 }
 
 /* ── Section group ───────────────────────────────────────────────────────── */
-function SectionGroup({ label, icon, children }: { label: string; icon?: React.ReactNode; children: React.ReactNode }) {
+function SectionGroup({ label, icon, children }: Readonly<{ label: string; icon?: React.ReactNode; children: React.ReactNode }>) {
   return (
     <div className="mt-3 mb-1">
       <div className="flex items-center justify-between px-2 py-1.5">
@@ -414,7 +415,7 @@ function SectionGroup({ label, icon, children }: { label: string; icon?: React.R
 }
 
 /* ── Connection item ─────────────────────────────────────────────────────── */
-function ConnectionItem({ session, connected, isRenaming, onContextMenu, onClick, onRename, onRenameCancel }: {
+function ConnectionItem({ session, connected, isRenaming, onContextMenu, onClick, onRename, onRenameCancel }: Readonly<{
   session: Session
   connected: boolean
   isRenaming: boolean
@@ -422,7 +423,7 @@ function ConnectionItem({ session, connected, isRenaming, onContextMenu, onClick
   onClick: () => void
   onRename: (label: string) => void
   onRenameCancel: () => void
-}) {
+}>) {
   const inputRef = useRef<HTMLInputElement>(null)
   const [draft, setDraft] = useState(session.label || session.host)
 
@@ -454,10 +455,11 @@ function ConnectionItem({ session, connected, isRenaming, onContextMenu, onClick
   }
 
   return (
-    <div
+    <button
+      type="button"
       onClick={onClick}
       onContextMenu={onContextMenu}
-      className="flex items-center gap-2 px-2 py-1 rounded-md cursor-pointer transition-colors"
+      className="w-full text-left flex items-center gap-2 px-2 py-1 rounded-md cursor-pointer transition-colors"
       onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
       onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = '' }}
     >
@@ -466,20 +468,20 @@ function ConnectionItem({ session, connected, isRenaming, onContextMenu, onClick
         {session.label || session.host}
       </span>
       {connected && <span className="w-1.5 h-1.5 rounded-full flex-shrink-0 bg-[#10B981]" />}
-    </div>
+    </button>
   )
 }
 
 
 /* ── Project view ────────────────────────────────────────────────────────── */
-function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, groupOrder, onGroupOrderChange }: {
+function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, groupOrder, onGroupOrderChange }: Readonly<{
   sessions: Session[]
   onConnect: (s: Session) => void
   onContextMenu: (e: React.MouseEvent, s: Session) => void
   onMoveToProject: (session: Session, group: string) => void
   groupOrder: string[]
   onGroupOrderChange: (order: string[]) => void
-}) {
+}>) {
   const [expanded, setExpanded] = useState<Set<string>>(new Set())
   const [groupMenu, setGroupMenu] = useState<{ group: string; x: number; y: number } | null>(null)
   const groupColors = useAppStore(s => s.groupColors)
@@ -605,14 +607,15 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
             }}
           >
             {/* Group header */}
-            <div
+            <button
+              type="button"
               onClick={() => toggle(group)}
               onContextMenu={e => {
                 e.preventDefault()
                 e.stopPropagation()
                 setGroupMenu({ group, x: e.clientX, y: e.clientY })
               }}
-              className="group flex items-center gap-1.5 px-2 py-1.5 rounded-md cursor-pointer transition-colors"
+              className="group w-full text-left flex items-center gap-1.5 px-2 py-1.5 rounded-md cursor-pointer transition-colors"
               style={{
                 background: isGroupTarget || isItemTarget ? 'var(--nox-hover)' : '',
                 outline: isItemTarget ? '1px dashed var(--nox-active-t)' : 'none',
@@ -629,6 +632,7 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
                 onDragStart={e => { e.stopPropagation(); dragGroupSrc.current = group }}
                 onDragEnd={() => { dragGroupSrc.current = null; setDragOverGroup(null) }}
                 onClick={e => e.stopPropagation()}
+                onKeyDown={e => e.stopPropagation()}
               >
                 <GripVertical className="w-3 h-3" />
               </span>
@@ -643,12 +647,13 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
               <span className="text-[10px] px-1.5 py-0.5 rounded" style={{ color: 'var(--nox-text-3)', background: 'var(--nox-border)' }}>
                 {items.length}
               </span>
-            </div>
+            </button>
 
             {isExpanded && (
               <div className="ml-5 mt-0.5 space-y-0.5">
                 {items.map(s => (
-                  <div
+                  <button
+                    type="button"
                     key={s.id}
                     draggable
                     onDragStart={e => { e.stopPropagation(); dragItemSrc.current = s }}
@@ -672,7 +677,7 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
                     }}
                     onClick={() => onConnect(s)}
                     onContextMenu={e => onContextMenu(e, s)}
-                    className="flex items-center gap-2 px-2 py-1 rounded-md cursor-pointer transition-colors"
+                    className="w-full text-left flex items-center gap-2 px-2 py-1 rounded-md cursor-pointer transition-colors"
                     style={{ outline: reorderTarget === s.id ? '1px dashed var(--nox-active-t)' : 'none' }}
                     onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = 'var(--nox-hover)' }}
                     onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = '' }}
@@ -681,7 +686,7 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
                     <span className="font-['Inter'] text-[11.5px] flex-1 truncate" style={{ color: 'var(--nox-text)' }}>
                       {s.label || s.host}
                     </span>
-                  </div>
+                  </button>
                 ))}
               </div>
             )}
@@ -705,7 +710,7 @@ function ProjectView({ sessions, onConnect, onContextMenu, onMoveToProject, grou
 }
 
 /* ── Project context menu ────────────────────────────────────────────────── */
-function GroupContextMenu({ x, y, group, current, onNewConnection, onPick, onClose }: {
+function GroupContextMenu({ x, y, group, current, onNewConnection, onPick, onClose }: Readonly<{
   x: number
   y: number
   group: string
@@ -713,7 +718,7 @@ function GroupContextMenu({ x, y, group, current, onNewConnection, onPick, onClo
   onNewConnection: () => void
   onPick: (color: string | null) => void
   onClose: () => void
-}) {
+}>) {
   const { menuRef, pos } = useMenuBehavior(x, y, onClose)
 
   useEffect(() => {
@@ -742,7 +747,7 @@ function GroupContextMenu({ x, y, group, current, onNewConnection, onPick, onClo
 
       <MenuItem
         icon={<Plus className="w-3.5 h-3.5" />}
-        label={`New Connection in ${group === 'Ungrouped' ? 'Ungrouped' : `"${group}"`}`}
+        label={group === 'Ungrouped' ? 'New Connection in Ungrouped' : `New Connection in "${group}"`}
         onClick={onNewConnection}
       />
 
@@ -781,7 +786,7 @@ function GroupContextMenu({ x, y, group, current, onNewConnection, onPick, onClo
 }
 
 /* ── Connection type icon ────────────────────────────────────────────────── */
-function ConnectionTypeIcon({ type, size = 12 }: { type?: string; size?: number }) {
+function ConnectionTypeIcon({ type, size = 12 }: Readonly<{ type?: string; size?: number }>) {
   const color = 'var(--nox-text-3)'
   switch (type) {
     case 'sftp': return <FolderOpen size={size} style={{ color }} className="flex-shrink-0" />
@@ -793,9 +798,9 @@ function ConnectionTypeIcon({ type, size = 12 }: { type?: string; size?: number
   }
 }
 
-function EmptyAreaMenu({ x, y, onNewConnection, onClose }: {
+function EmptyAreaMenu({ x, y, onNewConnection, onClose }: Readonly<{
   x: number; y: number; onNewConnection: () => void; onClose: () => void
-}) {
+}>) {
   const { menuRef, pos } = useMenuBehavior(x, y, onClose)
 
   return (
diff --git a/src/renderer/src/components/Sidebar/__tests__/Sidebar.test.tsx b/src/renderer/src/components/Sidebar/__tests__/Sidebar.test.tsx
new file mode 100644
index 0000000..56d9fd6
--- /dev/null
+++ b/src/renderer/src/components/Sidebar/__tests__/Sidebar.test.tsx
@@ -0,0 +1,86 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import Sidebar from '../Sidebar'
+import { installWindowApi, seedStore, makeSession } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+function rowFor(label: string): HTMLElement {
+  return screen.getByText(label).closest('button') as HTMLElement
+}
+
+describe('Sidebar', () => {
+  beforeEach(() => {
+    installWindowApi()
+    seedStore({
+      sessions: [], tabs: [], activeTabId: null, notifications: [],
+      sidebarView: 'type', sectionOrder: {}, projectGroupOrder: [],
+      groupColors: {}, focusedPaneId: null, showAddConnection: false,
+    })
+  })
+
+  it('activates nav items on click', () => {
+    render(<Sidebar />)
+
+    fireEvent.click(rowFor('Dashboard'))
+    expect(useAppStore.getState().tabs.some(t => t.view === 'dashboard')).toBe(true)
+
+    fireEvent.click(rowFor('Tunnels'))
+    expect(useAppStore.getState().tabs.some(t => t.view === 'tunnels')).toBe(true)
+
+    fireEvent.click(rowFor('Settings'))
+    expect(useAppStore.getState().tabs.some(t => t.view === 'settings')).toBe(true)
+  })
+
+  it('opens a session tab when a connection row is clicked', () => {
+    seedStore({
+      sessions: [
+        makeSession({ id: 'ssh-1', label: 'Web Server' }),
+        makeSession({ id: 'ssh-2', label: 'Db Server' }),
+      ],
+    })
+    render(<Sidebar />)
+
+    fireEvent.click(rowFor('Web Server'))
+    expect(useAppStore.getState().tabs.some(t => t.sessionId === 'ssh-1' && t.view === 'terminal')).toBe(true)
+
+    fireEvent.click(rowFor('Db Server'))
+    expect(useAppStore.getState().tabs.some(t => t.sessionId === 'ssh-2')).toBe(true)
+  })
+
+  it('opens session tabs on click too', () => {
+    seedStore({ sessions: [makeSession({ id: 'ssh-9', label: 'Clicky' })] })
+    render(<Sidebar />)
+    fireEvent.click(rowFor('Clicky'))
+    expect(useAppStore.getState().tabs.some(t => t.sessionId === 'ssh-9')).toBe(true)
+  })
+
+  it('toggles project groups and connects to grouped sessions on click', () => {
+    seedStore({
+      sidebarView: 'project',
+      sessions: [makeSession({ id: 'p-1', label: 'Prod Box', group: 'Prod' })],
+    })
+    render(<Sidebar />)
+
+    // Group is collapsed initially — the session row is hidden
+    expect(screen.queryByText('Prod Box')).toBeNull()
+
+    fireEvent.click(rowFor('Prod'))
+    expect(screen.getByText('Prod Box')).toBeTruthy()
+
+    fireEvent.click(rowFor('Prod Box'))
+    expect(useAppStore.getState().tabs.some(t => t.sessionId === 'p-1')).toBe(true)
+
+    // Clicking the header again collapses the group
+    fireEvent.click(rowFor('Prod'))
+    expect(screen.queryByText('Prod Box')).toBeNull()
+  })
+
+  it('opens redis sessions through the redis tab action', () => {
+    seedStore({ sessions: [makeSession({ id: 'r-1', label: 'Cache', type: 'redis' })] })
+    render(<Sidebar />)
+    fireEvent.click(rowFor('Cache'))
+    const tab = useAppStore.getState().tabs.find(t => t.sessionId === 'r-1')
+    expect(tab?.view).toBe('redis')
+  })
+})
diff --git a/src/renderer/src/components/StatusBar/StatusBar.tsx b/src/renderer/src/components/StatusBar/StatusBar.tsx
index ab73f1a..8a4f4c5 100644
--- a/src/renderer/src/components/StatusBar/StatusBar.tsx
+++ b/src/renderer/src/components/StatusBar/StatusBar.tsx
@@ -2,6 +2,8 @@ import { useEffect, useState } from 'react'
 import { Shield, Cable } from 'lucide-react'
 import { useAppStore } from '../../store'
 
+const countActive = (list: Array<{ status: string }>) => list.filter(t => t.status === 'active').length
+
 export default function StatusBar() {
   const sessions = useAppStore(s => s.sessions)
   const tabs = useAppStore(s => s.tabs)
@@ -19,7 +21,7 @@ export default function StatusBar() {
   useEffect(() => {
     const refresh = () => {
       window.api.tunnels.list()
-        .then(list => setActiveTunnels(list.filter(t => t.status === 'active').length))
+        .then(list => setActiveTunnels(countActive(list)))
         .catch(() => setActiveTunnels(0))
     }
     refresh()
diff --git a/src/renderer/src/components/StatusBar/__tests__/StatusBar.test.tsx b/src/renderer/src/components/StatusBar/__tests__/StatusBar.test.tsx
new file mode 100644
index 0000000..8d58263
--- /dev/null
+++ b/src/renderer/src/components/StatusBar/__tests__/StatusBar.test.tsx
@@ -0,0 +1,45 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import StatusBar from '../StatusBar'
+import { installWindowApi, seedStore, makeSession, makeTab } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+describe('StatusBar', () => {
+  beforeEach(() => {
+    seedStore({ sessions: [], tabs: [], notifications: [] })
+  })
+
+  it('counts only active tunnels', async () => {
+    installWindowApi({
+      tunnels: {
+        list: vi.fn().mockResolvedValue([
+          { status: 'active' }, { status: 'stopped' }, { status: 'error' },
+        ]),
+      },
+    })
+    render(<StatusBar />)
+    await waitFor(() => expect(screen.getByText('1 tunnel active')).toBeTruthy())
+
+    fireEvent.click(screen.getByTitle('View tunnels'))
+    expect(useAppStore.getState().tabs.some(t => t.view === 'tunnels')).toBe(true)
+  })
+
+  it('hides the tunnel badge when nothing is active and shows session counts', async () => {
+    const api = installWindowApi({ tunnels: { list: vi.fn().mockResolvedValue([{ status: 'stopped' }]) } })
+    seedStore({
+      sessions: [makeSession(), makeSession()],
+      tabs: [
+        makeTab({ view: 'terminal', status: 'connected' }),
+        makeTab({ view: 'terminal', status: 'error' }),
+        makeTab({ view: 'dashboard', status: 'connected' }),
+      ],
+    })
+    render(<StatusBar />)
+    await waitFor(() => expect(api.tunnels.list).toHaveBeenCalled())
+
+    expect(screen.queryByTitle('View tunnels')).toBeNull()
+    expect(screen.getByText(/2 connections configured/)).toBeTruthy()
+    expect(screen.getByText('1 connection lost')).toBeTruthy()
+  })
+})
diff --git a/src/renderer/src/components/TabBar/TabBar.tsx b/src/renderer/src/components/TabBar/TabBar.tsx
index 4c345e1..598d3cb 100644
--- a/src/renderer/src/components/TabBar/TabBar.tsx
+++ b/src/renderer/src/components/TabBar/TabBar.tsx
@@ -1,5 +1,5 @@
 import { useState, useEffect, useRef } from 'react'
-import { LayoutDashboard, List, Settings, Terminal, Boxes, Database, FolderOpen, X, Layers, Plus, FileCode, Monitor } from 'lucide-react'
+import { LayoutDashboard, List, Settings, Terminal, Boxes, Database, FolderOpen, X, Layers, Plus, FileCode, Monitor, Cable, TerminalSquare } from 'lucide-react'
 import { useAppStore, Tab } from '../../store'
 
 export default function TabBar() {
@@ -99,9 +99,13 @@ export default function TabBar() {
   )
 }
 
-function CloseConfirmDialog({ tabLabel, unsavedEdits, onConfirm, onCancel }: { tabLabel: string; unsavedEdits?: boolean; onConfirm: () => void; onCancel: () => void }) {
+function CloseConfirmDialog({ tabLabel, unsavedEdits, onConfirm, onCancel }: Readonly<{ tabLabel: string; unsavedEdits?: boolean; onConfirm: () => void; onCancel: () => void }>) {
   return (
-    <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={e => { if (e.target === e.currentTarget) onCancel() }}>
+    <div
+      className="fixed inset-0 bg-black/50 flex items-center justify-center z-50"
+      onClick={e => { if (e.target === e.currentTarget) onCancel() }}
+      onKeyDown={e => { if (e.key === 'Escape') onCancel() }}
+    >
       <div
         className="rounded-lg shadow-xl max-w-sm w-full mx-4 p-5"
         style={{ background: 'var(--nox-shell)', border: '1px solid var(--nox-border)' }}
@@ -139,27 +143,29 @@ function CloseConfirmDialog({ tabLabel, unsavedEdits, onConfirm, onCancel }: { t
   )
 }
 
+const VIEW_ICONS: Partial<Record<Tab['view'], { Icon: typeof Terminal; activeColor: string }>> = {
+  dashboard: { Icon: LayoutDashboard, activeColor: '#3B5CCC' },
+  connections: { Icon: List, activeColor: '#3B5CCC' },
+  settings: { Icon: Settings, activeColor: '#3B5CCC' },
+  terminal: { Icon: Terminal, activeColor: '#3B5CCC' },
+  k8s: { Icon: Boxes, activeColor: '#8B5CF6' },
+  database: { Icon: Database, activeColor: '#10B981' },
+  sftp: { Icon: FolderOpen, activeColor: '#EC4899' },
+  redis: { Icon: Layers, activeColor: '#DC382D' },
+  rdp: { Icon: Monitor, activeColor: '#06B6D4' },
+  editor: { Icon: FileCode, activeColor: '#F59E0B' },
+  docker: { Icon: Boxes, activeColor: '#2496ED' },
+  'local-term': { Icon: Terminal, activeColor: '#10B981' },
+  tunnels: { Icon: Cable, activeColor: '#3B5CCC' },
+  runner: { Icon: TerminalSquare, activeColor: '#3B5CCC' },
+}
+
 function tabIcon(view: Tab['view'], active: boolean) {
-  const color = active ? '#3B5CCC' : 'var(--nox-text-2)'
-  const size = 11
-  switch (view) {
-    case 'dashboard': return <LayoutDashboard size={size} style={{ color }} />
-    case 'connections': return <List size={size} style={{ color }} />
-    case 'settings': return <Settings size={size} style={{ color }} />
-    case 'terminal': return <Terminal size={size} style={{ color }} />
-    case 'k8s': return <Boxes size={size} style={{ color: active ? '#8B5CF6' : 'var(--nox-text-2)' }} />
-    case 'database': return <Database size={size} style={{ color: active ? '#10B981' : 'var(--nox-text-2)' }} />
-    case 'sftp': return <FolderOpen size={size} style={{ color: active ? '#EC4899' : 'var(--nox-text-2)' }} />
-    case 'redis': return <Layers size={size} style={{ color: active ? '#DC382D' : 'var(--nox-text-2)' }} />
-    case 'rdp': return <Monitor size={size} style={{ color: active ? '#06B6D4' : 'var(--nox-text-2)' }} />
-    case 'editor': return <FileCode size={size} style={{ color: active ? '#F59E0B' : 'var(--nox-text-2)' }} />
-    case 'docker': return <Boxes size={size} style={{ color: active ? '#2496ED' : 'var(--nox-text-2)' }} />
-    case 'local-term': return <Terminal size={size} style={{ color: active ? '#10B981' : 'var(--nox-text-2)' }} />
-    default: return <Terminal size={size} style={{ color }} />
-  }
+  const { Icon, activeColor } = VIEW_ICONS[view] ?? { Icon: Terminal, activeColor: '#3B5CCC' }
+  return <Icon size={11} style={{ color: active ? activeColor : 'var(--nox-text-2)' }} />
 }
 
-function TabPill({ tab, active, draggable, isDragging, isDropTarget, onActivate, onClose, onDragStart, onDragEnd, onDragOver, onDrop }: {
+function TabPill({ tab, active, draggable, isDragging, isDropTarget, onActivate, onClose, onDragStart, onDragEnd, onDragOver, onDrop }: Readonly<{
   tab: Tab
   active: boolean
   draggable: boolean
@@ -171,7 +177,7 @@ function TabPill({ tab, active, draggable, isDragging, isDropTarget, onActivate,
   onDragEnd: () => void
   onDragOver: (e: React.DragEvent) => void
   onDrop: () => void
-}) {
+}>) {
   return (
     <button
       onClick={onActivate}
@@ -220,6 +226,7 @@ function TabPill({ tab, active, draggable, isDragging, isDropTarget, onActivate,
         <span
           role="button"
           onClick={onClose}
+          onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onClose(e as unknown as React.MouseEvent) } }}
           className="w-4 h-4 flex items-center justify-center rounded transition-colors opacity-0 group-hover:opacity-100 flex-shrink-0 hover:bg-[#E5E7EB]"
           style={{ color: 'var(--nox-text-3)' }}
         >
diff --git a/src/renderer/src/components/TabBar/__tests__/TabBar.test.tsx b/src/renderer/src/components/TabBar/__tests__/TabBar.test.tsx
new file mode 100644
index 0000000..1c2fe03
--- /dev/null
+++ b/src/renderer/src/components/TabBar/__tests__/TabBar.test.tsx
@@ -0,0 +1,128 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import TabBar from '../TabBar'
+import { installWindowApi, seedStore, makeTab, WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore } from '../../../store'
+
+let api: WindowApiMock
+
+function reset(overrides: Record<string, any> = {}) {
+  api = installWindowApi(overrides)
+  seedStore({
+    sessions: [], tabs: [], activeTabId: null, notifications: [],
+    showCommandPalette: false, focusedPaneId: null,
+  })
+}
+
+function closeButtonFor(label: string): HTMLElement {
+  const pill = screen.getByText(label).closest('button')!
+  return pill.querySelector('[role="button"]') as HTMLElement
+}
+
+describe('TabBar', () => {
+  beforeEach(() => reset())
+
+  it('renders a pill per tab with view-specific icons and activates on click', () => {
+    const tabs = [
+      makeTab({ id: 'dash', view: 'dashboard', label: 'Dashboard' }),
+      makeTab({ id: 'term', view: 'terminal', label: 'web-1', status: 'connected' }),
+      makeTab({ id: 'k8s', view: 'k8s', label: 'cluster', status: 'connected' }),
+      makeTab({ id: 'db', view: 'database', label: 'postgres' }),
+      makeTab({ id: 'ed', view: 'editor', label: 'notes.md', isDirty: true }),
+      makeTab({ id: 'err', view: 'sftp', label: 'files', status: 'error' }),
+      makeTab({ id: 'conn', view: 'terminal', label: 'connecting', status: 'connecting' }),
+    ]
+    seedStore({ tabs, activeTabId: 'term' })
+    render(<TabBar />)
+
+    fireEvent.click(screen.getByText('postgres'))
+    expect(useAppStore.getState().activeTabId).toBe('db')
+  })
+
+  it('closes an idle tab directly without confirmation', () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'idle-tab', status: 'idle' })], activeTabId: 't1' })
+    render(<TabBar />)
+    fireEvent.click(closeButtonFor('idle-tab'))
+    expect(useAppStore.getState().tabs).toHaveLength(0)
+  })
+
+  it('asks for confirmation before closing a connected session and closes on confirm', async () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'live-tab', status: 'connected' })], activeTabId: 't1' })
+    render(<TabBar />)
+    await waitFor(() => expect(api.settings.get).toHaveBeenCalled())
+
+    fireEvent.click(closeButtonFor('live-tab'))
+    expect(screen.getByText('Close active session?')).toBeTruthy()
+    expect(screen.getByText(/has an active connection/)).toBeTruthy()
+
+    fireEvent.click(screen.getByText('Close'))
+    expect(useAppStore.getState().tabs).toHaveLength(0)
+  })
+
+  it('cancel and Escape both dismiss the confirm dialog without closing', async () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'live-tab', status: 'connected' })], activeTabId: 't1' })
+    render(<TabBar />)
+    await waitFor(() => expect(api.settings.get).toHaveBeenCalled())
+
+    fireEvent.click(closeButtonFor('live-tab'))
+    fireEvent.click(screen.getByText('Cancel'))
+    expect(screen.queryByText('Close active session?')).toBeNull()
+    expect(useAppStore.getState().tabs).toHaveLength(1)
+
+    fireEvent.click(closeButtonFor('live-tab'))
+    fireEvent.keyDown(screen.getByText('Cancel'), { key: 'Escape' })
+    expect(screen.queryByText('Close active session?')).toBeNull()
+    expect(useAppStore.getState().tabs).toHaveLength(1)
+  })
+
+  it('clicking the dialog backdrop cancels', async () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'live-tab', status: 'connected' })], activeTabId: 't1' })
+    render(<TabBar />)
+    await waitFor(() => expect(api.settings.get).toHaveBeenCalled())
+
+    fireEvent.click(closeButtonFor('live-tab'))
+    const backdrop = document.querySelector('.fixed.inset-0') as HTMLElement
+    fireEvent.click(backdrop)
+    expect(screen.queryByText('Close active session?')).toBeNull()
+  })
+
+  it('warns about unsaved edits when closing a dirty editor tab', () => {
+    seedStore({ tabs: [makeTab({ id: 'e1', view: 'editor', label: 'notes.md', isDirty: true, status: 'idle' })], activeTabId: 'e1' })
+    render(<TabBar />)
+    fireEvent.click(closeButtonFor('notes.md'))
+    expect(screen.getByText('Discard unsaved changes?')).toBeTruthy()
+    expect(screen.getByText(/Closing will discard them/)).toBeTruthy()
+  })
+
+  it('supports Enter and Space on the close affordance', async () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'live-tab', status: 'connected' })], activeTabId: 't1' })
+    render(<TabBar />)
+    await waitFor(() => expect(api.settings.get).toHaveBeenCalled())
+
+    fireEvent.keyDown(closeButtonFor('live-tab'), { key: 'Enter' })
+    expect(screen.getByText('Close active session?')).toBeTruthy()
+    fireEvent.click(screen.getByText('Cancel'))
+
+    fireEvent.keyDown(closeButtonFor('live-tab'), { key: ' ' })
+    expect(screen.getByText('Close active session?')).toBeTruthy()
+  })
+
+  it('skips confirmation when the user disabled confirmClose', async () => {
+    reset({ settings: { get: vi.fn().mockResolvedValue({ confirmClose: false }) } })
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'live-tab', status: 'connected' })], activeTabId: 't1' })
+    render(<TabBar />)
+    await waitFor(() => expect(api.settings.get).toHaveBeenCalled())
+
+    fireEvent.click(closeButtonFor('live-tab'))
+    expect(screen.queryByText('Close active session?')).toBeNull()
+    expect(useAppStore.getState().tabs).toHaveLength(0)
+  })
+
+  it('opens the command palette from the plus button', () => {
+    seedStore({ tabs: [makeTab({ id: 't1', view: 'terminal', label: 'a-tab' })], activeTabId: 't1' })
+    render(<TabBar />)
+    fireEvent.click(screen.getByTitle('Open connection (⌘T)'))
+    expect(useAppStore.getState().showCommandPalette).toBe(true)
+  })
+})
diff --git a/src/renderer/src/components/Terminal/DisconnectedOverlay.tsx b/src/renderer/src/components/Terminal/DisconnectedOverlay.tsx
index d96cf3b..3e2c0a9 100644
--- a/src/renderer/src/components/Terminal/DisconnectedOverlay.tsx
+++ b/src/renderer/src/components/Terminal/DisconnectedOverlay.tsx
@@ -10,7 +10,13 @@ interface Props {
   onClose: () => void
 }
 
-export default function DisconnectedOverlay({ message, onReconnect, connecting, cooldown, failCount, onDismiss, onClose }: Props) {
+function reconnectLabel(connecting: boolean, cooldown: number) {
+  if (connecting) return <><IconRefresh size={13} className="animate-spin" />Reconnecting…</>
+  if (cooldown > 0) return <><IconRefresh size={13} />Retry in {cooldown}s</>
+  return <><IconWifi size={13} />Reconnect</>
+}
+
+export default function DisconnectedOverlay({ message, onReconnect, connecting, cooldown, failCount, onDismiss, onClose }: Readonly<Props>) {
   const blocked = connecting || cooldown > 0
   const showFail2banHint = failCount >= 2 && message?.toLowerCase().includes('timeout')
   return (
@@ -47,13 +53,7 @@ export default function DisconnectedOverlay({ message, onReconnect, connecting,
             onMouseEnter={(e) => { if (!blocked) e.currentTarget.style.background = '#818cf8' }}
             onMouseLeave={(e) => { if (!blocked) e.currentTarget.style.background = '#6366f1' }}
           >
-            {connecting ? (
-              <><IconRefresh size={13} className="animate-spin" />Reconnecting…</>
-            ) : cooldown > 0 ? (
-              <><IconRefresh size={13} />Retry in {cooldown}s</>
-            ) : (
-              <><IconWifi size={13} />Reconnect</>
-            )}
+            {reconnectLabel(connecting, cooldown)}
           </button>
           <button
             onClick={onClose}
diff --git a/src/renderer/src/components/Terminal/HostHeader.tsx b/src/renderer/src/components/Terminal/HostHeader.tsx
index 61dec5b..4434c06 100644
--- a/src/renderer/src/components/Terminal/HostHeader.tsx
+++ b/src/renderer/src/components/Terminal/HostHeader.tsx
@@ -22,8 +22,23 @@ interface Props {
   onClosePane?: () => void
 }
 
+function StatusDot({ connecting, connected }: Readonly<{ connecting: boolean; connected: boolean }>) {
+  if (connecting) {
+    return (
+      <span className="relative w-1.5 h-1.5 flex-shrink-0">
+        <span className="absolute inset-0 rounded-full animate-pulse" style={{ background: 'rgba(99,102,241,0.5)' }} />
+        <span className="w-full h-full rounded-full block" style={{ background: '#6366f1' }} />
+      </span>
+    )
+  }
+  if (connected) {
+    return <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: '#22c55e', boxShadow: '0 0 6px rgba(34,197,94,0.5)' }} />
+  }
+  return <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: '#f87171' }} />
+}
+
 // Single bar above the terminal: identity, live metrics, and panel toggles.
-export default function HostHeader({ session, status, elapsed, metrics, cpuHistory, filesOpen, snippetsOpen, broadcastEnabled, onToggleFiles, onToggleSnippets, onToggleBroadcast, onSplitPick, onClosePane }: Props) {
+export default function HostHeader({ session, status, elapsed, metrics, cpuHistory, filesOpen, snippetsOpen, broadcastEnabled, onToggleFiles, onToggleSnippets, onToggleBroadcast, onSplitPick, onClosePane }: Readonly<Props>) {
   const connected = status === 'connected'
   const connecting = status === 'connecting'
   const spark = sparkline(cpuHistory.slice(-20))
@@ -34,17 +49,7 @@ export default function HostHeader({ session, status, elapsed, metrics, cpuHisto
       className="flex items-center gap-3 px-3 flex-shrink-0 select-none"
       style={{ height: 34, borderBottom: '1px solid rgba(255,255,255,0.05)', background: 'rgba(255,255,255,0.015)' }}
     >
-      {/* Status dot */}
-      {connecting ? (
-        <span className="relative w-1.5 h-1.5 flex-shrink-0">
-          <span className="absolute inset-0 rounded-full animate-pulse" style={{ background: 'rgba(99,102,241,0.5)' }} />
-          <span className="w-full h-full rounded-full block" style={{ background: '#6366f1' }} />
-        </span>
-      ) : connected ? (
-        <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: '#22c55e', boxShadow: '0 0 6px rgba(34,197,94,0.5)' }} />
-      ) : (
-        <span className="w-1.5 h-1.5 rounded-full flex-shrink-0" style={{ background: '#f87171' }} />
-      )}
+      <StatusDot connecting={connecting} connected={connected} />
 
       {/* Host */}
       <span className="text-xs font-semibold font-mono" style={{ color: '#eeeef2', letterSpacing: '-0.01em' }}>
@@ -140,7 +145,7 @@ export default function HostHeader({ session, status, elapsed, metrics, cpuHisto
   )
 }
 
-function HeaderToggle({ on, onClick, title, activeColor, activeBackground, activeBorder, children }: {
+function HeaderToggle({ on, onClick, title, activeColor, activeBackground, activeBorder, children }: Readonly<{
   on: boolean
   onClick: () => void
   title: string
@@ -148,7 +153,7 @@ function HeaderToggle({ on, onClick, title, activeColor, activeBackground, activ
   activeBackground: string
   activeBorder: string
   children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       onClick={onClick}
@@ -168,7 +173,7 @@ function HeaderToggle({ on, onClick, title, activeColor, activeBackground, activ
 }
 
 /* ── Split pane picker ───────────────────────────────────────────────────── */
-function SplitMenu({ currentSession, onPick }: { currentSession: Session; onPick: (session: Session) => void }) {
+function SplitMenu({ currentSession, onPick }: Readonly<{ currentSession: Session; onPick: (session: Session) => void }>) {
   const [open, setOpen] = useState(false)
   const sessions = useAppStore(s => s.sessions)
   const sshSessions = sessions.filter(s => (s.type ?? 'ssh') === 'ssh')
@@ -216,7 +221,7 @@ function SplitMenu({ currentSession, onPick }: { currentSession: Session; onPick
   )
 }
 
-function SplitMenuItem({ label, onClick }: { label: string; onClick: () => void }) {
+function SplitMenuItem({ label, onClick }: Readonly<{ label: string; onClick: () => void }>) {
   return (
     <button
       onClick={onClick}
diff --git a/src/renderer/src/components/Terminal/SnippetRunner.tsx b/src/renderer/src/components/Terminal/SnippetRunner.tsx
index ef1c249..fed0b48 100644
--- a/src/renderer/src/components/Terminal/SnippetRunner.tsx
+++ b/src/renderer/src/components/Terminal/SnippetRunner.tsx
@@ -20,7 +20,31 @@ function extractVars(cmd: string): string[] {
   return vars
 }
 
-export default function SnippetRunner({ hostSnippets, globalSnippets, hostname, onRun, onSave, onDelete, onClose }: {
+function VarInput({ name, value, autoFocus, onChange, onEnter, onCancel }: Readonly<{
+  name: string
+  value: string
+  autoFocus: boolean
+  onChange: (value: string) => void
+  onEnter: () => void
+  onCancel: () => void
+}>) {
+  return (
+    <div className="flex items-center gap-2">
+      <Variable className="w-3 h-3 flex-shrink-0" style={{ color: '#9d6ff8' }} />
+      <span className="text-[10px] font-mono flex-shrink-0" style={{ color: 'rgba(255,255,255,0.5)' }}>{name}</span>
+      <input value={value} onChange={e => onChange(e.target.value)}
+        onKeyDown={e => {
+          if (e.key === 'Enter') onEnter()
+          if (e.key === 'Escape') onCancel()
+        }}
+        autoFocus={autoFocus}
+        className="flex-1 bg-transparent text-[10px] font-mono px-1.5 py-0.5 rounded focus:outline-none"
+        style={{ color: '#eeeef2', border: '1px solid rgba(157,111,248,0.3)' }} placeholder="value…" />
+    </div>
+  )
+}
+
+export default function SnippetRunner({ hostSnippets, globalSnippets, hostname, onRun, onSave, onDelete, onClose }: Readonly<{
   hostSnippets: Snippet[]
   globalSnippets: Snippet[]
   hostname: string
@@ -28,7 +52,7 @@ export default function SnippetRunner({ hostSnippets, globalSnippets, hostname,
   onSave: (snippet: Snippet) => void
   onDelete: (id: string, scope: SnippetScope) => void
   onClose: () => void
-}) {
+}>) {
   const [adding, setAdding] = useState(false)
   const [addScope, setAddScope] = useState<SnippetScope>('global')
   const [editLabel, setEditLabel] = useState('')
@@ -58,11 +82,13 @@ export default function SnippetRunner({ hostSnippets, globalSnippets, hostname,
 
   function executeWithVars(snippet: Snippet) {
     let cmd = snippet.command
-    for (const [k, v] of Object.entries(varValues)) cmd = cmd.replace(new RegExp(`\\{\\{${k}\\}\\}`, 'g'), v)
+    for (const [k, v] of Object.entries(varValues)) cmd = cmd.replaceAll(`{{${k}}}`, v)
     onRun(cmd + '\n')
     setRunningId(null); setVarValues({})
   }
 
+  const setVar = (name: string, val: string) => setVarValues(p => ({ ...p, [name]: val }))
+
   function saveNew() {
     if (!editLabel.trim() || !editCmd.trim()) return
     onSave({
@@ -101,15 +127,11 @@ export default function SnippetRunner({ hostSnippets, globalSnippets, hostname,
         {runningId === s.id && (
           <div className="px-3 pb-3 pt-1 space-y-2" style={{ background: 'rgba(157,111,248,0.04)' }}>
             {extractVars(s.command).map(v => (
-              <div key={v} className="flex items-center gap-2">
-                <Variable className="w-3 h-3 flex-shrink-0" style={{ color: '#9d6ff8' }} />
-                <span className="text-[10px] font-mono flex-shrink-0" style={{ color: 'rgba(255,255,255,0.5)' }}>{v}</span>
-                <input value={varValues[v] || ''} onChange={e => setVarValues(p => ({ ...p, [v]: e.target.value }))}
-                  onKeyDown={e => { if (e.key === 'Enter') executeWithVars(s); if (e.key === 'Escape') setRunningId(null) }}
-                  autoFocus={extractVars(s.command)[0] === v}
-                  className="flex-1 bg-transparent text-[10px] font-mono px-1.5 py-0.5 rounded focus:outline-none"
-                  style={{ color: '#eeeef2', border: '1px solid rgba(157,111,248,0.3)' }} placeholder="value…" />
-              </div>
+              <VarInput key={v} name={v} value={varValues[v] || ''}
+                autoFocus={extractVars(s.command)[0] === v}
+                onChange={val => setVar(v, val)}
+                onEnter={() => executeWithVars(s)}
+                onCancel={() => setRunningId(null)} />
             ))}
             <div className="flex items-center gap-2 pt-1">
               <button onClick={() => executeWithVars(s)} className="flex items-center gap-1 px-2 py-1 rounded text-[10px] font-medium" style={{ background: '#10b981', color: '#fff' }}>
diff --git a/src/renderer/src/components/Terminal/TerminalSearchBar.tsx b/src/renderer/src/components/Terminal/TerminalSearchBar.tsx
index 67a3b5a..c583f33 100644
--- a/src/renderer/src/components/Terminal/TerminalSearchBar.tsx
+++ b/src/renderer/src/components/Terminal/TerminalSearchBar.tsx
@@ -15,7 +15,12 @@ interface Props {
   onClose: () => void
 }
 
-export default function TerminalSearchBar({ addon, onClose }: Props) {
+function resultsLabel(results: { index: number; count: number } | null): string {
+  if (!results) return ''
+  return results.count > 0 ? `${results.index + 1}/${results.count}` : '0/0'
+}
+
+export default function TerminalSearchBar({ addon, onClose }: Readonly<Props>) {
   const inputRef = useRef<HTMLInputElement>(null)
   const [query, setQuery] = useState('')
   const [results, setResults] = useState<{ index: number; count: number } | null>(null)
@@ -73,7 +78,7 @@ export default function TerminalSearchBar({ addon, onClose }: Props) {
         style={{ color: 'var(--nox-text)' }}
       />
       <span className="text-2xs tabular-nums min-w-[40px] text-right" style={{ color: 'var(--nox-text-3)' }}>
-        {results ? (results.count > 0 ? `${results.index + 1}/${results.count}` : '0/0') : ''}
+        {resultsLabel(results)}
       </span>
       <SearchNavButton title="Previous match (Shift+Enter)" onClick={() => search(query, 'previous')}>
         <ChevronUp className="w-3.5 h-3.5" />
@@ -88,11 +93,11 @@ export default function TerminalSearchBar({ addon, onClose }: Props) {
   )
 }
 
-function SearchNavButton({ title, onClick, children }: {
+function SearchNavButton({ title, onClick, children }: Readonly<{
   title: string
   onClick: () => void
   children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       title={title}
diff --git a/src/renderer/src/components/Terminal/TerminalView.tsx b/src/renderer/src/components/Terminal/TerminalView.tsx
index ef0af10..30c46d9 100644
--- a/src/renderer/src/components/Terminal/TerminalView.tsx
+++ b/src/renderer/src/components/Terminal/TerminalView.tsx
@@ -3,7 +3,7 @@ import { Terminal } from '@xterm/xterm'
 import { WebLinksAddon } from '@xterm/addon-web-links'
 import { SearchAddon } from '@xterm/addon-search'
 import '@xterm/xterm/css/xterm.css'
-import { useAppStore, Tab } from '../../store'
+import { useAppStore, Tab, Session } from '../../store'
 import { checkResourceAlerts } from '../../lib/metricsAlerts'
 import SnippetRunner, { Snippet, SnippetScope } from './SnippetRunner'
 import TerminalSearchBar from './TerminalSearchBar'
@@ -488,6 +488,17 @@ export default function TerminalView({ tab }: Props) {
 
   // Metrics handled by sshDispatch singleton (registered on connect)
 
+  function startCooldown(secs: number) {
+    setCooldown(secs)
+    if (cooldownTimerRef.current) clearInterval(cooldownTimerRef.current)
+    cooldownTimerRef.current = setInterval(() => {
+      setCooldown(prev => {
+        if (prev <= 1) { clearInterval(cooldownTimerRef.current!); return 0 }
+        return prev - 1
+      })
+    }, 1000)
+  }
+
   async function connect() {
     if (!session) return
     setConnecting(true)
@@ -498,22 +509,7 @@ export default function TerminalView({ tab }: Props) {
     termRef.current?.write(`${dim}Connecting to ${session.username}@${session.host}…${reset}\r\n`)
 
     try {
-      let password: string | undefined
-      let privateKey: string | undefined
-
-      if (session.authType === 'key') {
-        if (!session.keyPath) throw new Error('Key authentication selected but no key file path is configured')
-        privateKey = await readKeyFile(session.keyPath)
-        if (!privateKey) throw new Error(`Cannot read private key: ${session.keyPath}`)
-      } else {
-        const creds = tab.sessionId
-          ? await window.api.sessions.getCredentials(tab.sessionId).catch((err: any) => {
-              throw new Error(err?.message?.includes('locked') ? 'App is locked — unlock noxed to reconnect' : (err?.message ?? 'Failed to retrieve credentials'))
-            })
-          : null
-        password = creds?.password
-        if (password === undefined) throw new Error('No password found for this session — re-enter credentials in Settings')
-      }
+      const { password, privateKey } = await resolveSshCredentials(session, tab.sessionId)
 
       const streamId = await window.api.ssh.connect({
         host: session.host,
@@ -539,19 +535,10 @@ export default function TerminalView({ tab }: Props) {
     } catch (err: any) {
       const msg = typeof err === 'string' ? err : err?.message ?? 'Connection failed'
       failCountRef.current += 1
-      // Backoff: 5s, 15s, 30s after successive failures
-      const backoff = failCountRef.current === 1 ? 5 : failCountRef.current === 2 ? 15 : 30
       updateTab(tab.id, { status: 'error', errorMessage: msg })
       termRef.current?.write(`\r\n\x1b[31m✕ ${msg}\x1b[0m\r\n`)
-      // Countdown
-      setCooldown(backoff)
-      if (cooldownTimerRef.current) clearInterval(cooldownTimerRef.current)
-      cooldownTimerRef.current = setInterval(() => {
-        setCooldown(prev => {
-          if (prev <= 1) { clearInterval(cooldownTimerRef.current!); return 0 }
-          return prev - 1
-        })
-      }, 1000)
+      // Backoff: 5s, 15s, 30s after successive failures
+      startCooldown(BACKOFF_SECONDS[Math.min(failCountRef.current, BACKOFF_SECONDS.length) - 1])
     } finally {
       setConnecting(false)
     }
@@ -629,6 +616,32 @@ export default function TerminalView({ tab }: Props) {
   )
 }
 
+const BACKOFF_SECONDS = [5, 15, 30]
+
 async function readKeyFile(path: string): Promise<string | undefined> {
-  try { return await window.api.fs.readFile(path) } catch { return undefined }
+  try {
+    return await window.api.fs.readFile(path)
+  } catch (err: any) {
+    console.error(`[terminal] failed to read key file ${path}:`, err?.message ?? err)
+    return undefined
+  }
+}
+
+// Resolves either the private key or the stored password for a session,
+// throwing a user-facing error when neither is usable.
+async function resolveSshCredentials(session: Session, sessionId?: string): Promise<{ password?: string; privateKey?: string }> {
+  if (session.authType === 'key') {
+    if (!session.keyPath) throw new Error('Key authentication selected but no key file path is configured')
+    const privateKey = await readKeyFile(session.keyPath)
+    if (!privateKey) throw new Error(`Cannot read private key: ${session.keyPath}`)
+    return { privateKey }
+  }
+  const creds = sessionId
+    ? await window.api.sessions.getCredentials(sessionId).catch((err: any) => {
+        throw new Error(err?.message?.includes('locked') ? 'App is locked — unlock noxed to reconnect' : (err?.message ?? 'Failed to retrieve credentials'))
+      })
+    : null
+  const password = creds?.password
+  if (password === undefined) throw new Error('No password found for this session — re-enter credentials in Settings')
+  return { password }
 }
diff --git a/src/renderer/src/components/Terminal/__tests__/DisconnectedOverlay.test.tsx b/src/renderer/src/components/Terminal/__tests__/DisconnectedOverlay.test.tsx
new file mode 100644
index 0000000..25e6077
--- /dev/null
+++ b/src/renderer/src/components/Terminal/__tests__/DisconnectedOverlay.test.tsx
@@ -0,0 +1,43 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import DisconnectedOverlay from '../DisconnectedOverlay'
+
+const baseProps = {
+  onReconnect: vi.fn(),
+  connecting: false,
+  cooldown: 0,
+  failCount: 0,
+  onDismiss: vi.fn(),
+  onClose: vi.fn(),
+}
+
+describe('DisconnectedOverlay', () => {
+  it('renders the connection-lost message', () => {
+    render(<DisconnectedOverlay {...baseProps} message="Broken pipe" />)
+    expect(screen.getByText('Connection lost')).toBeTruthy()
+    expect(screen.getByText('Broken pipe')).toBeTruthy()
+  })
+
+  it('offers Reconnect when idle and fires onReconnect', () => {
+    const onReconnect = vi.fn()
+    render(<DisconnectedOverlay {...baseProps} onReconnect={onReconnect} />)
+    fireEvent.click(screen.getByText('Reconnect'))
+    expect(onReconnect).toHaveBeenCalledTimes(1)
+  })
+
+  it('shows countdown while cooling down', () => {
+    render(<DisconnectedOverlay {...baseProps} cooldown={7} />)
+    expect(screen.getByText('Retry in 7s')).toBeTruthy()
+  })
+
+  it('shows reconnecting state while connecting', () => {
+    render(<DisconnectedOverlay {...baseProps} connecting />)
+    expect(screen.getByText('Reconnecting…')).toBeTruthy()
+  })
+
+  it('hints at fail2ban after repeated timeouts', () => {
+    render(<DisconnectedOverlay {...baseProps} failCount={3} message="connect timeout" />)
+    expect(screen.getByText(/fail2ban/i)).toBeTruthy()
+  })
+})
diff --git a/src/renderer/src/components/Terminal/__tests__/HostHeader.test.tsx b/src/renderer/src/components/Terminal/__tests__/HostHeader.test.tsx
new file mode 100644
index 0000000..2f75739
--- /dev/null
+++ b/src/renderer/src/components/Terminal/__tests__/HostHeader.test.tsx
@@ -0,0 +1,82 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import HostHeader from '../HostHeader'
+import { installWindowApi, seedStore, makeSession } from '../../../__tests__/harness'
+
+const session = makeSession({ id: 'h1', label: 'Primary', host: 'h1.example.com', username: 'root', port: 2222 })
+
+function renderHeader(overrides: Partial<React.ComponentProps<typeof HostHeader>> = {}) {
+  const props = {
+    session,
+    status: 'connected',
+    elapsed: '5m',
+    metrics: { cpu: 42, memUsed: 2e9, memTotal: 8e9, available: true },
+    cpuHistory: [10, 20, 30],
+    filesOpen: false,
+    snippetsOpen: false,
+    broadcastEnabled: false,
+    onToggleFiles: vi.fn(),
+    onToggleSnippets: vi.fn(),
+    onToggleBroadcast: vi.fn(),
+    ...overrides,
+  }
+  render(<HostHeader {...props} />)
+  return props
+}
+
+describe('HostHeader', () => {
+  beforeEach(() => {
+    installWindowApi()
+    seedStore({ sessions: [session, makeSession({ id: 'h2', label: 'Secondary' })], tabs: [] })
+  })
+
+  it('shows identity, uptime and metrics while connected', () => {
+    renderHeader()
+    expect(screen.getByText((_, el) => el?.textContent === 'root@h1.example.com:2222' && el?.tagName === 'SPAN')).toBeTruthy()
+    expect(screen.getByText('5m')).toBeTruthy()
+    expect(screen.getByText('42%')).toBeTruthy()
+  })
+
+  it('renders the connecting state', () => {
+    renderHeader({ status: 'connecting', metrics: null, elapsed: '' })
+    expect(screen.getByText('Connecting…')).toBeTruthy()
+  })
+
+  it('renders the disconnected state without metrics', () => {
+    renderHeader({ status: 'error', metrics: null, elapsed: '' })
+    expect(screen.queryByText('Connecting…')).toBeNull()
+    expect(screen.queryByText(/%$/)).toBeNull()
+  })
+
+  it('wires up the panel toggles', () => {
+    const props = renderHeader()
+    fireEvent.click(screen.getByText('Snippets'))
+    expect(props.onToggleSnippets).toHaveBeenCalled()
+    fireEvent.click(screen.getByText('Files'))
+    expect(props.onToggleFiles).toHaveBeenCalled()
+    fireEvent.click(screen.getByText('Broadcast'))
+    expect(props.onToggleBroadcast).toHaveBeenCalled()
+  })
+
+  it('offers a split picker when allowed and a close button for panes', () => {
+    const onSplitPick = vi.fn()
+    const onClosePane = vi.fn()
+    renderHeader({ onSplitPick, onClosePane })
+
+    fireEvent.click(screen.getByText('Split'))
+    fireEvent.click(screen.getByText('Primary (again)'))
+    expect(onSplitPick).toHaveBeenCalledWith(session)
+
+    fireEvent.click(screen.getByTitle('Close pane'))
+    expect(onClosePane).toHaveBeenCalled()
+  })
+
+  it('lists other ssh sessions in the split menu', () => {
+    const onSplitPick = vi.fn()
+    renderHeader({ onSplitPick })
+    fireEvent.click(screen.getByText('Split'))
+    fireEvent.click(screen.getByText('Secondary'))
+    expect(onSplitPick).toHaveBeenCalledWith(expect.objectContaining({ id: 'h2' }))
+  })
+})
diff --git a/src/renderer/src/components/Terminal/__tests__/SnippetRunner.test.tsx b/src/renderer/src/components/Terminal/__tests__/SnippetRunner.test.tsx
new file mode 100644
index 0000000..f56244b
--- /dev/null
+++ b/src/renderer/src/components/Terminal/__tests__/SnippetRunner.test.tsx
@@ -0,0 +1,97 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import SnippetRunner, { Snippet } from '../SnippetRunner'
+
+const varSnippet: Snippet = {
+  id: 'snip-1',
+  label: 'Tail log',
+  command: 'tail -f /var/log/{{file}} | grep {{file}}',
+  tags: ['logs'],
+  scope: 'global',
+}
+
+const plainSnippet: Snippet = {
+  id: 'snip-2',
+  label: 'Uptime',
+  command: 'uptime',
+  tags: [],
+  scope: 'host',
+}
+
+function renderRunner(overrides: Partial<React.ComponentProps<typeof SnippetRunner>> = {}) {
+  const props = {
+    hostSnippets: [plainSnippet],
+    globalSnippets: [varSnippet],
+    hostname: 'h1.example.com',
+    onRun: vi.fn(),
+    onSave: vi.fn(),
+    onDelete: vi.fn(),
+    onClose: vi.fn(),
+    ...overrides,
+  }
+  render(<SnippetRunner {...props} />)
+  return props
+}
+
+describe('SnippetRunner', () => {
+  beforeEach(() => vi.clearAllMocks())
+
+  it('runs snippets without variables immediately', () => {
+    const props = renderRunner()
+    const runButtons = screen.getAllByTitle('Run')
+    fireEvent.click(runButtons[1]) // host section renders after global
+    expect(props.onRun).toHaveBeenCalledWith('uptime\n')
+  })
+
+  it('prompts for variables and substitutes every occurrence on Enter', () => {
+    const props = renderRunner()
+    fireEvent.click(screen.getAllByTitle('Run')[0])
+
+    const input = screen.getByPlaceholderText('value…')
+    fireEvent.change(input, { target: { value: 'syslog' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+
+    expect(props.onRun).toHaveBeenCalledWith('tail -f /var/log/syslog | grep syslog\n')
+    // The variable form is dismissed after running
+    expect(screen.queryByPlaceholderText('value…')).toBeNull()
+  })
+
+  it('cancels the variable prompt with Escape', () => {
+    const props = renderRunner()
+    fireEvent.click(screen.getAllByTitle('Run')[0])
+    fireEvent.keyDown(screen.getByPlaceholderText('value…'), { key: 'Escape' })
+    expect(screen.queryByPlaceholderText('value…')).toBeNull()
+    expect(props.onRun).not.toHaveBeenCalled()
+  })
+
+  it('runs from the inline Run button as well', () => {
+    const props = renderRunner()
+    fireEvent.click(screen.getAllByTitle('Run')[0])
+    fireEvent.change(screen.getByPlaceholderText('value…'), { target: { value: 'auth.log' } })
+    fireEvent.click(screen.getByText('Run'))
+    expect(props.onRun).toHaveBeenCalledWith('tail -f /var/log/auth.log | grep auth.log\n')
+  })
+
+  it('saves a new snippet with parsed tags', () => {
+    const props = renderRunner()
+    // The add button is icon-only (no title/aria-label); it renders immediately
+    // after the "Snippets" header label.
+    fireEvent.click(screen.getByText('Snippets').nextElementSibling as HTMLElement)
+
+    fireEvent.change(screen.getByPlaceholderText('Label (e.g. Deploy)'), { target: { value: 'Disk' } })
+    fireEvent.change(screen.getByPlaceholderText('Command (use {{var}} for placeholders)'), { target: { value: 'df -h' } })
+    fireEvent.change(screen.getByPlaceholderText('Tags (comma-separated)'), { target: { value: 'disk, space' } })
+    fireEvent.click(screen.getByText('Save'))
+
+    expect(props.onSave).toHaveBeenCalledWith(expect.objectContaining({
+      label: 'Disk', command: 'df -h', tags: ['disk', 'space'], scope: 'global',
+    }))
+  })
+
+  it('deletes snippets with their scope', () => {
+    const props = renderRunner()
+    fireEvent.click(screen.getAllByTitle('Delete')[0])
+    expect(props.onDelete).toHaveBeenCalledWith('snip-1', 'global')
+  })
+})
diff --git a/src/renderer/src/components/Terminal/__tests__/TerminalSearchBar.test.tsx b/src/renderer/src/components/Terminal/__tests__/TerminalSearchBar.test.tsx
new file mode 100644
index 0000000..fb3a65e
--- /dev/null
+++ b/src/renderer/src/components/Terminal/__tests__/TerminalSearchBar.test.tsx
@@ -0,0 +1,86 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent, act } from '@testing-library/react'
+import type { SearchAddon } from '@xterm/addon-search'
+import TerminalSearchBar from '../TerminalSearchBar'
+
+type ResultsCallback = (results: { resultIndex: number; resultCount: number }) => void
+
+function makeAddon() {
+  let onResults: ResultsCallback = () => {}
+  const addon = {
+    findNext: vi.fn(),
+    findPrevious: vi.fn(),
+    clearDecorations: vi.fn(),
+    onDidChangeResults: vi.fn((cb: ResultsCallback) => {
+      onResults = cb
+      return { dispose: vi.fn() }
+    }),
+  }
+  return { addon: addon as unknown as SearchAddon, mocks: addon, emit: (r: { resultIndex: number; resultCount: number }) => act(() => onResults(r)) }
+}
+
+describe('TerminalSearchBar', () => {
+  beforeEach(() => vi.clearAllMocks())
+
+  it('searches forward as you type and shows the match position', () => {
+    const { addon, mocks, emit } = makeAddon()
+    render(<TerminalSearchBar addon={addon} onClose={vi.fn()} />)
+
+    fireEvent.change(screen.getByPlaceholderText('Search'), { target: { value: 'err' } })
+    expect(mocks.findNext).toHaveBeenCalledWith('err', expect.anything())
+
+    emit({ resultIndex: 1, resultCount: 5 })
+    expect(screen.getByText('2/5')).toBeTruthy()
+
+    emit({ resultIndex: -1, resultCount: 0 })
+    expect(screen.getByText('0/0')).toBeTruthy()
+  })
+
+  it('shows nothing before a search has produced results', () => {
+    const { addon } = makeAddon()
+    render(<TerminalSearchBar addon={addon} onClose={vi.fn()} />)
+    // The label span is empty until results arrive
+    expect(screen.queryByText('0/0')).toBeNull()
+  })
+
+  it('navigates with Enter, Shift+Enter and the arrow buttons', () => {
+    const { addon, mocks } = makeAddon()
+    render(<TerminalSearchBar addon={addon} onClose={vi.fn()} />)
+    const input = screen.getByPlaceholderText('Search')
+
+    fireEvent.change(input, { target: { value: 'foo' } })
+    fireEvent.keyDown(input, { key: 'Enter' })
+    expect(mocks.findNext).toHaveBeenCalledTimes(2)
+
+    fireEvent.keyDown(input, { key: 'Enter', shiftKey: true })
+    expect(mocks.findPrevious).toHaveBeenCalledTimes(1)
+
+    fireEvent.click(screen.getByTitle('Previous match (Shift+Enter)'))
+    expect(mocks.findPrevious).toHaveBeenCalledTimes(2)
+
+    fireEvent.click(screen.getByTitle('Next match (Enter)'))
+    expect(mocks.findNext).toHaveBeenCalledTimes(3)
+  })
+
+  it('clears decorations when the query becomes empty', () => {
+    const { addon, mocks } = makeAddon()
+    render(<TerminalSearchBar addon={addon} onClose={vi.fn()} />)
+    const input = screen.getByPlaceholderText('Search')
+    fireEvent.change(input, { target: { value: 'x' } })
+    fireEvent.change(input, { target: { value: '' } })
+    expect(mocks.clearDecorations).toHaveBeenCalled()
+  })
+
+  it('closes on Escape and the close button', () => {
+    const { addon } = makeAddon()
+    const onClose = vi.fn()
+    render(<TerminalSearchBar addon={addon} onClose={onClose} />)
+
+    fireEvent.keyDown(screen.getByPlaceholderText('Search'), { key: 'Escape' })
+    expect(onClose).toHaveBeenCalledTimes(1)
+
+    fireEvent.click(screen.getByTitle('Close (Esc)'))
+    expect(onClose).toHaveBeenCalledTimes(2)
+  })
+})
diff --git a/src/renderer/src/components/Terminal/__tests__/TerminalView.test.tsx b/src/renderer/src/components/Terminal/__tests__/TerminalView.test.tsx
new file mode 100644
index 0000000..5487ec2
--- /dev/null
+++ b/src/renderer/src/components/Terminal/__tests__/TerminalView.test.tsx
@@ -0,0 +1,170 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeAll, beforeEach, vi } from 'vitest'
+import { render, screen, act, waitFor } from '@testing-library/react'
+import { installWindowApi, seedStore, makeSession, makeTab, WindowApiMock } from '../../../__tests__/harness'
+import { useAppStore, Session, Tab } from '../../../store'
+
+// xterm needs a real canvas/renderer — replace it with a minimal stand-in.
+vi.mock('@xterm/xterm', () => {
+  const disposable = () => ({ dispose: vi.fn() })
+  class Terminal {
+    options: Record<string, unknown> = {}
+    cols = 80
+    rows = 24
+    buffer = { active: { type: 'normal', baseY: 0, viewportY: 0, length: 0 } }
+    open = vi.fn()
+    write = vi.fn()
+    clear = vi.fn()
+    dispose = vi.fn()
+    focus = vi.fn()
+    resize = vi.fn()
+    scrollLines = vi.fn()
+    loadAddon = vi.fn()
+    attachCustomWheelEventHandler = vi.fn()
+    hasSelection = vi.fn(() => false)
+    getSelection = vi.fn(() => '')
+    onSelectionChange = vi.fn(disposable)
+    onBell = vi.fn(disposable)
+    onData = vi.fn(disposable)
+    onResize = vi.fn(disposable)
+  }
+  return { Terminal }
+})
+vi.mock('@xterm/addon-web-links', () => ({ WebLinksAddon: class {} }))
+vi.mock('@xterm/addon-search', () => ({
+  SearchAddon: class {
+    findNext = vi.fn()
+    findPrevious = vi.fn()
+    clearDecorations = vi.fn()
+    onDidChangeResults = vi.fn(() => ({ dispose: vi.fn() }))
+  },
+}))
+vi.mock('@xterm/xterm/css/xterm.css', () => ({}))
+
+import TerminalView from '../TerminalView'
+
+let api: WindowApiMock
+
+function setup(sessionOverrides: Partial<Session> = {}, apiOverrides: Record<string, unknown> = {}): Tab {
+  api = installWindowApi(apiOverrides)
+  const session = makeSession({ id: 's1', host: 'h1.example.com', username: 'root', ...sessionOverrides })
+  const tab = makeTab({ id: 't1', sessionId: 's1', view: 'terminal', status: 'idle' })
+  seedStore({
+    sessions: [session], tabs: [tab], activeTabId: 't1',
+    notifications: [], serverMetrics: {}, focusedPaneId: null, broadcastEnabled: false,
+  })
+  return tab
+}
+
+function storeTab(): Tab {
+  return useAppStore.getState().tabs.find(t => t.id === 't1')!
+}
+
+describe('TerminalView', () => {
+  beforeAll(() => {
+    // jsdom lacks both of these; the component only needs them to exist.
+    ;(globalThis as any).ResizeObserver = class {
+      observe() {}
+      unobserve() {}
+      disconnect() {}
+    }
+    Object.defineProperty(document, 'fonts', {
+      value: { ready: Promise.resolve() },
+      configurable: true,
+    })
+  })
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  it('connects with the stored password and starts metrics', async () => {
+    const tab = setup(
+      { authType: 'password' },
+      { sessions: { getCredentials: vi.fn().mockResolvedValue({ password: 'hunter2' }) } },
+    )
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('connected'))
+    expect(api.ssh.connect).toHaveBeenCalledWith(expect.objectContaining({
+      host: 'h1.example.com', username: 'root', password: 'hunter2', privateKey: undefined,
+    }))
+    expect(storeTab().streamId).toBe('stream-1')
+
+    // Metrics polling starts shortly after the connection settles
+    await waitFor(() => expect(api.ssh.startMetrics).toHaveBeenCalledWith('stream-1'), { timeout: 3000 })
+  })
+
+  it('connects with a private key when the session uses key auth', async () => {
+    const tab = setup(
+      { authType: 'key', keyPath: '/home/user/.ssh/id_ed25519' },
+      { fs: { readFile: vi.fn().mockResolvedValue('PRIVATE KEY MATERIAL') } },
+    )
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('connected'))
+    expect(api.fs.readFile).toHaveBeenCalledWith('/home/user/.ssh/id_ed25519')
+    expect(api.ssh.connect).toHaveBeenCalledWith(expect.objectContaining({
+      privateKey: 'PRIVATE KEY MATERIAL', password: undefined,
+    }))
+  })
+
+  it('fails fast when key auth has no key path configured', async () => {
+    const tab = setup({ authType: 'key', keyPath: undefined })
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('error'))
+    expect(storeTab().errorMessage).toBe('Key authentication selected but no key file path is configured')
+    expect(api.ssh.connect).not.toHaveBeenCalled()
+  })
+
+  it('reports an unreadable key file', async () => {
+    const tab = setup(
+      { authType: 'key', keyPath: '/nope/id_rsa' },
+      { fs: { readFile: vi.fn().mockRejectedValue(new Error('EACCES')) } },
+    )
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('error'))
+    expect(storeTab().errorMessage).toBe('Cannot read private key: /nope/id_rsa')
+  })
+
+  it('translates a locked keychain into a friendly message', async () => {
+    const tab = setup(
+      { authType: 'password' },
+      { sessions: { getCredentials: vi.fn().mockRejectedValue(new Error('keystore is locked')) } },
+    )
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('error'))
+    expect(storeTab().errorMessage).toBe('App is locked — unlock noxed to reconnect')
+  })
+
+  it('errors when no password is stored for the session', async () => {
+    const tab = setup(
+      { authType: 'password' },
+      { sessions: { getCredentials: vi.fn().mockResolvedValue({}) } },
+    )
+    render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('error'))
+    expect(storeTab().errorMessage).toBe('No password found for this session — re-enter credentials in Settings')
+  })
+
+  it('starts a reconnect cooldown after a failure and counts it down', async () => {
+    const tab = setup({ authType: 'key', keyPath: undefined })
+    const { rerender } = render(<TerminalView tab={tab} />)
+
+    await waitFor(() => expect(storeTab().status).toBe('error'))
+
+    // The overlay keys off the tab prop — re-render with the errored tab
+    rerender(<TerminalView tab={storeTab()} />)
+    expect(screen.getByText(/Retry in [45]s/)).toBeTruthy()
+
+    // One interval tick decrements the countdown
+    await act(async () => {
+      await new Promise(resolve => setTimeout(resolve, 1150))
+    })
+    expect(screen.getByText(/Retry in [34]s/)).toBeTruthy()
+  })
+})
diff --git a/src/renderer/src/components/Tunnels/TunnelsView.tsx b/src/renderer/src/components/Tunnels/TunnelsView.tsx
index 505a03e..029d3bf 100644
--- a/src/renderer/src/components/Tunnels/TunnelsView.tsx
+++ b/src/renderer/src/components/Tunnels/TunnelsView.tsx
@@ -141,14 +141,19 @@ function routeText(t: TunnelInfo): string {
   return `127.0.0.1:${t.listenPort} → ${t.targetHost}:${t.targetPort}`
 }
 
-function TunnelCard({ tunnel, via, busy, onToggle, onEdit, onDelete }: {
+function toggleIcon(busy: boolean, active: boolean) {
+  if (busy) return <Loader2 className="w-3.5 h-3.5 animate-spin" />
+  return active ? <Square className="w-3 h-3" /> : <Play className="w-3 h-3" />
+}
+
+function TunnelCard({ tunnel, via, busy, onToggle, onEdit, onDelete }: Readonly<{
   tunnel: TunnelInfo
   via: string
   busy: boolean
   onToggle: () => void
   onEdit: () => void
   onDelete: () => void
-}) {
+}>) {
   const meta = TYPE_META[tunnel.type]
   const active = tunnel.status === 'active'
 
@@ -214,7 +219,7 @@ function TunnelCard({ tunnel, via, busy, onToggle, onEdit, onDelete }: {
             ? { background: 'rgba(239,68,68,0.1)', color: '#EF4444' }
             : { background: 'rgba(16,185,129,0.1)', color: '#10B981' }}
         >
-          {busy ? <Loader2 className="w-3.5 h-3.5 animate-spin" /> : active ? <Square className="w-3 h-3" /> : <Play className="w-3 h-3" />}
+          {toggleIcon(busy, active)}
           {active ? 'Stop' : 'Start'}
         </button>
         <IconButton title="Edit" onClick={onEdit}><Pencil className="w-3.5 h-3.5" /></IconButton>
@@ -224,12 +229,12 @@ function TunnelCard({ tunnel, via, busy, onToggle, onEdit, onDelete }: {
   )
 }
 
-function IconButton({ title, onClick, danger, children }: {
+function IconButton({ title, onClick, danger, children }: Readonly<{
   title: string
   onClick: () => void
   danger?: boolean
   children: React.ReactNode
-}) {
+}>) {
   return (
     <button
       title={title}
@@ -250,12 +255,12 @@ function IconButton({ title, onClick, danger, children }: {
   )
 }
 
-function TunnelEditor({ tunnel, sshSessions, onClose, onSaved }: {
+function TunnelEditor({ tunnel, sshSessions, onClose, onSaved }: Readonly<{
   tunnel: TunnelInfo | null
   sshSessions: Session[]
   onClose: () => void
   onSaved: () => void
-}) {
+}>) {
   const [form, setForm] = useState({
     sessionId: tunnel?.sessionId ?? sshSessions[0]?.id ?? '',
     type: tunnel?.type ?? 'local' as TunnelInfo['type'],
@@ -281,11 +286,11 @@ function TunnelEditor({ tunnel, sshSessions, onClose, onSaved }: {
   async function save(e: React.FormEvent) {
     e.preventDefault()
     if (!form.sessionId) return setError('Choose an SSH connection')
-    const listenPort = parseInt(form.listenPort)
+    const listenPort = Number.parseInt(form.listenPort)
     if (!listenPort || listenPort < 1 || listenPort > 65535) return setError('Listen port must be 1–65535')
     if (form.type !== 'dynamic') {
       if (!form.targetHost.trim()) return setError('Target host is required')
-      const targetPort = parseInt(form.targetPort)
+      const targetPort = Number.parseInt(form.targetPort)
       if (!targetPort || targetPort < 1 || targetPort > 65535) return setError('Target port must be 1–65535')
     }
 
@@ -298,7 +303,7 @@ function TunnelEditor({ tunnel, sshSessions, onClose, onSaved }: {
           label: form.label.trim() || undefined,
           listenPort,
           targetHost: form.type !== 'dynamic' ? form.targetHost.trim() : undefined,
-          targetPort: form.type !== 'dynamic' ? parseInt(form.targetPort) : undefined,
+          targetPort: form.type !== 'dynamic' ? Number.parseInt(form.targetPort) : undefined,
         },
         tunnel?.id,
       )
@@ -444,7 +449,7 @@ function TunnelEditor({ tunnel, sshSessions, onClose, onSaved }: {
   )
 }
 
-function Field({ label, children }: { label: string; children: React.ReactNode }) {
+function Field({ label, children }: Readonly<{ label: string; children: React.ReactNode }>) {
   return (
     <div>
       <label className="font-['Plus_Jakarta_Sans'] text-[10px] uppercase tracking-wider font-semibold block mb-1.5" style={{ color: 'var(--nox-text-3)' }}>
diff --git a/src/renderer/src/components/Tunnels/__tests__/TunnelsView.test.tsx b/src/renderer/src/components/Tunnels/__tests__/TunnelsView.test.tsx
new file mode 100644
index 0000000..2c8a316
--- /dev/null
+++ b/src/renderer/src/components/Tunnels/__tests__/TunnelsView.test.tsx
@@ -0,0 +1,88 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import TunnelsView from '../TunnelsView'
+import { installWindowApi, seedStore, makeSession, WindowApiMock } from '../../../__tests__/harness'
+
+const tunnels = [
+  {
+    id: 'tun-1', sessionId: 'ssh-1', type: 'local', label: 'DB',
+    listenPort: 5433, targetHost: 'db.internal', targetPort: 5432,
+    status: 'active', connections: 2,
+  },
+  {
+    id: 'tun-2', sessionId: 'ssh-1', type: 'dynamic', label: 'Proxy',
+    listenPort: 1080, status: 'stopped', connections: 0,
+  },
+]
+
+let api: WindowApiMock
+
+describe('TunnelsView', () => {
+  beforeEach(() => {
+    api = installWindowApi({ tunnels: { list: vi.fn().mockResolvedValue(tunnels) } })
+    seedStore({
+      sessions: [makeSession({ id: 'ssh-1', label: 'Bastion' })],
+      tabs: [], notifications: [],
+    })
+  })
+
+  it('renders tunnel cards with the right toggle affordance', async () => {
+    render(<TunnelsView />)
+    await waitFor(() => expect(screen.getByText('DB')).toBeTruthy())
+    // Active tunnel offers Stop, stopped one offers Start
+    expect(screen.getByText('Stop')).toBeTruthy()
+    expect(screen.getByText('Start')).toBeTruthy()
+  })
+
+  it('starts and stops tunnels from the card button', async () => {
+    render(<TunnelsView />)
+    await waitFor(() => expect(screen.getByText('Start')).toBeTruthy())
+
+    fireEvent.click(screen.getByText('Start'))
+    await waitFor(() => expect(api.tunnels.start).toHaveBeenCalledWith('tun-2'))
+
+    fireEvent.click(screen.getByText('Stop'))
+    await waitFor(() => expect(api.tunnels.stop).toHaveBeenCalledWith('tun-1'))
+  })
+
+  it('validates ports before saving a new tunnel', async () => {
+    render(<TunnelsView />)
+    await waitFor(() => expect(screen.getByText('New Tunnel')).toBeTruthy())
+    fireEvent.click(screen.getByText('New Tunnel'))
+
+    // Empty listen port
+    fireEvent.click(screen.getByText('Create Tunnel'))
+    expect(screen.getByText('Listen port must be 1–65535')).toBeTruthy()
+
+    // Valid listen port but bogus target port
+    fireEvent.change(screen.getByPlaceholderText('8080'), { target: { value: '8080' } })
+    fireEvent.change(screen.getByPlaceholderText('db.internal'), { target: { value: 'db.internal' } })
+    fireEvent.change(screen.getByPlaceholderText('5432'), { target: { value: 'nope' } })
+    fireEvent.click(screen.getByText('Create Tunnel'))
+    expect(screen.getByText('Target port must be 1–65535')).toBeTruthy()
+
+    // Fixing the target port saves the tunnel
+    fireEvent.change(screen.getByPlaceholderText('5432'), { target: { value: '5432' } })
+    fireEvent.click(screen.getByText('Create Tunnel'))
+    await waitFor(() => expect(api.tunnels.save).toHaveBeenCalledWith(
+      expect.objectContaining({ sessionId: 'ssh-1', type: 'local', listenPort: 8080, targetHost: 'db.internal', targetPort: 5432 }),
+      undefined,
+    ))
+    // Editor closes after a successful save
+    await waitFor(() => expect(screen.queryByText('Create Tunnel')).toBeNull())
+  })
+
+  it('opens the editor pre-filled when editing an existing tunnel', async () => {
+    render(<TunnelsView />)
+    await waitFor(() => expect(screen.getByText('DB')).toBeTruthy())
+
+    fireEvent.click(screen.getAllByTitle('Edit')[0])
+    expect(screen.getByText('Edit Tunnel')).toBeTruthy()
+    expect((screen.getByPlaceholderText('8080') as HTMLInputElement).value).toBe('5433')
+
+    // Escape closes the editor
+    fireEvent.keyDown(window, { key: 'Escape' })
+    await waitFor(() => expect(screen.queryByText('Edit Tunnel')).toBeNull())
+  })
+})
diff --git a/src/renderer/src/components/UnlockScreen.tsx b/src/renderer/src/components/UnlockScreen.tsx
index 0276a1d..73362b6 100644
--- a/src/renderer/src/components/UnlockScreen.tsx
+++ b/src/renderer/src/components/UnlockScreen.tsx
@@ -137,12 +137,12 @@ export default function UnlockScreen() {
 }
 
 /* ── Biometric view ─────────────────────────────────────────────────────── */
-function BiometricView({ loading, error, onRetry, touchIDAvailable }: {
+function BiometricView({ loading, error, onRetry, touchIDAvailable }: Readonly<{
   loading: boolean
   error: string
   onRetry: () => void
   touchIDAvailable: boolean
-}) {
+}>) {
   return (
     <div className="flex flex-col items-center gap-5 w-full">
       <div
@@ -184,18 +184,18 @@ function BiometricView({ loading, error, onRetry, touchIDAvailable }: {
 }
 
 /* ── PIN view ───────────────────────────────────────────────────────────── */
-function PinView({ loading, error, shake, onSubmit }: {
+function PinView({ loading, error, shake, onSubmit }: Readonly<{
   loading: boolean
   error: string
   shake: boolean
   onSubmit: (pin: string) => void
-}) {
+}>) {
   const [digits, setDigits] = useState<string[]>([])
 
   useEffect(() => {
     const handler = (e: KeyboardEvent) => {
       if (loading) return
-      if (/^[0-9]$/.test(e.key) && digits.length < 4) {
+      if (/^\d$/.test(e.key) && digits.length < 4) {
         const next = [...digits, e.key]
         setDigits(next)
         if (next.length === 4) {
@@ -249,8 +249,8 @@ function PinView({ loading, error, shake, onSubmit }: {
 
       {/* Numpad */}
       <div className="grid grid-cols-3 gap-3 w-full">
-        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key, i) => {
-          if (key === '') return <div key={i} />
+        {['1','2','3','4','5','6','7','8','9','','0','⌫'].map((key) => {
+          if (key === '') return <div key="numpad-gap" />
           const isDelete = key === '⌫'
           return (
             <button
@@ -280,12 +280,12 @@ function PinView({ loading, error, shake, onSubmit }: {
 }
 
 /* ── Password view ──────────────────────────────────────────────────────── */
-function PasswordView({ loading, error, shake, onSubmit }: {
+function PasswordView({ loading, error, shake, onSubmit }: Readonly<{
   loading: boolean
   error: string
   shake: boolean
   onSubmit: (pw: string) => void
-}) {
+}>) {
   const [value, setValue] = useState('')
   const [show, setShow] = useState(false)
   const inputRef = useRef<HTMLInputElement>(null)
@@ -348,7 +348,7 @@ function PasswordView({ loading, error, shake, onSubmit }: {
 }
 
 /* ── Icons ──────────────────────────────────────────────────────────────── */
-function FingerprintIcon({ size = 24, active }: { size?: number; active?: boolean }) {
+function FingerprintIcon({ size = 24, active }: Readonly<{ size?: number; active?: boolean }>) {
   return (
     <svg width={size} height={size} viewBox="0 0 24 24" fill="none" strokeLinecap="round" strokeLinejoin="round">
       <path d="M4 8.5C4 6 6 4 8.5 4" stroke={active ? '#3B5CCC' : 'var(--nox-text-2)'} strokeWidth="1.5" />
@@ -363,7 +363,7 @@ function FingerprintIcon({ size = 24, active }: { size?: number; active?: boolea
   )
 }
 
-function EyeIcon({ size = 16 }: { size?: number }) {
+function EyeIcon({ size = 16 }: Readonly<{ size?: number }>) {
   return (
     <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
       <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/>
@@ -372,7 +372,7 @@ function EyeIcon({ size = 16 }: { size?: number }) {
   )
 }
 
-function EyeOffIcon({ size = 16 }: { size?: number }) {
+function EyeOffIcon({ size = 16 }: Readonly<{ size?: number }>) {
   return (
     <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
       <path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94"/>
diff --git a/src/renderer/src/components/__tests__/MainContent.test.tsx b/src/renderer/src/components/__tests__/MainContent.test.tsx
new file mode 100644
index 0000000..0ebd203
--- /dev/null
+++ b/src/renderer/src/components/__tests__/MainContent.test.tsx
@@ -0,0 +1,142 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, fireEvent, cleanup } from '@testing-library/react'
+import type { Tab } from '../../store'
+import { useAppStore } from '../../store'
+import { installWindowApi, seedStore, makeTab } from '../../__tests__/harness'
+
+// Keep the render shallow: every routed child becomes a labeled stub so this
+// test only exercises MainContent's own routing/layout logic.
+vi.mock('../Terminal/TerminalView', () => ({
+  default: ({ tab }: { tab: Tab }) => <div data-testid={`terminal-${tab.id}`}>terminal:{tab.id}</div>,
+}))
+vi.mock('../SFTP/SftpBrowser', () => ({ default: () => <div>stub-sftp</div> }))
+vi.mock('../K8s/K8sDashboard', () => ({
+  default: ({ context }: { context: string }) => <div>stub-k8s:{context}</div>,
+}))
+vi.mock('../Dashboard/Dashboard', () => ({ default: () => <div>stub-dashboard</div> }))
+vi.mock('../ConnectionManager/ConnectionManager', () => ({ default: () => <div>stub-connections</div> }))
+vi.mock('../Settings/Settings', () => ({ default: () => <div>stub-settings</div> }))
+vi.mock('../Redis/RedisExplorer', () => ({ default: () => <div>stub-redis</div> }))
+vi.mock('../Database/DatabaseExplorer', () => ({ default: () => <div>stub-database</div> }))
+vi.mock('../Editor/EditorTab', () => ({ default: () => <div>stub-editor</div> }))
+vi.mock('../Tunnels/TunnelsView', () => ({ default: () => <div>stub-tunnels</div> }))
+vi.mock('../Docker/DockerDashboard', () => ({ default: () => <div>stub-docker</div> }))
+vi.mock('../Runner/RunnerView', () => ({ default: () => <div>stub-runner</div> }))
+vi.mock('../Terminal/LocalTerminalView', () => ({ default: () => <div>stub-local-term</div> }))
+vi.mock('../RDP/RdpView', () => ({
+  default: ({ tab }: { tab: Tab }) => {
+    if (tab.label === 'explode') throw new Error('rdp blew up')
+    return <div>stub-rdp</div>
+  },
+}))
+
+import MainContent from '../MainContent'
+
+beforeEach(() => {
+  cleanup()
+  installWindowApi()
+  seedStore({ sessions: [], tabs: [], activeTabId: null, focusedPaneId: null })
+})
+
+const VIEW_STUBS: Array<[Tab['view'], string]> = [
+  ['sftp', 'stub-sftp'],
+  ['database', 'stub-database'],
+  ['redis', 'stub-redis'],
+  ['dashboard', 'stub-dashboard'],
+  ['connections', 'stub-connections'],
+  ['editor', 'stub-editor'],
+  ['settings', 'stub-settings'],
+  ['tunnels', 'stub-tunnels'],
+  ['docker', 'stub-docker'],
+  ['runner', 'stub-runner'],
+  ['local-term', 'stub-local-term'],
+  ['rdp', 'stub-rdp'],
+]
+
+describe('MainContent view routing', () => {
+  it.each(VIEW_STUBS)('routes a %s tab to its view', (view, stubText) => {
+    const tab = makeTab({ view })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<MainContent />)
+    expect(screen.getByText(stubText)).toBeTruthy()
+  })
+
+  it('routes k8s tabs with a context and passes it through', () => {
+    const tab = makeTab({ view: 'k8s', k8sContext: 'prod-cluster' })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<MainContent />)
+    expect(screen.getByText('stub-k8s:prod-cluster')).toBeTruthy()
+  })
+
+  it('renders nothing for a k8s tab without a context', () => {
+    const tab = makeTab({ view: 'k8s' })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    const { container } = render(<MainContent />)
+    expect(container.textContent).toBe('')
+  })
+
+  it('keeps every tab mounted but only the active tab visible', () => {
+    const a = makeTab({ view: 'settings' })
+    const b = makeTab({ view: 'runner' })
+    seedStore({ tabs: [a, b], activeTabId: b.id })
+    render(<MainContent />)
+    const settings = screen.getByText('stub-settings').parentElement as HTMLElement
+    const runner = screen.getByText('stub-runner').parentElement as HTMLElement
+    expect(settings.style.display).toBe('none')
+    expect(runner.style.display).toBe('flex')
+  })
+})
+
+describe('MainContent terminal panes', () => {
+  it('renders a single terminal without a split grid', () => {
+    const tab = makeTab({ view: 'terminal' })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<MainContent />)
+    const pane = screen.getByTestId(`terminal-${tab.id}`)
+    expect(pane).toBeTruthy()
+    // stub → pane wrapper → grid container
+    const grid = pane.parentElement!.parentElement as HTMLElement
+    expect(grid.style.display).toBe('flex')
+  })
+
+  it('renders split panes in a grid and skips pane tabs at the top level', () => {
+    const parent = makeTab({ view: 'terminal' })
+    const paneA = makeTab({ view: 'terminal', paneOf: parent.id })
+    const paneB = makeTab({ view: 'terminal', paneOf: parent.id })
+    seedStore({ tabs: [parent, paneA, paneB], activeTabId: parent.id })
+    render(<MainContent />)
+    // all three terminals mount exactly once
+    expect(screen.getAllByText(/terminal:/)).toHaveLength(3)
+    const grid = screen.getByTestId(`terminal-${parent.id}`).parentElement!.parentElement as HTMLElement
+    expect(grid.style.display).toBe('grid')
+    // three panes → third spans both columns
+    const third = screen.getByTestId(`terminal-${paneB.id}`).parentElement as HTMLElement
+    expect(third.style.gridColumn).toBe('span 2')
+  })
+
+  it('focuses a pane on mouse down when split', () => {
+    const parent = makeTab({ view: 'terminal' })
+    const pane = makeTab({ view: 'terminal', paneOf: parent.id })
+    seedStore({ tabs: [parent, pane], activeTabId: parent.id, focusedPaneId: null })
+    render(<MainContent />)
+    const paneEl = screen.getByTestId(`terminal-${pane.id}`).parentElement as HTMLElement
+    fireEvent.mouseDown(paneEl)
+    expect(useAppStore.getState().focusedPaneId).toBe(pane.id)
+  })
+})
+
+describe('MainContent error boundary', () => {
+  it('catches a crashing tab and recovers via Try again', () => {
+    const spy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const tab = makeTab({ view: 'rdp', label: 'explode' })
+    seedStore({ tabs: [tab], activeTabId: tab.id })
+    render(<MainContent />)
+    expect(screen.getByText('Something went wrong')).toBeTruthy()
+    expect(screen.getByText('rdp blew up')).toBeTruthy()
+    // Try again resets the boundary; the child throws again and is re-caught
+    fireEvent.click(screen.getByText('Try again'))
+    expect(screen.getByText('Something went wrong')).toBeTruthy()
+    spy.mockRestore()
+  })
+})
diff --git a/src/renderer/src/components/__tests__/UnlockScreen.test.tsx b/src/renderer/src/components/__tests__/UnlockScreen.test.tsx
new file mode 100644
index 0000000..161d1e4
--- /dev/null
+++ b/src/renderer/src/components/__tests__/UnlockScreen.test.tsx
@@ -0,0 +1,71 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import UnlockScreen from '../UnlockScreen'
+import { installWindowApi, seedStore, WindowApiMock } from '../../__tests__/harness'
+import { useAppStore } from '../../store'
+
+let api: WindowApiMock
+
+function setupPinMode(unlockResult: { success: boolean; error?: string }) {
+  api = installWindowApi({
+    auth: {
+      getMode: vi.fn().mockResolvedValue('pin'),
+      unlock: vi.fn().mockResolvedValue(unlockResult),
+    },
+  })
+  seedStore({ isLocked: true })
+}
+
+function typeDigits(digits: string) {
+  for (const d of digits) fireEvent.keyDown(window, { key: d })
+}
+
+describe('UnlockScreen (PIN mode)', () => {
+  beforeEach(() => setupPinMode({ success: true }))
+
+  it('submits after four keyboard digits and unlocks', async () => {
+    render(<UnlockScreen />)
+    await waitFor(() => expect(screen.getByText('Enter PIN')).toBeTruthy())
+
+    typeDigits('1234')
+    await waitFor(() => expect(api.auth.unlock).toHaveBeenCalledWith('1234'))
+    await waitFor(() => expect(useAppStore.getState().isLocked).toBe(false))
+  })
+
+  it('ignores non-digit keys and honors Backspace', async () => {
+    render(<UnlockScreen />)
+    await waitFor(() => expect(screen.getByText('Enter PIN')).toBeTruthy())
+
+    fireEvent.keyDown(window, { key: 'x' })
+    typeDigits('9')
+    fireEvent.keyDown(window, { key: 'Backspace' })
+    typeDigits('5678')
+
+    await waitFor(() => expect(api.auth.unlock).toHaveBeenCalledWith('5678'))
+  })
+
+  it('shows the error and keeps the lock on failure', async () => {
+    setupPinMode({ success: false, error: 'Wrong PIN' })
+    render(<UnlockScreen />)
+    await waitFor(() => expect(screen.getByText('Enter PIN')).toBeTruthy())
+
+    typeDigits('0000')
+    await waitFor(() => expect(screen.getByText('Wrong PIN')).toBeTruthy())
+    expect(useAppStore.getState().isLocked).toBe(true)
+  })
+
+  it('renders a numpad with a gap and a delete key', async () => {
+    render(<UnlockScreen />)
+    await waitFor(() => expect(screen.getByText('Enter PIN')).toBeTruthy())
+
+    for (const key of ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '⌫']) {
+      expect(screen.getByText(key)).toBeTruthy()
+    }
+
+    // Clicking a digit then delete leaves the pad empty (no submit)
+    fireEvent.click(screen.getByText('5'))
+    fireEvent.click(screen.getByText('⌫'))
+    expect(api.auth.unlock).not.toHaveBeenCalled()
+  })
+})
diff --git a/src/renderer/src/lib/__tests__/colors.test.ts b/src/renderer/src/lib/__tests__/colors.test.ts
new file mode 100644
index 0000000..1805ad6
--- /dev/null
+++ b/src/renderer/src/lib/__tests__/colors.test.ts
@@ -0,0 +1,73 @@
+import { describe, it, expect } from 'vitest'
+import { metricColor, metricColorMuted, groupColor, podStatusColor, containerStateColor } from '../colors'
+
+describe('metricColor', () => {
+  it('is red at or above 80', () => {
+    expect(metricColor(80)).toBe('#EF4444')
+    expect(metricColor(95)).toBe('#EF4444')
+  })
+
+  it('is amber between 60 and 79', () => {
+    expect(metricColor(60)).toBe('#F59E0B')
+    expect(metricColor(79)).toBe('#F59E0B')
+  })
+
+  it('is green below 60', () => {
+    expect(metricColor(10)).toBe('#10B981')
+  })
+})
+
+describe('metricColorMuted', () => {
+  it('mirrors the same thresholds with muted colors', () => {
+    expect(metricColorMuted(85)).toBe('#ef4444')
+    expect(metricColorMuted(65)).toBe('#f59e0b')
+    expect(metricColorMuted(10)).toBe('rgba(255,255,255,0.55)')
+  })
+})
+
+describe('groupColor', () => {
+  const palette = ['#6366f1', '#22c55e', '#f59e0b', '#f87171', '#a78bfa', '#06b6d4', '#fb923c', '#e879f9', '#34d399']
+
+  it('prefers a user override', () => {
+    expect(groupColor('prod', { prod: '#123456' })).toBe('#123456')
+  })
+
+  it('hashes the name to a stable palette color', () => {
+    const c = groupColor('production')
+    expect(palette).toContain(c)
+    expect(groupColor('production')).toBe(c)
+  })
+
+  it('handles multi-byte characters without throwing', () => {
+    expect(palette).toContain(groupColor('日本サーバ🚀'))
+  })
+
+  it('ignores overrides for other groups', () => {
+    expect(palette).toContain(groupColor('staging', { prod: '#123456' }))
+  })
+})
+
+describe('podStatusColor', () => {
+  it('maps common phases', () => {
+    expect(podStatusColor('Running')).toBe('#10B981')
+    expect(podStatusColor('Succeeded')).toBe('#3B82F6')
+    expect(podStatusColor('Pending')).toBe('#F59E0B')
+    expect(podStatusColor('CrashLoopBackOff')).toBe('#EF4444')
+    expect(podStatusColor('Unknown')).toBe('#6B7280')
+  })
+})
+
+describe('containerStateColor', () => {
+  it('maps running to green', () => {
+    expect(containerStateColor('running')).toBe('#10B981')
+  })
+
+  it('maps exited to the muted text variable', () => {
+    expect(containerStateColor('exited')).toBe('var(--nox-text-3)')
+  })
+
+  it('falls back to amber for transitional states', () => {
+    expect(containerStateColor('restarting')).toBe('#F59E0B')
+    expect(containerStateColor('paused')).toBe('#F59E0B')
+  })
+})
diff --git a/src/renderer/src/lib/__tests__/format.test.ts b/src/renderer/src/lib/__tests__/format.test.ts
new file mode 100644
index 0000000..f2bea6d
--- /dev/null
+++ b/src/renderer/src/lib/__tests__/format.test.ts
@@ -0,0 +1,85 @@
+import { describe, it, expect } from 'vitest'
+import {
+  formatBytes, formatBytesLong, formatFileSize, formatK8sMemory,
+  joinPath, formatUptime, sparkline, ipcErrorMessage,
+} from '../format'
+
+describe('formatK8sMemory', () => {
+  it('returns an em dash for empty input', () => {
+    expect(formatK8sMemory('')).toBe('—')
+  })
+
+  it('returns the raw string when it is not a number', () => {
+    expect(formatK8sMemory('abc')).toBe('abc')
+  })
+
+  it('formats gibibytes', () => {
+    expect(formatK8sMemory(String(2 * 1024 * 1024))).toBe('2Gi')
+  })
+
+  it('formats mebibytes', () => {
+    expect(formatK8sMemory('2048')).toBe('2Mi')
+  })
+
+  it('keeps small values in KiB', () => {
+    expect(formatK8sMemory('512')).toBe('512Ki')
+  })
+})
+
+describe('formatBytes / formatBytesLong / formatFileSize', () => {
+  it('formatBytes picks G/M/K units', () => {
+    expect(formatBytes(2.5e9)).toBe('2.5G')
+    expect(formatBytes(3e6)).toBe('3M')
+    expect(formatBytes(2048)).toBe('2K')
+  })
+
+  it('formatBytesLong picks GB/MB/KB/B units', () => {
+    expect(formatBytesLong(2.5e9)).toBe('2.5 GB')
+    expect(formatBytesLong(3e6)).toBe('3 MB')
+    expect(formatBytesLong(3e3)).toBe('3 KB')
+    expect(formatBytesLong(42)).toBe('42 B')
+  })
+
+  it('formatFileSize picks B/K/M/G units', () => {
+    expect(formatFileSize(512)).toBe('512B')
+    expect(formatFileSize(2048)).toBe('2K')
+    expect(formatFileSize(3 * 1024 * 1024)).toBe('3.0M')
+    expect(formatFileSize(2 * 1024 * 1024 * 1024)).toBe('2.0G')
+  })
+})
+
+describe('joinPath', () => {
+  it('joins against root without doubling the slash', () => {
+    expect(joinPath('/', 'etc')).toBe('/etc')
+  })
+
+  it('joins nested paths', () => {
+    expect(joinPath('/var/log', 'syslog')).toBe('/var/log/syslog')
+  })
+})
+
+describe('formatUptime', () => {
+  it('formats minutes, hours and days', () => {
+    expect(formatUptime(120)).toBe('2m')
+    expect(formatUptime(7200)).toBe('2h')
+    expect(formatUptime(86400 * 2 + 3600 * 3)).toBe('2d 3h')
+    expect(formatUptime(86400 * 2)).toBe('2d')
+  })
+})
+
+describe('sparkline', () => {
+  it('maps values to block characters', () => {
+    expect(sparkline([0, 100])).toBe('▁█')
+  })
+})
+
+describe('ipcErrorMessage', () => {
+  it('strips the Electron IPC wrapper', () => {
+    const err = new Error("Error invoking remote method 'ssh:connect': Error: boom")
+    expect(ipcErrorMessage(err)).toBe('boom')
+  })
+
+  it('falls back for non-errors', () => {
+    expect(ipcErrorMessage(undefined, 'nope')).toBe('nope')
+  })
+})
diff --git a/src/renderer/src/lib/colors.ts b/src/renderer/src/lib/colors.ts
index fda5a6a..c3ac980 100644
--- a/src/renderer/src/lib/colors.ts
+++ b/src/renderer/src/lib/colors.ts
@@ -35,7 +35,8 @@ export function groupColor(name: string, overrides?: Record<string, string>): st
   if (custom) return custom
   const palette = ['#6366f1', '#22c55e', '#f59e0b', '#f87171', '#a78bfa', '#06b6d4', '#fb923c', '#e879f9', '#34d399']
   let hash = 0
-  for (let i = 0; i < name.length; i++) hash = (hash * 31 + name.charCodeAt(i)) | 0
+  // Math.imul keeps the hash wrapped to 32 bits, like the classic (h*31+c)|0.
+  for (const ch of name) hash = Math.imul(hash, 31) + (ch.codePointAt(0) ?? 0)
   return palette[Math.abs(hash) % palette.length]
 }
 
@@ -48,6 +49,12 @@ export function podStatusColor(status: string): string {
   return '#6B7280'
 }
 
+export function containerStateColor(state: string): string {
+  if (state === 'running') return '#10B981'
+  if (state === 'exited') return 'var(--nox-text-3)'
+  return '#F59E0B'
+}
+
 export function dbTypeLabel(dbType?: string): string {
   const map: Record<string, string> = {
     postgresql: 'PostgreSQL',
diff --git a/src/renderer/src/lib/format.ts b/src/renderer/src/lib/format.ts
index 8e2bb42..805b674 100644
--- a/src/renderer/src/lib/format.ts
+++ b/src/renderer/src/lib/format.ts
@@ -25,8 +25,8 @@ export function formatFileSize(bytes: number): string {
 
 export function formatK8sMemory(mem: string): string {
   if (!mem) return '—'
-  const ki = parseInt(mem, 10)
-  if (isNaN(ki)) return mem
+  const ki = Number.parseInt(mem, 10)
+  if (Number.isNaN(ki)) return mem
   if (ki >= 1024 * 1024) return `${(ki / 1024 / 1024).toFixed(0)}Gi`
   if (ki >= 1024) return `${(ki / 1024).toFixed(0)}Mi`
   return `${ki}Ki`
diff --git a/src/renderer/src/store/__tests__/store.test.ts b/src/renderer/src/store/__tests__/store.test.ts
index cb65b81..bcf1306 100644
--- a/src/renderer/src/store/__tests__/store.test.ts
+++ b/src/renderer/src/store/__tests__/store.test.ts
@@ -285,6 +285,41 @@ describe('Zustand Store', () => {
     })
   })
 
+  describe('Session type → tab view mapping', () => {
+    it('opens an sftp view for sftp sessions', () => {
+      useAppStore.getState().openTab(makeSession({ type: 'sftp' }))
+      const tab = useAppStore.getState().tabs[0]
+      expect(tab.view).toBe('sftp')
+      expect(tab.status).toBe('idle')
+    })
+
+    it('opens a database view for database sessions', () => {
+      useAppStore.getState().openTab(makeSession({ type: 'database' }))
+      expect(useAppStore.getState().tabs[0].view).toBe('database')
+    })
+
+    it('opens a redis view for redis sessions', () => {
+      useAppStore.getState().openTab(makeSession({ type: 'redis' }))
+      expect(useAppStore.getState().tabs[0].view).toBe('redis')
+    })
+
+    it('opens an rdp view for rdp sessions, born connected with RDP label', () => {
+      useAppStore.getState().openTab(makeSession({ type: 'rdp', label: 'Win Box' }))
+      const tab = useAppStore.getState().tabs[0]
+      expect(tab.view).toBe('rdp')
+      expect(tab.status).toBe('connected')
+      expect(tab.label).toBe('RDP · Win Box')
+    })
+
+    it('falls back to terminal for untyped and ssh sessions', () => {
+      useAppStore.getState().openTab(makeSession({ id: 'a1' }))
+      useAppStore.getState().openTab(makeSession({ id: 'a2', type: 'ssh' }))
+      const [t1, t2] = useAppStore.getState().tabs
+      expect(t1.view).toBe('terminal')
+      expect(t2.view).toBe('terminal')
+    })
+  })
+
   describe('Notifications', () => {
     it('addNotification adds a notification', () => {
       useAppStore.getState().addNotification({ type: 'info', message: 'Test' })
diff --git a/src/renderer/src/store/index.ts b/src/renderer/src/store/index.ts
index dcd9cdb..2735efa 100644
--- a/src/renderer/src/store/index.ts
+++ b/src/renderer/src/store/index.ts
@@ -206,12 +206,19 @@ let notifCounter = 0
 
 // Fire-and-forget settings write, guarded so the store works in tests (no window)
 function persistSetting(key: string, value: unknown): void {
-  if (typeof window === 'undefined') return
+  if (typeof window === 'undefined') {
+    return
+  }
   ;(window as any).api?.settings?.set(key, value)
 }
 
 type SetState = (fn: (s: AppState) => Partial<AppState>) => void
 
+const TYPE_TO_VIEW: Record<string, TabView> = {
+  kubernetes: 'k8s', sftp: 'sftp', database: 'database', rdp: 'rdp', redis: 'redis',
+}
+const viewForSessionType = (type?: string): TabView => TYPE_TO_VIEW[type ?? ''] ?? 'terminal'
+
 // System views (dashboard, settings, …) only ever get one tab each.
 function openSingletonTab(set: SetState, view: TabView, label: string): void {
   set((s) => {
@@ -260,12 +267,9 @@ export const useAppStore = create<AppState>((set) => ({
     set((s) => {
       const existing = s.tabs.find((t) => t.sessionId === session.id && t.status !== 'error' && !t.paneOf)
       if (existing) return { activeTabId: existing.id, focusedPaneId: null }
-      const isK8s = session.type === 'kubernetes'
-      const isSftp = session.type === 'sftp'
-      const isDb = session.type === 'database'
-      const isRdp = session.type === 'rdp'
-      const isRedis = session.type === 'redis'
-      const view: TabView = isK8s ? 'k8s' : isSftp ? 'sftp' : isDb ? 'database' : isRdp ? 'rdp' : isRedis ? 'redis' : 'terminal'
+      const view = viewForSessionType(session.type)
+      const isK8s = view === 'k8s'
+      const isRdp = view === 'rdp'
       const tab: Tab = {
         id: `tab-${++tabCounter}`,
         sessionId: session.id,
diff --git a/tsconfig.web.json b/tsconfig.web.json
index 0e04c0e..fade08c 100644
--- a/tsconfig.web.json
+++ b/tsconfig.web.json
@@ -3,6 +3,7 @@
   "include": ["src/renderer/src/**/*", "src/renderer/src/**/*.d.ts", "src/preload/index.d.ts"],
   "compilerOptions": {
     "composite": true,
+    "jsx": "react-jsx",
     "baseUrl": ".",
     "paths": {
       "@renderer/*": ["src/renderer/src/*"]
diff --git a/vitest.config.ts b/vitest.config.ts
index 583753b..3d39edb 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -4,7 +4,14 @@ export default defineConfig({
   test: {
     globals: true,
     environment: 'node',
-    include: ['src/**/__tests__/**/*.test.ts'],
+    include: ['src/**/__tests__/**/*.test.{ts,tsx}'],
     exclude: ['node_modules', 'out', 'dist'],
+    coverage: {
+      provider: 'v8',
+      reporter: ['lcov', 'text-summary'],
+      include: ['src/**/*.{ts,tsx}'],
+      exclude: ['src/**/__tests__/**', 'src/preload/index.d.ts'],
+      reportsDirectory: 'coverage',
+    },
   },
 })