Function SettingsDialog

ai-code-studio/src/components/SettingsDialog.tsx:60–567

({
  open,
  config,
  setConfig,
  isTestingConnection,
  connectionReport,
  setupChecklist,
  onSaveConfig,
  onTestConnection,
  onShutdownGateway,
  onRestartLauncher,
  onClose,
}: SettingsDialogProps)

}

export function SettingsDialog({
  open,
  config,
  setConfig,
  isTestingConnection,
  connectionReport,
  setupChecklist,
  onSaveConfig,
  onTestConnection,
  onShutdownGateway,
  onRestartLauncher,
  onClose,
}: SettingsDialogProps) {
  const [settingsTab, setSettingsTab] = useState<SettingsTab>('Provider');
  const [saveState, setSaveState] = useState<'idle' | 'saving' | 'saved'>('idle');

  useEffect(() => {
    if (open) {
      setSettingsTab('Provider');
    }
  }, [open]);

  const currentPreset =
    providerPresets.find(
      preset =>
        preset.id !== 'custom' &&
        preset.upstreamBaseUrl === config.upstreamBaseUrl &&
        preset.upstreamModel === config.upstreamModel,
    ) || null;

  if (!open) {
    return null;
  }

  function applyPreset(preset: ProviderPreset) {
    setConfig(current => ({
      ...current,
      upstreamBaseUrl: preset.upstreamBaseUrl,
      upstreamModel: preset.upstreamModel,
      clawModel: preset.clawModel,
      textMode: preset.textMode,
    }));
  }

  async function pickDirectory(target: 'workspaceDir' | 'clawProjectDir') {
    const nextPath = await window.clawDesktop?.pickDirectory?.();
    if (nextPath) {
      setConfig(current => ({
        ...current,
        [target]: nextPath,
      }));
    }
  }

  async function pickBinaryPath() {
    const nextPath = await window.clawDesktop?.pickFile?.([
      { name: 'Executable', extensions: ['exe', 'bin', 'cmd'] },
      { name: 'All Files', extensions: ['*'] },