feat: add AI auto-fix UI — types, API client, ValidationSummary button, review modal, and TreeEditorPage wiring

- New ai-fix.ts types for request/response
- fixTree() method on treesApi
- "Fix with AI" button in ValidationSummary (shows for fixable errors)
- AIFixReviewModal with per-fix apply/skip and apply-all
- TreeEditorPage orchestrates the fix flow

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/tree-editor/ValidationSummary.tsx

@@ -1,14 +1,16 @@
 import { useState } from 'react'
-import { AlertCircle, AlertTriangle, ChevronDown, ChevronUp } from 'lucide-react'
+import { AlertCircle, AlertTriangle, ChevronDown, ChevronUp, Sparkles, Loader2 } from 'lucide-react'
 import { cn } from '@/lib/utils'
 import type { ValidationError } from '@/store/treeEditorStore'
 
 interface ValidationSummaryProps {
   errors: ValidationError[]
   onSelectNode: (nodeId: string) => void
+  onFixWithAI?: () => void
+  isFixing?: boolean
 }
 
-export function ValidationSummary({ errors, onSelectNode }: ValidationSummaryProps) {
+export function ValidationSummary({ errors, onSelectNode, onFixWithAI, isFixing }: ValidationSummaryProps) {
   const [isExpanded, setIsExpanded] = useState(true)
 
   const errorItems = errors.filter(e => e.severity === 'error')
@@ -22,6 +24,8 @@ export function ValidationSummary({ errors, onSelectNode }: ValidationSummaryPro
     }
   }
 
+  const hasFixableErrors = errorItems.some(e => e.nodeId)
+
   return (
     <div
       className={cn(
@@ -32,14 +36,16 @@ export function ValidationSummary({ errors, onSelectNode }: ValidationSummaryPro
       )}
     >
       {/* Header */}
-      <button
-        onClick={() => setIsExpanded(!isExpanded)}
+      <div
         className={cn(
-          'flex w-full items-center justify-between p-3 text-left transition-colors hover:bg-accent',
+          'flex w-full items-center justify-between p-3 transition-colors',
           errorItems.length > 0 ? 'text-red-400' : 'text-yellow-400'
         )}
       >
-        <div className="flex items-center gap-2">
+        <button
+          onClick={() => setIsExpanded(!isExpanded)}
+          className="flex items-center gap-2 text-left hover:opacity-80"
+        >
           {errorItems.length > 0 ? (
             <AlertCircle className="h-5 w-5" />
           ) : (
@@ -58,9 +64,35 @@ export function ValidationSummary({ errors, onSelectNode }: ValidationSummaryPro
               </>
             )}
           </span>
-        </div>
-        {isExpanded ? <ChevronUp className="h-4 w-4" /> : <ChevronDown className="h-4 w-4" />}
-      </button>
+          {isExpanded ? <ChevronUp className="h-4 w-4" /> : <ChevronDown className="h-4 w-4" />}
+        </button>
+
+        {/* Fix with AI button */}
+        {onFixWithAI && hasFixableErrors && (
+          <button
+            onClick={onFixWithAI}
+            disabled={isFixing}
+            className={cn(
+              'flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors',
+              isFixing
+                ? 'bg-primary/10 text-primary cursor-wait'
+                : 'bg-gradient-brand text-white shadow-sm shadow-primary/20 hover:opacity-90'
+            )}
+          >
+            {isFixing ? (
+              <>
+                <Loader2 className="h-3 w-3 animate-spin" />
+                Generating fixes...
+              </>
+            ) : (
+              <>
+                <Sparkles className="h-3 w-3" />
+                Fix with AI
+              </>
+            )}
+          </button>
+        )}
+      </div>
 
       {/* Error/Warning List */}
       {isExpanded && (