@admin-layout/ai-chat-ext-browser 12.2.4-alpha.66

package/lib/components/ChatSettingsPanel/ChatSettingsPanel.js

@@ -0,0 +1,1191 @@
+import React,{useState,useMemo,useCallback,useEffect}from'react';import {FiSearch}from'@react-icons/all-files/fi/FiSearch.js';import {FiX}from'@react-icons/all-files/fi/FiX.js';import {FiRefreshCw}from'@react-icons/all-files/fi/FiRefreshCw.js';import {FiChevronDown}from'@react-icons/all-files/fi/FiChevronDown.js';import {FiEdit2}from'@react-icons/all-files/fi/FiEdit2.js';import {FiPlus}from'@react-icons/all-files/fi/FiPlus.js';import {FiTrash2}from'@react-icons/all-files/fi/FiTrash2.js';/**
+ * ChatSettingsPanel — VS Code–style settings UI for the messenger inbox.
+ *
+ * Renders all ChatConfiguration entries as grouped toggle/input controls
+ * with search filtering. Reads/writes via the `useChatConfiguration` hook
+ * (GraphQL backed) or a lightweight localStorage fallback for offline use.
+ *
+ * Usage:
+ *   <ChatSettingsPanel />                  // standalone
+ *   <ChatSettingsPanel channelId="xyz" />  // channel-scoped overrides
+ */
+/**
+ * Pre-defined groups that mirror VS Code's settingsLayout.ts
+ * (chat/agent, chat/appearance, chat/sessions, chat/tools, chat/mcp, chat/context, chat/inlineChat, chat/miscellaneous).
+ */
+const SETTINGS_GROUPS = [{
+  id: 'agent',
+  label: 'Agent',
+  icon: '🤖',
+  keys: ['chat.agent.enabled', 'chat.agent.maxRequests', 'chat.planAgent.defaultModel', 'chat.exploreAgent.defaultModel', 'chat.requestQueuing.defaultAction', 'chat.agentsControl.enabled', 'chat.agentSessionProjection.enabled', 'chat.customAgentInSubagent.enabled', 'chat.exitAfterDelegation', 'chat.checkpoints.enabled', 'chat.checkpoints.showFileChanges', 'chat.editRequests', 'chat.undoRequests.restoreInput', 'chat.editing.autoAcceptDelay', 'chat.editing.confirmEditRequestRemoval', 'chat.editing.confirmEditRequestRetry', 'chat.editing.explainChanges.enabled']
+}, {
+  id: 'appearance',
+  label: 'Appearance',
+  icon: '🎨',
+  keys: ['chat.fontSize', 'chat.fontFamily', 'chat.editor.fontSize', 'chat.editor.fontFamily', 'chat.editor.fontWeight', 'chat.editor.wordWrap', 'chat.editor.lineHeight', 'chat.math.enabled', 'chat.inlineReferences.style', 'chat.agent.codeBlockProgress', 'chat.unifiedAgentsBar.enabled', 'chat.agentsControl.clickBehavior', 'chat.tips.enabled', 'chat.upvoteAnimation', 'chat.notifyWindowOnConfirmation', 'chat.notifyWindowOnResponseReceived', 'chat.growthNotification.enabled']
+}, {
+  id: 'thinking',
+  label: 'Thinking',
+  icon: '🧠',
+  keys: ['chat.agent.thinkingStyle', 'chat.agent.thinking.generateTitles', 'chat.agent.thinking.collapsedTools', 'chat.agent.thinking.terminalTools', 'chat.agent.thinking.phrases']
+}, {
+  id: 'sessions',
+  label: 'Sessions',
+  icon: '📋',
+  keys: ['chat.viewSessions.enabled', 'chat.viewSessions.grouping', 'chat.viewSessions.orientation', 'chat.viewProgressBadge.enabled', 'chat.restoreLastPanelSession']
+}, {
+  id: 'tools',
+  label: 'Tools',
+  icon: '🔧',
+  keys: ['chat.extensionTools.enabled', 'chat.tools.usagesTool.enabled', 'chat.tools.renameTool.enabled', 'chat.tools.todos.showWidget', 'chat.tools.terminal.simpleCollapsible', 'chat.tools.autoExpandFailures', 'chat.edits2.enabled', 'chat.repoInfo.enabled']
+}, {
+  id: 'autoapprove',
+  label: 'Auto-approve',
+  icon: '✅',
+  keys: ['chat.autoReply', 'chat.tools.global.autoApprove', 'chat.tools.edits.autoApprove', 'chat.tools.urls.autoApprove', 'chat.tools.eligibleForAutoApproval']
+}, {
+  id: 'mcp',
+  label: 'MCP',
+  icon: '🔌',
+  keys: ['chat.mcp.access', 'chat.mcp.autostart', 'chat.mcp.apps.enabled', 'chat.mcp.serverSampling', 'chat.mcp.discovery.enabled', 'chat.mcp.gallery.enabled', 'chat.mcp.gallery.serviceUrl']
+}, {
+  id: 'context',
+  label: 'Context',
+  icon: '📎',
+  keys: ['chat.detectParticipant.enabled', 'chat.implicitContext.enabled', 'chat.implicitContext.suggestedContext', 'chat.contextUsage.enabled', 'chat.sendElementsToChat.enabled', 'chat.sendElementsToChat.attachCSS', 'chat.sendElementsToChat.attachImages', 'chat.instructionsFilesLocations', 'chat.promptFilesLocations', 'chat.agentFilesLocations', 'chat.agentSkillsLocations', 'chat.hookFilesLocations', 'chat.promptFilesRecommendations', 'chat.useAgentsMdFile', 'chat.useNestedAgentsMdFiles', 'chat.useClaudeMdFile', 'chat.useAgentSkills', 'chat.useSkillAdherencePrompt', 'chat.includeApplyingInstructions', 'chat.includeReferencedInstructions', 'chat.useHooks', 'chat.useClaudeHooks', 'chat.modeFilesLocations']
+}, {
+  id: 'inlineChat',
+  label: 'Inline Chat',
+  icon: '💬',
+  keys: ['inlineChat.finishOnType', 'inlineChat.holdToSpeech', 'inlineChat.enableV2', 'inlineChat.defaultModel', 'inlineChat.notebookAgent', 'inlineChat.affordance', 'inlineChat.renderMode', 'inlineChat.fixDiagnostics']
+}, {
+  id: 'terminalTools',
+  label: 'Terminal Tools',
+  icon: '🖥️',
+  keys: ['chat.tools.terminal.enableAutoApprove', 'chat.tools.terminal.autoApprove', 'chat.tools.terminal.autoApproveWorkspaceNpmScripts', 'chat.tools.terminal.ignoreDefaultAutoApproveRules', 'chat.tools.terminal.blockDetectedFileWrites', 'chat.tools.terminal.shellIntegrationTimeout', 'chat.tools.terminal.autoReplyToPrompts', 'chat.tools.terminal.outputLocation', 'chat.tools.terminal.sandbox.enabled', 'chat.tools.terminal.sandbox.network', 'chat.tools.terminal.sandbox.linuxFileSystem', 'chat.tools.terminal.sandbox.macFileSystem', 'chat.tools.terminal.preventShellHistory', 'chat.tools.terminal.enforceTimeoutFromModel', 'chat.tools.terminal.terminalProfile.linux', 'chat.tools.terminal.terminalProfile.osx', 'chat.tools.terminal.terminalProfile.windows']
+}, {
+  id: 'editor',
+  label: 'Editor / Edit Mode',
+  icon: '✏️',
+  keys: ['chat.editorAssociations', 'chat.editMode.hidden']
+}, {
+  id: 'miscellaneous',
+  label: 'Miscellaneous',
+  icon: '⚙️',
+  keys: ['chat.disableAIFeatures', 'chat.allowAnonymousAccess', 'chat.extensionUnification.enabled', 'chat.statusWidget.anonymous', 'chat.plugins.enabled', 'chat.plugins.paths', 'chat.plugins.marketplaces', 'chat.customizationsMenu.enabled', 'chat.customizationsMenu.userStoragePath']
+}];
+/** Fallback built-in metadata. Defaults/types aligned with VS Code main branch. */
+const BUILT_IN_DEFAULTS = {
+  // ── Core / Miscellaneous ────────────────────────────────────────
+  'chat.disableAIFeatures': {
+    default: false,
+    type: 'boolean',
+    description: 'Disable and hide built-in AI features provided by GitHub Copilot, including chat and inline suggestions'
+  },
+  'chat.allowAnonymousAccess': {
+    default: false,
+    type: 'boolean',
+    description: 'Controls whether anonymous access is allowed in chat'
+  },
+  'chat.plugins.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enable agent plugin integration in chat'
+  },
+  'chat.plugins.paths': {
+    default: {},
+    type: 'object',
+    description: 'Plugin directories to discover (path → enabled)'
+  },
+  'chat.plugins.marketplaces': {
+    default: ['github/copilot-plugins', 'github/awesome-copilot'],
+    type: 'array',
+    description: 'Plugin marketplaces to query'
+  },
+  'chat.extensionUnification.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enables the unification of GitHub Copilot extensions'
+  },
+  'chat.statusWidget.anonymous': {
+    default: false,
+    type: 'boolean',
+    description: 'Show status widget for anonymous users when rate limited'
+  },
+  // ── Agent ───────────────────────────────────────────────────────
+  'chat.agent.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'When enabled, agent mode can be activated from chat and tools with side effects can be used'
+  },
+  'chat.agent.maxRequests': {
+    default: 50,
+    type: 'number',
+    description: 'Maximum requests per-turn when using an agent. When reached, asks to continue'
+  },
+  'chat.planAgent.defaultModel': {
+    default: '',
+    type: 'string',
+    description: 'Default language model for the Plan agent'
+  },
+  'chat.exploreAgent.defaultModel': {
+    default: '',
+    type: 'string',
+    description: 'Default language model for the Explore subagent'
+  },
+  'chat.requestQueuing.defaultAction': {
+    default: 'steer',
+    type: 'string',
+    description: 'Default action for the queue button when a request is in progress'
+  },
+  'chat.agentsControl.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Show the Agent Status indicator in the title bar command center'
+  },
+  'chat.agentSessionProjection.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Enable Agent Session Projection mode for reviewing sessions in a focused workspace'
+  },
+  'chat.customAgentInSubagent.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Whether the runSubagent tool is able to use custom agents'
+  },
+  'chat.exitAfterDelegation': {
+    default: false,
+    type: 'boolean',
+    description: 'Automatically exit the chat panel after delegating to another session'
+  },
+  // ── Editor / Edit Mode ──────────────────────────────────────────
+  'chat.editorAssociations': {
+    default: {},
+    type: 'object',
+    description: 'Configure glob patterns to editors for opening files from chat'
+  },
+  'chat.editMode.hidden': {
+    default: true,
+    type: 'boolean',
+    description: 'When enabled, hides the Edit mode from the chat mode picker'
+  },
+  'chat.edits2.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Enable the new Edits mode based on tool-calling'
+  },
+  'chat.editRequests': {
+    default: 'inline',
+    type: 'string',
+    description: 'Enables editing of requests in the chat. Allows changing request content and resubmitting'
+  },
+  'chat.editing.autoAcceptDelay': {
+    default: 0,
+    type: 'number',
+    description: 'Delay (seconds, 0–100) after which changes made by chat are automatically accepted. 0 = disabled'
+  },
+  'chat.editing.confirmEditRequestRemoval': {
+    default: true,
+    type: 'boolean',
+    description: 'Show a confirmation before removing a request and its associated edits'
+  },
+  'chat.editing.confirmEditRequestRetry': {
+    default: true,
+    type: 'boolean',
+    description: 'Show a confirmation before retrying a request and its associated edits'
+  },
+  'chat.editing.explainChanges.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Show the Explain button in the Chat panel and the Explain Changes context menu in the SCM view'
+  },
+  // ── Appearance / UI ─────────────────────────────────────────────
+  'chat.fontSize': {
+    default: 13,
+    type: 'number',
+    description: 'Controls the font size in pixels in chat messages'
+  },
+  'chat.fontFamily': {
+    default: 'default',
+    type: 'string',
+    description: 'Controls the font family in chat messages'
+  },
+  'chat.editor.fontSize': {
+    default: 14,
+    type: 'number',
+    description: 'Controls the font size in pixels in chat codeblocks'
+  },
+  'chat.editor.fontFamily': {
+    default: 'default',
+    type: 'string',
+    description: 'Controls the font family in chat codeblocks'
+  },
+  'chat.editor.fontWeight': {
+    default: 'default',
+    type: 'string',
+    description: 'Controls the font weight in chat codeblocks'
+  },
+  'chat.editor.wordWrap': {
+    default: 'off',
+    type: 'string',
+    description: 'Controls whether lines should wrap in chat codeblocks'
+  },
+  'chat.editor.lineHeight': {
+    default: 0,
+    type: 'number',
+    description: 'Controls the line height in pixels in chat codeblocks. Use 0 to compute from font size'
+  },
+  'chat.math.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enable math rendering in chat responses using KaTeX'
+  },
+  'chat.inlineReferences.style': {
+    default: 'box',
+    type: 'string',
+    description: 'How inline file/symbol references render in chat messages'
+  },
+  'chat.agent.codeBlockProgress': {
+    default: true,
+    type: 'boolean',
+    description: 'Show a progress animation in the code block pill when applying edits'
+  },
+  'chat.unifiedAgentsBar.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Replaces the command center search box with a unified chat and search widget'
+  },
+  'chat.agentsControl.clickBehavior': {
+    default: 'default',
+    type: 'string',
+    description: 'Behaviour when clicking on the chat icon in the command center'
+  },
+  'chat.tips.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Show tips above user messages in chat'
+  },
+  'chat.upvoteAnimation': {
+    default: 'floatingThumbs',
+    type: 'string',
+    description: 'Animation shown when clicking the thumbs up button on a chat response'
+  },
+  'chat.notifyWindowOnConfirmation': {
+    default: 'windowNotFocused',
+    type: 'string',
+    description: 'OS notification when a confirmation or question needs input'
+  },
+  'chat.notifyWindowOnResponseReceived': {
+    default: 'windowNotFocused',
+    type: 'string',
+    description: 'OS notification when a chat response is received'
+  },
+  'chat.growthNotification.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Show growth notification to encourage new users to try Copilot'
+  },
+  'chat.restoreLastPanelSession': {
+    default: false,
+    type: 'boolean',
+    description: 'Restore the last session in panel after restart'
+  },
+  // ── Thinking ────────────────────────────────────────────────────
+  'chat.agent.thinkingStyle': {
+    default: 'fixedScrolling',
+    type: 'string',
+    description: 'How the model thinking output is displayed'
+  },
+  'chat.agent.thinking.generateTitles': {
+    default: true,
+    type: 'boolean',
+    description: 'Use an LLM to generate summary titles for thinking sections'
+  },
+  'chat.agent.thinking.collapsedTools': {
+    default: 'always',
+    type: 'string',
+    description: 'How tool calls are displayed in relation to thinking sections'
+  },
+  'chat.agent.thinking.terminalTools': {
+    default: true,
+    type: 'boolean',
+    description: 'Display terminal tool calls inside the thinking dropdown with a simplified view'
+  },
+  'chat.agent.thinking.phrases': {
+    default: {
+      mode: 'append',
+      phrases: []
+    },
+    type: 'object',
+    description: 'Customize loading messages shown during agent operations'
+  },
+  // ── Sessions ────────────────────────────────────────────────────
+  'chat.viewSessions.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Show chat agent sessions when chat is empty or alongside when wide enough'
+  },
+  'chat.viewSessions.grouping': {
+    default: 'date',
+    type: 'string',
+    description: 'How sessions are grouped in the list'
+  },
+  'chat.viewSessions.orientation': {
+    default: 'sideBySide',
+    type: 'string',
+    description: 'Orientation of the chat agent sessions view'
+  },
+  'chat.viewProgressBadge.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Show a progress badge on the chat view when an agent session is in progress'
+  },
+  // ── Tools ───────────────────────────────────────────────────────
+  'chat.extensionTools.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enable using tools contributed by third-party extensions'
+  },
+  'chat.tools.usagesTool.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enable the usages tool for finding references, definitions, and implementations'
+  },
+  'chat.tools.renameTool.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enable the rename tool for renaming code symbols across the workspace'
+  },
+  'chat.tools.todos.showWidget': {
+    default: true,
+    type: 'boolean',
+    description: 'Show the todo list widget above the chat input'
+  },
+  'chat.tools.terminal.simpleCollapsible': {
+    default: false,
+    type: 'boolean',
+    description: 'Use a simplified collapsible for terminal tool output'
+  },
+  'chat.tools.autoExpandFailures': {
+    default: true,
+    type: 'boolean',
+    description: 'Auto-expand tool result cards on failure'
+  },
+  'chat.repoInfo.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Capture lightweight repository metadata when a chat request is submitted'
+  },
+  // ── Auto-approve ────────────────────────────────────────────────
+  'chat.autoReply': {
+    default: false,
+    type: 'boolean',
+    description: 'Automatically answer chat question carousels using the current model'
+  },
+  'chat.tools.global.autoApprove': {
+    default: false,
+    type: 'boolean',
+    description: 'Global auto-approve (YOLO mode) disables manual approval for all tools'
+  },
+  'chat.tools.edits.autoApprove': {
+    default: {},
+    type: 'object',
+    description: 'Controls auto-approval for edits. Glob patterns map to true/false'
+  },
+  'chat.tools.urls.autoApprove': {
+    default: {},
+    type: 'object',
+    description: 'Controls which URLs are automatically approved (URL pattern → true/false)'
+  },
+  'chat.tools.eligibleForAutoApproval': {
+    default: {},
+    type: 'object',
+    description: 'Controls which tools are eligible for automatic approval (tool → true/false)'
+  },
+  // ── Features ────────────────────────────────────────────────────
+  'chat.checkpoints.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enables checkpoints to restore chat to a previous state'
+  },
+  'chat.checkpoints.showFileChanges': {
+    default: false,
+    type: 'boolean',
+    description: 'Show file changes for chat checkpoints'
+  },
+  'chat.undoRequests.restoreInput': {
+    default: true,
+    type: 'boolean',
+    description: 'Restore chat input when an undo request is made'
+  },
+  // ── Context ─────────────────────────────────────────────────────
+  'chat.contextUsage.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Show the context window usage indicator in the chat input'
+  },
+  'chat.detectParticipant.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Enables chat participant autodetection for panel chat'
+  },
+  'chat.implicitContext.enabled': {
+    default: {
+      panel: 'always'
+    },
+    type: 'object',
+    description: 'Automatically use the active editor as chat context'
+  },
+  'chat.implicitContext.suggestedContext': {
+    default: true,
+    type: 'boolean',
+    description: 'Auto-include context in Ask/Edit modes; suggest as attachment in agent mode'
+  },
+  'chat.sendElementsToChat.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Allow elements to be sent to chat from the Simple Browser'
+  },
+  'chat.sendElementsToChat.attachCSS': {
+    default: true,
+    type: 'boolean',
+    description: 'Attach CSS of the selected element to chat'
+  },
+  'chat.sendElementsToChat.attachImages': {
+    default: true,
+    type: 'boolean',
+    description: 'Attach a screenshot of the selected element to chat'
+  },
+  // ── Prompts / Instructions / Agents ─────────────────────────────
+  'chat.instructionsFilesLocations': {
+    default: {
+      '.github/instructions': true
+    },
+    type: 'object',
+    description: 'Locations of instructions files for Chat sessions'
+  },
+  'chat.promptFilesLocations': {
+    default: {
+      '.github/prompts': true
+    },
+    type: 'object',
+    description: 'Locations of reusable prompt files for Chat sessions'
+  },
+  'chat.modeFilesLocations': {
+    default: {
+      '.github/chatModes': true
+    },
+    type: 'object',
+    description: 'Locations of custom chat mode files (deprecated — now agents)'
+  },
+  'chat.agentFilesLocations': {
+    default: {
+      '.github/agents': true,
+      '.claude': true
+    },
+    type: 'object',
+    description: 'Locations of custom agent files'
+  },
+  'chat.agentSkillsLocations': {
+    default: {
+      '.github/skills': true
+    },
+    type: 'object',
+    description: 'Locations of agent skills (SKILL.md) for Chat sessions'
+  },
+  'chat.hookFilesLocations': {
+    default: {
+      '.github/hooks': true
+    },
+    type: 'object',
+    description: 'Paths to hook configuration files for agent workflow commands'
+  },
+  'chat.promptFilesRecommendations': {
+    default: {},
+    type: 'object',
+    description: 'Configure which prompt files to recommend in the chat welcome view'
+  },
+  'chat.useAgentsMdFile': {
+    default: true,
+    type: 'boolean',
+    description: 'Attach instructions from AGENTS.md found in workspace roots to all chat requests'
+  },
+  'chat.useNestedAgentsMdFiles': {
+    default: false,
+    type: 'boolean',
+    description: 'List instructions from nested AGENTS.md files found in the workspace'
+  },
+  'chat.useClaudeMdFile': {
+    default: true,
+    type: 'boolean',
+    description: 'Attach instructions from CLAUDE.md found in workspace roots or .claude / ~/.claude folder'
+  },
+  'chat.useAgentSkills': {
+    default: true,
+    type: 'boolean',
+    description: 'Provide skills as specialized capabilities to chat requests'
+  },
+  'chat.useSkillAdherencePrompt': {
+    default: false,
+    type: 'boolean',
+    description: 'Use a stronger skill adherence prompt that encourages immediate skill invocation'
+  },
+  'chat.includeApplyingInstructions': {
+    default: true,
+    type: 'boolean',
+    description: 'Auto-include instructions with a matching applyTo attribute in chat requests'
+  },
+  'chat.includeReferencedInstructions': {
+    default: false,
+    type: 'boolean',
+    description: 'Auto-include referenced instructions in chat requests'
+  },
+  'chat.useHooks': {
+    default: true,
+    type: 'boolean',
+    description: 'Execute chat hooks at strategic points during an agent workflow'
+  },
+  'chat.useClaudeHooks': {
+    default: false,
+    type: 'boolean',
+    description: 'Allow hooks from Claude configuration files to execute'
+  },
+  // ── MCP (Model Context Protocol) ────────────────────────────────
+  'chat.mcp.access': {
+    default: 'all',
+    type: 'string',
+    description: 'Controls access to installed Model Context Protocol servers'
+  },
+  'chat.mcp.autostart': {
+    default: 'newAndOutdated',
+    type: 'string',
+    description: 'Whether MCP servers auto-start when chat messages are submitted'
+  },
+  'chat.mcp.apps.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Allow MCP servers to provide custom UI for tool invocations'
+  },
+  'chat.mcp.serverSampling': {
+    default: {},
+    type: 'object',
+    description: 'Configure which models are exposed to MCP servers for sampling'
+  },
+  'chat.mcp.discovery.enabled': {
+    default: {},
+    type: 'object',
+    description: 'Configure discovery of MCP servers from other applications'
+  },
+  'chat.mcp.gallery.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Enable the default Marketplace for MCP servers'
+  },
+  'chat.mcp.gallery.serviceUrl': {
+    default: '',
+    type: 'string',
+    description: 'MCP Gallery service URL to connect to'
+  },
+  // ── Inline Chat ─────────────────────────────────────────────────
+  'inlineChat.finishOnType': {
+    default: false,
+    type: 'boolean',
+    description: 'Finish an inline chat session when typing outside of changed regions'
+  },
+  'inlineChat.holdToSpeech': {
+    default: true,
+    type: 'boolean',
+    description: 'Holding the inline chat keybinding automatically enables speech recognition'
+  },
+  'inlineChat.enableV2': {
+    default: false,
+    type: 'boolean',
+    description: 'Use the next version of inline chat'
+  },
+  'inlineChat.defaultModel': {
+    default: '',
+    type: 'string',
+    description: 'Default language model for inline chat'
+  },
+  'inlineChat.notebookAgent': {
+    default: false,
+    type: 'boolean',
+    description: 'Enable agent-like behavior for inline chat widget in notebooks'
+  },
+  'inlineChat.affordance': {
+    default: 'off',
+    type: 'string',
+    description: 'Controls whether an inline chat affordance is shown when text is selected'
+  },
+  'inlineChat.renderMode': {
+    default: 'zone',
+    type: 'string',
+    description: 'Controls how inline chat is rendered'
+  },
+  'inlineChat.fixDiagnostics': {
+    default: true,
+    type: 'boolean',
+    description: 'Controls whether the Fix action is shown for diagnostics in the editor'
+  },
+  // ── Terminal Chat Agent Tools ────────────────────────────────────
+  'chat.tools.terminal.enableAutoApprove': {
+    default: true,
+    type: 'boolean',
+    description: 'Controls whether to allow auto approval in the run in terminal tool'
+  },
+  'chat.tools.terminal.autoApprove': {
+    default: {},
+    type: 'object',
+    description: 'Commands/regex patterns controlling terminal tool auto-approval'
+  },
+  'chat.tools.terminal.autoApproveWorkspaceNpmScripts': {
+    default: true,
+    type: 'boolean',
+    description: 'Auto-approve npm/yarn/pnpm run commands for workspace scripts'
+  },
+  'chat.tools.terminal.ignoreDefaultAutoApproveRules': {
+    default: false,
+    type: 'boolean',
+    description: 'Ignore built-in default auto-approve rules'
+  },
+  'chat.tools.terminal.blockDetectedFileWrites': {
+    default: 'outsideWorkspace',
+    type: 'string',
+    description: 'Block detected file write operations in terminal tool'
+  },
+  'chat.tools.terminal.shellIntegrationTimeout': {
+    default: -1,
+    type: 'number',
+    description: 'Duration (ms) to wait for shell integration detection (-1 = auto)'
+  },
+  'chat.tools.terminal.autoReplyToPrompts': {
+    default: false,
+    type: 'boolean',
+    description: 'Auto-respond to terminal prompts (experimental, use at your own risk)'
+  },
+  'chat.tools.terminal.outputLocation': {
+    default: 'chat',
+    type: 'string',
+    description: 'Where to show run-in-terminal output'
+  },
+  'chat.tools.terminal.sandbox.enabled': {
+    default: false,
+    type: 'boolean',
+    description: 'Run commands in a sandboxed terminal'
+  },
+  'chat.tools.terminal.sandbox.network': {
+    default: {},
+    type: 'object',
+    description: 'Network access controls for the terminal sandbox'
+  },
+  'chat.tools.terminal.sandbox.linuxFileSystem': {
+    default: {},
+    type: 'object',
+    description: 'File system access controls for the terminal sandbox on Linux'
+  },
+  'chat.tools.terminal.sandbox.macFileSystem': {
+    default: {},
+    type: 'object',
+    description: 'File system access controls for the terminal sandbox on macOS'
+  },
+  'chat.tools.terminal.preventShellHistory': {
+    default: true,
+    type: 'boolean',
+    description: 'Exclude terminal tool commands from shell history'
+  },
+  'chat.tools.terminal.enforceTimeoutFromModel': {
+    default: true,
+    type: 'boolean',
+    description: 'Enforce the timeout value provided by the model'
+  },
+  'chat.tools.terminal.terminalProfile.linux': {
+    default: null,
+    type: 'object',
+    description: 'Terminal profile for Linux chat agent terminal tool'
+  },
+  'chat.tools.terminal.terminalProfile.osx': {
+    default: null,
+    type: 'object',
+    description: 'Terminal profile for macOS chat agent terminal tool'
+  },
+  'chat.tools.terminal.terminalProfile.windows': {
+    default: null,
+    type: 'object',
+    description: 'Terminal profile for Windows chat agent terminal tool'
+  },
+  // ── Customization ───────────────────────────────────────────────
+  'chat.customizationsMenu.enabled': {
+    default: true,
+    type: 'boolean',
+    description: 'Make the Chat Customizations editor available in the Command Palette'
+  },
+  'chat.customizationsMenu.userStoragePath': {
+    default: '',
+    type: 'string',
+    description: 'Override the base directory for user-level customization files'
+  }
+};
+/** Enum options for string-type settings. */
+const ENUM_OPTIONS = {
+  'chat.requestQueuing.defaultAction': ['queue', 'steer'],
+  'chat.inlineReferences.style': ['box', 'link'],
+  'chat.agentsControl.clickBehavior': ['default', 'cycle'],
+  'chat.agent.thinkingStyle': ['collapsed', 'collapsedPreview', 'fixedScrolling'],
+  'chat.agent.thinking.collapsedTools': ['off', 'withThinking', 'always'],
+  'chat.notifyWindowOnConfirmation': ['off', 'windowNotFocused', 'always'],
+  'chat.notifyWindowOnResponseReceived': ['off', 'windowNotFocused', 'always'],
+  'chat.viewSessions.grouping': ['none', 'date', 'agent'],
+  'chat.viewSessions.orientation': ['stacked', 'sideBySide'],
+  'chat.upvoteAnimation': ['off', 'confetti', 'floatingThumbs', 'pulseWave', 'radiantLines'],
+  'chat.editRequests': ['inline', 'hover', 'input', 'none'],
+  'chat.editor.wordWrap': ['on', 'off'],
+  'chat.mcp.access': ['none', 'registry', 'all'],
+  'chat.mcp.autostart': ['never', 'onlyNew', 'newAndOutdated'],
+  'inlineChat.affordance': ['off', 'gutter', 'editor'],
+  'inlineChat.renderMode': ['zone', 'hover'],
+  'chat.tools.terminal.blockDetectedFileWrites': ['never', 'outsideWorkspace', 'all'],
+  'chat.tools.terminal.outputLocation': ['terminal', 'chat']
+};
+// ─── Subcomponents ──────────────────────────────────────────────────────────
+/** Toggle switch for booleans. */
+const Toggle = ({
+  checked,
+  onChange,
+  disabled
+}) => React.createElement("button", {
+  role: "switch",
+  "aria-checked": checked,
+  disabled: disabled,
+  className: `
+            relative inline-flex h-5 w-9 items-center rounded-full transition-colors
+            ${checked ? 'bg-blue-600' : 'bg-gray-300 dark:bg-gray-600'}
+            ${disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'}
+        `,
+  onClick: () => !disabled && onChange(!checked)
+}, React.createElement("span", {
+  className: `
+                inline-block h-3.5 w-3.5 rounded-full bg-white shadow transition-transform
+                ${checked ? 'translate-x-[18px]' : 'translate-x-[3px]'}
+            `
+}));
+/** Dropdown select for enum strings. */
+const EnumSelect = ({
+  value,
+  options,
+  onChange
+}) => React.createElement("select", {
+  value: value,
+  onChange: e => onChange(e.target.value),
+  className: "text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600\n                   rounded px-2 py-1 text-gray-700 dark:text-gray-300 focus:ring-1 focus:ring-blue-500\n                   focus:outline-none"
+}, options.map(opt => React.createElement("option", {
+  key: opt,
+  value: opt
+}, opt)));
+/** Text input for strings. */
+const TextInput = ({
+  value,
+  onChange,
+  placeholder
+}) => React.createElement("input", {
+  type: "text",
+  value: value,
+  onChange: e => onChange(e.target.value),
+  placeholder: placeholder,
+  className: "text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600\n                   rounded px-2 py-1 w-full max-w-xs text-gray-700 dark:text-gray-300\n                   focus:ring-1 focus:ring-blue-500 focus:outline-none"
+});
+/** Number input. */
+const NumberInput = ({
+  value,
+  onChange
+}) => React.createElement("input", {
+  type: "number",
+  value: value,
+  onChange: e => onChange(Number(e.target.value)),
+  className: "text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600\n                   rounded px-2 py-1 w-20 text-gray-700 dark:text-gray-300\n                   focus:ring-1 focus:ring-blue-500 focus:outline-none"
+});
+/** Array tag editor (simplified). */
+const ArrayInput = ({
+  value,
+  onChange,
+  placeholder
+}) => {
+  const [input, setInput] = useState('');
+  const items = Array.isArray(value) ? value.map(String) : [];
+  const add = () => {
+    const trimmed = input.trim();
+    if (trimmed && !items.includes(trimmed)) {
+      onChange([...items, trimmed]);
+      setInput('');
+    }
+  };
+  return React.createElement("div", {
+    className: "flex flex-col gap-1 w-full max-w-xs"
+  }, React.createElement("div", {
+    className: "flex gap-1"
+  }, React.createElement("input", {
+    type: "text",
+    value: input,
+    onChange: e => setInput(e.target.value),
+    onKeyDown: e => e.key === 'Enter' && (e.preventDefault(), add()),
+    placeholder: placeholder || 'Add item...',
+    className: "text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600\n                               rounded px-2 py-1 flex-1 text-gray-700 dark:text-gray-300\n                               focus:ring-1 focus:ring-blue-500 focus:outline-none"
+  }), React.createElement("button", {
+    onClick: add,
+    className: "text-xs px-2 py-1 rounded bg-blue-600 text-white hover:bg-blue-700 transition-colors"
+  }, "Add")), items.length > 0 && React.createElement("div", {
+    className: "flex flex-wrap gap-1"
+  }, items.map((item, i) => React.createElement("span", {
+    key: i,
+    className: "inline-flex items-center gap-1 text-[10px] bg-gray-200 dark:bg-gray-700\n                                       text-gray-700 dark:text-gray-300 rounded px-1.5 py-0.5"
+  }, item, React.createElement("button", {
+    onClick: () => onChange(items.filter((_, j) => j !== i)),
+    className: "text-gray-400 hover:text-red-500"
+  }, "\u00D7")))));
+};
+/**
+ * Detects whether an object value is a simple Record<string, boolean> (most
+ * common pattern: path/glob → enabled). For these we show a friendly key–value
+ * pair editor. Everything else falls back to a JSON textarea.
+ */
+const isStringBooleanRecord = v => {
+  if (v === null || v === undefined || typeof v !== 'object' || Array.isArray(v)) return false;
+  return Object.values(v).every(val => typeof val === 'boolean');
+};
+/** Key–value pair editor for Record<string, boolean> objects. */
+const KeyValueBoolEditor = ({
+  value,
+  onChange
+}) => {
+  const [newKey, setNewKey] = useState('');
+  const entries = Object.entries(value);
+  const addEntry = () => {
+    const trimmed = newKey.trim();
+    if (trimmed && !(trimmed in value)) {
+      onChange({
+        ...value,
+        [trimmed]: true
+      });
+      setNewKey('');
+    }
+  };
+  return React.createElement("div", {
+    className: "flex flex-col gap-1 w-full max-w-sm"
+  }, entries.map(([k, v]) => React.createElement("div", {
+    key: k,
+    className: "flex items-center gap-1.5 text-[11px]"
+  }, React.createElement("code", {
+    className: "flex-1 truncate text-gray-600 dark:text-gray-400 font-mono",
+    title: k
+  }, k), React.createElement(Toggle, {
+    checked: v,
+    onChange: checked => onChange({
+      ...value,
+      [k]: checked
+    })
+  }), React.createElement("button", {
+    onClick: () => {
+      const next = {
+        ...value
+      };
+      delete next[k];
+      onChange(next);
+    },
+    className: "p-0.5 rounded text-gray-400 hover:text-red-500 transition-colors",
+    title: "Remove entry"
+  }, React.createElement(FiTrash2, {
+    className: "w-3 h-3"
+  })))), React.createElement("div", {
+    className: "flex gap-1 mt-0.5"
+  }, React.createElement("input", {
+    type: "text",
+    value: newKey,
+    onChange: e => setNewKey(e.target.value),
+    onKeyDown: e => e.key === 'Enter' && (e.preventDefault(), addEntry()),
+    placeholder: "Add key\u2026",
+    className: "text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600\n                               rounded px-2 py-1 flex-1 text-gray-700 dark:text-gray-300\n                               focus:ring-1 focus:ring-blue-500 focus:outline-none"
+  }), React.createElement("button", {
+    onClick: addEntry,
+    className: "p-1 rounded bg-blue-600 text-white hover:bg-blue-700 transition-colors",
+    title: "Add entry"
+  }, React.createElement(FiPlus, {
+    className: "w-3 h-3"
+  }))));
+};
+/** JSON textarea editor — fallback for complex / mixed-type objects. */
+const JsonEditor = ({
+  value,
+  onChange
+}) => {
+  const [text, setText] = useState(() => JSON.stringify(value, null, 2));
+  const [error, setError] = useState(null);
+  const [expanded, setExpanded] = useState(false);
+  // Sync when external value changes
+  useEffect(() => {
+    setText(JSON.stringify(value, null, 2));
+    setError(null);
+  }, [value]);
+  const handleBlur = () => {
+    try {
+      const parsed = JSON.parse(text);
+      setError(null);
+      onChange(parsed);
+    } catch {
+      setError('Invalid JSON');
+    }
+  };
+  if (!expanded) {
+    const preview = JSON.stringify(value);
+    const short = preview.length > 40 ? preview.slice(0, 37) + '…' : preview;
+    return React.createElement("button", {
+      onClick: () => setExpanded(true),
+      className: "inline-flex items-center gap-1 text-[11px] text-gray-500 dark:text-gray-400\n                           hover:text-blue-600 dark:hover:text-blue-400 transition-colors",
+      title: "Edit as JSON"
+    }, React.createElement(FiEdit2, {
+      className: "w-3 h-3"
+    }), React.createElement("code", {
+      className: "font-mono truncate max-w-[180px]"
+    }, short));
+  }
+  return React.createElement("div", {
+    className: "flex flex-col gap-1 w-full max-w-sm"
+  }, React.createElement("textarea", {
+    value: text,
+    onChange: e => {
+      setText(e.target.value);
+      setError(null);
+    },
+    onBlur: handleBlur,
+    rows: Math.min(Math.max(text.split('\n').length, 3), 10),
+    spellCheck: false,
+    className: `text-[11px] font-mono bg-white dark:bg-gray-800 border rounded
+                            px-2 py-1.5 w-full text-gray-700 dark:text-gray-300
+                            focus:ring-1 focus:outline-none resize-y
+                            ${error ? 'border-red-400 focus:ring-red-400' : 'border-gray-300 dark:border-gray-600 focus:ring-blue-500'}`
+  }), React.createElement("div", {
+    className: "flex items-center justify-between"
+  }, error && React.createElement("span", {
+    className: "text-[10px] text-red-500"
+  }, error), React.createElement("button", {
+    onClick: () => setExpanded(false),
+    className: "text-[10px] text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 ml-auto"
+  }, "Collapse")));
+};
+/** Composite object editor — uses KeyValueBoolEditor for simple maps, JSON for complex ones. */
+const ObjectEditor = ({
+  value,
+  onChange
+}) => {
+  if (value === null || value === undefined || typeof value === 'object' && Object.keys(value).length === 0) {
+    // Empty object or null — show the JSON editor (compact "Edit" button)
+    return React.createElement(JsonEditor, {
+      value: value ?? {},
+      onChange: onChange
+    });
+  }
+  if (isStringBooleanRecord(value)) {
+    return React.createElement(KeyValueBoolEditor, {
+      value: value,
+      onChange: onChange
+    });
+  }
+  return React.createElement(JsonEditor, {
+    value: value,
+    onChange: onChange
+  });
+};
+// ─── Main Panel ─────────────────────────────────────────────────────────────
+const ChatSettingsPanel = ({
+  entries: externalEntries,
+  channelId,
+  onChange,
+  onReset,
+  loading = false,
+  className = '',
+  compact = false
+}) => {
+  const [search, setSearch] = useState('');
+  const [expandedGroups, setExpandedGroups] = useState(() => new Set(SETTINGS_GROUPS.map(g => g.id)));
+  const [localOverrides, setLocalOverrides] = useState({});
+  const [modifiedKeys, setModifiedKeys] = useState(new Set());
+  // Merge external entries + built-in defaults
+  const entryMap = useMemo(() => {
+    const map = new Map();
+    // Start with built-in defaults
+    for (const [key, meta] of Object.entries(BUILT_IN_DEFAULTS)) {
+      map.set(key, {
+        key,
+        value: meta.default,
+        defaultValue: meta.default,
+        valueType: meta.type,
+        description: meta.description
+      });
+    }
+    // Overlay external entries (from GraphQL)
+    if (externalEntries) {
+      for (const entry of externalEntries) {
+        map.set(entry.key, entry);
+      }
+    }
+    // Overlay local overrides (unsaved changes)
+    for (const [key, value] of Object.entries(localOverrides)) {
+      const existing = map.get(key);
+      if (existing) {
+        map.set(key, {
+          ...existing,
+          value
+        });
+      }
+    }
+    return map;
+  }, [externalEntries, localOverrides]);
+  // Filter by search
+  const matchesSearch = useCallback(entry => {
+    if (!search) return true;
+    const q = search.toLowerCase();
+    return entry.key.toLowerCase().includes(q) || entry.description.toLowerCase().includes(q);
+  }, [search]);
+  // Toggle group expand/collapse
+  const toggleGroup = useCallback(groupId => {
+    setExpandedGroups(prev => {
+      const next = new Set(prev);
+      if (next.has(groupId)) next.delete(groupId);else next.add(groupId);
+      return next;
+    });
+  }, []);
+  // Handle value change
+  const handleChange = useCallback((key, value) => {
+    setLocalOverrides(prev => ({
+      ...prev,
+      [key]: value
+    }));
+    setModifiedKeys(prev => new Set(prev).add(key));
+    onChange?.(key, value);
+  }, [onChange]);
+  // Handle reset
+  const handleReset = useCallback(key => {
+    setLocalOverrides(prev => {
+      const next = {
+        ...prev
+      };
+      delete next[key];
+      return next;
+    });
+    setModifiedKeys(prev => {
+      const next = new Set(prev);
+      next.delete(key);
+      return next;
+    });
+    onReset?.(key);
+  }, [onReset]);
+  // Render the control for a single setting
+  const renderControl = useCallback(entry => {
+    const isModified = modifiedKeys.has(entry.key);
+    const isDefault = JSON.stringify(entry.value) === JSON.stringify(entry.defaultValue);
+    const enumOpts = ENUM_OPTIONS[entry.key];
+    return React.createElement("div", {
+      key: entry.key,
+      className: `
+                        flex flex-col gap-1 px-3 py-2.5
+                        ${isModified ? 'bg-blue-50/50 dark:bg-blue-900/10' : ''}
+                        border-b border-gray-100 dark:border-gray-800 last:border-0
+                    `
+    }, React.createElement("div", {
+      className: "flex items-start justify-between gap-3"
+    }, React.createElement("div", {
+      className: "flex-1 min-w-0"
+    }, React.createElement("div", {
+      className: "flex items-center gap-1.5"
+    }, React.createElement("code", {
+      className: "text-xs font-mono text-gray-700 dark:text-gray-300 break-all"
+    }, entry.key), !isDefault && React.createElement("span", {
+      className: "text-[9px] px-1 py-0.5 rounded bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400 font-medium"
+    }, "Modified")), React.createElement("p", {
+      className: "text-[11px] text-gray-500 dark:text-gray-400 mt-0.5 leading-relaxed"
+    }, entry.description)), React.createElement("div", {
+      className: "flex items-center gap-2 flex-shrink-0"
+    }, entry.valueType === 'boolean' && React.createElement(Toggle, {
+      checked: !!entry.value,
+      onChange: v => handleChange(entry.key, v)
+    }), entry.valueType === 'string' && enumOpts && React.createElement(EnumSelect, {
+      value: String(entry.value ?? ''),
+      options: enumOpts,
+      onChange: v => handleChange(entry.key, v)
+    }), entry.valueType === 'string' && !enumOpts && React.createElement(TextInput, {
+      value: String(entry.value ?? ''),
+      onChange: v => handleChange(entry.key, v),
+      placeholder: String(entry.defaultValue ?? '')
+    }), entry.valueType === 'number' && React.createElement(NumberInput, {
+      value: Number(entry.value ?? 0),
+      onChange: v => handleChange(entry.key, v)
+    }), entry.valueType === 'array' && React.createElement(ArrayInput, {
+      value: Array.isArray(entry.value) ? entry.value : [],
+      onChange: v => handleChange(entry.key, v)
+    }), entry.valueType === 'object' && React.createElement(ObjectEditor, {
+      value: entry.value,
+      onChange: v => handleChange(entry.key, v)
+    }), !isDefault && React.createElement("button", {
+      onClick: () => handleReset(entry.key),
+      title: "Reset to default",
+      className: "p-1 rounded hover:bg-gray-200 dark:hover:bg-gray-700 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors"
+    }, React.createElement(FiRefreshCw, {
+      className: "w-3 h-3"
+    })))));
+  }, [modifiedKeys, handleChange, handleReset]);
+  return React.createElement("div", {
+    className: `flex flex-col h-full bg-white dark:bg-gray-900 ${className}`
+  }, React.createElement("div", {
+    className: "flex items-center gap-2 px-4 py-3 border-b border-gray-200 dark:border-gray-700"
+  }, React.createElement("span", {
+    className: "text-sm font-semibold text-gray-800 dark:text-gray-200"
+  }, "Chat Settings"), loading && React.createElement(FiRefreshCw, {
+    className: "w-3.5 h-3.5 text-gray-400 animate-spin"
+  }), React.createElement("span", {
+    className: "ml-auto text-[10px] text-gray-400"
+  }, entryMap.size, " settings")), React.createElement("div", {
+    className: "px-3 py-2 border-b border-gray-200 dark:border-gray-700"
+  }, React.createElement("div", {
+    className: "relative"
+  }, React.createElement(FiSearch, {
+    className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-gray-400"
+  }), React.createElement("input", {
+    type: "text",
+    value: search,
+    onChange: e => setSearch(e.target.value),
+    placeholder: "Search settings...",
+    className: "w-full text-xs bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700\n                                   rounded-md pl-8 pr-8 py-1.5 text-gray-700 dark:text-gray-300\n                                   focus:ring-1 focus:ring-blue-500 focus:outline-none focus:bg-white dark:focus:bg-gray-900\n                                   placeholder-gray-400"
+  }), search && React.createElement("button", {
+    onClick: () => setSearch(''),
+    className: "absolute right-2 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600"
+  }, React.createElement(FiX, {
+    className: "w-3.5 h-3.5"
+  })))), React.createElement("div", {
+    className: "flex-1 overflow-y-auto"
+  }, SETTINGS_GROUPS.map(group => {
+    const groupEntries = group.keys.map(key => entryMap.get(key)).filter(e => !!e && matchesSearch(e));
+    if (groupEntries.length === 0) return null;
+    const isExpanded = expandedGroups.has(group.id);
+    return React.createElement("div", {
+      key: group.id,
+      className: "border-b border-gray-200 dark:border-gray-700 last:border-0"
+    }, React.createElement("button", {
+      className: "flex items-center gap-2 w-full text-left px-4 py-2.5\n                                           hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-colors",
+      onClick: () => toggleGroup(group.id)
+    }, React.createElement(FiChevronDown, {
+      className: `w-3.5 h-3.5 text-gray-400 transition-transform ${isExpanded ? '' : '-rotate-90'}`
+    }), React.createElement("span", {
+      className: "text-sm"
+    }, group.icon), React.createElement("span", {
+      className: "text-xs font-semibold text-gray-700 dark:text-gray-300"
+    }, group.label), React.createElement("span", {
+      className: "ml-auto text-[10px] text-gray-400"
+    }, groupEntries.length)), isExpanded && React.createElement("div", {
+      className: "bg-gray-50/50 dark:bg-gray-800/20"
+    }, groupEntries.map(renderControl)));
+  }), search && SETTINGS_GROUPS.every(g => g.keys.map(k => entryMap.get(k)).filter(e => !!e && matchesSearch(e)).length === 0) && React.createElement("div", {
+    className: "flex flex-col items-center justify-center py-12 text-gray-400"
+  }, React.createElement(FiSearch, {
+    className: "w-8 h-8 mb-2 opacity-50"
+  }), React.createElement("p", {
+    className: "text-sm"
+  }, "No settings match \"", search, "\""))));
+};export{ChatSettingsPanel};//# sourceMappingURL=ChatSettingsPanel.js.map