@dollhousemcp/mcp-server 2.0.16 → 2.0.18

package/dist/web/public/setup.js

@@ -18,15 +18,15 @@
   const PLATFORMS = [
     // Claude Desktop & Claude Code panels are handwritten in HTML (unique structure)
     { id: 'claude-desktop', rootKey: 'mcpServers' },
-    { id: 'claude-code',    rootKey: 'mcpServers', cli: 'claude', hookSupport: 'verified', hookCommand: `bash ${HOOK_BASE_SCRIPT_PATH}`, hookConfigPath: '<code>~/.claude/settings.json</code>' },
+    { id: 'claude-code',    rootKey: 'mcpServers', cli: 'claude', hookCommand: `bash ${HOOK_BASE_SCRIPT_PATH}`, hookConfigPath: '<code>~/.claude/settings.json</code>' },
     // These panels are generated from this data by renderGeneratedPanels()
-    { id: 'cursor',    rootKey: 'mcpServers', installClient: 'cursor',     openClient: 'cursor',     configPath: '<code>.cursor/mcp.json</code> in your project, or <code>~/.cursor/mcp.json</code> for all projects', hint: 'Or configure via Settings &gt; MCP Servers in the Cursor UI.', hookSupport: 'manual', hookCommand: `bash ${HOOKS_DIR}/pretooluse-cursor.sh`, hookConfigPath: '<code>.cursor/mcp.json</code> in your project, or <code>~/.cursor/mcp.json</code> for all projects' },
-    { id: 'vscode',    rootKey: 'servers',    installClient: 'vscode',     configPath: '<code>.vscode/mcp.json</code> in your workspace', hint: 'VS Code uses <code>"servers"</code>, not <code>"mcpServers"</code>.' },
-    { id: 'codex',     rootKey: 'mcpServers', installClient: 'codex',      openClient: 'codex',      cli: 'codex', toml: true, tomlPath: '<code>~/.codex/config.toml</code> (Codex uses TOML, not JSON)', hookSupport: 'manual', hookCommand: `bash ${HOOKS_DIR}/pretooluse-codex.sh`, hookConfigPath: '<code>~/.codex/config.toml</code>' },
-    { id: 'gemini',    rootKey: 'mcpServers', installClient: 'gemini-cli', openClient: 'gemini-cli', cli: 'gemini', configPath: '<code>~/.gemini/settings.json</code> or <code>.gemini/settings.json</code> in your project', hookSupport: 'manual', hookCommand: `bash ${HOOKS_DIR}/pretooluse-gemini.sh`, hookConfigPath: '<code>~/.gemini/settings.json</code> or <code>.gemini/settings.json</code> in your project' },
-    { id: 'windsurf',  rootKey: 'mcpServers', installClient: 'windsurf',   openClient: 'windsurf',   configPath: '<code>~/.codeium/windsurf/mcp_config.json</code>', hint: 'Or click the MCPs icon in the Cascade panel &gt; Configure.', hookSupport: 'manual', hookCommand: `bash ${HOOKS_DIR}/pretooluse-windsurf.sh`, hookConfigPath: '<code>~/.codeium/windsurf/mcp_config.json</code>' },
-    { id: 'cline',     rootKey: 'mcpServers', installClient: 'cline',      configPath: '<code>cline_mcp_settings.json</code> via Cline\'s top nav &gt; Configure &gt; Advanced MCP Settings' },
-    { id: 'lmstudio',  rootKey: 'mcpServers', openClient: 'lmstudio',     configPath: '<code>~/.lmstudio/mcp.json</code> (or open via Program tab &gt; Install &gt; Edit mcp.json)', hint: 'Restart LM Studio after saving.' },
+    { id: 'cursor',    rootKey: 'mcpServers', installClient: 'cursor',     openClient: 'cursor',     configPath: '<code>.cursor/mcp.json</code> in your project, or <code>~/.cursor/mcp.json</code> for all projects', hint: 'Or configure via Settings &gt; MCP Servers in the Cursor UI.', hookCommand: `bash ${HOOKS_DIR}/pretooluse-cursor.sh`, hookConfigPath: '<code>.cursor/hooks.json</code> in your project, or <code>~/.cursor/hooks.json</code> for all projects' },
+    { id: 'vscode',    rootKey: 'servers',    installClient: 'vscode',     configPath: '<code>.vscode/mcp.json</code> in your workspace', hint: 'VS Code uses <code>"servers"</code>, not <code>"mcpServers"</code>.', hookCommand: `bash ${HOOKS_DIR}/pretooluse-vscode.sh`, hookConfigPath: '<code>~/.copilot/hooks/dollhouse-permissions.json</code> plus <code>chat.hookFilesLocations</code> in VS Code user settings' },
+    { id: 'codex',     rootKey: 'mcpServers', installClient: 'codex',      openClient: 'codex',      cli: 'codex', toml: true, tomlPath: '<code>~/.codex/config.toml</code> (Codex uses TOML, not JSON)', hookCommand: `bash ${HOOKS_DIR}/pretooluse-codex.sh`, hookConfigPath: '<code>~/.codex/hooks.json</code> and <code>~/.codex/config.toml</code>' },
+    { id: 'gemini',    rootKey: 'mcpServers', installClient: 'gemini-cli', openClient: 'gemini-cli', cli: 'gemini', configPath: '<code>~/.gemini/settings.json</code> or <code>.gemini/settings.json</code> in your project', hookCommand: `bash ${HOOKS_DIR}/pretooluse-gemini.sh`, hookConfigPath: '<code>~/.gemini/settings.json</code> or <code>.gemini/settings.json</code> in your project' },
+    { id: 'windsurf',  rootKey: 'mcpServers', installClient: 'windsurf',   openClient: 'windsurf',   configPath: '<code>~/.codeium/windsurf/mcp_config.json</code>', hint: 'Or click the MCPs icon in the Cascade panel &gt; Configure.', hookCommand: `bash ${HOOKS_DIR}/pretooluse-windsurf.sh`, hookConfigPath: '<code>~/.codeium/windsurf/hooks.json</code> or <code>.windsurf/hooks.json</code> in your project' },
+    { id: 'cline',     rootKey: 'mcpServers', installClient: 'cline',      openClient: 'cline',      configPath: 'Cline stores MCP servers in <code>cline_mcp_settings.json</code> inside its extension settings. Use Configure Now or open the file directly.' },
+    { id: 'lmstudio',  rootKey: 'mcpServers', installClient: 'lmstudio',   openClient: 'lmstudio',   configPath: '<code>~/.lmstudio/mcp.json</code> (or open via Program tab &gt; Install &gt; Edit mcp.json)', hint: 'Restart LM Studio after saving.' },
   ];
 
   const HOOK_BASE_SCRIPT = `#!/bin/bash
@@ -82,6 +82,94 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
   }
 }`;
 
+  const GEMINI_HOOK_SETTINGS = `{
+  "hooks": {
+    "BeforeTool": [
+      {
+        "matcher": ".*",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash ${HOOKS_DIR}/pretooluse-gemini.sh"
+          }
+        ]
+      }
+    ]
+  }
+}`;
+
+  const CODEX_HOOK_SETTINGS = `{
+  "hooks": {
+    "PreToolUse": [
+      {
+        "matcher": "Bash",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash ${HOOKS_DIR}/pretooluse-codex.sh",
+            "statusMessage": "Checking Bash permissions"
+          }
+        ]
+      }
+    ]
+  }
+}`;
+
+  const CURSOR_HOOK_SETTINGS = `{
+  "version": 1,
+  "hooks": {
+    "preToolUse": [
+      {
+        "type": "command",
+        "command": "bash ${HOOKS_DIR}/pretooluse-cursor.sh",
+        "matcher": ".*"
+      }
+    ]
+  }
+}`;
+
+  const VSCODE_HOOK_SETTINGS = `{
+  "hooks": {
+    "PreToolUse": [
+      {
+        "matcher": "*",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash ${HOOKS_DIR}/pretooluse-vscode.sh"
+          }
+        ]
+      }
+    ]
+  }
+}`;
+
+  const VSCODE_HOOK_LOCATIONS_SETTINGS = `{
+  "chat.hookFilesLocations": {
+    "~/.copilot/hooks": true
+  }
+}`;
+
+  const WINDSURF_HOOK_SETTINGS = `{
+  "hooks": {
+    "pre_run_command": [
+      {
+        "type": "command",
+        "command": "bash ${HOOKS_DIR}/pretooluse-windsurf.sh"
+      }
+    ],
+    "pre_mcp_tool_use": [
+      {
+        "type": "command",
+        "command": "bash ${HOOKS_DIR}/pretooluse-windsurf.sh"
+      }
+    ]
+  }
+}`;
+
+  const CODEX_HOOK_FEATURES_TOML = `[features]
+codex_hooks = true`;
+
   /** Build a JSON config block for a given npx command string */
   function jsonConfig(rootKey, npxCmd) {
     const parts = npxCmd.split(' ');
@@ -459,6 +547,32 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
       : `${msg}. Try the manual config below.`;
   };
 
+  const buildInstallPayload = (client) => {
+    const payload = { client };
+    if (currentMethod === 'global' && pinnedVersion && pinnedVersion !== 'latest') {
+      payload.version = pinnedVersion;
+    } else if (currentChannel !== 'latest') {
+      payload.channel = currentChannel;
+    }
+    return payload;
+  };
+
+  const applyInstallSuccessState = (btn, status, data, verified) => {
+    btn.textContent = 'Installed';
+    btn.classList.remove('is-loading');
+    btn.classList.add('is-success');
+    if (!status) return;
+
+    if (data.hookInstall?.supported && !data.hookInstall?.configured && data.hookInstall?.assetsPrepared) {
+      status.textContent = 'Configured MCP server. Dollhouse hook assets were also prepared; finish manual permission setup in Permissions & Security.';
+    } else {
+      status.textContent = verified
+        ? 'Verified — config written. Restart the application to activate.'
+        : 'Restart the application to activate.';
+    }
+    status.classList.add('is-success');
+  };
+
   /** Handle Configure Now button click */
   const handleInstallClick = async (btn) => {
     const client = btn.dataset.installClient;
@@ -476,17 +590,10 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     }
 
     try {
-      const payload = { client };
-      if (currentMethod === 'global' && pinnedVersion && pinnedVersion !== 'latest') {
-        payload.version = pinnedVersion;
-      } else if (currentChannel !== 'latest') {
-        payload.channel = currentChannel;
-      }
-
       const res = await DollhouseAuth.apiFetch('/api/setup/install', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(payload),
+        body: JSON.stringify(buildInstallPayload(client)),
       });
 
       const data = await res.json();
@@ -500,16 +607,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
       await fetchDetection();
       updateDetectionState();
       const verified = detectedConfigs[clientToPlatformReverse[client]]?.installed;
-
-      btn.textContent = 'Installed';
-      btn.classList.remove('is-loading');
-      btn.classList.add('is-success');
-      if (status) {
-        status.textContent = verified
-          ? 'Verified — config written. Restart the application to activate.'
-          : 'Restart the application to activate.';
-        status.classList.add('is-success');
-      }
+      applyInstallSuccessState(btn, status, data, verified);
 
       // Show the completion banner after any successful install
       showCompletionBanner(client);
@@ -572,7 +670,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
       btn.classList.add('is-success');
 
       if (status) {
-        status.textContent = 'Claude Code permissions are enabled. Restart Claude Code if it is already running.';
+        status.textContent = data.hookInstall?.message || 'Permissions are enabled. Restart the client if it is already running.';
         status.classList.add('is-success');
       }
     } catch (err) {
@@ -790,6 +888,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     'claude': 'claude-desktop',
     'claude-code': 'claude-code',
     'cursor': 'cursor',
+    'cline': 'cline',
     'windsurf': 'windsurf',
     'lmstudio': 'lmstudio',
     'gemini-cli': 'gemini',
@@ -867,70 +966,228 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     }
   };
 
-  const PERMISSION_PLATFORM_LABELS = {
-    'claude-desktop': 'Claude Desktop',
-    'claude-code': 'Claude Code',
-    cursor: 'Cursor',
-    vscode: 'VS Code',
-    codex: 'Codex',
-    gemini: 'Gemini CLI',
-    windsurf: 'Windsurf',
-    cline: 'Cline',
-    lmstudio: 'LM Studio',
+  const PERMISSION_SUPPORT_MATRIX = {
+    'claude-desktop': {
+      label: 'Claude Desktop',
+      supportLevel: 'unsupported',
+      statusTag: 'coming soon',
+      badgeClass: 'unsupported',
+      limitation: 'Claude Desktop can host DollhouseMCP, but this release does not ship a native permissions setup flow for it yet.',
+    },
+    'claude-code': {
+      label: 'Claude Code',
+      supportLevel: 'full_native',
+      statusTag: 'claude code',
+      badgeClass: 'verified',
+      configPath: '<code>~/.claude/settings.json</code>',
+      scriptPath: HOOK_BASE_SCRIPT_PATH,
+      settingsBlock: CLAUDE_CODE_HOOK_SETTINGS,
+      limitation: 'Claude Code has the full native permission-hook path in this release.',
+    },
+    gemini: {
+      label: 'Gemini CLI',
+      supportLevel: 'partial_native',
+      statusTag: 'allow / deny',
+      badgeClass: 'manual',
+      configPath: '<code>~/.gemini/settings.json</code> or <code>.gemini/settings.json</code> in your project',
+      scriptPath: `${HOOKS_DIR}/pretooluse-gemini.sh`,
+      settingsBlock: GEMINI_HOOK_SETTINGS,
+      limitation: 'Gemini CLI exposes native BeforeTool hooks, but it does not support an ask/confirm response path. Confirmation-style policies currently degrade to deny.',
+    },
+    cursor: {
+      label: 'Cursor',
+      supportLevel: 'partial_native',
+      statusTag: 'native hooks',
+      badgeClass: 'manual',
+      configPath: '<code>.cursor/hooks.json</code> in your project, or <code>~/.cursor/hooks.json</code> for all projects',
+      scriptPath: `${HOOKS_DIR}/pretooluse-cursor.sh`,
+      settingsBlock: CURSOR_HOOK_SETTINGS,
+      limitation: 'Cursor exposes native hooks, but its permission handling still needs broader runtime verification across allow and ask decisions.',
+    },
+    vscode: {
+      label: 'VS Code',
+      supportLevel: 'partial_native',
+      statusTag: 'native hooks',
+      badgeClass: 'manual',
+      configPath: '<code>~/.copilot/hooks/dollhouse-permissions.json</code> and VS Code user settings',
+      scriptPath: `${HOOKS_DIR}/pretooluse-vscode.sh`,
+      settingsBlock: VSCODE_HOOK_SETTINGS,
+      featureBlock: VSCODE_HOOK_LOCATIONS_SETTINGS,
+      featureHeading: '2. Enable <code>~/.copilot/hooks</code> in VS Code user settings',
+      featureCopyLabel: 'Copy VS Code hookFilesLocations settings',
+      limitation: 'VS Code exposes native PreToolUse hooks, but it ignores matcher values and uses tool names that differ from Claude Code. This adapter normalizes the common built-in tools we know about.',
+    },
+    windsurf: {
+      label: 'Windsurf',
+      supportLevel: 'partial_native',
+      statusTag: 'allow / deny',
+      badgeClass: 'manual',
+      configPath: '<code>~/.codeium/windsurf/hooks.json</code> or <code>.windsurf/hooks.json</code> in your project',
+      scriptPath: `${HOOKS_DIR}/pretooluse-windsurf.sh`,
+      settingsBlock: WINDSURF_HOOK_SETTINGS,
+      limitation: 'Windsurf exposes native pre-run and pre-MCP hooks, but they are binary allow-or-block hooks. Confirmation-style policies currently degrade to block.',
+    },
+    codex: {
+      label: 'Codex',
+      supportLevel: 'partial_native',
+      statusTag: 'bash only',
+      badgeClass: 'manual',
+      configPath: '<code>~/.codex/hooks.json</code> and <code>~/.codex/config.toml</code>',
+      scriptPath: `${HOOKS_DIR}/pretooluse-codex.sh`,
+      settingsBlock: CODEX_HOOK_SETTINGS,
+      featureBlock: CODEX_HOOK_FEATURES_TOML,
+      limitation: 'Codex currently only supports native PreToolUse hooks for Bash, so this turns on Bash permission guardrails only.',
+    },
+    cline: {
+      label: 'Cline',
+      supportLevel: 'mcp_only',
+      statusTag: 'mcp only',
+      badgeClass: 'manual',
+      limitation: 'Cline MCP setup is supported here, but native permission-hook automation is still incomplete in this release.',
+    },
+    lmstudio: {
+      label: 'LM Studio',
+      supportLevel: 'mcp_only',
+      statusTag: 'mcp only',
+      badgeClass: 'manual',
+      limitation: 'LM Studio MCP setup is supported here, but permission enforcement currently relies on LM Studio built-in confirmations or a future fallback adapter.',
+    },
   };
 
-  const getPermissionStatusCopy = (platformId, detected) => {
-    if (platformId === 'claude-code') {
-      if (detected?.hookInstalled) {
-        return {
-          tone: 'info',
-          titleText: 'Claude Code permission enforcement is enabled.',
-          messageText: 'No further changes are needed here unless you want to reinstall the hook settings.',
-        };
-      }
+  const getPermissionSupport = (platformId, detected) => {
+    if (detected?.support) {
+      return {
+        ...PERMISSION_SUPPORT_MATRIX[platformId],
+        supportLevel: detected.support.level || PERMISSION_SUPPORT_MATRIX[platformId]?.supportLevel,
+      };
+    }
+    return PERMISSION_SUPPORT_MATRIX[platformId];
+  };
 
-      if (detected?.installed) {
-        return {
-          tone: 'warning',
-          titleText: 'Claude Code is connected for this client.',
-          messageText: 'DollhouseMCP is configured as an MCP server. Use Configure Now below to also install the Claude Code permission hook.',
-        };
-      }
+  const getFullNativePermissionStatusCopy = (support, detected) => {
+    if (detected?.hookInstalled) {
+      return {
+        tone: 'info',
+        titleText: `${support.label} permission enforcement is enabled.`,
+        messageText: 'No further changes are needed here unless you want to reinstall the hook settings.',
+      };
+    }
 
+    if (detected?.installed) {
+      return {
+        tone: 'warning',
+        titleText: `${support.label} is connected for this client.`,
+        messageText: `DollhouseMCP is configured as an MCP server. Use Configure Now below to also install the ${support.label} permission hook.`,
+      };
+    }
+
+    return {
+      tone: 'info',
+      titleText: `${support.label} permissions are not configured yet.`,
+      messageText: `First connect DollhouseMCP using Auto-updating or Pinned version, then use Configure Now below to install the ${support.label} permission hook.`,
+    };
+  };
+
+  const getPartialPermissionStatusCopy = (support, detected) => {
+    const activationLabel = support.label === 'Codex' ? 'Bash guardrails' : 'permission hooks';
+    if (detected?.hookInstalled) {
       return {
         tone: 'info',
-        titleText: 'Claude Code permissions are not configured yet.',
-        messageText: 'First connect DollhouseMCP using Auto-updating or Pinned version, then use Configure Now below to install the Claude Code permission hook.',
+        titleText: `${support.label} ${activationLabel} are enabled.`,
+        messageText: support.limitation,
       };
     }
 
-    const support = PLATFORMS.find((platform) => platform.id === platformId)?.hookSupport || 'unsupported';
-    if (support === 'manual') {
-      if (detected?.installed) {
-        return {
-          tone: 'warning',
-          titleText: 'DollhouseMCP is connected for this client.',
-          messageText: 'DollhouseMCP is configured here, but permission enforcement is separate. Use the manual hook steps below to turn it on for this client.',
-        };
-      }
+    if (detected?.installed) {
+      return {
+        tone: 'warning',
+        titleText: `${support.label} is connected for this client.`,
+        messageText: `DollhouseMCP is configured as an MCP server. Use Configure Now below to turn on ${support.label}'s native ${activationLabel}.`,
+      };
+    }
 
+    return {
+      tone: 'info',
+      titleText: `${support.label} ${activationLabel} are not configured yet.`,
+      messageText: `First connect DollhouseMCP using Auto-updating or Pinned version, then use Configure Now below to install ${support.label}'s native ${activationLabel}.`,
+    };
+  };
+
+  const getMcpOnlyPermissionStatusCopy = (support, detected) => {
+    if (detected?.installed) {
+      return {
+        tone: 'warning',
+        titleText: `${support.label} is connected for this client.`,
+        messageText: `${support.limitation} This release keeps that client in the MCP and fallback lane for now.`,
+      };
+    }
+
+    return {
+      tone: 'info',
+      titleText: `${support.label} supports MCP setup in this release.`,
+      messageText: `${support.limitation} Use Auto-updating or Pinned version above to connect DollhouseMCP first.`,
+    };
+  };
+
+  const getManualPermissionStatusCopy = (support, detected) => {
+    if (detected?.hookAssetsPrepared) {
       return {
         tone: 'info',
-        titleText: 'Manual permissions setup is available for this client.',
-        messageText: 'Use the steps below if you want to turn on permission enforcement for this client manually.',
+        titleText: 'Hook bridge files are already prepared for this client.',
+        messageText: 'Finish the client-specific hook registration below to turn on permission enforcement.',
+      };
+    }
+    if (detected?.installed) {
+      return {
+        tone: 'warning',
+        titleText: 'DollhouseMCP is connected for this client.',
+        messageText: 'DollhouseMCP is configured here, but permission enforcement is separate. Use the manual hook steps below to turn it on for this client.',
       };
     }
 
-    const platformLabel = PERMISSION_PLATFORM_LABELS[platformId] || 'this client';
     return {
-      tone: detected?.installed ? 'warning' : 'neutral',
-      titleText: `Permissions & security tools are unavailable for ${platformLabel} right now.`,
-      messageText: detected?.installed
-        ? 'DollhouseMCP is connected for this client, but this release does not include a supported permissions setup flow here yet.'
-        : 'This release does not include a supported permissions setup flow for this client yet.',
+      tone: 'info',
+      titleText: 'Manual permissions setup is available for this client.',
+      messageText: 'Use the steps below if you want to turn on permission enforcement for this client manually.',
     };
   };
 
+  const getUnsupportedPermissionStatusCopy = (support, detected) => ({
+    tone: detected?.installed ? 'warning' : 'neutral',
+    titleText: `Permissions & security tools are unavailable for ${support.label} right now.`,
+    messageText: detected?.installed
+      ? 'DollhouseMCP is connected for this client, but this release does not include a supported permissions setup flow here yet.'
+      : support.limitation,
+  });
+
+  const getPermissionStatusCopy = (platformId, detected) => {
+    const support = getPermissionSupport(platformId, detected);
+    if (!support) {
+      return getUnsupportedPermissionStatusCopy({
+        label: 'this client',
+        limitation: 'This release does not include a supported permissions setup flow for this client yet.',
+      }, detected);
+    }
+
+    if (support.supportLevel === 'full_native') {
+      return getFullNativePermissionStatusCopy(support, detected);
+    }
+
+    if (support.supportLevel === 'partial_native') {
+      return getPartialPermissionStatusCopy(support, detected);
+    }
+
+    if (support.supportLevel === 'mcp_only') {
+      return getMcpOnlyPermissionStatusCopy(support, detected);
+    }
+
+    if (support.supportLevel === 'manual') {
+      return getManualPermissionStatusCopy(support, detected);
+    }
+
+    return getUnsupportedPermissionStatusCopy(support, detected);
+  };
+
   const updatePermissionStatus = (panel, platformId, detected) => {
     const status = panel?.querySelector('.setup-permission-status');
     if (!status) return;
@@ -950,6 +1207,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     const panel = document.getElementById('setup-panel-' + platformId);
     const tabBtn = document.getElementById('setup-tab-' + platformId);
     updatePermissionStatus(panel, platformId, detected);
+    updatePermissionInstallButton(panel?.querySelector('.setup-permission-install-btn'), detected);
 
     if (!detected?.installed) return;
 
@@ -958,7 +1216,6 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     updateDetectionNotice(panel?.querySelector('.setup-installed-notice'), matches);
     updateDetectionBadge(tabBtn?.querySelector('.setup-tab-badge'), matches);
     updateDetectionButton(panel?.querySelector('.setup-install-btn'), matches);
-    updatePermissionInstallButton(panel?.querySelector('.setup-permission-install-btn'), detected);
 
     // Refresh the "Current config" code block with the latest detected config
     if (detected.currentConfig && panel) {
@@ -1120,49 +1377,136 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     return html;
   };
 
-  const renderPermissionSection = (p) => {
-    const hookSupport = p.hookSupport || 'unsupported';
-    const configPath = p.hookConfigPath || p.configPath || p.tomlPath || 'this client’s user configuration';
+  const buildPartialAutoHint = (p, partial) => {
+    const base = partial.limitation;
+    if (p.id === 'codex') {
+      return `${base} This automatic path writes the shared hook bridge, updates <code>~/.codex/hooks.json</code>, and enables <code>features.codex_hooks</code> in <code>~/.codex/config.toml</code>.`;
+    }
+    if (p.id === 'vscode') {
+      return `${base} This automatic path writes the shared hook bridge, creates <code>~/.copilot/hooks/dollhouse-permissions.json</code>, and enables <code>~/.copilot/hooks</code> in VS Code's <code>chat.hookFilesLocations</code> setting.`;
+    }
+    return `${base} This automatic path writes the shared hook bridge and updates ${partial.configPath}.`;
+  };
 
-    if (hookSupport === 'verified' && p.id === 'claude-code') {
-      return `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
-        <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--verified">claude code</span></h3>
-        <div class="setup-permission-status" data-state="info">
-          <strong class="setup-permission-status-title"></strong>
-          <p class="setup-permission-status-msg"></p>
-        </div>
-        <div class="setup-install-row">
-          <button class="setup-btn setup-btn-primary setup-permission-install-btn" type="button" data-permission-install-client="claude-code">Configure Now</button>
-          <span class="setup-install-status" data-permission-install-status="claude-code"></span>
+  const buildPartialFeatureHeading = (p, partial) => {
+    if (partial.featureHeading) return partial.featureHeading;
+    if (p.id === 'codex') return '2. Enable Codex hooks in <code>~/.codex/config.toml</code>';
+    return '2. Add the additional client settings';
+  };
+
+  const renderVerifiedPermissionSection = (p, verified) => {
+    const permissionInstallClient = p.installClient || p.id;
+    return `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
+      <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--verified">${verified.statusTag}</span></h3>
+      <div class="setup-permission-status" data-state="info">
+        <strong class="setup-permission-status-title"></strong>
+        <p class="setup-permission-status-msg"></p>
+      </div>
+      <div class="setup-install-row">
+        <button class="setup-btn setup-btn-primary setup-permission-install-btn" type="button" data-permission-install-client="${permissionInstallClient}">Configure Now</button>
+        <span class="setup-install-status" data-permission-install-status="${permissionInstallClient}"></span>
+      </div>
+      <p class="setup-hint">This writes the shared hook bridge assets and updates ${verified.configPath} automatically.</p>
+    </div>
+    <div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
+      <details class="setup-manual-fallback">
+        <summary>Manual fallback</summary>
+        <div class="setup-manual-fallback-body">
+          <h4>1. Save the shared hook bridge once</h4>
+          <p>Save this file as <code>${HOOK_BASE_SCRIPT_PATH}</code>, then make it executable with <code>chmod +x ${HOOK_BASE_SCRIPT_PATH}</code>.</p>
+          <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(HOOK_BASE_SCRIPT)}' aria-label="Copy shared hook bridge">Copy</button>
+            <pre><code>${escapeHtml(HOOK_BASE_SCRIPT)}</code></pre>
+          </div>
+          <h4>2. Add the ${verified.label} hook settings</h4>
+          <p>Add this block to ${verified.configPath} so ${verified.label} can call the hook bridge before tool use.</p>
+          <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(verified.settingsBlock)}' aria-label="Copy ${verified.label} hook settings">Copy</button>
+            <pre><code>${escapeHtml(verified.settingsBlock)}</code></pre>
+          </div>
+          <p class="setup-hint">Command hook target: <code>${verified.scriptPath}</code></p>
         </div>
-        <p class="setup-hint">This writes the shared hook bridge to <code>${HOOK_BASE_SCRIPT_PATH}</code> and updates ${configPath} automatically.</p>
+      </details>
+    </div>`;
+  };
+
+  const renderPartialPermissionSection = (p, partial) => {
+    const permissionInstallClient = p.installClient || p.id;
+    const autoHint = buildPartialAutoHint(p, partial);
+    const featureHeading = buildPartialFeatureHeading(p, partial);
+    const featureSection = partial.featureBlock
+      ? `<h4>${featureHeading}</h4>
+            <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(partial.featureBlock)}' aria-label="${escapeAttr(partial.featureCopyLabel || `Copy ${partial.label} settings`)}">Copy</button>
+              <pre><code>${escapeHtml(partial.featureBlock)}</code></pre>
+            </div>`
+      : '';
+    const stepNumber = partial.featureBlock ? '3' : '2';
+
+    return `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
+      <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--manual">${partial.statusTag}</span></h3>
+      <div class="setup-permission-status" data-state="info">
+        <strong class="setup-permission-status-title"></strong>
+        <p class="setup-permission-status-msg"></p>
+      </div>
+      <div class="setup-install-row">
+        <button class="setup-btn setup-btn-primary setup-permission-install-btn" type="button" data-permission-install-client="${permissionInstallClient}">Configure Now</button>
+        <span class="setup-install-status" data-permission-install-status="${permissionInstallClient}"></span>
       </div>
-      <div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
-        <details class="setup-manual-fallback">
-          <summary>Manual fallback</summary>
-          <div class="setup-manual-fallback-body">
-            <h4>1. Save the shared hook bridge once</h4>
-            <p>Save this file as <code>${HOOK_BASE_SCRIPT_PATH}</code>, then make it executable with <code>chmod +x ${HOOK_BASE_SCRIPT_PATH}</code>.</p>
-            <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(HOOK_BASE_SCRIPT)}' aria-label="Copy shared hook bridge">Copy</button>
-              <pre><code>${escapeHtml(HOOK_BASE_SCRIPT)}</code></pre>
-            </div>
-            <h4>2. Add the Claude Code hook settings</h4>
-            <p>Add this block to ${configPath} so Claude Code can call the hook bridge before tool use.</p>
-            <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(CLAUDE_CODE_HOOK_SETTINGS)}' aria-label="Copy Claude Code hook settings">Copy</button>
-              <pre><code>${escapeHtml(CLAUDE_CODE_HOOK_SETTINGS)}</code></pre>
-            </div>
-            <p class="setup-hint">Command hook target: <code>${HOOK_BASE_SCRIPT_PATH}</code></p>
+      <p class="setup-hint">${autoHint}</p>
+    </div>
+    <div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
+      <details class="setup-manual-fallback">
+        <summary>Manual fallback</summary>
+        <div class="setup-manual-fallback-body">
+          <h4>1. Save the shared hook bridge once</h4>
+          <p>Save this file as <code>${HOOK_BASE_SCRIPT_PATH}</code>, then make it executable with <code>chmod +x ${HOOK_BASE_SCRIPT_PATH}</code>.</p>
+          <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(HOOK_BASE_SCRIPT)}' aria-label="Copy shared hook bridge">Copy</button>
+            <pre><code>${escapeHtml(HOOK_BASE_SCRIPT)}</code></pre>
           </div>
-        </details>
-      </div>`;
+          ${featureSection}
+          <h4>${stepNumber}. Add the ${partial.label} hook settings in ${partial.configPath}</h4>
+          <div class="setup-code-block"><button class="setup-copy-btn" type="button" data-copy-text='${escapeAttr(partial.settingsBlock)}' aria-label="Copy ${partial.label} hook settings">Copy</button>
+            <pre><code>${escapeHtml(partial.settingsBlock)}</code></pre>
+          </div>
+          <p class="setup-hint">Command hook target: <code>${partial.scriptPath}</code></p>
+        </div>
+      </details>
+    </div>`;
+  };
+
+  const renderMcpOnlyPermissionSection = (support) => `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
+      <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--${support.badgeClass}">${support.statusTag}</span></h3>
+      <div class="setup-permission-status" data-state="info">
+        <strong class="setup-permission-status-title"></strong>
+        <p class="setup-permission-status-msg"></p>
+      </div>
+      <p class="setup-hint">${support.limitation}</p>
+    </div>`;
+
+  const renderPermissionSection = (p) => {
+    const support = getPermissionSupport(p.id);
+    const configPath = p.hookConfigPath || p.configPath || p.tomlPath || 'this client’s user configuration';
+
+    if (!support) {
+      return '';
+    }
+
+    if (support.supportLevel === 'full_native') {
+      return renderVerifiedPermissionSection(p, support);
+    }
+
+    if (support.supportLevel === 'partial_native') {
+      return renderPartialPermissionSection(p, support);
+    }
+
+    if (support.supportLevel === 'mcp_only') {
+      return renderMcpOnlyPermissionSection(support);
     }
 
-    if (hookSupport === 'manual') {
+    if (support.supportLevel === 'manual') {
       const platformName = p.id === 'gemini' ? 'gemini' : p.id;
       const wrapperFilename = `pretooluse-${platformName}.sh`;
       const wrapperScript = buildHookWrapperScript(platformName);
       return `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
-        <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--manual">manual setup</span></h3>
+        <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--${support.badgeClass}">${support.statusTag}</span></h3>
         <div class="setup-permission-status" data-state="info">
           <strong class="setup-permission-status-title"></strong>
           <p class="setup-permission-status-msg"></p>
@@ -1180,7 +1524,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
     }
 
     return `<div class="setup-method setup-security-mode" data-setup-modes="permissions" hidden>
-      <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--unsupported">coming soon</span></h3>
+      <h3>Permissions &amp; Security <span class="setup-support-badge setup-support-badge--${support.badgeClass}">${support.statusTag}</span></h3>
       <div class="setup-permission-status" data-state="neutral">
         <strong class="setup-permission-status-title"></strong>
         <p class="setup-permission-status-msg"></p>
@@ -1194,7 +1538,7 @@ exec bash "$SCRIPT_DIR/pretooluse-dollhouse.sh"`;
 
     intro.innerHTML = `<div class="setup-permissions-note">
         <strong>Permissions &amp; Security</strong>
-        <p>Use this mode to turn on permission enforcement for supported clients. Claude Code is fully guided in this release. Where we have workable manual steps for other clients, they are shown here. Otherwise, the client will be marked as coming soon.</p>
+        <p>Use this mode to turn on permission enforcement for supported clients. Claude Code is fully guided in this release. Gemini CLI, Cursor, VS Code, Windsurf, and Codex have native partial support, while Cline and LM Studio stay in the MCP and fallback lane for now. Other clients will be marked as coming soon.</p>
       </div>`;
   };