create-principles-disciple 1.0.0 → 1.74.0

package/console/dist/ui/api.js

@@ -0,0 +1,243 @@
+function getToken() {
+    return sessionStorage.getItem("pd_token");
+}
+function setToken(token) {
+    sessionStorage.setItem("pd_token", token);
+}
+function clearToken() {
+    sessionStorage.removeItem("pd_token");
+}
+async function request(path, options) {
+    const token = getToken();
+    const headers = {
+        "Content-Type": "application/json",
+    };
+    if (token) {
+        headers.Authorization = `Bearer ${token}`;
+    }
+    try {
+        const response = await fetch(path, {
+            ...options,
+            headers: {
+                ...headers,
+                ...options?.headers,
+            },
+        });
+        if (!response.ok) {
+            let errorMessage = `HTTP ${response.status}`;
+            try {
+                const parsed = await response.json();
+                if (parsed && typeof parsed.message === 'string') {
+                    errorMessage = parsed.message;
+                }
+                else if (parsed && typeof parsed.error === 'string') {
+                    errorMessage = parsed.error;
+                }
+            }
+            catch {
+                // ignore parse errors
+            }
+            return { success: false, error: errorMessage };
+        }
+        const json = await response.json();
+        if (json.success === true && json.data !== undefined) {
+            return { success: true, data: json.data };
+        }
+        return { success: true, data: json };
+    }
+    catch (err) {
+        return {
+            success: false,
+            error: err instanceof Error ? err.message : "Network error",
+        };
+    }
+}
+async function checkAuth() {
+    const result = await request("/api/health");
+    return result.success;
+}
+async function fetchTasks() {
+    return request("/api/tasks");
+}
+async function fetchTaskEvidence(id) {
+    return request(`/api/tasks/${id}/evidence`);
+}
+async function approveTask(id) {
+    return request(`/api/tasks/${id}/approve`, { method: "POST" });
+}
+async function rejectTask(id) {
+    return request(`/api/tasks/${id}/reject`, { method: "POST" });
+}
+async function cleanupTask(id) {
+    return request(`/api/tasks/${id}/cleanup`, { method: "POST" });
+}
+async function fetchStatus() {
+    return request("/api/status");
+}
+async function fetchActivity() {
+    return request("/api/activity");
+}
+async function fetchOverview() {
+    return request("/api/overview");
+}
+async function fetchOverviewHealth() {
+    return request("/api/overview/health");
+}
+async function fetchGateStats() {
+    return request("/api/gate/stats");
+}
+async function fetchGateBlocks(limit) {
+    const query = limit ? `?limit=${limit}` : '';
+    return request(`/api/gate/blocks${query}`);
+}
+async function fetchFeedbackGfi() {
+    return request("/api/feedback/gfi");
+}
+async function fetchEmpathyEvents(limit) {
+    const query = limit ? `?limit=${limit}` : '';
+    return request(`/api/feedback/empathy-events${query}`);
+}
+async function fetchFeedbackGateBlocks(limit) {
+    const query = limit ? `?limit=${limit}` : '';
+    return request(`/api/feedback/gate-blocks${query}`);
+}
+async function fetchWorkspaces() {
+    return request("/api/workspaces");
+}
+async function addWorkspace(name, path) {
+    return request("/api/workspaces", {
+        method: "POST",
+        body: JSON.stringify({ name, path }),
+    });
+}
+async function removeWorkspace(name) {
+    return request(`/api/workspaces/${encodeURIComponent(name)}`, { method: "DELETE" });
+}
+async function syncWorkspace(name) {
+    return request(`/api/workspaces/${encodeURIComponent(name)}/sync`, { method: "POST" });
+}
+async function fetchCentralOverview() {
+    return request("/api/central/overview");
+}
+async function fetchCentralHealth() {
+    return request("/api/central/health");
+}
+async function fetchSamples(status, page) {
+    const params = new URLSearchParams();
+    if (status && status !== 'all')
+        params.set('status', status);
+    if (page)
+        params.set('page', String(page));
+    const query = params.toString() ? `?${params.toString()}` : '';
+    return request(`/api/samples${query}`);
+}
+async function fetchSampleDetail(sampleId) {
+    return request(`/api/samples/${encodeURIComponent(sampleId)}`);
+}
+async function reviewSample(sampleId, decision) {
+    return request(`/api/samples/${encodeURIComponent(sampleId)}/review`, {
+        method: 'POST',
+        body: JSON.stringify({ decision }),
+    });
+}
+async function fetchEvolutionStats() {
+    return request("/api/evolution/stats");
+}
+async function fetchEvolutionTasks(status, page) {
+    const params = new URLSearchParams();
+    if (status && status !== 'all')
+        params.set('status', status);
+    if (page)
+        params.set('page', String(page));
+    const query = params.toString() ? `?${params.toString()}` : '';
+    return request(`/api/evolution/tasks${query}`);
+}
+async function fetchEvolutionPrinciples() {
+    return request("/api/evolution/principles");
+}
+async function fetchPrinciples() {
+    return request("/api/principles");
+}
+async function fetchPrincipleDetail(principleId) {
+    return request(`/api/principles/${encodeURIComponent(principleId)}`);
+}
+async function fetchEvolutionQueue() {
+    return request("/api/evolution/queue");
+}
+async function fetchThinkingModels() {
+    return request("/api/thinking-models");
+}
+async function fetchSystemHealth() {
+    return request("/api/health");
+}
+async function fetchPipelineStats() {
+    return request("/api/pipeline");
+}
+async function fetchEvents(options) {
+    const params = new URLSearchParams();
+    if (options.types)
+        options.types.forEach(type => params.append('type', type));
+    if (options.startDate)
+        params.set('startDate', options.startDate);
+    if (options.endDate)
+        params.set('endDate', options.endDate);
+    if (options.searchQuery)
+        params.set('q', options.searchQuery);
+    if (options.page)
+        params.set('page', options.page.toString());
+    if (options.pageSize)
+        params.set('pageSize', options.pageSize.toString());
+    const queryStr = params.toString() ? `?${params.toString()}` : '';
+    return request(`/api/events${queryStr}`);
+}
+async function fetchEventsGrouped(options) {
+    const params = new URLSearchParams();
+    if (options?.startDate)
+        params.set('startDate', options.startDate);
+    if (options?.endDate)
+        params.set('endDate', options.endDate);
+    const queryStr = params.toString() ? `?${params.toString()}` : '';
+    return request(`/api/events/grouped${queryStr}`);
+}
+async function fetchRelatedEvents(eventId, maxDistance) {
+    const params = new URLSearchParams();
+    if (maxDistance)
+        params.set('maxDistance', maxDistance.toString());
+    const queryStr = params.toString() ? `?${params.toString()}` : '';
+    return request(`/api/events/${encodeURIComponent(eventId)}/related${queryStr}`);
+}
+async function fetchAgents() {
+    return request("/api/agents");
+}
+async function fetchAgentDetail(id) {
+    return request(`/api/agents/${encodeURIComponent(id)}`);
+}
+async function fetchApprovals(params) {
+    const searchParams = new URLSearchParams();
+    if (params?.status)
+        searchParams.set('status', params.status);
+    if (params?.channel)
+        searchParams.set('channel', params.channel);
+    if (params?.page)
+        searchParams.set('page', String(params.page));
+    if (params?.pageSize)
+        searchParams.set('pageSize', String(params.pageSize));
+    const qs = searchParams.toString() ? '?' + searchParams.toString() : '';
+    return request('/api/v1/approvals' + qs);
+}
+async function fetchApprovalDetail(approvalId) {
+    return request('/api/v1/approvals/' + encodeURIComponent(approvalId));
+}
+async function approveApproval(approvalId, note) {
+    return request('/api/v1/approvals/' + encodeURIComponent(approvalId) + '/approve', {
+        method: 'POST',
+        body: JSON.stringify({ note }),
+    });
+}
+async function rejectApproval(approvalId, reason) {
+    return request('/api/v1/approvals/' + encodeURIComponent(approvalId) + '/reject', {
+        method: 'POST',
+        body: JSON.stringify({ reason }),
+    });
+}
+export { getToken, setToken, clearToken, checkAuth, request, fetchTasks, fetchTaskEvidence, approveTask, rejectTask, cleanupTask, fetchStatus, fetchActivity, fetchOverview, fetchOverviewHealth, fetchGateStats, fetchGateBlocks, fetchFeedbackGfi, fetchEmpathyEvents, fetchFeedbackGateBlocks, fetchWorkspaces, addWorkspace, removeWorkspace, syncWorkspace, fetchCentralOverview, fetchCentralHealth, fetchSamples, fetchSampleDetail, reviewSample, fetchEvolutionStats, fetchEvolutionTasks, fetchEvolutionPrinciples, fetchPrinciples, fetchPrincipleDetail, fetchEvolutionQueue, fetchThinkingModels, fetchSystemHealth, fetchPipelineStats, fetchEvents, fetchEventsGrouped, fetchRelatedEvents, fetchAgents, fetchAgentDetail, fetchApprovals, fetchApprovalDetail, approveApproval, rejectApproval, };

package/console/dist/ui/components/UpdateBanner.d.ts

@@ -0,0 +1 @@
+export declare function UpdateBanner(): import("react/jsx-runtime").JSX.Element | null;

package/console/dist/ui/components/UpdateBanner.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { Badge } from "./ui/badge.js";
+import { RefreshCw, X } from "lucide-react";
+export function UpdateBanner() {
+    const { t } = useTranslation();
+    const [updateInfo, setUpdateInfo] = useState(null);
+    const [dismissed, setDismissed] = useState(false);
+    useEffect(() => {
+        async function check() {
+            try {
+                const response = await fetch("/api/update/check");
+                const result = await response.json();
+                if (typeof result === "object" && result !== null &&
+                    Object.hasOwn(result, "success") && result.success === true) {
+                    const data = result.data;
+                    if (typeof data === "object" && data !== null &&
+                        typeof data.hasUpdate === "boolean" &&
+                        typeof data.currentVersion === "string") {
+                        setUpdateInfo(data);
+                    }
+                    else {
+                        console.error("[UpdateBanner] Invalid data shape from /api/update/check:", data);
+                    }
+                }
+            }
+            catch (err) {
+                console.error("[UpdateBanner] Failed to check for updates:", err);
+            }
+        }
+        check();
+    }, []);
+    if (!updateInfo?.hasUpdate || dismissed) {
+        return null;
+    }
+    return (_jsx("div", { className: "bg-primary/5 border-b border-primary/20 px-4 py-2", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(RefreshCw, { className: "h-4 w-4 text-primary animate-spin", style: { animationDuration: "3s" } }), _jsx("span", { className: "text-sm", children: t("components:updateBanner.newVersion", {
+                                version: updateInfo.latestVersion,
+                                defaultValue: `PD ${updateInfo.latestVersion} 可用`,
+                            }) }), _jsxs(Badge, { variant: "outline", className: "text-xs", children: [updateInfo.currentVersion, " \u2192 ", updateInfo.latestVersion] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("a", { href: "#/settings/update", className: "text-sm font-medium text-primary hover:underline", children: t("components:updateBanner.updateNow", { defaultValue: "立即更新" }) }), _jsx("button", { onClick: () => setDismissed(true), className: "p-1 text-muted-foreground hover:text-foreground", "aria-label": t("common:dismiss", { defaultValue: "关闭" }), children: _jsx(X, { className: "h-3 w-3" }) })] })] }) }));
+}

package/console/dist/ui/components/UpdateProgressDialog.d.ts

@@ -0,0 +1,12 @@
+export type UpdateStatus = "checking" | "downloading" | "applying" | "completed" | "failed";
+interface UpdateProgressDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    status: UpdateStatus;
+    currentVersion: string;
+    targetVersion: string;
+    errorMessage?: string;
+    onRollback?: () => void;
+}
+export declare function UpdateProgressDialog({ open, onOpenChange, status, currentVersion, targetVersion, errorMessage, onRollback, }: UpdateProgressDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/console/dist/ui/components/UpdateProgressDialog.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, } from "./ui/dialog.js";
+import { Button } from "./ui/button.js";
+import { Loader2, CheckCircle2, XCircle } from "lucide-react";
+const STATUS_ICONS = {
+    checking: _jsx(Loader2, { className: "h-5 w-5 animate-spin text-primary" }),
+    downloading: _jsx(Loader2, { className: "h-5 w-5 animate-spin text-primary" }),
+    applying: _jsx(Loader2, { className: "h-5 w-5 animate-spin text-primary" }),
+    completed: _jsx(CheckCircle2, { className: "h-5 w-5 text-green-600" }),
+    failed: _jsx(XCircle, { className: "h-5 w-5 text-destructive" }),
+};
+export function UpdateProgressDialog({ open, onOpenChange, status, currentVersion, targetVersion, errorMessage, onRollback, }) {
+    const { t } = useTranslation();
+    const isActive = status === "checking" || status === "downloading" || status === "applying";
+    const isDone = status === "completed" || status === "failed";
+    const statusLabels = {
+        checking: t("components:updateProgress.checking", { defaultValue: "正在检查更新..." }),
+        downloading: t("components:updateProgress.downloading", { defaultValue: "正在下载更新包..." }),
+        applying: t("components:updateProgress.applying", { defaultValue: "正在应用更新..." }),
+        completed: t("components:updateProgress.completed", { defaultValue: "更新完成！" }),
+        failed: t("components:updateProgress.failed", { defaultValue: "更新失败" }),
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: isDone ? onOpenChange : undefined, children: _jsxs(DialogContent, { className: "max-w-md", onPointerDownOutside: (e) => { if (isActive)
+                e.preventDefault(); }, children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2", children: [STATUS_ICONS[status], statusLabels[status]] }), _jsx(DialogDescription, { children: _jsxs("span", { className: "font-mono text-sm", children: ["v", currentVersion, " \u2192 v", targetVersion] }) })] }), status === "failed" && errorMessage && (_jsx("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: errorMessage })), isActive && (_jsx("div", { className: "space-y-2", children: _jsx("div", { className: "h-2 rounded-full bg-muted overflow-hidden", children: _jsx("div", { className: "h-full bg-primary rounded-full transition-all duration-500", style: {
+                                width: status === "checking" ? "30%" : status === "downloading" ? "60%" : "85%",
+                            } }) }) })), _jsxs(DialogFooter, { children: [status === "failed" && onRollback && (_jsx(Button, { variant: "outline", onClick: onRollback, children: t("components:updateProgress.rollback", { defaultValue: "回滚" }) })), isDone && (_jsx(Button, { onClick: () => onOpenChange(false), children: t("common:close", { defaultValue: "关闭" }) }))] })] }) }));
+}

package/console/dist/ui/components/app-sidebar.d.ts

@@ -0,0 +1,7 @@
+interface AppSidebarProps {
+    className?: string;
+    collapsed?: boolean;
+    onCollapsedChange?: (collapsed: boolean) => void;
+}
+export declare function AppSidebar({ className, collapsed, onCollapsedChange }: AppSidebarProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/console/dist/ui/components/app-sidebar.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Link, useLocation } from "react-router-dom";
+import { Flame, ScrollText, ShieldCheck, Settings, ChevronLeft, ChevronRight, ChevronDown, ChevronUp, AlertTriangle, Activity, FileText, Dna, Wrench, } from "lucide-react";
+import { cn } from "../../lib/utils.js";
+import { isNavActive } from "../utils/navigation.js";
+import { Button } from "./ui/button.js";
+import { Badge } from "./ui/badge.js";
+import { fetchSystemHealth } from "../api.js";
+const mvpNavItems = [
+    { id: "pain", label: "Pain", icon: Flame, href: "/pain", alsoActive: ["/"] },
+    { id: "principles", label: "Principle", icon: ScrollText, href: "/principles" },
+    { id: "approvals", label: "Approval", icon: ShieldCheck, href: "/approvals" },
+];
+const diagnosticNavItems = [
+    { id: "overview", label: "Overview", icon: Activity, href: "/overview" },
+    { id: "data-flow", label: "Data Flow", icon: Activity, href: "/data-flow" },
+    { id: "event-log", label: "Event Log", icon: FileText, href: "/event-log" },
+    { id: "evolution", label: "Evolution", icon: Dna, href: "/evolution" },
+];
+export function AppSidebar({ className, collapsed = false, onCollapsedChange }) {
+    const location = useLocation();
+    const [healthData, setHealthData] = useState(null);
+    const [alertCount, setAlertCount] = useState(0);
+    const [healthError, setHealthError] = useState(null);
+    const [diagnosticsOpen, setDiagnosticsOpen] = useState(false);
+    const isActive = (href, alsoActive) => isNavActive(href, location.pathname, alsoActive);
+    useEffect(() => {
+        const fetchHealth = async () => {
+            try {
+                setHealthError(null);
+                const result = await fetchSystemHealth();
+                if (result.success && result.data) {
+                    setHealthData(result.data);
+                    const errorChecks = result.data.checks.filter(c => c.status === "error").length;
+                    const warningChecks = result.data.checks.filter(c => c.status === "warning").length;
+                    setAlertCount(errorChecks + warningChecks);
+                }
+                else if (!result.success) {
+                    setHealthError(result.error ?? "Failed to load health status");
+                }
+            }
+            catch (err) {
+                setHealthError(err instanceof Error ? err.message : "Network error");
+            }
+        };
+        fetchHealth();
+        const interval = setInterval(fetchHealth, 30000);
+        return () => clearInterval(interval);
+    }, []);
+    const getAlertBadgeVariant = () => {
+        if (!healthData)
+            return "secondary";
+        if (healthData.overall === "error")
+            return "destructive";
+        if (healthData.overall === "degraded")
+            return "secondary";
+        return "default";
+    };
+    const isDiagnosticsActive = diagnosticNavItems.some(d => isActive(d.href));
+    return (_jsxs("aside", { className: cn("fixed left-0 top-0 h-screen bg-sidebar border-r border-border flex flex-col transition-all duration-300 ease-in-out z-50", collapsed ? "w-16" : "w-56", className), children: [_jsx("div", { className: "p-4 border-b border-border", children: _jsxs("div", { className: cn("flex items-center gap-3 font-bold text-lg text-primary", collapsed && "justify-center"), children: [_jsxs("div", { className: "relative", children: [_jsx(Dna, { className: "h-6 w-6", "aria-hidden": "true" }), alertCount > 0 && (_jsx(Badge, { variant: getAlertBadgeVariant(), className: "absolute -top-2 -right-2 h-5 min-w-5 flex items-center justify-center p-0 text-[10px]", children: alertCount }))] }), !collapsed && (_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { children: "PD Console" }), alertCount > 0 && (_jsxs("div", { className: "flex items-center gap-1 text-xs text-destructive", children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), _jsx("span", { children: alertCount })] })), healthError && (_jsxs("div", { className: "flex items-center gap-1 text-xs text-destructive", title: healthError, children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), _jsx("span", { children: "!" })] }))] }), _jsx("span", { className: "text-[10px] text-muted-foreground mt-0.5 tracking-wider", children: "Burn pain, drive evolution" })] }))] }) }), _jsxs("nav", { className: "flex-1 py-4 overflow-y-auto", children: [_jsxs("div", { className: "mb-2", children: [!collapsed && (_jsx("div", { className: "px-4 pb-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground", children: "MVP Journey" })), mvpNavItems.map((item) => {
+                                const Icon = item.icon;
+                                return (_jsxs(Link, { to: item.href, "data-testid": `nav-${item.id}`, className: cn("flex items-center gap-3 px-4 py-3 text-sm transition-all duration-200", "hover:bg-accent hover:text-accent-foreground", isActive(item.href, item.alsoActive)
+                                        ? "bg-primary/10 text-primary border-r-2 border-primary"
+                                        : "text-muted-foreground", collapsed && "justify-center"), children: [_jsx(Icon, { className: "h-5 w-5 flex-shrink-0", "aria-hidden": "true" }), !collapsed && _jsx("span", { children: item.label })] }, item.id));
+                            })] }), _jsxs("div", { className: "border-t border-border pt-2 mt-2", children: [_jsxs("button", { type: "button", "data-testid": "diagnostics-toggle", onClick: () => setDiagnosticsOpen(!diagnosticsOpen), className: cn("flex items-center gap-3 px-4 py-2 text-xs w-full text-left transition-all duration-200", "hover:bg-accent hover:text-accent-foreground", isDiagnosticsActive ? "text-primary" : "text-muted-foreground", collapsed && "justify-center"), children: [_jsx(Wrench, { className: "h-4 w-4 flex-shrink-0", "aria-hidden": "true" }), !collapsed && (_jsxs(_Fragment, { children: [_jsx("span", { className: "flex-1 uppercase tracking-wider font-semibold", children: "Diagnostics" }), diagnosticsOpen ? (_jsx(ChevronUp, { className: "h-3 w-3" })) : (_jsx(ChevronDown, { className: "h-3 w-3" }))] }))] }), (diagnosticsOpen || collapsed) && diagnosticNavItems.map((item) => {
+                                const Icon = item.icon;
+                                return (_jsxs(Link, { to: item.href, "data-testid": `nav-${item.id}`, className: cn("flex items-center gap-3 px-4 py-2 text-xs transition-all duration-200", "hover:bg-accent hover:text-accent-foreground", isActive(item.href)
+                                        ? "bg-primary/10 text-primary border-r-2 border-primary"
+                                        : "text-muted-foreground", collapsed && "justify-center"), children: [_jsx(Icon, { className: "h-4 w-4 flex-shrink-0", "aria-hidden": "true" }), !collapsed && _jsx("span", { children: item.label })] }, item.id));
+                            })] }), _jsx("div", { className: "border-t border-border pt-2 mt-2", children: _jsxs(Link, { to: "/settings", "data-testid": "nav-settings", className: cn("flex items-center gap-3 px-4 py-2 text-xs transition-all duration-200", "hover:bg-accent hover:text-accent-foreground", isActive("/settings")
+                                ? "bg-primary/10 text-primary border-r-2 border-primary"
+                                : "text-muted-foreground", collapsed && "justify-center"), children: [_jsx(Settings, { className: "h-4 w-4 flex-shrink-0", "aria-hidden": "true" }), !collapsed && _jsx("span", { children: "Settings" })] }) })] }), _jsx("div", { className: "p-2 border-t border-border", children: _jsx(Button, { variant: "ghost", size: "icon", onClick: () => onCollapsedChange?.(!collapsed), className: "w-full justify-center", children: collapsed ? (_jsx(ChevronRight, { className: "h-5 w-5" })) : (_jsx(ChevronLeft, { className: "h-5 w-5" })) }) })] }));
+}

package/console/dist/ui/components/approval-card.d.ts

@@ -0,0 +1,8 @@
+import type { ApprovalRecord } from "../api.js";
+export declare function ApprovalCard({ approval, onApprove, onReject, onViewDetail, loading, }: {
+    approval: ApprovalRecord;
+    onApprove: () => void;
+    onReject: () => void;
+    onViewDetail: () => void;
+    loading?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/console/dist/ui/components/approval-card.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Card, CardContent } from "./ui/card.js";
+import { Button } from "./ui/button.js";
+import { Badge } from "./ui/badge.js";
+import { Check, X, Eye } from "lucide-react";
+function timeAgo(date, t) {
+    const seconds = Math.floor((Date.now() - date.getTime()) / 1000);
+    if (seconds < 60)
+        return t("pages:tasks.secondsAgo", { count: seconds });
+    const minutes = Math.floor(seconds / 60);
+    if (minutes < 60)
+        return t("pages:tasks.minutesAgo", { count: minutes });
+    const hours = Math.floor(minutes / 60);
+    if (hours < 24)
+        return t("pages:tasks.hoursAgo", { count: hours });
+    const days = Math.floor(hours / 24);
+    return t("components:pageHeader.daysAgo", { count: days });
+}
+const CONFIDENCE_COLORS = {
+    high: "bg-green-100 text-green-800 border-green-300",
+    medium: "bg-amber-100 text-amber-800 border-amber-300",
+    low: "bg-red-100 text-red-800 border-red-300",
+};
+const RISK_COLORS = {
+    low: "bg-green-50 text-green-700",
+    medium: "bg-amber-50 text-amber-700",
+    high: "bg-red-50 text-red-700",
+};
+function getChannelLabel(channel, t) {
+    const key = "components:approvalCard.channel." + channel;
+    const translated = t(key);
+    return translated !== key ? translated : channel;
+}
+export function ApprovalCard({ approval, onApprove, onReject, onViewDetail, loading, }) {
+    const { t } = useTranslation();
+    const isPending = approval.status === "pending";
+    return (_jsx(Card, { className: "mb-3 transition-all duration-200 hover:shadow-sm", children: _jsxs(CardContent, { className: "p-4", children: [_jsx("div", { className: "flex items-start justify-between gap-3", children: _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 mb-1.5 flex-wrap", children: [_jsx(Badge, { variant: "outline", className: "text-xs", children: getChannelLabel(approval.channel, t) }), _jsx(Badge, { className: "text-xs border " + (CONFIDENCE_COLORS[approval.confidenceLabel] ?? CONFIDENCE_COLORS.medium), children: t("components:approvalCard.confidence." + approval.confidenceLabel) }), approval.riskLevel && (_jsx(Badge, { variant: "secondary", className: "text-xs " + (RISK_COLORS[approval.riskLevel] ?? ""), children: t("components:approvalCard.riskLevel." + approval.riskLevel, approval.riskLevel) })), _jsx("span", { className: "text-xs text-muted-foreground", children: timeAgo(new Date(approval.requestedAt), t) })] }), _jsx("p", { className: "font-medium text-sm line-clamp-2", children: approval.summary ?? approval.approvalId })] }) }), isPending && (_jsxs("div", { className: "flex items-center gap-2 mt-3 pt-3 border-t", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: onViewDetail, className: "flex items-center gap-1", disabled: loading, children: [_jsx(Eye, { className: "h-3 w-3" }), t("components:approvalCard.viewDetail")] }), _jsx("div", { className: "flex-1" }), _jsxs(Button, { variant: "destructive", size: "sm", onClick: onReject, className: "flex items-center gap-1", disabled: loading, children: [_jsx(X, { className: "h-3 w-3" }), t("components:approvalCard.reject")] }), _jsxs(Button, { variant: "default", size: "sm", onClick: onApprove, className: "flex items-center gap-1", disabled: loading, children: [_jsx(Check, { className: "h-3 w-3" }), t("components:approvalCard.approve")] })] })), !isPending && (_jsxs("div", { className: "flex items-center gap-2 mt-3 pt-3 border-t", children: [_jsx(Badge, { variant: approval.status === "approved" ? "default" : "secondary", children: t("components:approvalCard.status." + approval.status) }), approval.decidedBy && (_jsx("span", { className: "text-xs text-muted-foreground", children: t("components:approvalCard.decidedBy", { by: approval.decidedBy }) })), _jsx("div", { className: "flex-1" }), _jsx(Button, { variant: "ghost", size: "sm", onClick: onViewDetail, disabled: loading, "aria-label": t("components:approvalCard.viewDetail"), children: _jsx(Eye, { className: "h-3 w-3" }) })] }))] }) }));
+}

package/console/dist/ui/components/approval-detail-dialog.d.ts

@@ -0,0 +1,9 @@
+import type { ApprovalRecord } from "../api.js";
+export declare function ApprovalDetailDialog({ approval, open, onOpenChange, onApprove, onReject, loading, }: {
+    approval: ApprovalRecord | null;
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    onApprove: () => void;
+    onReject: () => void;
+    loading?: boolean;
+}): import("react/jsx-runtime").JSX.Element | null;

package/console/dist/ui/components/approval-detail-dialog.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, } from "./ui/dialog.js";
+import { Button } from "./ui/button.js";
+import { Badge } from "./ui/badge.js";
+import { Separator } from "./ui/separator.js";
+import { Check, X } from "lucide-react";
+const CONFIDENCE_COLORS = {
+    high: "bg-green-100 text-green-800 border-green-300",
+    medium: "bg-amber-100 text-amber-800 border-amber-300",
+    low: "bg-red-100 text-red-800 border-red-300",
+};
+export function ApprovalDetailDialog({ approval, open, onOpenChange, onApprove, onReject, loading, }) {
+    const { t } = useTranslation();
+    if (!approval)
+        return null;
+    const isPending = approval.status === "pending";
+    const canAct = isPending && approval.isMvpProven !== false;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-w-lg max-h-[80vh] overflow-y-auto", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { className: "text-base", children: approval.summary ?? approval.approvalId }), _jsx(DialogDescription, { children: _jsxs("div", { className: "flex items-center gap-2 mt-1", children: [_jsx(Badge, { variant: "outline", className: "text-xs", children: t("components:approvalCard.channel." + approval.channel, approval.channel) }), _jsx(Badge, { className: "text-xs border " + (CONFIDENCE_COLORS[approval.confidenceLabel] ?? CONFIDENCE_COLORS.medium), children: t("components:approvalCard.confidence." + approval.confidenceLabel) }), approval.riskLevel && (_jsx(Badge, { variant: "secondary", className: "text-xs", children: t("components:approvalCard.riskLevel." + approval.riskLevel, approval.riskLevel) }))] }) })] }), _jsxs("div", { className: "space-y-4", children: [approval.triggerReason && (_jsxs("div", { children: [_jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: t("components:approvalDetail.whyRecommended") }), _jsx("p", { className: "text-sm", children: approval.triggerReason })] })), approval.confidenceExplanation && (_jsxs("div", { children: [_jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: t("components:approvalDetail.confidenceExplanation") }), _jsx("p", { className: "text-sm", children: approval.confidenceExplanation })] })), approval.effectDescription && (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsxs("div", { children: [_jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: t("components:approvalDetail.whatHappens") }), _jsx("p", { className: "text-sm", children: approval.effectDescription })] })] })), approval.rejectionEffect && (_jsxs("div", { className: "bg-red-50 dark:bg-red-950/20 rounded-md p-3", children: [_jsx("p", { className: "text-xs font-medium text-red-600 dark:text-red-400 mb-1", children: t("components:approvalDetail.ifReject") }), _jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: approval.rejectionEffect })] }))] }), isPending && approval.isMvpProven === false && (_jsxs("div", { className: "text-xs text-muted-foreground italic pt-2", children: [t("components:approvalCard.channel." + approval.channel, approval.channel), " \u2014 ", t("components:approvalCard.channel.retired", "retired")] })), canAct && (_jsxs(DialogFooter, { children: [_jsxs(Button, { variant: "destructive", size: "sm", onClick: onReject, disabled: loading, className: "flex items-center gap-1", children: [_jsx(X, { className: "h-3 w-3" }), t("components:approvalCard.reject")] }), _jsxs(Button, { size: "sm", onClick: onApprove, disabled: loading, className: "flex items-center gap-1", children: [_jsx(Check, { className: "h-3 w-3" }), t("components:approvalCard.approve")] })] }))] }) }));
+}

package/console/dist/ui/components/compare-view.d.ts

@@ -0,0 +1,7 @@
+import type { PrincipleListItem } from "../api.js";
+interface CompareViewProps {
+    principles: PrincipleListItem[];
+    onClose: () => void;
+}
+export declare function CompareView({ principles, onClose }: CompareViewProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/console/dist/ui/components/compare-view.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Card, CardContent, CardHeader, CardTitle } from "./ui/card.js";
+import { Badge } from "./ui/badge.js";
+import { Button } from "./ui/button.js";
+import { ValueScoreBar, AdherenceBar } from "./ui/progress-bar.js";
+import { X } from "lucide-react";
+import { cn } from "../../lib/utils.js";
+const STATUS_COLORS = {
+    candidate: "text-amber-500",
+    probation: "text-blue-500",
+    active: "text-primary",
+    deprecated: "text-destructive",
+    archived: "text-muted-foreground",
+};
+const PRIORITY_COLORS = {
+    P0: "text-destructive",
+    P1: "text-amber-500",
+    P2: "text-muted-foreground",
+};
+function DiffRow({ label, left, right, highlight }) {
+    const isDifferent = String(left) !== String(right);
+    return (_jsxs("div", { className: cn("grid grid-cols-[1fr_2fr_2fr] gap-2 py-1.5 px-2 text-xs", isDifferent && highlight && "bg-amber-50 dark:bg-amber-950/20"), children: [_jsx("span", { className: "text-muted-foreground font-medium", children: label }), _jsx("span", { className: cn(isDifferent && highlight && "font-medium"), children: String(left) || "—" }), _jsx("span", { className: cn(isDifferent && highlight && "font-medium"), children: String(right) || "—" })] }));
+}
+export function CompareView({ principles, onClose }) {
+    const { t } = useTranslation();
+    if (principles.length !== 2) {
+        return null;
+    }
+    const [a, b] = principles;
+    return (_jsxs(Card, { className: "border-2 border-primary/20", children: [_jsx(CardHeader, { className: "pb-2", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsx(CardTitle, { className: "text-sm flex items-center gap-2", children: t("pages:principles.compareTitle") }), _jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, children: _jsx(X, { className: "h-4 w-4" }) })] }) }), _jsxs(CardContent, { children: [_jsxs("div", { className: "grid grid-cols-[1fr_2fr_2fr] gap-2 mb-2 text-xs font-medium text-muted-foreground border-b border-border pb-2", children: [_jsx("span", { children: t("pages:principles.compareField") }), _jsxs("span", { className: "flex items-center gap-1", children: [_jsx(Badge, { variant: "outline", className: cn("text-xs", STATUS_COLORS[a.status]), children: a.status }), a.id] }), _jsxs("span", { className: "flex items-center gap-1", children: [_jsx(Badge, { variant: "outline", className: cn("text-xs", STATUS_COLORS[b.status]), children: b.status }), b.id] })] }), _jsxs("div", { className: "divide-y divide-border", children: [_jsx(DiffRow, { label: t("pages:principles.text"), left: a.text, right: b.text, highlight: true }), _jsx(DiffRow, { label: t("pages:principles.status"), left: a.status, right: b.status, highlight: true }), _jsx(DiffRow, { label: t("pages:principles.priority"), left: a.priority, right: b.priority, highlight: true }), _jsx(DiffRow, { label: t("pages:principles.scope"), left: a.scope + (a.domain ? ` / ${a.domain}` : ""), right: b.scope + (b.domain ? ` / ${b.domain}` : ""), highlight: true }), _jsx(DiffRow, { label: t("pages:principles.evaluability"), left: a.evaluability, right: b.evaluability, highlight: true }), _jsx(DiffRow, { label: t("pages:principles.triggerPattern"), left: a.triggerPattern, right: b.triggerPattern, highlight: true }), _jsx(DiffRow, { label: t("pages:principles.action"), left: a.action, right: b.action, highlight: true })] }), _jsxs("div", { className: "grid grid-cols-[1fr_2fr_2fr] gap-2 mt-4 pt-4 border-t border-border", children: [_jsx("span", { className: "text-xs text-muted-foreground font-medium", children: t("pages:principles.valueScore") }), _jsx("div", { children: _jsx(ValueScoreBar, { valueScore: a.valueScore }) }), _jsx("div", { children: _jsx(ValueScoreBar, { valueScore: b.valueScore }) }), _jsx("span", { className: "text-xs text-muted-foreground font-medium", children: t("pages:principles.adherence") }), _jsx("div", { children: _jsx(AdherenceBar, { adherenceRate: a.adherenceRate }) }), _jsx("div", { children: _jsx(AdherenceBar, { adherenceRate: b.adherenceRate }) }), _jsx("span", { className: "text-xs text-muted-foreground font-medium", children: t("pages:principles.painPrevented") }), _jsx("span", { className: "text-xs", children: a.painPreventedCount }), _jsx("span", { className: "text-xs", children: b.painPreventedCount }), _jsx("span", { className: "text-xs text-muted-foreground font-medium", children: t("pages:principles.rules") }), _jsx("span", { className: "text-xs", children: a.ruleCount }), _jsx("span", { className: "text-xs", children: b.ruleCount })] })] })] }));
+}

package/console/dist/ui/components/data-freshness-indicator.d.ts

@@ -0,0 +1,10 @@
+interface DataFreshnessIndicatorProps {
+    lastUpdateTime: string | null | undefined;
+    label: string;
+    thresholdMinutes?: {
+        stale: number;
+        critical: number;
+    };
+}
+export declare function DataFreshnessIndicator({ lastUpdateTime, label, thresholdMinutes, }: DataFreshnessIndicatorProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/console/dist/ui/components/data-freshness-indicator.js

@@ -0,0 +1,63 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Badge } from './ui/badge.js';
+function formatTimeAgo(timestamp, t) {
+    const now = new Date();
+    const time = new Date(timestamp);
+    const diffMs = now.getTime() - time.getTime();
+    const diffSec = Math.floor(diffMs / 1000);
+    const diffMin = Math.floor(diffSec / 60);
+    const diffHour = Math.floor(diffMin / 60);
+    const diffDay = Math.floor(diffHour / 24);
+    if (diffMin < 1)
+        return t('components:dataFreshness.justNow');
+    if (diffMin < 60)
+        return t('components:pageHeader.minutesAgo', { count: diffMin });
+    if (diffHour < 24)
+        return t('components:pageHeader.hoursAgo', { count: diffHour });
+    return t('components:pageHeader.daysAgo', { count: diffDay });
+}
+export function DataFreshnessIndicator({ lastUpdateTime, label, thresholdMinutes = { stale: 5, critical: 15 }, }) {
+    const { t } = useTranslation();
+    const [freshness, setFreshness] = useState('fresh');
+    const [timeAgo, setTimeAgo] = useState('');
+    useEffect(() => {
+        if (!lastUpdateTime) {
+            setFreshness('critical');
+            setTimeAgo(t('components:dataFreshness.never'));
+            return;
+        }
+        const update = () => {
+            const now = new Date();
+            const time = new Date(lastUpdateTime);
+            const diffMs = now.getTime() - time.getTime();
+            const diffMin = diffMs / (1000 * 60);
+            let level = 'fresh';
+            if (diffMin > thresholdMinutes.critical)
+                level = 'critical';
+            else if (diffMin > thresholdMinutes.stale)
+                level = 'stale';
+            setFreshness(level);
+            setTimeAgo(formatTimeAgo(lastUpdateTime, t));
+        };
+        update();
+        const interval = setInterval(update, 10000);
+        return () => clearInterval(interval);
+    }, [lastUpdateTime, thresholdMinutes, t]);
+    const getBadgeVariant = () => {
+        switch (freshness) {
+            case 'fresh': return 'default';
+            case 'stale': return 'secondary';
+            case 'critical': return 'destructive';
+        }
+    };
+    const getStatusText = () => {
+        switch (freshness) {
+            case 'fresh': return t('components:dataFreshness.upToDate');
+            case 'stale': return t('components:dataFreshness.slightlyDelayed');
+            case 'critical': return t('components:dataFreshness.stale');
+        }
+    };
+    return (_jsxs(Badge, { variant: getBadgeVariant(), children: [label, ": ", getStatusText(), " (", timeAgo, ")"] }));
+}