devintelligence 1.0.0 → 1.0.1

package/src/App.tsx

@@ -1,783 +0,0 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import {
-  LayoutDashboard,
-  FolderSearch,
-  Activity,
-  Smartphone,
-  Cpu,
-  Layers,
-  Code2,
-  Palette,
-  Gauge,
-  ShieldAlert,
-  PackageCheck,
-  Bug,
-  Wrench,
-  Eye,
-  CheckSquare,
-  History,
-  Server,
-  Settings,
-  RefreshCw,
-  Menu,
-  X,
-} from 'lucide-react';
-import {
-  DashboardModuleId,
-  EnvironmentCheckItem,
-  ErrorDiagnosisResult,
-  ProjectIntelligenceReport,
-  QualityGateConfig,
-} from './types/devintelligence.ts';
-import {
-  CommandCenterView,
-  ProjectExplorerView,
-  ProjectHealthView,
-} from './components/OverviewAndExplorerViews.tsx';
-import {
-  ReactNativeDoctorView,
-  AndroidDiagnosticsView,
-  IosDiagnosticsView,
-  ErrorDiagnosticsView,
-} from './components/MobileAndPlatformViews.tsx';
-import {
-  CodeIntelligenceView,
-  DesignIntelligenceView,
-  PerformanceLabView,
-  SecurityAuditView,
-  DependencyIntelligenceView,
-} from './components/DeepAnalysisViews.tsx';
-import {
-  AutoRepairCenterView,
-  VisualTestingView,
-  QualityGateView,
-  ProjectHistoryView,
-  EnvironmentManagerView,
-  SettingsAndMcpView,
-} from './components/RepairAndGateViews.tsx';
-
-interface NavItem {
-  id: DashboardModuleId;
-  label: string;
-  group: 'Core' | 'Mobile & Native' | 'Deep Analysis' | 'Repair & Delivery';
-  icon: React.ComponentType<{ className?: string }>;
-}
-
-const NAVIGATION_MODULES: NavItem[] = [
-  { id: 'command-center', label: 'Command Center', group: 'Core', icon: LayoutDashboard },
-  { id: 'project-explorer', label: 'Project Explorer', group: 'Core', icon: FolderSearch },
-  { id: 'project-health', label: 'Project Health', group: 'Core', icon: Activity },
-  { id: 'rn-doctor', label: 'React Native Doctor', group: 'Mobile & Native', icon: Smartphone },
-  { id: 'android-diagnostics', label: 'Android Diagnostics', group: 'Mobile & Native', icon: Cpu },
-  { id: 'ios-diagnostics', label: 'iOS Diagnostics', group: 'Mobile & Native', icon: Layers },
-  { id: 'code-intelligence', label: 'Code Intelligence', group: 'Deep Analysis', icon: Code2 },
-  { id: 'design-intelligence', label: 'Design Intelligence', group: 'Deep Analysis', icon: Palette },
-  { id: 'performance-lab', label: 'Performance Lab', group: 'Deep Analysis', icon: Gauge },
-  { id: 'security-audit', label: 'Security Audit', group: 'Deep Analysis', icon: ShieldAlert },
-  { id: 'dependency-intelligence', label: 'Dependency Intelligence', group: 'Deep Analysis', icon: PackageCheck },
-  { id: 'error-diagnostics', label: 'Error Diagnostics', group: 'Repair & Delivery', icon: Bug },
-  { id: 'auto-repair', label: 'Auto Repair Center', group: 'Repair & Delivery', icon: Wrench },
-  { id: 'visual-testing', label: 'Visual Testing', group: 'Repair & Delivery', icon: Eye },
-  { id: 'quality-gate', label: 'Quality Gate', group: 'Repair & Delivery', icon: CheckSquare },
-  { id: 'project-history', label: 'Project History', group: 'Repair & Delivery', icon: History },
-  { id: 'environment-manager', label: 'Environment Manager', group: 'Repair & Delivery', icon: Server },
-  { id: 'settings', label: 'Settings', group: 'Repair & Delivery', icon: Settings },
-];
-
-export function App() {
-  const [projects, setProjects] = useState<ProjectIntelligenceReport[]>([]);
-  const [selectedProjectId, setSelectedProjectId] = useState<string>('rn-expo-commerce');
-  const [activeModule, setActiveModule] = useState<DashboardModuleId>('command-center');
-  const [environmentChecks, setEnvironmentChecks] = useState<EnvironmentCheckItem[]>([]);
-  const [mcpTools, setMcpTools] = useState<
-    { name: string; description: string; parameters: string[] }[]
-  >([]);
-  const [presetErrorLogs, setPresetErrorLogs] = useState<
-    { id: string; label: string; ecosystem: string; rawLog: string }[]
-  >([]);
-  const [loading, setLoading] = useState<boolean>(true);
-  const [isBusy, setIsBusy] = useState<boolean>(false);
-  const [statusMessage, setStatusMessage] = useState<string | null>(null);
-  const [mobileNavOpen, setMobileNavOpen] = useState<boolean>(false);
-
-  const loadWorkspace = useCallback(async () => {
-    try {
-      const res = await fetch('/api/devintel/workspace');
-      const data = await res.json();
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      if (Array.isArray(data.environmentChecks)) {
-        setEnvironmentChecks(data.environmentChecks);
-      }
-      if (Array.isArray(data.mcpTools)) {
-        setMcpTools(data.mcpTools);
-      }
-      if (Array.isArray(data.presetErrorLogs)) {
-        setPresetErrorLogs(data.presetErrorLogs);
-      }
-    } catch (err) {
-      console.error('Failed to load DEVINTELLIGENCE workspace:', err);
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    loadWorkspace();
-  }, [loadWorkspace]);
-
-  const activeReport =
-    projects.find((p) => p.id === selectedProjectId) || projects[0] || null;
-
-  async function handleRunScan() {
-    if (!activeReport) return;
-    setIsBusy(true);
-    setStatusMessage(`Scanning ${activeReport.name}...`);
-    try {
-      const res = await fetch(`/api/devintel/projects/${activeReport.id}/scan`, {
-        method: 'POST',
-      });
-      const data = await res.json();
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      setStatusMessage(
-        `Scan completed in ${data.report?.scanDurationMs || 15}ms — ${data.report?.issues?.length ?? 0} findings verified.`
-      );
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleFixIssue(issueId: string, allowReview = false) {
-    if (!activeReport) return;
-    setIsBusy(true);
-    setStatusMessage('Creating backup snapshot and applying repair...');
-    try {
-      const res = await fetch(`/api/devintel/projects/${activeReport.id}/repair`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ issueId, allowReviewTier: allowReview }),
-      });
-      const data = await res.json();
-      if (!res.ok) {
-        setStatusMessage(`Repair blocked: ${data.error}`);
-        return;
-      }
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      setStatusMessage(
-        `Repaired "${data.repairRecord.issueTitle}" and verified fix via re-scan.`
-      );
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleFixAllSafe() {
-    if (!activeReport) return;
-    setIsBusy(true);
-    setStatusMessage('Applying all SAFE repairs with automatic disk backups...');
-    try {
-      const res = await fetch(
-        `/api/devintel/projects/${activeReport.id}/repair-all-safe`,
-        { method: 'POST' }
-      );
-      const data = await res.json();
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      setStatusMessage(
-        `Applied ${data.appliedRepairs?.length || 0} SAFE repair(s) and verified on disk.`
-      );
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleRollbackRepair(repairId: string) {
-    if (!activeReport) return;
-    setIsBusy(true);
-    setStatusMessage('Restoring original file from backup snapshot...');
-    try {
-      const res = await fetch(`/api/devintel/projects/${activeReport.id}/rollback`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ repairId }),
-      });
-      const data = await res.json();
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      setStatusMessage(
-        `Rolled back "${data.restoredRecord?.issueTitle}" and restored original file.`
-      );
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleRegisterProject(name: string, rootPath: string) {
-    setIsBusy(true);
-    try {
-      const res = await fetch('/api/devintel/projects/register', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ name, rootPath }),
-      });
-      const data = await res.json();
-      if (!res.ok) {
-        throw new Error(data.error || 'Failed to register project');
-      }
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      if (data.report?.id) {
-        setSelectedProjectId(data.report.id);
-      }
-      setStatusMessage(`Registered and scanned "${name}" (${data.report?.filesAnalyzed?.length || 0} files).`);
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleUpdateQualityGate(cfg: Partial<QualityGateConfig>) {
-    if (!activeReport) return;
-    setIsBusy(true);
-    try {
-      const res = await fetch(
-        `/api/devintel/projects/${activeReport.id}/quality-gate`,
-        {
-          method: 'PUT',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify(cfg),
-        }
-      );
-      const data = await res.json();
-      if (Array.isArray(data.projects)) {
-        setProjects(data.projects);
-      }
-      setStatusMessage(
-        `Updated Quality Gate thresholds — Status: ${data.updatedReport?.qualityGateEvaluation?.passed ? 'PASSING' : 'FAILING'}`
-      );
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleDiagnoseLog(rawLog: string): Promise<ErrorDiagnosisResult> {
-    const res = await fetch('/api/devintel/diagnose-log', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ rawLog }),
-    });
-    return res.json();
-  }
-
-  async function handleRefreshEnvironment() {
-    setIsBusy(true);
-    try {
-      const res = await fetch('/api/devintel/environment/refresh', {
-        method: 'POST',
-      });
-      const data = await res.json();
-      if (Array.isArray(data.environmentChecks)) {
-        setEnvironmentChecks(data.environmentChecks);
-      }
-      setStatusMessage('Re-probed host operating system and developer binaries.');
-    } finally {
-      setIsBusy(false);
-    }
-  }
-
-  async function handleCallMcpTool(
-    toolName: string,
-    args: Record<string, string>
-  ): Promise<unknown> {
-    const res = await fetch('/api/devintel/mcp/call', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ toolName, args }),
-    });
-    const data = await res.json();
-    if (Array.isArray(data.projects)) {
-      setProjects(data.projects);
-    }
-    return data.output;
-  }
-
-  if (loading || !activeReport) {
-    return (
-      <div className="min-h-screen bg-[#090D16] text-slate-100 flex items-center justify-center p-6">
-        <div className="text-center space-y-2">
-          <div className="text-sm font-semibold tracking-wide text-slate-200">
-            DEVINTELLIGENCE
-          </div>
-          <div className="text-xs text-slate-400 font-mono">
-            Initializing local engineering intelligence engines...
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  const groups = ['Core', 'Mobile & Native', 'Deep Analysis', 'Repair & Delivery'] as const;
-
-  return (
-    <div className="min-h-screen bg-[#090D16] text-slate-100 flex flex-col">
-      {/* Top Bar Contract: 3 Zones Separated by gap-8 */}
-      <header className="flex items-center justify-between gap-8 px-6 py-3.5 bg-[#090D16] border-b border-slate-800/90 sticky top-0 z-30">
-        {/* Zone 1: Single text element wordmark */}
-        <a
-          href="#top"
-          onClick={(e) => {
-            e.preventDefault();
-            setActiveModule('command-center');
-          }}
-          className="text-base font-bold tracking-tight text-slate-100 whitespace-nowrap shrink-0"
-        >
-          DEVINTELLIGENCE
-        </a>
-
-        {/* Zone 2: 5 concise single-line text navigation links */}
-        <nav
-          aria-label="Primary Shortcuts"
-          className="hidden md:flex items-center gap-6 text-xs font-medium text-slate-400"
-        >
-          <a
-            href="#command-center"
-            onClick={(e) => {
-              e.preventDefault();
-              setActiveModule('command-center');
-            }}
-            className={`hover:text-slate-100 hover:underline underline-offset-4 transition-colors whitespace-nowrap shrink-0 ${
-              activeModule === 'command-center' ? 'text-slate-100' : ''
-            }`}
-          >
-            Command Center
-          </a>
-          <a
-            href="#rn-doctor"
-            onClick={(e) => {
-              e.preventDefault();
-              setActiveModule('rn-doctor');
-            }}
-            className={`hover:text-slate-100 hover:underline underline-offset-4 transition-colors whitespace-nowrap shrink-0 ${
-              activeModule === 'rn-doctor' ? 'text-slate-100' : ''
-            }`}
-          >
-            React Native Doctor
-          </a>
-          <a
-            href="#auto-repair"
-            onClick={(e) => {
-              e.preventDefault();
-              setActiveModule('auto-repair');
-            }}
-            className={`hover:text-slate-100 hover:underline underline-offset-4 transition-colors whitespace-nowrap shrink-0 ${
-              activeModule === 'auto-repair' ? 'text-slate-100' : ''
-            }`}
-          >
-            Auto Repair Center
-          </a>
-          <a
-            href="#error-diagnostics"
-            onClick={(e) => {
-              e.preventDefault();
-              setActiveModule('error-diagnostics');
-            }}
-            className={`hover:text-slate-100 hover:underline underline-offset-4 transition-colors whitespace-nowrap shrink-0 ${
-              activeModule === 'error-diagnostics' ? 'text-slate-100' : ''
-            }`}
-          >
-            Error Diagnostics
-          </a>
-          <a
-            href="#quality-gate"
-            onClick={(e) => {
-              e.preventDefault();
-              setActiveModule('quality-gate');
-            }}
-            className={`hover:text-slate-100 hover:underline underline-offset-4 transition-colors whitespace-nowrap shrink-0 ${
-              activeModule === 'quality-gate' ? 'text-slate-100' : ''
-            }`}
-          >
-            Quality Gate
-          </a>
-        </nav>
-
-        {/* Zone 3: 1 Primary Action */}
-        <div className="flex items-center gap-3 shrink-0">
-          <button
-            type="button"
-            disabled={isBusy}
-            onClick={handleRunScan}
-            className="px-4 py-2 text-xs font-semibold text-white bg-blue-600 hover:bg-blue-500 disabled:opacity-50 rounded-lg transition-colors whitespace-nowrap shrink-0 cursor-pointer"
-          >
-            {isBusy ? 'Scanning...' : 'Run Deep Scan'}
-          </button>
-        </div>
-      </header>
-
-      {/* Main Workstation Layout: Sidebar + Content Viewport */}
-      <div className="flex-1 flex min-h-0">
-        {/* Sidebar Navigation (Desktop 256px) */}
-        <aside
-          aria-label="Workstation Modules"
-          className="hidden lg:flex lg:flex-col w-64 shrink-0 bg-[#0B101B] border-r border-slate-800/80 py-5 px-3 space-y-6 overflow-y-auto"
-        >
-          <div className="px-3 space-y-1.5">
-            <label
-              htmlFor="sidebar-project-select"
-              className="block text-[11px] font-medium text-slate-400"
-            >
-              Active Local Project
-            </label>
-            <select
-              id="sidebar-project-select"
-              value={activeReport.id}
-              onChange={(e) => setSelectedProjectId(e.target.value)}
-              className="w-full px-2.5 py-2 text-xs font-medium bg-slate-900 border border-slate-800 rounded-md text-slate-100 focus:outline-none focus:border-blue-500"
-            >
-              {projects.map((p) => (
-                <option key={p.id} value={p.id}>
-                  {p.name}
-                </option>
-              ))}
-            </select>
-            <div className="text-[11px] text-slate-500 font-mono pt-0.5">
-              Understand. Diagnose. Repair. Optimize.
-            </div>
-          </div>
-
-          {groups.map((grp) => (
-            <div key={grp} className="space-y-1">
-              <div className="px-3 text-[11px] font-medium text-slate-500">
-                {grp}
-              </div>
-              {NAVIGATION_MODULES.filter((m) => m.group === grp).map((mod) => {
-                const Icon = mod.icon;
-                const isActive = activeModule === mod.id;
-                return (
-                  <button
-                    key={mod.id}
-                    type="button"
-                    onClick={() => setActiveModule(mod.id)}
-                    className={`w-full flex items-center gap-2.5 px-3 py-2 rounded-md text-xs font-medium transition-colors cursor-pointer whitespace-nowrap ${
-                      isActive
-                        ? 'bg-blue-600/15 text-blue-400'
-                        : 'text-slate-400 hover:text-slate-100 hover:bg-slate-800/50'
-                    }`}
-                  >
-                    <Icon className="w-4 h-4 shrink-0" />
-                    <span className="truncate">{mod.label}</span>
-                  </button>
-                );
-              })}
-            </div>
-          ))}
-        </aside>
-
-        {/* Main Workspace Content Area */}
-        <div className="flex-1 flex flex-col min-w-0">
-          {/* Contextual Sub-Toolbar for Mobile Navigation & Active Project Context */}
-          <div className="px-6 py-3 bg-[#0B101B] border-b border-slate-800/80 flex flex-wrap items-center justify-between gap-3">
-            <div className="flex items-center gap-3">
-              <button
-                type="button"
-                aria-label="Toggle Modules Menu"
-                onClick={() => setMobileNavOpen(!mobileNavOpen)}
-                className="lg:hidden inline-flex items-center gap-1.5 px-2.5 py-1.5 text-xs font-medium text-slate-200 bg-slate-900 border border-slate-800 rounded"
-              >
-                {mobileNavOpen ? <X className="w-4 h-4" /> : <Menu className="w-4 h-4" />}
-                <span>Modules</span>
-              </button>
-
-              <div className="text-xs text-slate-400 font-mono">
-                <span className="text-slate-300 font-semibold">
-                  {NAVIGATION_MODULES.find((m) => m.id === activeModule)?.label}
-                </span>
-                <span className="mx-2 text-slate-600">/</span>
-                <span>{activeReport.id}</span>
-              </div>
-            </div>
-
-            <div className="flex items-center gap-3 min-w-0">
-              {statusMessage && (
-                <div
-                  role="status"
-                  className="text-xs text-blue-300 font-mono truncate max-w-[240px] sm:max-w-md"
-                >
-                  {statusMessage}
-                </div>
-              )}
-              <div className="lg:hidden">
-                <label htmlFor="mobile-project-select" className="sr-only">
-                  Select Active Project
-                </label>
-                <select
-                  id="mobile-project-select"
-                  value={activeReport.id}
-                  onChange={(e) => setSelectedProjectId(e.target.value)}
-                  className="px-2.5 py-1.5 text-xs bg-slate-900 border border-slate-800 rounded text-slate-100"
-                >
-                  {projects.map((p) => (
-                    <option key={p.id} value={p.id}>
-                      {p.name}
-                    </option>
-                  ))}
-                </select>
-              </div>
-            </div>
-          </div>
-
-          {/* Mobile Drawer Navigation */}
-          {mobileNavOpen && (
-            <div className="lg:hidden bg-slate-900 border-b border-slate-800 p-4 grid grid-cols-2 sm:grid-cols-3 gap-2">
-              {NAVIGATION_MODULES.map((mod) => {
-                const Icon = mod.icon;
-                return (
-                  <button
-                    key={mod.id}
-                    type="button"
-                    onClick={() => {
-                      setActiveModule(mod.id);
-                      setMobileNavOpen(false);
-                    }}
-                    className={`flex items-center gap-2 px-3 py-2 rounded text-xs font-medium text-left ${
-                      activeModule === mod.id
-                        ? 'bg-blue-600 text-white'
-                        : 'text-slate-300 hover:bg-slate-800'
-                    }`}
-                  >
-                    <Icon className="w-3.5 h-3.5 shrink-0" />
-                    <span className="truncate">{mod.label}</span>
-                  </button>
-                );
-              })}
-            </div>
-          )}
-
-          {/* Active Module Viewport */}
-          <main className="flex-1 p-6 lg:p-8 max-w-7xl w-full mx-auto">
-            {activeModule === 'command-center' && (
-              <CommandCenterView
-                report={activeReport}
-                allProjects={projects}
-                onSelectProject={setSelectedProjectId}
-                onNavigateModule={setActiveModule}
-                onRunScan={handleRunScan}
-                onFixAllSafe={handleFixAllSafe}
-                onFixIssue={handleFixIssue}
-                onRegisterProject={handleRegisterProject}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'project-explorer' && (
-              <ProjectExplorerView
-                report={activeReport}
-                allProjects={projects}
-                onSelectProject={setSelectedProjectId}
-                onNavigateModule={setActiveModule}
-                onRunScan={handleRunScan}
-                onFixAllSafe={handleFixAllSafe}
-                onFixIssue={handleFixIssue}
-                onRegisterProject={handleRegisterProject}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'project-health' && (
-              <ProjectHealthView
-                report={activeReport}
-                allProjects={projects}
-                onSelectProject={setSelectedProjectId}
-                onNavigateModule={setActiveModule}
-                onRunScan={handleRunScan}
-                onFixAllSafe={handleFixAllSafe}
-                onFixIssue={handleFixIssue}
-                onRegisterProject={handleRegisterProject}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'rn-doctor' && (
-              <ReactNativeDoctorView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                presetErrorLogs={presetErrorLogs}
-                onDiagnoseLog={handleDiagnoseLog}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'android-diagnostics' && (
-              <AndroidDiagnosticsView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                presetErrorLogs={presetErrorLogs}
-                onDiagnoseLog={handleDiagnoseLog}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'ios-diagnostics' && (
-              <IosDiagnosticsView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                presetErrorLogs={presetErrorLogs}
-                onDiagnoseLog={handleDiagnoseLog}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'code-intelligence' && (
-              <CodeIntelligenceView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'design-intelligence' && (
-              <DesignIntelligenceView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'performance-lab' && (
-              <PerformanceLabView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'security-audit' && (
-              <SecurityAuditView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'dependency-intelligence' && (
-              <DependencyIntelligenceView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'error-diagnostics' && (
-              <ErrorDiagnosticsView
-                report={activeReport}
-                onFixIssue={handleFixIssue}
-                presetErrorLogs={presetErrorLogs}
-                onDiagnoseLog={handleDiagnoseLog}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'auto-repair' && (
-              <AutoRepairCenterView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'visual-testing' && (
-              <VisualTestingView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'quality-gate' && (
-              <QualityGateView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'project-history' && (
-              <ProjectHistoryView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'environment-manager' && (
-              <EnvironmentManagerView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-
-            {activeModule === 'settings' && (
-              <SettingsAndMcpView
-                report={activeReport}
-                environmentChecks={environmentChecks}
-                mcpTools={mcpTools}
-                onFixIssue={handleFixIssue}
-                onFixAllSafe={handleFixAllSafe}
-                onRollbackRepair={handleRollbackRepair}
-                onUpdateQualityGate={handleUpdateQualityGate}
-                onRefreshEnvironment={handleRefreshEnvironment}
-                onCallMcpTool={handleCallMcpTool}
-                isBusy={isBusy}
-              />
-            )}
-          </main>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default App;