@shepai/cli 1.122.0 → 1.122.1-pr373.cb974c2

package/dist/src/presentation/web/components/features/database/query-runner.js

@@ -0,0 +1,53 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Button } from '../../ui/button.js';
+import { Label } from '../../ui/label.js';
+import { Textarea } from '../../ui/textarea.js';
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '../../ui/table.js';
+import { Play, Loader2, AlertCircle } from 'lucide-react';
+import { isWriteQuery } from '../../../lib/sql-validation.js';
+import { CellValueDialog } from './cell-value-dialog.js';
+const MAX_CELL_LENGTH = 100;
+function formatCellDisplay(value) {
+    if (value === null || value === undefined) {
+        return 'NULL';
+    }
+    return String(value);
+}
+export function QueryRunner({ onExecute }) {
+    const [sql, setSql] = useState('');
+    const [result, setResult] = useState(null);
+    const [clientError, setClientError] = useState(null);
+    const [loading, setLoading] = useState(false);
+    const [dialogState, setDialogState] = useState({ open: false, columnName: '', value: '' });
+    const handleExecute = async () => {
+        setClientError(null);
+        setResult(null);
+        const trimmed = sql.trim();
+        if (!trimmed) {
+            setClientError('Query cannot be empty');
+            return;
+        }
+        if (isWriteQuery(trimmed)) {
+            setClientError('Write operations are not allowed. Only SELECT and PRAGMA queries are permitted.');
+            return;
+        }
+        setLoading(true);
+        try {
+            const res = await onExecute(trimmed);
+            setResult(res);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const error = clientError ?? result?.error;
+    return (_jsxs("div", { className: "flex flex-col gap-4", "data-testid": "query-runner", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { htmlFor: "sql-query", className: "text-xs font-medium", children: "SQL Query" }), _jsx(Textarea, { id: "sql-query", placeholder: "SELECT * FROM features LIMIT 10", value: sql, onChange: (e) => setSql(e.target.value), className: "bg-muted/30 font-mono text-xs", rows: 4, "data-testid": "query-runner-input" }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { onClick: handleExecute, disabled: loading || sql.trim().length === 0, size: "sm", className: "gap-1.5", "data-testid": "query-runner-execute", children: [loading ? (_jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" })) : (_jsx(Play, { className: "h-3.5 w-3.5" })), loading ? 'Executing...' : 'Execute'] }) })] }), error ? (_jsxs("div", { className: "bg-destructive/10 text-destructive flex items-start gap-2 rounded-md border border-red-200 p-3 text-sm dark:border-red-900", role: "alert", "aria-live": "polite", "data-testid": "query-runner-error", children: [_jsx(AlertCircle, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { className: "text-xs", children: error })] })) : null, result?.columns && result.rows ? (_jsxs("div", { "data-testid": "query-runner-results", children: [_jsxs("div", { className: "text-muted-foreground mb-2 text-xs", children: [result.rows.length, " row", result.rows.length !== 1 ? 's' : '', " returned"] }), _jsx("div", { className: "border-border overflow-auto rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsx(TableRow, { className: "bg-muted/50 hover:bg-muted/50", children: result.columns.map((col) => (_jsx(TableHead, { className: "font-mono text-xs font-medium whitespace-nowrap", children: col }, col))) }) }), _jsx(TableBody, { children: result.rows.map((row, rowIdx) => (
+                                    // eslint-disable-next-line react/no-array-index-key
+                                    _jsx(TableRow, { children: result.columns.map((col) => {
+                                            const display = formatCellDisplay(row[col]);
+                                            const truncated = display.length > MAX_CELL_LENGTH;
+                                            return (_jsx(TableCell, { className: "max-w-[300px] py-1.5 font-mono text-xs", children: truncated ? (_jsxs("button", { className: "text-primary cursor-pointer text-left underline-offset-2 hover:underline", onClick: () => setDialogState({ open: true, columnName: col, value: display }), title: "Click to view full value", children: [display.slice(0, MAX_CELL_LENGTH), "..."] })) : (_jsx("span", { className: display === 'NULL' ? 'text-muted-foreground italic' : '', children: display })) }, col));
+                                        }) }, rowIdx))) })] }) })] })) : null, _jsx(CellValueDialog, { open: dialogState.open, onOpenChange: (open) => setDialogState((s) => ({ ...s, open })), columnName: dialogState.columnName, value: dialogState.value })] }));
+}

package/dist/src/presentation/web/components/features/database/query-runner.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { QueryRunner } from './query-runner.js';
+declare const meta: Meta<typeof QueryRunner>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Interactive: Story;
+export declare const WithError: Story;
+//# sourceMappingURL=query-runner.stories.d.ts.map

package/dist/src/presentation/web/components/features/database/query-runner.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"query-runner.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/query-runner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAUlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAiDnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC"}

package/dist/src/presentation/web/components/features/database/query-runner.stories.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { fn } from '@storybook/test';
+import { QueryRunner } from './query-runner.js';
+const meta = {
+    title: 'Features/Database/QueryRunner',
+    component: QueryRunner,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'padded',
+    },
+    args: {
+        onExecute: fn(),
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Interactive wrapper for stories that need state
+ * ------------------------------------------------------------------------- */
+function QueryRunnerWithMockResults() {
+    return (_jsx(QueryRunner, { onExecute: async (sql) => {
+            // Simulate server delay
+            await new Promise((r) => setTimeout(r, 500));
+            if (sql.toLowerCase().includes('error')) {
+                return { error: 'near "error": syntax error' };
+            }
+            return {
+                columns: ['id', 'name', 'status', 'created_at'],
+                rows: [
+                    {
+                        id: 1,
+                        name: 'database-management-ui',
+                        status: 'in_progress',
+                        created_at: '2026-03-10',
+                    },
+                    { id: 2, name: 'agent-improvements', status: 'completed', created_at: '2026-03-09' },
+                    { id: 3, name: 'cli-refactor', status: 'pending', created_at: '2026-03-08' },
+                ],
+            };
+        } }));
+}
+function QueryRunnerWithError() {
+    return (_jsx(QueryRunner, { onExecute: async () => {
+            return { error: 'no such table: nonexistent_table' };
+        } }));
+}
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const Default = {};
+export const Interactive = {
+    render: () => _jsx(QueryRunnerWithMockResults, {}),
+};
+export const WithError = {
+    render: () => _jsx(QueryRunnerWithError, {}),
+};

package/dist/src/presentation/web/components/features/database/row-browser.d.ts

@@ -0,0 +1,11 @@
+export interface RowBrowserProps {
+    columns: string[];
+    rows: Record<string, unknown>[];
+    totalRows: number;
+    page: number;
+    pageSize: number;
+    onPageChange: (page: number) => void;
+    loading?: boolean;
+}
+export declare function RowBrowser({ columns, rows, totalRows, page, pageSize, onPageChange, loading, }: RowBrowserProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=row-browser.d.ts.map

package/dist/src/presentation/web/components/features/database/row-browser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-browser.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/row-browser.tsx"],"names":[],"mappings":"AAiBA,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAoBD,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,YAAY,EACZ,OAAO,GACR,EAAE,eAAe,2CAuHjB"}

package/dist/src/presentation/web/components/features/database/row-browser.js

@@ -0,0 +1,42 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '../../ui/table.js';
+import { Button } from '../../ui/button.js';
+import { ChevronLeft, ChevronRight, Loader2 } from 'lucide-react';
+import { CellValueDialog } from './cell-value-dialog.js';
+const MAX_CELL_LENGTH = 100;
+function formatCellDisplay(value) {
+    if (value === null || value === undefined) {
+        return 'NULL';
+    }
+    return String(value);
+}
+function isTruncated(value) {
+    return value.length > MAX_CELL_LENGTH;
+}
+function truncate(value) {
+    if (isTruncated(value)) {
+        return `${value.slice(0, MAX_CELL_LENGTH)}...`;
+    }
+    return value;
+}
+export function RowBrowser({ columns, rows, totalRows, page, pageSize, onPageChange, loading, }) {
+    const [dialogState, setDialogState] = useState({ open: false, columnName: '', value: '' });
+    const totalPages = Math.max(1, Math.ceil(totalRows / pageSize));
+    const isFirstPage = page === 0;
+    const isLastPage = page >= totalPages - 1;
+    if (loading) {
+        return (_jsxs("div", { className: "text-muted-foreground flex items-center justify-center gap-2 p-12 text-sm", "data-testid": "row-browser-loading", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Loading rows..."] }));
+    }
+    if (rows.length === 0 && totalRows === 0) {
+        return (_jsx("div", { className: "text-muted-foreground flex items-center justify-center p-12 text-sm", "data-testid": "row-browser-empty", children: "This table has no rows" }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-3", "data-testid": "row-browser", children: [_jsxs("div", { className: "flex items-center justify-between", "data-testid": "row-browser-pagination", children: [_jsxs("span", { className: "text-muted-foreground text-xs tabular-nums", children: [totalRows.toLocaleString(), " row", totalRows !== 1 ? 's' : '', " \u00B7 Page ", page + 1, " of", ' ', totalPages] }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => onPageChange(page - 1), disabled: isFirstPage, "data-testid": "row-browser-prev", children: _jsx(ChevronLeft, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "icon", className: "h-7 w-7", onClick: () => onPageChange(page + 1), disabled: isLastPage, "data-testid": "row-browser-next", children: _jsx(ChevronRight, { className: "h-4 w-4" }) })] })] }), _jsx("div", { className: "border-border overflow-auto rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsx(TableRow, { className: "bg-muted/50 hover:bg-muted/50", children: columns.map((col) => (_jsx(TableHead, { className: "font-mono text-xs font-medium whitespace-nowrap", children: col }, col))) }) }), _jsx(TableBody, { children: rows.map((row, rowIdx) => (
+                            // eslint-disable-next-line react/no-array-index-key
+                            _jsx(TableRow, { children: columns.map((col) => {
+                                    const display = formatCellDisplay(row[col]);
+                                    const truncated = isTruncated(display);
+                                    return (_jsx(TableCell, { className: "max-w-[300px] py-1.5 font-mono text-xs", children: truncated ? (_jsx("button", { className: "text-primary cursor-pointer text-left underline-offset-2 hover:underline", onClick: () => setDialogState({ open: true, columnName: col, value: display }), title: "Click to view full value", children: truncate(display) })) : (_jsx("span", { className: display === 'NULL' ? 'text-muted-foreground italic' : '', children: display })) }, col));
+                                }) }, rowIdx))) })] }) }), _jsx(CellValueDialog, { open: dialogState.open, onOpenChange: (open) => setDialogState((s) => ({ ...s, open })), columnName: dialogState.columnName, value: dialogState.value })] }));
+}

package/dist/src/presentation/web/components/features/database/row-browser.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { RowBrowser } from './row-browser.js';
+declare const meta: Meta<typeof RowBrowser>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const PopulatedTable: Story;
+export declare const MiddlePage: Story;
+export declare const LastPage: Story;
+export declare const EmptyTable: Story;
+export declare const Loading: Story;
+export declare const TruncatedValues: Story;
+export declare const WithNullValues: Story;
+export declare const BlobValues: Story;
+//# sourceMappingURL=row-browser.stories.d.ts.map

package/dist/src/presentation/web/components/features/database/row-browser.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-browser.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/row-browser.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAYjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAgCnC,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAWxB,CAAC"}

package/dist/src/presentation/web/components/features/database/row-browser.stories.js

@@ -0,0 +1,120 @@
+import { fn } from '@storybook/test';
+import { RowBrowser } from './row-browser.js';
+const meta = {
+    title: 'Features/Database/RowBrowser',
+    component: RowBrowser,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'padded',
+    },
+    args: {
+        onPageChange: fn(),
+        page: 0,
+        pageSize: 50,
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const sampleColumns = ['id', 'name', 'status', 'created_at'];
+const sampleRows = [
+    {
+        id: 1,
+        name: 'database-management-ui',
+        status: 'in_progress',
+        created_at: '2026-03-10T14:30:00Z',
+    },
+    { id: 2, name: 'agent-improvements', status: 'completed', created_at: '2026-03-09T10:15:00Z' },
+    { id: 3, name: 'cli-refactor', status: 'pending', created_at: '2026-03-08T08:00:00Z' },
+    { id: 4, name: 'settings-page', status: 'completed', created_at: '2026-03-07T16:45:00Z' },
+    { id: 5, name: 'tui-redesign', status: 'in_progress', created_at: '2026-03-06T12:00:00Z' },
+];
+const longTextRow = {
+    id: 1,
+    description: 'This is a very long description that exceeds one hundred characters in length and should be truncated in the table cell display with an ellipsis and a clickable link to view the full value in a dialog modal window',
+    metadata: JSON.stringify({ key: 'value', nested: { deep: true, items: [1, 2, 3] } }),
+};
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const PopulatedTable = {
+    args: {
+        columns: sampleColumns,
+        rows: sampleRows,
+        totalRows: 230,
+        page: 0,
+        pageSize: 50,
+    },
+};
+export const MiddlePage = {
+    args: {
+        columns: sampleColumns,
+        rows: sampleRows,
+        totalRows: 230,
+        page: 2,
+        pageSize: 50,
+    },
+};
+export const LastPage = {
+    args: {
+        columns: sampleColumns,
+        rows: sampleRows.slice(0, 2),
+        totalRows: 230,
+        page: 4,
+        pageSize: 50,
+    },
+};
+export const EmptyTable = {
+    args: {
+        columns: sampleColumns,
+        rows: [],
+        totalRows: 0,
+        page: 0,
+        pageSize: 50,
+    },
+};
+export const Loading = {
+    args: {
+        columns: [],
+        rows: [],
+        totalRows: 0,
+        page: 0,
+        pageSize: 50,
+        loading: true,
+    },
+};
+export const TruncatedValues = {
+    args: {
+        columns: ['id', 'description', 'metadata'],
+        rows: [longTextRow],
+        totalRows: 1,
+        page: 0,
+        pageSize: 50,
+    },
+};
+export const WithNullValues = {
+    args: {
+        columns: ['id', 'name', 'email', 'notes'],
+        rows: [
+            { id: 1, name: 'Alice', email: 'alice@example.com', notes: null },
+            { id: 2, name: 'Bob', email: null, notes: 'Some notes here' },
+            { id: 3, name: null, email: null, notes: null },
+        ],
+        totalRows: 3,
+        page: 0,
+        pageSize: 50,
+    },
+};
+export const BlobValues = {
+    args: {
+        columns: ['id', 'name', 'data'],
+        rows: [
+            { id: 1, name: 'image.png', data: '(2048 bytes)' },
+            { id: 2, name: 'document.pdf', data: '(15360 bytes)' },
+        ],
+        totalRows: 2,
+        page: 0,
+        pageSize: 50,
+    },
+};

package/dist/src/presentation/web/components/features/database/schema-viewer.d.ts

@@ -0,0 +1,7 @@
+import type { ColumnInfo } from '../../../app/actions/get-table-schema.js';
+export interface SchemaViewerProps {
+    columns: ColumnInfo[];
+    loading?: boolean;
+}
+export declare function SchemaViewer({ columns, loading }: SchemaViewerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=schema-viewer.d.ts.map

package/dist/src/presentation/web/components/features/database/schema-viewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-viewer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/schema-viewer.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAEjE,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,iBAAiB,2CA0EnE"}

package/dist/src/presentation/web/components/features/database/schema-viewer.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '../../ui/table.js';
+import { Badge } from '../../ui/badge.js';
+import { Loader2 } from 'lucide-react';
+export function SchemaViewer({ columns, loading }) {
+    if (loading) {
+        return (_jsxs("div", { className: "text-muted-foreground flex items-center justify-center gap-2 p-12 text-sm", "data-testid": "schema-viewer-loading", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Loading schema..."] }));
+    }
+    if (columns.length === 0) {
+        return (_jsx("div", { className: "text-muted-foreground flex items-center justify-center p-12 text-sm", "data-testid": "schema-viewer-empty", children: "No column information available" }));
+    }
+    return (_jsx("div", { "data-testid": "schema-viewer", children: _jsx("div", { className: "border-border overflow-auto rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { className: "bg-muted/50 hover:bg-muted/50", children: [_jsx(TableHead, { className: "font-mono text-xs font-medium", children: "Name" }), _jsx(TableHead, { className: "font-mono text-xs font-medium", children: "Type" }), _jsx(TableHead, { className: "font-mono text-xs font-medium", children: "Nullable" }), _jsx(TableHead, { className: "font-mono text-xs font-medium", children: "Default" }), _jsx(TableHead, { className: "font-mono text-xs font-medium", children: "Primary Key" })] }) }), _jsx(TableBody, { children: columns.map((col) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-mono text-xs font-medium", children: col.name }), _jsx(TableCell, { children: _jsx(Badge, { variant: "outline", className: "font-mono text-[10px]", children: col.type || 'any' }) }), _jsx(TableCell, { className: "text-xs", children: col.notnull ? (_jsx("span", { className: "text-muted-foreground", children: "No" })) : (_jsx("span", { children: "Yes" })) }), _jsx(TableCell, { className: "text-muted-foreground font-mono text-xs", children: col.defaultValue ?? _jsx("span", { className: "italic", children: "None" }) }), _jsx(TableCell, { children: col.primaryKey ? (_jsx(Badge, { variant: "default", className: "text-[10px]", "data-testid": `pk-badge-${col.name}`, children: "PK" })) : null })] }, col.name))) })] }) }) }));
+}

package/dist/src/presentation/web/components/features/database/schema-viewer.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { SchemaViewer } from './schema-viewer.js';
+declare const meta: Meta<typeof SchemaViewer>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const TypicalSchema: Story;
+export declare const AllNullable: Story;
+export declare const CompositePrimaryKey: Story;
+export declare const Loading: Story;
+export declare const Empty: Story;
+//# sourceMappingURL=schema-viewer.stories.d.ts.map

package/dist/src/presentation/web/components/features/database/schema-viewer.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-viewer.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/schema-viewer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAOnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAsCnC,eAAO,MAAM,aAAa,EAAE,KAI3B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAIzB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAIjC,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC"}

package/dist/src/presentation/web/components/features/database/schema-viewer.stories.js

@@ -0,0 +1,67 @@
+import { SchemaViewer } from './schema-viewer.js';
+const meta = {
+    title: 'Features/Database/SchemaViewer',
+    component: SchemaViewer,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'padded',
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const typicalSchema = [
+    { name: 'id', type: 'TEXT', notnull: true, defaultValue: null, primaryKey: true },
+    { name: 'name', type: 'TEXT', notnull: true, defaultValue: null, primaryKey: false },
+    { name: 'description', type: 'TEXT', notnull: false, defaultValue: null, primaryKey: false },
+    { name: 'status', type: 'TEXT', notnull: true, defaultValue: "'pending'", primaryKey: false },
+    {
+        name: 'created_at',
+        type: 'TEXT',
+        notnull: true,
+        defaultValue: 'CURRENT_TIMESTAMP',
+        primaryKey: false,
+    },
+    { name: 'updated_at', type: 'TEXT', notnull: false, defaultValue: null, primaryKey: false },
+];
+const allNullable = [
+    { name: 'key', type: 'TEXT', notnull: false, defaultValue: null, primaryKey: false },
+    { name: 'value', type: 'TEXT', notnull: false, defaultValue: null, primaryKey: false },
+    { name: 'metadata', type: 'BLOB', notnull: false, defaultValue: null, primaryKey: false },
+];
+const compositePk = [
+    { name: 'feature_id', type: 'TEXT', notnull: true, defaultValue: null, primaryKey: true },
+    { name: 'repository_id', type: 'TEXT', notnull: true, defaultValue: null, primaryKey: true },
+    { name: 'status', type: 'TEXT', notnull: true, defaultValue: "'active'", primaryKey: false },
+    { name: 'created_at', type: 'TEXT', notnull: true, defaultValue: null, primaryKey: false },
+];
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const TypicalSchema = {
+    args: {
+        columns: typicalSchema,
+    },
+};
+export const AllNullable = {
+    args: {
+        columns: allNullable,
+    },
+};
+export const CompositePrimaryKey = {
+    args: {
+        columns: compositePk,
+    },
+};
+export const Loading = {
+    args: {
+        columns: [],
+        loading: true,
+    },
+};
+export const Empty = {
+    args: {
+        columns: [],
+    },
+};

package/dist/src/presentation/web/components/features/database/table-list.d.ts

@@ -0,0 +1,8 @@
+import type { TableInfo } from '../../../app/actions/list-tables.js';
+export interface TableListProps {
+    tables: TableInfo[];
+    selectedTable: string | null;
+    onSelectTable: (tableName: string) => void;
+}
+export declare function TableList({ tables, selectedTable, onSelectTable }: TableListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=table-list.d.ts.map

package/dist/src/presentation/web/components/features/database/table-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-list.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/table-list.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAI3D,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,EAAE,cAAc,2CA4DjF"}

package/dist/src/presentation/web/components/features/database/table-list.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Badge } from '../../ui/badge.js';
+import { Input } from '../../ui/input.js';
+import { ScrollArea } from '../../ui/scroll-area.js';
+const SEARCH_THRESHOLD = 10;
+export function TableList({ tables, selectedTable, onSelectTable }) {
+    const [search, setSearch] = useState('');
+    const filteredTables = search.length > 0
+        ? tables.filter((t) => t.name.toLowerCase().includes(search.toLowerCase()))
+        : tables;
+    if (tables.length === 0) {
+        return (_jsx("div", { className: "text-muted-foreground p-4 text-center text-sm", "data-testid": "table-list-empty", children: "No tables found" }));
+    }
+    return (_jsxs("div", { className: "flex h-full flex-col", "data-testid": "table-list", children: [tables.length > SEARCH_THRESHOLD && (_jsx("div", { className: "border-border border-b px-2 py-2", children: _jsx(Input, { placeholder: "Filter tables...", value: search, onChange: (e) => setSearch(e.target.value), className: "h-7 text-xs", "data-testid": "table-list-search" }) })), _jsx(ScrollArea, { className: "flex-1", children: _jsxs("div", { className: "flex flex-col gap-0.5 p-1.5", children: [filteredTables.map((table) => (_jsxs("button", { onClick: () => onSelectTable(table.name), className: `flex w-full items-center justify-between rounded-md px-2.5 py-1.5 text-left text-sm transition-colors ${selectedTable === table.name
+                                ? 'bg-primary/10 text-primary font-medium'
+                                : 'text-foreground hover:bg-muted/50'}`, "data-testid": `table-item-${table.name}`, children: [_jsx("span", { className: "truncate font-mono text-xs", children: table.name }), _jsx(Badge, { variant: selectedTable === table.name ? 'default' : 'secondary', className: "ml-2 h-5 shrink-0 px-1.5 text-[10px]", children: table.rowCount.toLocaleString() })] }, table.name))), filteredTables.length === 0 && search.length > 0 && (_jsxs("div", { className: "text-muted-foreground p-4 text-center text-xs", children: ["No tables matching \"", search, "\""] }))] }) })] }));
+}

package/dist/src/presentation/web/components/features/database/table-list.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { TableList } from './table-list.js';
+declare const meta: Meta<typeof TableList>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const FewTables: Story;
+export declare const WithSelectedTable: Story;
+export declare const ManyTablesWithSearch: Story;
+export declare const Empty: Story;
+//# sourceMappingURL=table-list.stories.d.ts.map

package/dist/src/presentation/web/components/features/database/table-list.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-list.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/database/table-list.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAkBhC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAgCnC,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAK/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAIlC,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC"}

package/dist/src/presentation/web/components/features/database/table-list.stories.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { fn } from '@storybook/test';
+import { TableList } from './table-list.js';
+const meta = {
+    title: 'Features/Database/TableList',
+    component: TableList,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+    },
+    args: {
+        selectedTable: null,
+        onSelectTable: fn(),
+    },
+    decorators: [
+        (Story) => (_jsx("div", { className: "w-64", children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const fewTables = [
+    { name: 'features', rowCount: 42 },
+    { name: 'repositories', rowCount: 5 },
+    { name: 'settings', rowCount: 12 },
+    { name: 'migrations', rowCount: 8 },
+];
+const manyTables = [
+    { name: 'features', rowCount: 42 },
+    { name: 'repositories', rowCount: 5 },
+    { name: 'settings', rowCount: 12 },
+    { name: 'migrations', rowCount: 8 },
+    { name: 'agents', rowCount: 156 },
+    { name: 'agent_events', rowCount: 1024 },
+    { name: 'agent_logs', rowCount: 5432 },
+    { name: 'skills', rowCount: 23 },
+    { name: 'tools', rowCount: 67 },
+    { name: 'tool_executions', rowCount: 890 },
+    { name: 'workflows', rowCount: 15 },
+    { name: 'workflow_steps', rowCount: 234 },
+];
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const FewTables = {
+    args: {
+        tables: fewTables,
+    },
+};
+export const WithSelectedTable = {
+    args: {
+        tables: fewTables,
+        selectedTable: 'repositories',
+    },
+};
+export const ManyTablesWithSearch = {
+    args: {
+        tables: manyTables,
+    },
+};
+export const Empty = {
+    args: {
+        tables: [],
+    },
+};

package/dist/src/presentation/web/components/layouts/app-sidebar/app-sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/layouts/app-sidebar/app-sidebar.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAG/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,YAAY,EAAE,iBAAiB,CAAC;IAEhC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EAEZ,cAAc,GACf,EAAE,eAAe,2CAgHjB"}
+{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/layouts/app-sidebar/app-sidebar.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAG/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,YAAY,EAAE,iBAAiB,CAAC;IAEhC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EAEZ,cAAc,GACf,EAAE,eAAe,2CAsHjB"}

package/dist/src/presentation/web/components/layouts/app-sidebar/app-sidebar.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { usePathname } from 'next/navigation';
-import { Home, Wrench, Puzzle, Settings } from 'lucide-react';
+import { Home, Wrench, Puzzle, Settings, Database } from 'lucide-react';
 import { Sidebar, SidebarHeader, SidebarContent, SidebarMenu, SidebarMenuItem, SidebarRail, useSidebar, } from '../../ui/sidebar.js';
 import { ScrollArea } from '../../ui/scroll-area.js';
 import { SidebarNavItem } from '../../common/sidebar-nav-item/index.js';
@@ -29,7 +29,7 @@ export function AppSidebar({ features, featureFlags, onFeatureClick, }) {
                                             'flex min-w-0 flex-1 items-center gap-2 overflow-hidden px-2',
                                             'transition-opacity duration-200 ease-out',
                                             expandedVisible ? 'opacity-100' : 'opacity-0',
-                                        ].join(' '), "aria-hidden": !expandedVisible, children: [_jsx(ShepLogo, { className: "shrink-0", size: 20, variant: versionData.isDev ? 'dev' : 'default' }), _jsx("span", { className: "truncate text-sm font-semibold tracking-tight", children: "Shep" }), _jsx(VersionBadge, { version: versionData.version, branch: versionData.branch || undefined, commitHash: versionData.commitHash || undefined, isDev: versionData.isDev, packageName: versionData.packageName, description: versionData.description, instancePath: versionData.instancePath || undefined })] })) : null, _jsx(SidebarCollapseToggle, { className: "shrink-0 transition-all duration-200" })] }) }), _jsx(SidebarNavItem, { icon: Home, label: "Control Center", href: "/", active: pathname === '/' }), _jsx(SidebarNavItem, { icon: Wrench, label: "Tools", href: "/tools", active: pathname === '/tools' }), featureFlags.skills ? (_jsx(SidebarNavItem, { icon: Puzzle, label: "Skills", href: "/skills", active: pathname === '/skills' })) : null, _jsx(SidebarNavItem, { icon: Settings, label: "Settings", href: "/settings", active: pathname === '/settings' })] }) }), _jsx(SidebarContent, { children: showExpanded ? (_jsxs("div", { className: [
+                                        ].join(' '), "aria-hidden": !expandedVisible, children: [_jsx(ShepLogo, { className: "shrink-0", size: 20, variant: versionData.isDev ? 'dev' : 'default' }), _jsx("span", { className: "truncate text-sm font-semibold tracking-tight", children: "Shep" }), _jsx(VersionBadge, { version: versionData.version, branch: versionData.branch || undefined, commitHash: versionData.commitHash || undefined, isDev: versionData.isDev, packageName: versionData.packageName, description: versionData.description, instancePath: versionData.instancePath || undefined })] })) : null, _jsx(SidebarCollapseToggle, { className: "shrink-0 transition-all duration-200" })] }) }), _jsx(SidebarNavItem, { icon: Home, label: "Control Center", href: "/", active: pathname === '/' }), _jsx(SidebarNavItem, { icon: Wrench, label: "Tools", href: "/tools", active: pathname === '/tools' }), featureFlags.skills ? (_jsx(SidebarNavItem, { icon: Puzzle, label: "Skills", href: "/skills", active: pathname === '/skills' })) : null, _jsx(SidebarNavItem, { icon: Settings, label: "Settings", href: "/settings", active: pathname === '/settings' }), _jsx(SidebarNavItem, { icon: Database, label: "Database", href: "/database", active: pathname === '/database' })] }) }), _jsx(SidebarContent, { children: showExpanded ? (_jsxs("div", { className: [
                         'min-w-0 overflow-hidden transition-opacity duration-200 ease-out',
                         '[&_[data-sidebar=group-label]]:!mt-0 [&_[data-sidebar=group-label]]:!opacity-100 [&_[data-sidebar=group-label]]:!transition-none',
                         expandedVisible ? 'opacity-100' : 'opacity-0',

package/dist/src/presentation/web/components/ui/table.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+declare function Table({ className, ...props }: React.ComponentProps<'table'>): import("react/jsx-runtime").JSX.Element;
+declare function TableHeader({ className, ...props }: React.ComponentProps<'thead'>): import("react/jsx-runtime").JSX.Element;
+declare function TableBody({ className, ...props }: React.ComponentProps<'tbody'>): import("react/jsx-runtime").JSX.Element;
+declare function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>): import("react/jsx-runtime").JSX.Element;
+declare function TableRow({ className, ...props }: React.ComponentProps<'tr'>): import("react/jsx-runtime").JSX.Element;
+declare function TableHead({ className, ...props }: React.ComponentProps<'th'>): import("react/jsx-runtime").JSX.Element;
+declare function TableCell({ className, ...props }: React.ComponentProps<'td'>): import("react/jsx-runtime").JSX.Element;
+declare function TableCaption({ className, ...props }: React.ComponentProps<'caption'>): import("react/jsx-runtime").JSX.Element;
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };
+//# sourceMappingURL=table.d.ts.map

package/dist/src/presentation/web/components/ui/table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAUpE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAE1E;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAQ1E;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAWpE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAWrE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAWrE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,2CAQ7E;AAED,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC"}