Function McpSettings

packages/app-core/src/components/SettingsModal.tsx:5302–5461

()

function McpSettings(): JSX.Element {
  const [statuses, setStatuses] = useState<McpClientStatus[] | null>(null)
  const [runtime, setRuntime] = useState<McpServerRuntime | null>(null)
  const [busyId, setBusyId] = useState<McpClientId | null>(null)
  const [error, setError] = useState<string | null>(null)
  const [showCommand, setShowCommand] = useState(false)

  const refresh = useCallback(async (): Promise<void> => {
    try {
      const [s, r] = await Promise.all([
        window.zen.mcpGetStatuses(),
        window.zen.mcpGetRuntime()
      ])
      setStatuses(s)
      setRuntime(r)
      setError(null)
    } catch (err) {
      setError((err as Error).message)
    }
  }, [])

  useEffect(() => {
    void refresh()
  }, [refresh])

  const onInstall = async (id: McpClientId): Promise<void> => {
    setBusyId(id)
    try {
      await window.zen.mcpInstall(id)
      await refresh()
    } catch (err) {
      setError((err as Error).message)
    } finally {
      setBusyId(null)
    }
  }

  const onUninstall = async (id: McpClientId): Promise<void> => {
    setBusyId(id)
    try {
      await window.zen.mcpUninstall(id)
      await refresh()
    } catch (err) {
      setError((err as Error).message)
    } finally {
      setBusyId(null)
    }
  }

  const copy = (text: string): void => {
    window.zen.clipboardWriteText(text)
  }

  const commandPreview = runtime
    ? `${runtime.command} ${runtime.args.map((a) => (a.includes(' ') ? `"${a}"` : a)).join(' ')}`
    : '—'
  const entryMissing = runtime !== null && runtime.entryPath == null