@gxp-dev/tools 2.0.12 → 2.0.14

package/browser-extensions/chrome/popup.js

@@ -5,13 +5,16 @@ document.addEventListener("DOMContentLoaded", async function () {
 	const saveButton = document.getElementById("saveButton");
 	const statusDiv = document.getElementById("status");
 	const maskingModeCheckbox = document.getElementById("maskingMode");
-	const clearCacheOnEnableCheckbox =
-		document.getElementById("clearCacheOnEnable");
-	const disableCacheForRedirectsCheckbox = document.getElementById(
-		"disableCacheForRedirects"
-	);
+	const clearCacheOnEnableCheckbox = document.getElementById("clearCacheOnEnable");
+	const disableCacheForRedirectsCheckbox = document.getElementById("disableCacheForRedirects");
 	const clearCacheButton = document.getElementById("clearCacheButton");
 
+	// Tab elements
+	const tabs = document.querySelectorAll(".tab");
+	const tabContents = document.querySelectorAll(".tab-content");
+	const jsBadge = document.getElementById("jsBadge");
+	const cssBadge = document.getElementById("cssBadge");
+
 	// Inspector elements
 	const inspectorToggle = document.getElementById("inspectorToggle");
 	const inspectorText = document.getElementById("inspectorText");
@@ -35,79 +38,113 @@ document.addEventListener("DOMContentLoaded", async function () {
 	const cssRedirectSection = document.getElementById("cssRedirectSection");
 	const cssCustomPattern = document.getElementById("cssCustomPattern");
 	const cssPatternDisplay = document.getElementById("cssPatternDisplay");
-	const cssCustomPatternInput = document.getElementById(
-		"cssCustomPatternInput"
-	);
+	const cssCustomPatternInput = document.getElementById("cssCustomPatternInput");
+
+	// Load environment-based defaults from defaults.json (generated by launch script)
+	let envDefaults = {};
+	try {
+		const response = await fetch(chrome.runtime.getURL("defaults.json"));
+		if (response.ok) {
+			envDefaults = await response.json();
+			console.log("Loaded environment defaults:", envDefaults);
+		}
+	} catch (error) {
+		console.log("No environment defaults found, using hardcoded defaults");
+	}
+
+	// Build default redirect URL from env defaults or fallback
+	const defaultRedirectUrl = envDefaults.jsRedirectUrl || "https://localhost:3060/src/Plugin.vue";
 
-	// Default configuration
+	// Default configuration (merged with environment defaults)
 	const defaultConfig = {
-		enabled: false,
-		// Legacy fields for backward compatibility
-		redirectUrl: "https://localhost:3060/src/Plugin.vue",
+		enabled: envDefaults.enabled || false,
+		redirectUrl: defaultRedirectUrl,
 		urlPattern: "uploads\\/plugin-version\\/\\d+\\/file_name\\/.*\\.js(\\?.*)?",
-		useCustomPattern: false,
-		// New rules-based configuration
+		useCustomPattern: envDefaults.jsUseCustomPattern || false,
 		rules: {
 			js: {
 				enabled: true,
-				pattern:
-					"uploads\\/plugin-version\\/\\d+\\/file_name\\/.*\\.js(\\?.*)?",
-				redirectUrl: "https://localhost:3060/src/Plugin.vue",
-				useCustomPattern: false,
+				pattern: "uploads\\/plugin-version\\/\\d+\\/file_name\\/.*\\.js(\\?.*)?",
+				redirectUrl: defaultRedirectUrl,
+				useCustomPattern: envDefaults.jsUseCustomPattern || false,
 			},
 			css: {
-				enabled: true,
-				pattern:
-					"uploads\\/plugin-version\\/\\d+\\/style_file_name\\/.*\\.css(\\?.*)?",
-				redirectUrl: "",
-				returnBlank: true,
-				useCustomPattern: false,
+				enabled: envDefaults.cssRuleEnabled !== false,
+				pattern: "uploads\\/plugin-version\\/\\d+\\/style_file_name\\/.*\\.css(\\?.*)?",
+				redirectUrl: envDefaults.cssRedirectUrl || "",
+				returnBlank: envDefaults.cssReturnBlank !== false,
+				useCustomPattern: envDefaults.cssUseCustomPattern || false,
 			},
 		},
 		maskingMode: false,
-		clearCacheOnEnable: true,
-		disableCacheForRedirects: true,
+		clearCacheOnEnable: envDefaults.clearCacheOnEnable !== false,
+		disableCacheForRedirects: envDefaults.disableCacheForRedirects !== false,
 	};
 
 	// Load current configuration
 	let config = {};
 	try {
-		const result = await chrome.storage.sync.get(defaultConfig);
-		config = result;
+		const result = await chrome.storage.sync.get(null);
 
-		// Migrate legacy config if needed
-		config = migrateConfig(config);
+		if (!result || Object.keys(result).length === 0) {
+			config = defaultConfig;
+			await chrome.storage.sync.set(config);
+			console.log("Initialized with environment defaults");
+		} else {
+			config = { ...defaultConfig, ...result };
+			config = migrateConfig(config, defaultConfig);
+		}
 	} catch (error) {
 		console.error("Error loading config:", error);
 		config = defaultConfig;
 	}
 
-	// Initialize UI with loaded config
+	// Initialize UI
 	updateUI();
 	updatePatternDisplays();
+	setupTabNavigation();
 
-	function migrateConfig(config) {
-		// If rules don't exist, create them from legacy config
+	function migrateConfig(config, defaults = defaultConfig) {
 		if (!config.rules) {
 			config.rules = {
 				js: {
 					enabled: true,
-					pattern: config.urlPattern || defaultConfig.rules.js.pattern,
-					redirectUrl: config.redirectUrl || defaultConfig.rules.js.redirectUrl,
-					useCustomPattern: config.useCustomPattern || false,
+					pattern: config.urlPattern || defaults.rules.js.pattern,
+					redirectUrl: config.redirectUrl || defaults.rules.js.redirectUrl,
+					useCustomPattern: config.useCustomPattern || defaults.rules.js.useCustomPattern,
 				},
 				css: {
-					enabled: true,
-					pattern: defaultConfig.rules.css.pattern,
-					redirectUrl: "",
-					returnBlank: true,
-					useCustomPattern: false,
+					enabled: defaults.rules.css.enabled,
+					pattern: defaults.rules.css.pattern,
+					redirectUrl: defaults.rules.css.redirectUrl,
+					returnBlank: defaults.rules.css.returnBlank,
+					useCustomPattern: defaults.rules.css.useCustomPattern,
 				},
 			};
 		}
 		return config;
 	}
 
+	function setupTabNavigation() {
+		tabs.forEach((tab) => {
+			tab.addEventListener("click", () => {
+				const tabName = tab.dataset.tab;
+
+				// Update active tab
+				tabs.forEach((t) => t.classList.remove("active"));
+				tab.classList.add("active");
+
+				// Show corresponding content
+				tabContents.forEach((content) => {
+					content.classList.remove("active");
+					if (content.id === `${tabName}Tab`) {
+						content.classList.add("active");
+					}
+				});
+			});
+		});
+	}
+
 	function updateUI() {
 		// Update toggle button
 		if (config.enabled) {
@@ -121,8 +158,7 @@ document.addEventListener("DOMContentLoaded", async function () {
 		// Update global settings
 		maskingModeCheckbox.checked = config.maskingMode || false;
 		clearCacheOnEnableCheckbox.checked = config.clearCacheOnEnable !== false;
-		disableCacheForRedirectsCheckbox.checked =
-			config.disableCacheForRedirects !== false;
+		disableCacheForRedirectsCheckbox.checked = config.disableCacheForRedirects !== false;
 
 		// Update JS rule
 		if (config.rules && config.rules.js) {
@@ -131,10 +167,16 @@ document.addEventListener("DOMContentLoaded", async function () {
 			jsCustomPattern.checked = config.rules.js.useCustomPattern || false;
 			jsCustomPatternInput.value = config.rules.js.pattern || "";
 
-			// Toggle JS rule content visibility
+			// Update JS badge
 			if (config.rules.js.enabled) {
+				jsBadge.textContent = "ON";
+				jsBadge.classList.remove("disabled");
+				jsBadge.classList.add("enabled");
 				jsRuleContent.classList.remove("rule-disabled");
 			} else {
+				jsBadge.textContent = "OFF";
+				jsBadge.classList.remove("enabled");
+				jsBadge.classList.add("disabled");
 				jsRuleContent.classList.add("rule-disabled");
 			}
 
@@ -156,10 +198,16 @@ document.addEventListener("DOMContentLoaded", async function () {
 			cssCustomPattern.checked = config.rules.css.useCustomPattern || false;
 			cssCustomPatternInput.value = config.rules.css.pattern || "";
 
-			// Toggle CSS rule content visibility
+			// Update CSS badge
 			if (config.rules.css.enabled) {
+				cssBadge.textContent = "ON";
+				cssBadge.classList.remove("disabled");
+				cssBadge.classList.add("enabled");
 				cssRuleContent.classList.remove("rule-disabled");
 			} else {
+				cssBadge.textContent = "OFF";
+				cssBadge.classList.remove("enabled");
+				cssBadge.classList.add("disabled");
 				cssRuleContent.classList.add("rule-disabled");
 			}
 
@@ -182,7 +230,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 	}
 
 	function updatePatternDisplays() {
-		// Update JS pattern display
 		if (config.rules && config.rules.js) {
 			const jsPattern = config.rules.js.useCustomPattern
 				? config.rules.js.pattern
@@ -190,7 +237,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 			jsPatternDisplay.textContent = jsPattern;
 		}
 
-		// Update CSS pattern display
 		if (config.rules && config.rules.css) {
 			const cssPattern = config.rules.css.useCustomPattern
 				? config.rules.css.pattern
@@ -210,23 +256,17 @@ document.addEventListener("DOMContentLoaded", async function () {
 	}
 
 	function validateRedirectUrl(url) {
-		if (!url || url.trim() === "") {
-			return null; // Empty URL is valid for optional fields
-		}
+		if (!url || url.trim() === "") return null;
 
 		try {
 			new URL(url);
-			return null; // Valid
+			return null;
 		} catch {
-			// Check if it's a relative-style URL like localhost:3060/path
-			if (url.includes("://")) {
-				return "Invalid URL format";
-			}
+			if (url.includes("://")) return "Invalid URL format";
 
-			// Try to parse as localhost-style URL
 			try {
 				new URL("https://" + url);
-				return null; // Valid
+				return null;
 			} catch {
 				return "Invalid URL format";
 			}
@@ -234,13 +274,11 @@ document.addEventListener("DOMContentLoaded", async function () {
 	}
 
 	function validatePattern(pattern) {
-		if (!pattern || pattern.trim() === "") {
-			return "URL pattern is required";
-		}
+		if (!pattern || pattern.trim() === "") return "URL pattern is required";
 
 		try {
 			new RegExp(pattern);
-			return null; // Valid
+			return null;
 		} catch {
 			return "Invalid regular expression pattern";
 		}
@@ -248,9 +286,7 @@ document.addEventListener("DOMContentLoaded", async function () {
 
 	function normalizeUrl(url) {
 		if (!url || url.trim() === "") return "";
-		if (!url.includes("://")) {
-			return "https://" + url;
-		}
+		if (!url.includes("://")) return "https://" + url;
 		return url;
 	}
 
@@ -262,7 +298,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 			await chrome.storage.sync.set({ enabled: config.enabled });
 			updateUI();
 
-			// Send message to background script
 			chrome.runtime.sendMessage({
 				action: "toggleProxy",
 				enabled: config.enabled,
@@ -332,29 +367,23 @@ document.addEventListener("DOMContentLoaded", async function () {
 			this.textContent = "Clearing...";
 			this.disabled = true;
 
-			const response = await chrome.runtime.sendMessage({
-				action: "clearCache",
-			});
+			const response = await chrome.runtime.sendMessage({ action: "clearCache" });
 
 			if (response.success) {
 				showStatus("Cache cleared successfully");
 			} else {
-				showStatus(
-					"Error clearing cache: " + (response.error || "Unknown error"),
-					false
-				);
+				showStatus("Error clearing cache: " + (response.error || "Unknown error"), false);
 			}
 		} catch (error) {
 			console.error("Error clearing cache:", error);
 			showStatus("Error clearing cache", false);
 		} finally {
-			this.textContent = "Clear Cache Now";
+			this.textContent = "Clear Cache";
 			this.disabled = false;
 		}
 	});
 
 	saveButton.addEventListener("click", async function () {
-		// Ensure rules structure exists
 		if (!config.rules) config.rules = {};
 		if (!config.rules.js) config.rules.js = { ...defaultConfig.rules.js };
 		if (!config.rules.css) config.rules.css = { ...defaultConfig.rules.css };
@@ -367,10 +396,7 @@ document.addEventListener("DOMContentLoaded", async function () {
 				: defaultConfig.rules.js.pattern;
 
 			if (!jsRedirectUrlValue) {
-				showStatus(
-					"JavaScript redirect URL is required when JS rule is enabled",
-					false
-				);
+				showStatus("JavaScript redirect URL is required when JS rule is enabled", false);
 				return;
 			}
 
@@ -386,7 +412,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 				return;
 			}
 
-			// Update JS rule config
 			config.rules.js.redirectUrl = normalizeUrl(jsRedirectUrlValue);
 			config.rules.js.pattern = jsPatternValue;
 		}
@@ -398,12 +423,8 @@ document.addEventListener("DOMContentLoaded", async function () {
 				? cssCustomPatternInput.value.trim()
 				: defaultConfig.rules.css.pattern;
 
-			// Only validate redirect URL if not returning blank
 			if (!config.rules.css.returnBlank && !cssRedirectUrlValue) {
-				showStatus(
-					"CSS redirect URL is required when CSS rule is enabled and not returning blank",
-					false
-				);
+				showStatus("CSS redirect URL is required when not returning blank", false);
 				return;
 			}
 
@@ -421,7 +442,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 				return;
 			}
 
-			// Update CSS rule config
 			config.rules.css.redirectUrl = normalizeUrl(cssRedirectUrlValue);
 			config.rules.css.pattern = cssPatternValue;
 		}
@@ -429,7 +449,6 @@ document.addEventListener("DOMContentLoaded", async function () {
 		try {
 			await chrome.storage.sync.set(config);
 
-			// Send updated config to background script
 			chrome.runtime.sendMessage({
 				action: "updateConfig",
 				config: config,
@@ -450,10 +469,7 @@ document.addEventListener("DOMContentLoaded", async function () {
 		config: config,
 	});
 
-	// ============================================================
 	// Component Inspector
-	// ============================================================
-
 	function updateInspectorUI() {
 		if (inspectorEnabled) {
 			inspectorToggle.classList.add("enabled");
@@ -464,45 +480,30 @@ document.addEventListener("DOMContentLoaded", async function () {
 		}
 	}
 
-	// Get initial inspector state from content script
 	async function getInspectorState() {
 		try {
-			const [tab] = await chrome.tabs.query({
-				active: true,
-				currentWindow: true,
-			});
+			const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
 			if (tab?.id) {
-				const response = await chrome.tabs.sendMessage(tab.id, {
-					action: "getInspectorState",
-				});
+				const response = await chrome.tabs.sendMessage(tab.id, { action: "getInspectorState" });
 				if (response) {
 					inspectorEnabled = response.enabled;
 					updateInspectorUI();
 				}
 			}
 		} catch (error) {
-			// Content script might not be loaded yet
 			console.log("Could not get inspector state:", error);
 		}
 	}
 
-	// Toggle inspector
 	inspectorToggle.addEventListener("click", async function () {
 		try {
-			const [tab] = await chrome.tabs.query({
-				active: true,
-				currentWindow: true,
-			});
+			const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
 			if (tab?.id) {
-				const response = await chrome.tabs.sendMessage(tab.id, {
-					action: "toggleInspector",
-				});
+				const response = await chrome.tabs.sendMessage(tab.id, { action: "toggleInspector" });
 				if (response) {
 					inspectorEnabled = response.enabled;
 					updateInspectorUI();
-					showStatus(
-						inspectorEnabled ? "Inspector enabled" : "Inspector disabled"
-					);
+					showStatus(inspectorEnabled ? "Inspector enabled" : "Inspector disabled");
 				}
 			}
 		} catch (error) {
@@ -510,6 +511,5 @@ document.addEventListener("DOMContentLoaded", async function () {
 		}
 	});
 
-	// Initialize inspector state
 	getInspectorState();
 });

package/browser-extensions/firefox/manifest.json

@@ -62,6 +62,7 @@
     "content.js",
     "inspector.js",
     "panel.html",
-    "panel.js"
+    "panel.js",
+    "defaults.json"
   ]
 } 

package/browser-extensions/firefox/popup.js

@@ -1,30 +1,49 @@
-// Configuration defaults
+// Environment defaults loaded from defaults.json (generated by launch script)
+let envDefaults = {};
+
+// Load environment defaults synchronously via XHR (needed before DEFAULT_CONFIG)
+try {
+	const xhr = new XMLHttpRequest();
+	xhr.open('GET', browser.runtime.getURL('defaults.json'), false);
+	xhr.send();
+	if (xhr.status === 200) {
+		envDefaults = JSON.parse(xhr.responseText);
+		console.log('[JavaScript Proxy] Loaded environment defaults:', envDefaults);
+	}
+} catch (error) {
+	console.log('[JavaScript Proxy] No environment defaults found, using hardcoded defaults');
+}
+
+// Build default redirect URL from env defaults or fallback
+const defaultRedirectUrl = envDefaults.jsRedirectUrl || "https://localhost:3060/src/Plugin.vue";
+
+// Configuration defaults (merged with environment defaults)
 const DEFAULT_CONFIG = {
-	enabled: false,
+	enabled: envDefaults.enabled || false,
 	// Legacy fields for backward compatibility
-	redirectUrl: "https://localhost:3060/src/Plugin.vue",
+	redirectUrl: defaultRedirectUrl,
 	urlPattern: "uploads\\/plugin-version\\/\\d+\\/file_name\\/.*\\.js(\\?.*)?",
-	useCustomPattern: false,
+	useCustomPattern: envDefaults.jsUseCustomPattern || false,
 	// New rules-based configuration
 	rules: {
 		js: {
 			enabled: true,
 			pattern: "uploads\\/plugin-version\\/\\d+\\/file_name\\/.*\\.js(\\?.*)?",
-			redirectUrl: "https://localhost:3060/src/Plugin.vue",
-			useCustomPattern: false,
+			redirectUrl: defaultRedirectUrl,
+			useCustomPattern: envDefaults.jsUseCustomPattern || false,
 		},
 		css: {
-			enabled: true,
+			enabled: envDefaults.cssRuleEnabled !== false,
 			pattern:
 				"uploads\\/plugin-version\\/\\d+\\/style_file_name\\/.*\\.css(\\?.*)?",
-			redirectUrl: "",
-			returnBlank: true,
-			useCustomPattern: false,
+			redirectUrl: envDefaults.cssRedirectUrl || "",
+			returnBlank: envDefaults.cssReturnBlank !== false,
+			useCustomPattern: envDefaults.cssUseCustomPattern || false,
 		},
 	},
 	maskingMode: false,
-	clearCacheOnEnable: true,
-	disableCacheForRedirects: true,
+	clearCacheOnEnable: envDefaults.clearCacheOnEnable !== false,
+	disableCacheForRedirects: envDefaults.disableCacheForRedirects !== false,
 };
 
 // Global state

package/dist/tui/App.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../../bin/lib/tui/App.tsx"],"names":[],"mappings":"AAQA,OAAO,EAUL,aAAa,EAKd,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,IAAI,EAAE,MAAM,EAAE,CAAC;CAChB;AAUD,MAAM,WAAW,QAAQ;IACvB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,QAAQ,2CAqpBxD"}
+{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../../bin/lib/tui/App.tsx"],"names":[],"mappings":"AAQA,OAAO,EAUL,aAAa,EAKd,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,IAAI,EAAE,MAAM,EAAE,CAAC;CAChB;AAUD,MAAM,WAAW,QAAQ;IACvB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,QAAQ,2CAyqBxD"}

package/dist/tui/App.js

@@ -82,15 +82,7 @@ export default function App({ autoStart, args }) {
             }
             return;
         }
-        // Tab to cycle through tabs (when not in input)
-        if (key.tab && services.length > 0) {
-            const nextTab = key.shift
-                ? (activeTab - 1 + services.length) % services.length
-                : (activeTab + 1) % services.length;
-            setActiveTab(nextTab);
-            return;
-        }
-        // Left/Right arrow to switch tabs
+        // Left/Right arrow to switch tabs (Tab is reserved for command autocomplete)
         if (key.leftArrow && services.length > 0) {
             setActiveTab((activeTab - 1 + services.length) % services.length);
             return;
@@ -99,7 +91,7 @@ export default function App({ autoStart, args }) {
             setActiveTab((activeTab + 1) % services.length);
             return;
         }
-        // Ctrl+1-9 or Cmd+1-9 to switch tabs (for compatibility)
+        // Ctrl+1-9 or Cmd+1-9 to switch tabs directly
         if ((key.ctrl || key.meta) && /^[1-9]$/.test(input)) {
             const tabIndex = parseInt(input) - 1;
             if (tabIndex < services.length) {
@@ -433,11 +425,21 @@ export default function App({ autoStart, args }) {
         const overwrite = cmdArgs.includes('--overwrite') || cmdArgs.includes('-o');
         addSystemLog('Scanning source files for GxP configuration...');
         try {
-            // Use require for CommonJS modules
-            const path = require('path');
-            const fs = require('fs');
-            // eslint-disable-next-line @typescript-eslint/no-var-requires
-            const extractConfigUtils = require('../utils/extract-config.js');
+            // Use dynamic imports for ES modules
+            const path = await import('path');
+            const fs = await import('fs');
+            const url = await import('url');
+            const { createRequire } = await import('module');
+            // Get the directory of this file and resolve to the utils directory
+            const __filename = url.fileURLToPath(import.meta.url);
+            const __dirname = path.dirname(__filename);
+            // The compiled JS is in dist/tui/, utils is in bin/lib/utils/
+            // From dist/tui/ we need to go up to package root, then into bin/lib/utils/
+            const packageRoot = path.resolve(__dirname, '..', '..');
+            const utilsPath = path.join(packageRoot, 'bin', 'lib', 'utils', 'extract-config.js');
+            // Create a require function to load CommonJS modules
+            const requireCjs = createRequire(import.meta.url);
+            const extractConfigUtils = requireCjs(utilsPath);
             const projectPath = process.cwd();
             const srcDir = path.join(projectPath, 'src');
             const manifestPath = path.join(projectPath, 'app-manifest.json');
@@ -507,43 +509,59 @@ export default function App({ autoStart, args }) {
     });
     const getHelpText = () => `
 Available commands:
-  /dev                  Start Vite (+ Socket if SOCKET_IO_ENABLED=true)
-  /dev --with-socket    Start Vite + Socket.IO together
-  /dev --with-mock      Start Vite + Socket.IO + Mock API server
-  /dev --no-socket      Start Vite only (skip Socket.IO)
-  /dev --no-https       Start Vite without SSL
-  /dev --firefox        Start Vite + Firefox extension
-  /dev --chrome         Start Vite + Chrome extension
-  /socket               Start Socket.IO server
-  /socket --with-mock   Start Socket.IO with Mock API enabled
-  /socket send <event>  Send socket event
-  /socket list          List available events
-  /mock                 Start Socket.IO + Mock API (shorthand)
-  /ext chrome           Launch Chrome extension
-  /ext firefox          Launch Firefox extension
-  /extract-config       Extract GxP config from source to manifest
-  /extract-config -d    Dry run (show what would be extracted)
-  /extract-config -o    Overwrite existing values in manifest
-  /stop [service]       Stop a running service
-  /restart [service]    Restart a service
-  /clear                Clear current log panel
-  /gemini               Open Gemini AI chat panel
-  /gemini enable        Set up Google authentication
-  /gemini ask <query>   Quick question to Gemini
-  /gemini status        Check authentication status
-  /gemini logout        Log out from Gemini
-  /help                 Show this help message
-  /quit                 Exit the application
+
+  Development Server:
+    /dev                  Start Vite dev server
+    /dev --with-socket    Start Vite + Socket.IO
+    /dev --with-mock      Start Vite + Socket.IO + Mock API
+    /dev --no-https       Start without SSL
+    /dev --no-socket      Start without Socket.IO
+    /dev --chrome         Start + launch Chrome extension
+    /dev --firefox        Start + launch Firefox extension
+
+  Socket.IO:
+    /socket               Start Socket.IO server
+    /socket --with-mock   Start with Mock API enabled
+    /socket send <event>  Send a socket event
+    /socket list          List available events
+    /mock                 Shorthand for /socket --with-mock
+
+  Browser Extensions:
+    /ext chrome           Launch Chrome with GxP extension
+    /ext firefox          Launch Firefox with GxP extension
+
+  Config Extraction:
+    /extract-config       Extract GxP config from source
+    /extract-config -d    Dry run (preview changes)
+    /extract-config -o    Overwrite existing values
+
+  AI Assistant:
+    /gemini               Open Gemini AI chat panel
+    /gemini enable        Set up Google authentication
+    /gemini ask <query>   Quick question to AI
+    /gemini status        Check auth status
+    /gemini logout        Log out from Gemini
+    /gemini clear         Clear conversation history
+    /ai                   Alias for /gemini
+
+  Service Management:
+    /stop [service]       Stop current or specified service
+    /restart [service]    Restart a service
+    /clear                Clear current log panel
+    /help                 Show this help
+    /quit                 Exit application
 
 Keyboard shortcuts:
-  Tab / Shift+Tab  Cycle through tabs
-  Left/Right       Switch tabs
-  Cmd+1/2/3...     Jump to tab (Mac)
-  Shift+Up/Down    Scroll logs
-  Cmd+Up/Down      Jump to top/bottom of logs
+  ←/→              Switch tabs
+  Ctrl+1/2/3...    Jump to tab directly
+  Shift+↑/↓        Scroll logs
+  Ctrl+↑/↓         Jump to top/bottom of logs
   Ctrl+L           Clear current log
+  Ctrl+K           Stop current service
   Ctrl+C           Exit application
-  Up/Down          Command history (in input)
+  Tab              Autocomplete command
+  ↑/↓              Navigate suggestions or command history
+  Esc              Clear input
 `;
     // Show Gemini panel
     if (showGemini) {