refactor(settings): move remaining sections into folders

- Move feature-defaults-section.tsx into feature-defaults/
- Move keyboard-shortcuts-section.tsx into keyboard-shortcuts/
- Move kanban-display-section.tsx into kanban-display/
- Move danger-zone-section.tsx into danger-zone/
- Update settings-view.tsx to import from new locations
- Update type imports in kanban-display and danger-zone to ../types
- All TypeScript diagnostics passing
- Git preserves file history with rename detection

app/src/components/views/settings-view.tsx

@@ -33,10 +33,10 @@ import { ApiKeysSection } from "./settings-view/api-keys/api-keys-section";
 import { ClaudeCliStatus } from "./settings-view/cli-status/claude-cli-status";
 import { CodexCliStatus } from "./settings-view/cli-status/codex-cli-status";
 import { AppearanceSection } from "./settings-view/appearance/appearance-section";
-import { KanbanDisplaySection } from "./settings-view/kanban-display-section";
-import { KeyboardShortcutsSection } from "./settings-view/keyboard-shortcuts-section";
-import { FeatureDefaultsSection } from "./settings-view/feature-defaults-section";
-import { DangerZoneSection } from "./settings-view/danger-zone-section";
+import { KanbanDisplaySection } from "./settings-view/kanban-display/kanban-display-section";
+import { KeyboardShortcutsSection } from "./settings-view/keyboard-shortcuts/keyboard-shortcuts-section";
+import { FeatureDefaultsSection } from "./settings-view/feature-defaults/feature-defaults-section";
+import { DangerZoneSection } from "./settings-view/danger-zone/danger-zone-section";
 
 // Navigation items for the side panel
 const NAV_ITEMS = [

app/src/components/views/settings-view/cli-status-section.tsx

@@ -1,304 +0,0 @@
-import { Button } from "@/components/ui/button";
-import {
-  Terminal,
-  CheckCircle2,
-  AlertCircle,
-  RefreshCw,
-  Atom,
-} from "lucide-react";
-import type { CliStatus } from "./types";
-
-interface CliStatusProps {
-  status: CliStatus | null;
-  isChecking: boolean;
-  onRefresh: () => void;
-}
-
-export function ClaudeCliStatus({
-  status,
-  isChecking,
-  onRefresh,
-}: CliStatusProps) {
-  if (!status) return null;
-
-  return (
-    <div
-      id="claude"
-      className="rounded-xl border border-border bg-card backdrop-blur-md overflow-hidden scroll-mt-6"
-    >
-      <div className="p-6 border-b border-border">
-        <div className="flex items-center justify-between mb-2">
-          <div className="flex items-center gap-2">
-            <Terminal className="w-5 h-5 text-brand-500" />
-            <h2 className="text-lg font-semibold text-foreground">
-              Claude Code CLI
-            </h2>
-          </div>
-          <Button
-            variant="ghost"
-            size="icon"
-            onClick={onRefresh}
-            disabled={isChecking}
-            data-testid="refresh-claude-cli"
-            title="Refresh Claude CLI detection"
-          >
-            <RefreshCw
-              className={`w-4 h-4 ${isChecking ? "animate-spin" : ""}`}
-            />
-          </Button>
-        </div>
-        <p className="text-sm text-muted-foreground">
-          Claude Code CLI provides better performance for long-running tasks,
-          especially with ultrathink.
-        </p>
-      </div>
-      <div className="p-6 space-y-4">
-        {status.success && status.status === "installed" ? (
-          <div className="space-y-3">
-            <div className="flex items-center gap-2 p-3 rounded-lg bg-green-500/10 border border-green-500/20">
-              <CheckCircle2 className="w-5 h-5 text-green-500 shrink-0" />
-              <div className="flex-1">
-                <p className="text-sm font-medium text-green-400">
-                  Claude Code CLI Installed
-                </p>
-                <div className="text-xs text-green-400/80 mt-1 space-y-1">
-                  {status.method && (
-                    <p>
-                      Method: <span className="font-mono">{status.method}</span>
-                    </p>
-                  )}
-                  {status.version && (
-                    <p>
-                      Version:{" "}
-                      <span className="font-mono">{status.version}</span>
-                    </p>
-                  )}
-                  {status.path && (
-                    <p className="truncate" title={status.path}>
-                      Path:{" "}
-                      <span className="font-mono text-[10px]">
-                        {status.path}
-                      </span>
-                    </p>
-                  )}
-                </div>
-              </div>
-            </div>
-            {status.recommendation && (
-              <p className="text-xs text-muted-foreground">
-                {status.recommendation}
-              </p>
-            )}
-          </div>
-        ) : (
-          <div className="space-y-3">
-            <div className="flex items-start gap-3 p-3 rounded-lg bg-yellow-500/10 border border-yellow-500/20">
-              <AlertCircle className="w-5 h-5 text-yellow-500 mt-0.5 shrink-0" />
-              <div className="flex-1">
-                <p className="text-sm font-medium text-yellow-400">
-                  Claude Code CLI Not Detected
-                </p>
-                <p className="text-xs text-yellow-400/80 mt-1">
-                  {status.recommendation ||
-                    "Consider installing Claude Code CLI for optimal performance with ultrathink."}
-                </p>
-              </div>
-            </div>
-            {status.installCommands && (
-              <div className="space-y-2">
-                <p className="text-xs font-medium text-foreground-secondary">
-                  Installation Commands:
-                </p>
-                <div className="space-y-1">
-                  {status.installCommands.npm && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">npm:</p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.npm}
-                      </code>
-                    </div>
-                  )}
-                  {status.installCommands.macos && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">
-                        macOS/Linux:
-                      </p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.macos}
-                      </code>
-                    </div>
-                  )}
-                  {status.installCommands.windows && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">
-                        Windows (PowerShell):
-                      </p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.windows}
-                      </code>
-                    </div>
-                  )}
-                </div>
-              </div>
-            )}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}
-
-export function CodexCliStatus({
-  status,
-  isChecking,
-  onRefresh,
-}: CliStatusProps) {
-  if (!status) return null;
-
-  return (
-    <div
-      id="codex"
-      className="rounded-xl border border-border bg-card backdrop-blur-md overflow-hidden scroll-mt-6"
-    >
-      <div className="p-6 border-b border-border">
-        <div className="flex items-center justify-between mb-2">
-          <div className="flex items-center gap-2">
-            <Terminal className="w-5 h-5 text-green-500" />
-            <h2 className="text-lg font-semibold text-foreground">
-              OpenAI Codex CLI
-            </h2>
-          </div>
-          <Button
-            variant="ghost"
-            size="icon"
-            onClick={onRefresh}
-            disabled={isChecking}
-            data-testid="refresh-codex-cli"
-            title="Refresh Codex CLI detection"
-          >
-            <RefreshCw
-              className={`w-4 h-4 ${isChecking ? "animate-spin" : ""}`}
-            />
-          </Button>
-        </div>
-        <p className="text-sm text-muted-foreground">
-          Codex CLI enables GPT-5.1 Codex models for autonomous coding tasks.
-        </p>
-      </div>
-      <div className="p-6 space-y-4">
-        {status.success && status.status === "installed" ? (
-          <div className="space-y-3">
-            <div className="flex items-center gap-2 p-3 rounded-lg bg-green-500/10 border border-green-500/20">
-              <CheckCircle2 className="w-5 h-5 text-green-500 shrink-0" />
-              <div className="flex-1">
-                <p className="text-sm font-medium text-green-400">
-                  Codex CLI Installed
-                </p>
-                <div className="text-xs text-green-400/80 mt-1 space-y-1">
-                  {status.method && (
-                    <p>
-                      Method: <span className="font-mono">{status.method}</span>
-                    </p>
-                  )}
-                  {status.version && (
-                    <p>
-                      Version:{" "}
-                      <span className="font-mono">{status.version}</span>
-                    </p>
-                  )}
-                  {status.path && (
-                    <p className="truncate" title={status.path}>
-                      Path:{" "}
-                      <span className="font-mono text-[10px]">
-                        {status.path}
-                      </span>
-                    </p>
-                  )}
-                </div>
-              </div>
-            </div>
-            {status.recommendation && (
-              <p className="text-xs text-muted-foreground">
-                {status.recommendation}
-              </p>
-            )}
-          </div>
-        ) : status.status === "api_key_only" ? (
-          <div className="space-y-3">
-            <div className="flex items-start gap-3 p-3 rounded-lg bg-blue-500/10 border border-blue-500/20">
-              <AlertCircle className="w-5 h-5 text-blue-500 mt-0.5 shrink-0" />
-              <div className="flex-1">
-                <p className="text-sm font-medium text-blue-400">
-                  API Key Detected - CLI Not Installed
-                </p>
-                <p className="text-xs text-blue-400/80 mt-1">
-                  {status.recommendation ||
-                    "OPENAI_API_KEY found but Codex CLI not installed. Install the CLI for full agentic capabilities."}
-                </p>
-              </div>
-            </div>
-            {status.installCommands && (
-              <div className="space-y-2">
-                <p className="text-xs font-medium text-foreground-secondary">
-                  Installation Commands:
-                </p>
-                <div className="space-y-1">
-                  {status.installCommands.npm && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">npm:</p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.npm}
-                      </code>
-                    </div>
-                  )}
-                </div>
-              </div>
-            )}
-          </div>
-        ) : (
-          <div className="space-y-3">
-            <div className="flex items-start gap-3 p-3 rounded-lg bg-yellow-500/10 border border-yellow-500/20">
-              <AlertCircle className="w-5 h-5 text-yellow-500 mt-0.5 shrink-0" />
-              <div className="flex-1">
-                <p className="text-sm font-medium text-yellow-400">
-                  Codex CLI Not Detected
-                </p>
-                <p className="text-xs text-yellow-400/80 mt-1">
-                  {status.recommendation ||
-                    "Install OpenAI Codex CLI to use GPT-5.1 Codex models for autonomous coding."}
-                </p>
-              </div>
-            </div>
-            {status.installCommands && (
-              <div className="space-y-2">
-                <p className="text-xs font-medium text-foreground-secondary">
-                  Installation Commands:
-                </p>
-                <div className="space-y-1">
-                  {status.installCommands.npm && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">npm:</p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.npm}
-                      </code>
-                    </div>
-                  )}
-                  {status.installCommands.macos && (
-                    <div className="p-2 rounded bg-background border border-border-glass">
-                      <p className="text-xs text-muted-foreground mb-1">
-                        macOS (Homebrew):
-                      </p>
-                      <code className="text-xs text-foreground-secondary font-mono break-all">
-                        {status.installCommands.macos}
-                      </code>
-                    </div>
-                  )}
-                </div>
-              </div>
-            )}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

app/src/components/views/settings-view/danger-zone/danger-zone-section.tsx

@@ -1,6 +1,6 @@
 import { Button } from "@/components/ui/button";
 import { Trash2, Folder } from "lucide-react";
-import type { Project } from "./types";
+import type { Project } from "../types";
 
 interface DangerZoneSectionProps {
   project: Project | null;

app/src/components/views/settings-view/kanban-display/kanban-display-section.tsx

@@ -1,7 +1,7 @@
 import { Button } from "@/components/ui/button";
 import { Label } from "@/components/ui/label";
 import { LayoutGrid, Minimize2, Square, Maximize2 } from "lucide-react";
-import type { KanbanDetailLevel } from "./types";
+import type { KanbanDetailLevel } from "../types";
 
 interface KanbanDisplaySectionProps {
   detailLevel: KanbanDetailLevel;