spine-framework 0.3.124 → 0.3.126

package/.framework/src/components/shared/MemberList.tsx

@@ -0,0 +1,182 @@
+import React, { useState, useEffect, useCallback, useMemo } from 'react'
+import { apiFetch } from '../../lib/api'
+
+export interface AllowedRole {
+  slug: string
+  name: string
+}
+
+interface Member {
+  id: string
+  full_name: string | null
+  email: string
+  status: string
+  role: { id: string; slug: string; name: string } | null
+  is_active: boolean
+}
+
+async function callInvitesApi(action: string, params: Record<string, any> = {}, method: 'GET' | 'POST' = 'GET') {
+  const base = '/.netlify/functions/invites'
+  if (method === 'GET') {
+    const qs = new URLSearchParams({ action, ...params }).toString()
+    const res = await apiFetch(`${base}?${qs}`)
+    return res.json()
+  }
+  const res = await apiFetch(`${base}?action=${action}`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(params),
+  })
+  return res.json()
+}
+
+export interface MemberListProps {
+  accountId?: string
+  allowedRoles: AllowedRole[]
+}
+
+export function MemberList({ accountId, allowedRoles }: MemberListProps) {
+  const [members, setMembers] = useState<Member[]>([])
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState('')
+  const [search, setSearch] = useState('')
+  const [selectedRole, setSelectedRole] = useState<Record<string, string>>({})
+
+  const load = useCallback(async () => {
+    if (!accountId) return
+    setLoading(true)
+    setError('')
+    const result = await callInvitesApi('list-members', { account_id: accountId })
+    setLoading(false)
+    if (result.error) {
+      setError(result.error)
+    } else {
+      const rows = (result.data || []).filter((m: Member) => m.is_active || m.status === 'active')
+      setMembers(rows)
+      const roleMap: Record<string, string> = {}
+      for (const m of rows) {
+        if (m.role?.slug) roleMap[m.id] = m.role.slug
+      }
+      setSelectedRole(roleMap)
+    }
+  }, [accountId])
+
+  useEffect(() => { load() }, [load])
+
+  const handleRoleChange = async (personId: string) => {
+    const newSlug = selectedRole[personId]
+    const current = members.find(m => m.id === personId)?.role?.slug
+    if (!newSlug || newSlug === current) return
+
+    setError('')
+    const result = await callInvitesApi('update-member', { person_id: personId, role_slug: newSlug }, 'POST')
+    if (result.error) {
+      setError(result.error)
+    } else {
+      await load()
+    }
+  }
+
+  const handleDeactivate = async (personId: string) => {
+    setError('')
+    const result = await callInvitesApi('deactivate-member', { person_id: personId }, 'POST')
+    if (result.error) {
+      setError(result.error)
+    } else {
+      await load()
+    }
+  }
+
+  const filtered = useMemo(() => {
+    const q = search.toLowerCase()
+    if (!q) return members
+    return members.filter(m =>
+      (m.full_name ?? '').toLowerCase().includes(q) ||
+      m.email.toLowerCase().includes(q) ||
+      (m.role?.name ?? '').toLowerCase().includes(q)
+    )
+  }, [members, search])
+
+  const canShowRole = (slug: string) => allowedRoles.some(r => r.slug === slug)
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <h2 className="text-lg font-medium text-slate-900">Active members</h2>
+        <input
+          type="text"
+          value={search}
+          onChange={e => setSearch(e.target.value)}
+          placeholder="Search members…"
+          className="w-64 px-3 py-2 border border-slate-300 rounded-[5px] shadow-sm placeholder-slate-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"
+        />
+      </div>
+
+      {error && (
+        <div className="rounded-md bg-red-50 p-3">
+          <p className="text-sm text-red-800">{error}</p>
+        </div>
+      )}
+
+      {loading ? (
+        <div className="flex items-center justify-center py-12">
+          <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-slate-900" />
+        </div>
+      ) : filtered.length === 0 ? (
+        <div className="text-center py-8 text-slate-500">
+          <p className="text-sm">No active members.</p>
+        </div>
+      ) : (
+        <div className="overflow-x-auto">
+          <table className="min-w-full divide-y divide-slate-200">
+            <thead>
+              <tr>
+                <th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase tracking-wider">Name</th>
+                <th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase tracking-wider">Email</th>
+                <th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase tracking-wider">Role</th>
+                <th className="px-4 py-3 text-right text-xs font-medium text-slate-500 uppercase tracking-wider">Actions</th>
+              </tr>
+            </thead>
+            <tbody className="divide-y divide-slate-100">
+              {filtered.map(m => (
+                <tr key={m.id} className="hover:bg-slate-50">
+                  <td className="px-4 py-3 text-sm text-slate-900">{m.full_name || '—'}</td>
+                  <td className="px-4 py-3 text-sm text-slate-600">{m.email}</td>
+                  <td className="px-4 py-3 text-sm text-slate-600">
+                    {canShowRole(m.role?.slug ?? '') ? m.role?.name : '—'}
+                  </td>
+                  <td className="px-4 py-3 text-right">
+                    <div className="flex gap-2 justify-end items-center flex-wrap">
+                      <select
+                        value={selectedRole[m.id] ?? m.role?.slug ?? ''}
+                        onChange={e => setSelectedRole(s => ({ ...s, [m.id]: e.target.value }))}
+                        className="text-sm border border-slate-300 rounded-[5px] px-2 py-1 focus:outline-none focus:ring-blue-500 focus:border-blue-500"
+                      >
+                        {allowedRoles.map(r => (
+                          <option key={r.slug} value={r.slug}>{r.name}</option>
+                        ))}
+                      </select>
+                      <button
+                        onClick={() => handleRoleChange(m.id)}
+                        disabled={selectedRole[m.id] === m.role?.slug}
+                        className="text-xs text-blue-600 hover:text-blue-800 px-2 py-1 rounded border border-blue-200 hover:border-blue-400 disabled:opacity-50"
+                      >
+                        Update
+                      </button>
+                      <button
+                        onClick={() => handleDeactivate(m.id)}
+                        className="text-xs text-red-600 hover:text-red-800 px-2 py-1 rounded border border-red-200 hover:border-red-400"
+                      >
+                        Deactivate
+                      </button>
+                    </div>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}

package/.framework/src/components/shared/SchemaFields.tsx

@@ -1,66 +1,52 @@
-/**
- * @module src/components/shared/SchemaFields
- * @audience installer
- * @layer frontend-component
- * @stability stable
- *
- * Schema-driven field grid. Renders an ordered list of `FieldDefinition`
- * entries via `FieldRenderer`, managing the name→value mapping and
- * propagating `onChange` calls back to the parent.
- *
- * **Value source resolution** (per field):
- * - `system` flag set → `data[name]` (top-level column)
- * - `system` flag unset → `data.data?.[name] ?? data[name]` (JSONB field
- *   with column fallback)
- *
- * **Layout:** two-column responsive grid by default (`twoColumn=true`);
- * pass `twoColumn=false` for a single-column stacked layout.
- *
- * **Exports:**
- * - `SchemaFields` — full editable/read-only field grid
- * - `SchemaFieldDisplay` — read-only single-field key:value display row
- * - `SchemaField` (unexported) — internal wrapper binding name to value
- *
- * @seeAlso src/components/shared/FieldRenderer.tsx
- * @seeAlso src/types/types.ts (FieldDefinition)
- * @seeAlso src/components/runtime/SchemaDetailForm.tsx (primary consumer)
- */
 
+
+
+
+
+
+// CIL[BEGIN chunk_id="SchemaFields_module_header_1783927912" type="module_header" identity="module_header" parent="none"]
+// CIL[DOC-MACRO purpose="Import dependencies and define schema field component interfaces"]
+// CIL[DOC-RESPONSIBILITY responsibility="Manage React imports and field component prop types"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[\".framework/functions/_shared/schema-utils.ts\",\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/components/ui/dialog.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Imported modules and interfaces" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Imports React, field types, and component, defines SchemaFieldsProps interface" 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: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/functions/_shared/schema-utils.ts, custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/components/ui/dialog.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 React from 'react'
 import { FieldDefinition } from '../../types/types'
 import { FieldRenderer } from './FieldRenderer'
 
-/**
- * Props for `SchemaFields`.
- *
- * @prop fields - Ordered array of field definitions to render
- * @prop data - Record containing current field values; may be flat or
- *   nested under a `.data` key for JSONB fields
- * @prop onChange - `(name, value)` callback; omit for pure read-only display
- * @prop readonly - Passes read-only mode down to every `FieldRenderer`
- * @prop errors - Per-field validation error messages
- * @prop twoColumn - Two-column responsive grid (default: `true`)
- * @prop displayTypes - Widget override map keyed by field name (from view config)
- */
 interface SchemaFieldsProps {
   fields: FieldDefinition[]
   data: Record<string, any>
   onChange?: (name: string, value: any) => void
   readonly?: boolean
   errors?: Record<string, string>
-  /** Render fields in a two-column grid (default: true) */
   twoColumn?: boolean
-  /** display_type per field key, sourced from view config — never from field definitions */
   displayTypes?: Record<string, string>
 }
-
-/**
- * Renders a full schema field grid.
- *
- * @param props - `SchemaFieldsProps`
- * @returns Two-column (or single-column) field grid, or an empty-state message
- * @sideEffects none (delegates changes to `onChange`)
- */
+// CIL[END chunk_id="SchemaFields_module_header_1783927912"]
+// CIL[BEGIN chunk_id="SchemaFields_schemafields_1783927912" type="function" identity="SchemaFields" parent="none"]
+// CIL[DOC-MACRO purpose="Render schema-driven field grid with responsive layout"]
+// CIL[DOC-RESPONSIBILITY responsibility="Display and manage multiple schema fields in grid format"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[\".framework/functions/_shared/schema-utils.ts\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Responsive field grid" errors="none" side_effects="Renders UI, calls onChange"]
+// CIL[DOC-MICRO logic_summary="Maps field definitions to SchemaField components, handles system vs JSONB data resolution" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/functions/_shared/schema-utils.ts, custom/apps/portal/pages/ContentPage.tsx, .framework/src/pages/admin/RolesPage.tsx, .framework/src/components/ui/dialog.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"]
 export function SchemaFields({
   fields,
   data,
@@ -95,8 +81,21 @@ export function SchemaFields({
     </div>
   )
 }
-
-/** Internal props for the `SchemaField` name-binding wrapper. */
+// CIL[END chunk_id="SchemaFields_schemafields_1783927912"]
+// CIL[BEGIN chunk_id="SchemaFields_interface_1783927912" type="interface" identity="SchemaFieldProps" parent="none"]
+// CIL[DOC-MACRO purpose="Define props interface for individual schema field wrapper"]
+// CIL[DOC-RESPONSIBILITY responsibility="Type definition for SchemaField component props"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[\".framework/functions/_shared/schema-utils.ts\",\".framework/functions/_shared/principal.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Interface definition" errors="none" side_effects="Type definition"]
+// CIL[DOC-MICRO logic_summary="Defines SchemaFieldProps interface with field, value, and callback properties" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/functions/_shared/schema-utils.ts, .framework/functions/_shared/principal.ts, .framework/src/pages/admin/TypeDetailPage.tsx, 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"]
 interface SchemaFieldProps {
   field: FieldDefinition
   value: any
@@ -105,7 +104,21 @@ interface SchemaFieldProps {
   error?: string
   displayType?: string
 }
-
+// CIL[END chunk_id="SchemaFields_interface_1783927912"]
+// CIL[BEGIN chunk_id="SchemaFields_schemafield_1783927912" type="function" identity="SchemaField" parent="none"]
+// CIL[DOC-MACRO purpose="Wrapper component that binds field name to FieldRenderer"]
+// CIL[DOC-RESPONSIBILITY responsibility="Connect individual field to FieldRenderer with proper callbacks"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\"custom/apps/cortex/functions/custom_cil-embeddings.ts\",\".framework/src/pages/admin/RolesPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="FieldRenderer component" errors="none" side_effects="Renders FieldRenderer"]
+// CIL[DOC-MICRO logic_summary="Wraps FieldRenderer with name-binding logic and readonly handling" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, .framework/src/components/ui/dialog.tsx, custom/apps/cortex/functions/custom_cil-embeddings.ts, .framework/src/pages/admin/RolesPage.tsx, 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"]
 function SchemaField({ field, value, onChange, readonly, error, displayType }: SchemaFieldProps) {
   return (
     <FieldRenderer
@@ -118,16 +131,21 @@ function SchemaField({ field, value, onChange, readonly, error, displayType }: S
     />
   )
 }
-
-/**
- * Read-only display of a single schema field value as a label:value row.
- * Useful for compact detail views outside the full form layout.
- *
- * @param field - Field definition (used for label and data_type formatting)
- * @param value - Raw value to display
- * @returns A `<div>` with label on the left and formatted value on the right
- * @sideEffects none (pure rendering)
- */
+// CIL[END chunk_id="SchemaFields_schemafield_1783927912"]
+// CIL[BEGIN chunk_id="SchemaFields_schemafielddisplay_1783927912" type="function" identity="SchemaFieldDisplay" parent="none"]
+// CIL[DOC-MACRO purpose="Render read-only field value as label:value display row"]
+// CIL[DOC-RESPONSIBILITY responsibility="Display formatted field values in compact detail view"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Formatted display row" errors="none" side_effects="Renders UI"]
+// CIL[DOC-MICRO logic_summary="Formats field value and renders as label-value pair with proper styling" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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 function SchemaFieldDisplay({
   field,
   value
@@ -148,22 +166,21 @@ export function SchemaFieldDisplay({
     </div>
   )
 }
-
-/**
- * Formats a raw field value for read-only display, applying type-specific
- * transformations:
- * - `boolean`/`checkbox` → `'Yes'` / `'No'`
- * - `date` / `datetime` → locale string
- * - `select` → resolves option label from `field.options`
- * - `multiselect` → comma-joined option labels
- * - `json` → `<pre>` code block
- * - `url` → `<a>` link
- * - Null/undefined/empty → em-dash placeholder
- *
- * @param field - Field definition
- * @param value - Raw value
- * @returns Formatted `ReactNode`
- */
+// CIL[END chunk_id="SchemaFields_schemafielddisplay_1783927912"]
+// CIL[BEGIN chunk_id="SchemaFields_formatfieldvalue_1783927912" type="function" identity="formatFieldValue" parent="none"]
+// CIL[DOC-MACRO purpose="Format field values for read-only display based on data type"]
+// CIL[DOC-RESPONSIBILITY responsibility="Apply type-specific formatting to field values"]
+// CIL[DOC-CONTEXT module="schema-fields" layer="frontend-component" related_files="[]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Formatted ReactNode" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Switches on data_type to apply appropriate formatting (dates, booleans, URLs, JSON)" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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"]
 function formatFieldValue(field: FieldDefinition, value: any): React.ReactNode {
   if (value === null || value === undefined || value === '') {
     return <span className="text-slate-400 italic">—</span>
@@ -224,3 +241,4 @@ function formatFieldValue(field: FieldDefinition, value: any): React.ReactNode {
       return String(value)
   }
 }
+// CIL[END chunk_id="SchemaFields_formatfieldvalue_1783927912"]

package/.framework/src/components/ui/DataTable.tsx

@@ -1,27 +1,29 @@
-/**
- * @module src/components/ui/DataTable
- * @audience installer
- * @layer frontend-component
- * @stability stable
- *
- * Higher-level table wrapper that adds search, column filters, active-filter
- * chips, and pagination using shadcn/ui table primitives.
- *
- * **Search:** when `searchable=true`, renders a text input that calls
- * `onSearch` on each keystroke and shows an active chip while a query
- * is present.
- *
- * **Column filters:** columns with `filterable=true` and `filterOptions`
- * appear in an expandable filter panel as `<select>` dropdowns. Active
- * filter chips are shown above the table; each chip has an inline
- * dismiss button.
- *
- * **Pagination:** built-in pagination controls using shadcn Button components.
- *
- * @seeAlso src/components/ui/table.tsx
- * @seeAlso src/lib/utils.ts (cn)
- */
 
+
+
+
+
+
+
+
+
+
+
+// CIL[BEGIN chunk_id="DataTable_moduleheader_1783907801" type="module_header" identity="imports" parent="none"]
+// CIL[DOC-MACRO purpose="Import React and table dependencies"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provide all external dependencies for data table components"]
+// CIL[DOC-CONTEXT module="DataTable" layer="frontend-component" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="React, useState, table components, UI components" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Imports React hooks, shadcn table primitives, badge, button, 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: frontend-component. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/pages/admin/RolesPage.tsx, .framework/src/components/ui/dialog.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 React, { useState } from 'react'
 import {
   Table,
@@ -35,41 +37,61 @@ import { Badge } from './badge'
 import { Button } from './button'
 import { Search, Filter } from 'lucide-react'
 import { cn } from '../../lib/utils'
-
-/**
- * Column definition for DataTable
- */
+// CIL[END chunk_id="DataTable_moduleheader_1783907801"]
+// CIL[BEGIN chunk_id="DataTable_tablecolumn_1783907801" type="interface" identity="TableColumn" parent="none"]
+// CIL[DOC-MACRO purpose="Define base table column interface"]
+// CIL[DOC-RESPONSIBILITY responsibility="Specify basic column properties for table rendering"]
+// CIL[DOC-CONTEXT module="DataTable" layer="frontend-component" related_files="[\".framework/src/components/layout/Sidebar.tsx\",\".framework/functions/_shared/schema-utils.ts\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\".framework/functions/_shared/principal.ts\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="TableColumn interface" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Generic column interface with key, title, render function, and sort flag" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/src/components/layout/Sidebar.tsx, .framework/functions/_shared/schema-utils.ts, .framework/src/pages/admin/IntegrationsPage.tsx, .framework/src/pages/admin/RolesPage.tsx, .framework/functions/_shared/principal.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 TableColumn<T> {
   key: keyof T | string
   title: string
   render?: (row: T) => React.ReactNode
   sortable?: boolean
 }
-
-/**
- * Extends `TableColumn<T>` with column-level filter support.
- */
+// CIL[END chunk_id="DataTable_tablecolumn_1783907801"]
+// CIL[BEGIN chunk_id="DataTable_datatablecolumn_1783907801" type="interface" identity="DataTableColumn" parent="none"]
+// CIL[DOC-MACRO purpose="Define extended table column interface with filtering"]
+// CIL[DOC-RESPONSIBILITY responsibility="Extend TableColumn with filter-specific properties"]
+// CIL[DOC-CONTEXT module="DataTable" layer="frontend-component" related_files="[\".framework/src/components/layout/Sidebar.tsx\",\".framework/functions/_shared/schema-utils.ts\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\".framework/functions/_shared/principal.ts\",\"custom/apps/cortex/functions/custom_cil-embeddings.ts\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="DataTableColumn interface" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Adds filterable flag and filter options array to base column interface" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/src/components/layout/Sidebar.tsx, .framework/functions/_shared/schema-utils.ts, .framework/src/pages/admin/IntegrationsPage.tsx, .framework/functions/_shared/principal.ts, custom/apps/cortex/functions/custom_cil-embeddings.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 DataTableColumn<T> extends TableColumn<T> {
   filterable?: boolean
   filterOptions?: Array<{ value: string; label: string }>
 }
-
-/**
- * Props for `DataTable<T>`.
- *
- * @prop data - Row data array
- * @prop columns - Column descriptors (may include filter config)
- * @prop loading - Shows spinner while true
- * @prop searchable - Shows search input (default: `true`)
- * @prop searchPlaceholder - Placeholder text for the search input
- * @prop filterable - Shows the filter toggle button (default: `true`)
- * @prop pagination - Pagination config; omit to hide pagination
- * @prop onSort / sortColumn / sortDirection - Sort state and callback
- * @prop onRowClick - Row click callback
- * @prop onSearch - Callback invoked with the current search query
- * @prop onFilter - Callback invoked with the active filter map
- * @prop emptyMessage - Empty-state text
- */
+// CIL[END chunk_id="DataTable_datatablecolumn_1783907801"]
+// CIL[BEGIN chunk_id="DataTable_datatableprops_1783907801" type="interface" identity="DataTableProps" parent="none"]
+// CIL[DOC-MACRO purpose="Define comprehensive data table props interface"]
+// CIL[DOC-RESPONSIBILITY responsibility="Specify all props needed for DataTable component configuration"]
+// CIL[DOC-CONTEXT module="DataTable" layer="frontend-component" related_files="[\".framework/src/components/layout/Sidebar.tsx\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\".framework/functions/_shared/schema-utils.ts\",\".framework/functions/_shared/principal.ts\",\"\\\"]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="DataTableProps interface" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Extensive props for data, columns, search, filters, pagination, and callbacks" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/src/components/layout/Sidebar.tsx, .framework/src/pages/admin/IntegrationsPage.tsx, .framework/functions/_shared/schema-utils.ts, .framework/functions/_shared/principal.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 DataTableProps<T> {
   data: T[]
   columns: DataTableColumn<T>[]
@@ -94,14 +116,21 @@ interface DataTableProps<T> {
   emptyMessage?: string
   className?: string
 }
-
-/**
- * Full-featured data table with search, filters, sort, and pagination.
- *
- * @param props - `DataTableProps<T>`
- * @returns Search/filter bar + `Table` + optional `TablePagination`
- * @sideEffects none (all state changes delegated to callbacks)
- */
+// CIL[END chunk_id="DataTable_datatableprops_1783907801"]
+// CIL[BEGIN chunk_id="DataTable_datatable_1783907801" type="function" identity="DataTable" parent="none"]
+// CIL[DOC-MACRO purpose="Render full-featured data table with search, filters, sort, and pagination"]
+// CIL[DOC-RESPONSIBILITY responsibility="Handle table state management, user interactions, and data rendering"]
+// CIL[DOC-CONTEXT module="DataTable" layer="frontend-component" related_files="[]"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Table with search/filter controls" errors="none" side_effects="Calls search/filter/sort callbacks"]
+// CIL[DOC-MICRO logic_summary="Manages internal search/filter state, renders UI controls and table body" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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 function DataTable<T extends Record<string, any>>({
   data,
   columns,
@@ -341,3 +370,4 @@ export function DataTable<T extends Record<string, any>>({
     </div>
   )
 }
+// CIL[END chunk_id="DataTable_datatable_1783907801"]