cdead696ed
- Five-region CSS grid shell (TopBar, LeftNav, Main, StatusFooter; Inspector collapsed)
- Ten placeholder routes with EmptyState cli/string variants and ApiErrorBoundary
- Extended EmptyState API: nextAction accepts string (button) | { kind: "cli", command }
- Updated CommandPalette: real fuzzy search over three commands (Chat, Proposals, Evals)
with ↑/↓/Enter keyboard nav and useInRouterContext degradation for Branch 1 preview
- TanStack Query hooks for all W-026 endpoints; 30s polling on runtime/status
- TypeScript mirror of workbench/schemas.py at src/types/api.ts
- StatusFooter: mutation_mode badge, git_revision (copy on click), checkpoint_revision
with amber warning + ADR-0157/ADR-0158 expansion note
- TopBar: CORE Workbench wordmark, ⌘K palette trigger, connection pill
- ApiErrorBoundary (class component) catches WorkbenchApiError → ErrorState
- scripts/dump-api-schemas.py: AST-based Python dataclass field extractor
- workbench-ui/api-schema-snapshot.json: checked-in drift sentinel
- 51 tests across 10 files (0 failures); enum-coverage 4/4; clean vite build
41 lines
1.4 KiB
TypeScript
41 lines
1.4 KiB
TypeScript
import { NavLink } from "react-router-dom";
|
|
|
|
const NAV_ITEMS = [
|
|
{ label: "Chat", to: "/chat" },
|
|
{ label: "Trace", to: "/trace" },
|
|
{ label: "Replay", to: "/replay" },
|
|
{ label: "Proposals", to: "/proposals" },
|
|
{ label: "Evals", to: "/evals" },
|
|
{ label: "Runs", to: "/runs" },
|
|
{ label: "Packs", to: "/packs" },
|
|
{ label: "Vault", to: "/vault" },
|
|
{ label: "Audit", to: "/audit" },
|
|
{ label: "Settings", to: "/settings" },
|
|
] as const;
|
|
|
|
export function LeftNav() {
|
|
return (
|
|
<nav
|
|
data-region="leftnav"
|
|
className="flex h-full flex-col gap-1 overflow-y-auto border-r border-[var(--color-border-subtle)] bg-[var(--color-surface-base)] p-2"
|
|
aria-label="Main navigation"
|
|
>
|
|
{NAV_ITEMS.map((item) => (
|
|
<NavLink
|
|
key={item.to}
|
|
to={item.to}
|
|
className={({ isActive }) =>
|
|
[
|
|
"block rounded px-3 py-2 text-sm transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--color-focus-ring)]",
|
|
isActive
|
|
? "border-l-2 border-[var(--color-focus-ring)] pl-[10px] text-[var(--color-text-primary)] bg-[var(--color-surface-raised)]"
|
|
: "border-l-2 border-transparent pl-[10px] text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] hover:bg-[var(--color-surface-raised)]",
|
|
].join(" ")
|
|
}
|
|
>
|
|
{item.label}
|
|
</NavLink>
|
|
))}
|
|
</nav>
|
|
);
|
|
}
|