spine-framework 0.3.124 → 0.3.126

package/.framework/src/pages/admin/cil/CILProjectsPage.tsx

@@ -0,0 +1,614 @@
+// CIL[BEGIN chunk_id="cilprojectspage_module_header_1784193942" type="module_header" identity="module_header" parent="none"]
+// CIL[DOC-MACRO purpose="Import dependencies and icons for the CIL projects page"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provides module imports and icon references used by CILProjectsPage"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="none" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Imports React hooks, router, apiFetch, useAppPath, shadcn UI components, and lucide icons" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-AUDIENCE audience="developer"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: custom/apps/cortex/pages/operations/OperationsDashboard.tsx, custom/apps/portal/pages/ContentPage.tsx, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/src/pages/admin/RolesPage.tsx, \."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+import { useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { apiFetch } from '@core/lib/api'
+import { Card, CardContent, CardHeader, CardTitle } from '@core/components/ui/card'
+import { Button } from '@core/components/ui/button'
+import { Badge } from '@core/components/ui/badge'
+import { Skeleton } from '@core/components/ui/skeleton'
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+} from '@core/components/ui/dialog'
+import { Input } from '@core/components/ui/input'
+import { Label } from '@core/components/ui/label'
+import { Textarea } from '@core/components/ui/textarea'
+import { NativeSelect, NativeSelectOption } from '@core/components/ui/native-select'
+import { FolderGit2, Plus, Play, CheckCircle2, Clock, AlertCircle, GitGraph, LayoutDashboard, Trash2, Layers, Pencil, X } from 'lucide-react'
+
+import { PageInstructions } from '../../../components/admin/PageInstructions'
+// CIL[END chunk_id="cilprojectspage_module_header_1784193942"]
+// CIL[BEGIN chunk_id="cilprojectspage_sourceset_1784193942" type="interface" identity="SourceSet" parent="none"]
+// CIL[DOC-MACRO purpose="Declare the SourceSet data shape for ingestion configuration"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provides the TypeScript contract for a named source set within a CIL project"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/functions/_shared/principal.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\".framework/functions/_shared/schema-utils.ts\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="SourceSet type definition" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Defines id, name, base_path, and optional globs, exclude_globs, and layer fields" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/functions/_shared/principal.ts, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/src/pages/admin/IntegrationsPage.tsx, .framework/functions/_shared/schema-utils.ts, \."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+interface SourceSet {
+  id: string
+  name: string
+  base_path: string
+  globs?: string
+  exclude_globs?: string
+  layer?: string
+}
+
+// CIL[END chunk_id="cilprojectspage_sourceset_1784193942"]
+// CIL[BEGIN chunk_id="cilprojectspage_cilproject_1784193942" type="interface" identity="CILProject" parent="none"]
+// CIL[DOC-MACRO purpose="Declare the CILProject data shape for project listing and management"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provides the TypeScript contract for CIL project records including ingestion metadata"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/functions/_shared/principal.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="CILProject type definition" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Defines id, title, description, status, and nested data with repo, language mix, status, counts, cost, timestamps, source sets, and dependencies" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: custom/apps/cortex/pages/operations/OperationsDashboard.tsx, custom/apps/portal/pages/ContentPage.tsx, .framework/functions/_shared/principal.ts, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/src/pages/admin/IntegrationsPage.tsx, \."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+interface CILProject {
+  id: string
+  title: string
+  description: string
+  status: string
+  data: {
+    repo_path: string
+    language_mix: string
+    ingestion_status: 'not_started' | 'in_progress' | 'complete'
+    file_count: number
+    chunk_count: number
+    total_ingestion_cost_usd: number
+    last_ingested_at: string | null
+    source_sets?: SourceSet[]
+    dependencies?: string[]
+  }
+  created_at: string
+}
+
+// CIL[END chunk_id="cilprojectspage_cilproject_1784193942"]
+// CIL[BEGIN chunk_id="cilprojectspage_status_badge_1784193942" type="constant" identity="STATUS_BADGE" parent="none"]
+// CIL[DOC-MACRO purpose="Map ingestion status strings to badge labels and variants"]
+// CIL[DOC-RESPONSIBILITY responsibility="Supplies visual badge configuration for project ingestion status"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[\".framework/src/pages/admin/RolesPage.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/functions/custom_cil-embeddings.ts\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="STATUS_BADGE mapping" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Maps not_started, in_progress, and complete to label text and shadcn Badge variant values" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: .framework/src/pages/admin/RolesPage.tsx, custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/functions/custom_cil-embeddings.ts, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, \."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+const STATUS_BADGE: Record<string, { label: string; variant: 'default' | 'secondary' | 'outline' }> = {
+  not_started: { label: 'Not Started', variant: 'outline' },
+  in_progress: { label: 'In Progress', variant: 'secondary' },
+  complete: { label: 'Complete', variant: 'default' },
+}
+
+// CIL[END chunk_id="cilprojectspage_status_badge_1784193942"]
+// CIL[BEGIN chunk_id="cilprojectspage_status_icon_1784193942" type="constant" identity="STATUS_ICON" parent="none"]
+// CIL[DOC-MACRO purpose="Map ingestion status strings to icon components"]
+// CIL[DOC-RESPONSIBILITY responsibility="Supplies the icon component used for each project ingestion status"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="STATUS_ICON mapping of React.ElementType" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Maps not_started to Clock, in_progress to AlertCircle, and complete to CheckCircle2" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: none."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+const STATUS_ICON: Record<string, React.ElementType> = {
+  not_started: Clock,
+  in_progress: AlertCircle,
+  complete: CheckCircle2,
+}
+
+// CIL[END chunk_id="cilprojectspage_status_icon_1784193942"]
+// CIL[BEGIN chunk_id="cilprojectspage_cilprojectspage_1784193942" type="component" identity="CILProjectsPage" parent="none"]
+// CIL[DOC-MACRO purpose="Render the CIL projects list with creation, editing, and deletion workflows"]
+// CIL[DOC-RESPONSIBILITY responsibility="Manage CIL project list state and render project cards, dialogs, and navigation"]
+// CIL[DOC-CONTEXT module="cortex:cil-projects" layer="presentation" related_files="[]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="JSX.Element" errors="API errors are silently caught; required fields block save" side_effects="Calls /api/cil-project actions and navigates to /cil/:id routes"]
+// CIL[DOC-MICRO logic_summary="Fetches projects on mount, displays loading/empty/card states, manages create/edit form with source sets, and navigates to ingest, dashboard, files, and graph pages" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: presentation. Direct callers: 0. Direct calls: 0. Related files: none."]
+// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
+// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
+// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
+export default function CILProjectsPage() {
+  const navigate = useNavigate()
+  const appPath = (path: string) => '/spine-framework/admin' + (path.startsWith('/') ? path : '/' + path)
+  const [projects, setProjects] = useState<CILProject[]>([])
+  const [loading, setLoading] = useState(true)
+  const [showCreate, setShowCreate] = useState(false)
+  const [creating, setCreating] = useState(false)
+  const [confirmDeleteId, setConfirmDeleteId] = useState<string | null>(null)
+  const [deleting, setDeleting] = useState(false)
+  const [form, setForm] = useState({ name: '', description: '', repo_path: '', language_mix: '', source_sets: [] as SourceSet[] })
+  const [editingProjectId, setEditingProjectId] = useState<string | null>(null)
+
+  const fetchProjects = () => {
+    setLoading(true)
+    apiFetch('/api/cil-project?action=list')
+      .then(r => r.json())
+      .then(data => setProjects(data?.projects || data?.data?.projects || []))
+      .catch(() => {})
+      .finally(() => setLoading(false))
+  }
+
+  useEffect(() => { fetchProjects() }, [])
+
+  const handleSave = async () => {
+    if (!form.name || !form.repo_path) return
+    setCreating(true)
+    try {
+      const payload: Record<string, any> = {
+        name: form.name,
+        description: form.description,
+        repo_path: form.repo_path,
+        language_mix: form.language_mix,
+      }
+      if (form.source_sets && form.source_sets.length > 0) {
+        payload.source_sets = form.source_sets.map(ss => ({
+          ...ss,
+          globs: ss.globs ? ss.globs.split(',').map(s => s.trim()).filter(Boolean) : undefined,
+          exclude_globs: ss.exclude_globs ? ss.exclude_globs.split(',').map(s => s.trim()).filter(Boolean) : undefined,
+        }))
+      }
+
+      let res: Response
+      if (editingProjectId) {
+        res = await apiFetch(`/api/cil-project?action=update&id=${editingProjectId}`, {
+          method: 'PATCH',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ data: payload }),
+        })
+      } else {
+        res = await apiFetch('/api/cil-project?action=create', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify(payload),
+        })
+      }
+
+      const data = await res.json()
+      const newId = data?.project?.id || data?.data?.project?.id
+      setShowCreate(false)
+      setEditingProjectId(null)
+      setForm({ name: '', description: '', repo_path: '', language_mix: '', source_sets: [] })
+      if (newId && !editingProjectId) {
+        navigate(appPath(`/cil/${newId}/ingest`))
+      } else {
+        fetchProjects()
+      }
+    } catch {
+    } finally {
+      setCreating(false)
+    }
+  }
+
+  const openCreate = () => {
+    setEditingProjectId(null)
+    setForm({ name: '', description: '', repo_path: '', language_mix: '', source_sets: [] })
+    setShowCreate(true)
+  }
+
+  const openEdit = (project: CILProject) => {
+    setEditingProjectId(project.id)
+    setForm({
+      name: project.title,
+      description: project.description,
+      repo_path: project.data?.repo_path || '',
+      language_mix: project.data?.language_mix || '',
+      source_sets: (project.data?.source_sets || []).map(ss => ({
+        ...ss,
+        globs: Array.isArray(ss.globs) ? ss.globs.join(', ') : ss.globs || '',
+        exclude_globs: Array.isArray(ss.exclude_globs) ? ss.exclude_globs.join(', ') : ss.exclude_globs || '',
+      })),
+    })
+    openCreate()
+  }
+
+  const handleDeleteProject = async () => {
+    if (!confirmDeleteId) return
+    setDeleting(true)
+    try {
+      await apiFetch(`/api/cil-project?action=delete&id=${confirmDeleteId}`, {
+        method: 'DELETE',
+      })
+      setConfirmDeleteId(null)
+      fetchProjects()
+    } catch {
+    } finally {
+      setDeleting(false)
+    }
+  }
+
+  return (
+    <div className="p-6 space-y-6">
+      <div className="flex items-center justify-between">
+        <div>
+          <h1 className="text-2xl font-bold flex items-center gap-2">
+            <FolderGit2 className="h-6 w-6 text-indigo-500" />
+            Code Intelligence Layer
+          </h1>
+          <p className="text-muted-foreground text-sm mt-1">
+            Register codebases, run ingestion passes, and query the code graph
+          </p>
+        </div>
+        <Button onClick={() => openCreate()}>
+          <Plus className="h-4 w-4 mr-2" />
+          New Project
+        </Button>
+      </div>
+
+      <PageInstructions
+        description="Manage CIL projects and registered codebases."
+        sections={[
+          { title: 'What this page is for', content: 'Projects represent codebases that the CIL has indexed. This page lists all projects, their ingestion status, and quick stats.' },
+          { title: 'How to read this page', content: 'Each card shows the project title, repository path, status badge, and counts for files, chunks, and cumulative ingestion cost. Click a card to open the project.' },
+          { title: 'How to create / manage', content: 'Click New Project to register a codebase. Open a project to run ingestion, inspect the graph, or use the agent. Use the dashboard or ingestion tabs for detailed status.' },
+          { title: 'Important notes', content: 'The status badge reflects the latest ingestion pass. Costs are cumulative across all runs and include embedding and documentation generation.' },
+        ]}
+      />
+
+      {loading ? (
+        <div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
+          {[1, 2, 3].map(i => <Skeleton key={i} className="h-44 rounded-xl" />)}
+        </div>
+      ) : projects.length === 0 ? (
+        <div className="flex flex-col items-center justify-center py-24 text-center space-y-3">
+          <FolderGit2 className="h-12 w-12 text-muted-foreground/40" />
+          <p className="text-muted-foreground">No projects yet. Register a codebase to get started.</p>
+          <Button variant="outline" onClick={() => openCreate()}>
+            <Plus className="h-4 w-4 mr-2" />
+            New Project
+          </Button>
+        </div>
+      ) : (
+        <div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
+          {projects.map(project => {
+            const ingestionStatus = project.data?.ingestion_status || 'not_started'
+            const { label, variant } = STATUS_BADGE[ingestionStatus] || STATUS_BADGE.not_started
+            const StatusIcon = STATUS_ICON[ingestionStatus] || Clock
+
+            return (
+              <Card
+                key={project.id}
+                className="cursor-pointer hover:shadow-md transition-shadow"
+                onClick={() => navigate(appPath(`/cil/${project.id}/ingest`))}
+              >
+                <CardHeader className="pb-2">
+                  <div className="flex items-start justify-between gap-2">
+                    <CardTitle className="text-base">{project.title}</CardTitle>
+                    <Badge variant={variant} className="shrink-0 flex items-center gap-1">
+                      <StatusIcon className="h-3 w-3" />
+                      {label}
+                    </Badge>
+                  </div>
+                  <p className="text-xs text-muted-foreground font-mono truncate">
+                    {project.data?.repo_path || '—'}
+                  </p>
+                </CardHeader>
+                <CardContent className="space-y-3">
+                  {project.description && (
+                    <p className="text-sm text-muted-foreground line-clamp-2">{project.description}</p>
+                  )}
+                  <div className="grid grid-cols-3 gap-2 pt-1">
+                    <div className="text-center">
+                      <div className="text-xl font-bold">{project.data?.file_count ?? 0}</div>
+                      <div className="text-xs text-muted-foreground">Files</div>
+                    </div>
+                    <div className="text-center">
+                      <div className="text-xl font-bold">{project.data?.chunk_count ?? 0}</div>
+                      <div className="text-xs text-muted-foreground">Chunks</div>
+                    </div>
+                    <div className="text-center">
+                      <div className="text-xl font-bold">
+                        ${(project.data?.total_ingestion_cost_usd ?? 0).toFixed(2)}
+                      </div>
+                      <div className="text-xs text-muted-foreground">Cost</div>
+                    </div>
+                  </div>
+                  {project.data?.language_mix && (
+                    <p className="text-xs text-muted-foreground">{project.data.language_mix}</p>
+                  )}
+                  <div className="flex gap-2">
+                    <Button
+                      size="sm"
+                      variant="outline"
+                      className="flex-1"
+                      onClick={e => {
+                        e.stopPropagation()
+                        navigate(appPath(`/cil/${project.id}/ingest`))
+                      }}
+                    >
+                      <Play className="h-3 w-3 mr-1" />
+                      Run Pipeline
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      className="px-2"
+                      onClick={e => {
+                        e.stopPropagation()
+                        navigate(appPath(`/cil/${project.id}/dashboard`))
+                      }}
+                      title="Dashboard"
+                    >
+                      <LayoutDashboard className="h-3.5 w-3.5" />
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      className="px-2"
+                      onClick={e => {
+                        e.stopPropagation()
+                        navigate(appPath(`/cil/${project.id}/files`))
+                      }}
+                      title="Browse Files"
+                    >
+                      <Layers className="h-3.5 w-3.5" />
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      className="px-2"
+                      onClick={e => {
+                        e.stopPropagation()
+                        navigate(appPath(`/cil/${project.id}/graph`))
+                      }}
+                      title="View Graph"
+                    >
+                      <GitGraph className="h-3.5 w-3.5" />
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      className="px-2"
+                      onClick={e => {
+                        e.stopPropagation()
+                        openEdit(project)
+                      }}
+                      title="Edit project"
+                    >
+                      <Pencil className="h-3.5 w-3.5" />
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      className="px-2 text-destructive hover:text-destructive hover:bg-destructive/10"
+                      onClick={e => {
+                        e.stopPropagation()
+                        setConfirmDeleteId(project.id)
+                      }}
+                      title="Delete project"
+                    >
+                      <Trash2 className="h-3.5 w-3.5" />
+                    </Button>
+                  </div>
+                </CardContent>
+              </Card>
+            )
+          })}
+        </div>
+      )}
+
+      {}
+      <Dialog open={showCreate} onOpenChange={open => { if (!open) { setEditingProjectId(null); setForm({ name: '', description: '', repo_path: '', language_mix: '', source_sets: [] }) } setShowCreate(open) }}>
+        <DialogContent className="max-w-2xl max-h-[85vh] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle>{editingProjectId ? 'Edit CIL Project' : 'Register New CIL Project'}</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4 py-2">
+            <div className="space-y-1.5">
+              <Label htmlFor="name">Project Name *</Label>
+              <Input
+                id="name"
+                placeholder="spine-ia"
+                value={form.name}
+                onChange={e => setForm(f => ({ ...f, name: e.target.value }))}
+              />
+            </div>
+            <div className="space-y-1.5">
+              <Label htmlFor="repo_path">Repository Path *</Label>
+              <Input
+                id="repo_path"
+                placeholder="/Users/thistle/CascadeProjects/spine-ia"
+                value={form.repo_path}
+                onChange={e => setForm(f => ({ ...f, repo_path: e.target.value }))}
+              />
+              <p className="text-xs text-muted-foreground">Absolute path to the repository root on the agent's filesystem</p>
+            </div>
+            {editingProjectId && (
+              <>
+                <div className="space-y-1.5">
+                  <Label htmlFor="language_mix">Languages</Label>
+                  <Input
+                    id="language_mix"
+                    placeholder="TypeScript, SQL"
+                    value={form.language_mix}
+                    onChange={e => setForm(f => ({ ...f, language_mix: e.target.value }))}
+                  />
+                </div>
+                <div className="space-y-1.5">
+                  <Label htmlFor="description">Description</Label>
+                  <Textarea
+                    id="description"
+                    placeholder="Spine framework — multi-tenant SaaS platform"
+                    value={form.description}
+                    onChange={e => setForm(f => ({ ...f, description: e.target.value }))}
+                    rows={3}
+                  />
+                </div>
+              </>
+            )}
+
+            {}
+            {editingProjectId && <div className="space-y-2 pt-2 border-t">
+              <div className="flex items-center justify-between">
+                <Label>Source Sets</Label>
+                <Button
+                  type="button"
+                  size="sm"
+                  variant="outline"
+                  onClick={() => setForm(f => ({
+                    ...f,
+                    source_sets: [...f.source_sets, { id: crypto.randomUUID(), name: '', base_path: '', globs: '', exclude_globs: '', layer: 'app-specific' }],
+                  }))}
+                >
+                  <Plus className="h-3 w-3 mr-1" /> Add Source Set
+                </Button>
+              </div>
+              <p className="text-xs text-muted-foreground">
+                Optional. Leave empty to use the default globs. Each source set defines a base path relative to the repo root, its own globs/excludes, and an architectural layer.
+              </p>
+              {form.source_sets.length === 0 && (
+                <p className="text-xs text-muted-foreground italic">No source sets — default globs will be used.</p>
+              )}
+              {form.source_sets.map((ss, idx) => (
+                <div key={ss.id} className="border rounded-md p-3 space-y-2 bg-muted/30">
+                  <div className="flex items-center justify-between gap-2">
+                    <Input
+                      placeholder="Set name"
+                      value={ss.name}
+                      onChange={e => setForm(f => {
+                        const next = [...f.source_sets]
+                        next[idx] = { ...next[idx], name: e.target.value }
+                        return { ...f, source_sets: next }
+                      })}
+                      className="text-sm"
+                    />
+                    <Button
+                      type="button"
+                      size="sm"
+                      variant="ghost"
+                      className="text-destructive hover:text-destructive hover:bg-destructive/10 shrink-0"
+                      onClick={() => setForm(f => ({ ...f, source_sets: f.source_sets.filter((_, i) => i !== idx) }))}
+                    >
+                      <X className="h-3.5 w-3.5" />
+                    </Button>
+                  </div>
+                  <div className="grid grid-cols-2 gap-2">
+                    <Input
+                      placeholder="Base path (relative to repo)"
+                      value={ss.base_path}
+                      onChange={e => setForm(f => {
+                        const next = [...f.source_sets]
+                        next[idx] = { ...next[idx], base_path: e.target.value }
+                        return { ...f, source_sets: next }
+                      })}
+                      className="text-xs font-mono"
+                    />
+                    <NativeSelect
+                      value={ss.layer || 'app-specific'}
+                      onChange={e => setForm(f => {
+                        const next = [...f.source_sets]
+                        next[idx] = { ...next[idx], layer: e.target.value }
+                        return { ...f, source_sets: next }
+                      })}
+                      className="text-xs"
+                    >
+                      <NativeSelectOption value="shared-core">shared-core</NativeSelectOption>
+                      <NativeSelectOption value="app-specific">app-specific</NativeSelectOption>
+                      <NativeSelectOption value="infrastructure">infrastructure</NativeSelectOption>
+                      <NativeSelectOption value="test">test</NativeSelectOption>
+                    </NativeSelect>
+                  </div>
+                  <Input
+                    placeholder="Globs, comma-separated (e.g. **/*.ts, **/*.tsx)"
+                    value={ss.globs || ''}
+                    onChange={e => setForm(f => {
+                      const next = [...f.source_sets]
+                      next[idx] = { ...next[idx], globs: e.target.value }
+                      return { ...f, source_sets: next }
+                    })}
+                    className="text-xs font-mono"
+                  />
+                  <Input
+                    placeholder="Exclude globs, comma-separated (optional)"
+                    value={ss.exclude_globs || ''}
+                    onChange={e => setForm(f => {
+                      const next = [...f.source_sets]
+                      next[idx] = { ...next[idx], exclude_globs: e.target.value }
+                      return { ...f, source_sets: next }
+                    })}
+                    className="text-xs font-mono"
+                  />
+                </div>
+              ))}
+            </div>}
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowCreate(false)}>Cancel</Button>
+            <Button
+              onClick={handleSave}
+              disabled={creating || !form.name || !form.repo_path}
+            >
+              {creating ? 'Saving…' : (editingProjectId ? 'Save Project' : 'Create Project')}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {}
+      <Dialog open={!!confirmDeleteId} onOpenChange={open => { if (!open) setConfirmDeleteId(null) }}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle className="text-destructive flex items-center gap-2">
+              <Trash2 className="h-4 w-4" /> Delete Project
+            </DialogTitle>
+          </DialogHeader>
+          <p className="text-sm text-muted-foreground">
+            This will permanently delete the project and <strong>all associated files, chunks, proposals, embeddings, and graph links</strong>. This action cannot be undone.
+          </p>
+          <p className="text-sm font-medium">
+            Project: <span className="font-mono">{projects.find(p => p.id === confirmDeleteId)?.title || confirmDeleteId}</span>
+          </p>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setConfirmDeleteId(null)} disabled={deleting}>Cancel</Button>
+            <Button variant="destructive" onClick={handleDeleteProject} disabled={deleting}>
+              {deleting ? 'Deleting…' : 'Delete Project'}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  )
+}
+
+// CIL[END chunk_id="cilprojectspage_cilprojectspage_1784193942"]