5.2 KiB
5.2 KiB
CORE Workbench v1 — UI Component Map
This document maps conceptual modules to concrete UI components.
The purpose is to keep the implementation coherent and prevent uncontrolled UI sprawl.
Global Layout
+---------------------------------------------------------------+
| TopBar |
+-------------+-------------------------------------------------+
| SideNav | MainContent |
| | |
| | |
+-------------+-------------------------------------------------+
| StatusBar |
+---------------------------------------------------------------+
TopBar
Responsibilities
- runtime status
- backend indicator
- replay health
- revision warning badge
- active session id
- current branch/revision
Components
RuntimeBackendBadgeReplayHealthBadgeRevisionWarningBadgeSessionIndicatorGitRevisionPill
Anti-goals
- giant metrics wall
- animated status spam
- streaming logs
Side Navigation
Sections
- Chat
- Replay
- Proposals
- Evals
- Artifacts
- Runtime
Components
NavItemNavSectionUnreadIndicator(optional future)
Navigation should feel closer to Linear/Raycast than a cloud admin portal.
Chat Screen
Layout
+------------------------------------------------+
| Conversation |
| |
| Prompt |
| Response |
| Trust badges |
| |
+----------------------+-------------------------+
| Composer | TraceDrawer |
+----------------------+-------------------------+
Components
Conversation
ConversationTimelinePromptBubbleResponseSurfaceTrustBadgeRow
Composer
PromptInputSubmitButtonRuntimeModeIndicator
Trace Drawer
Collapsed by default.
Components:
TraceHashCardGroundingCardReplayDigestCardProposalReferenceCardAdmissibilityCardRawTraceViewer
Replay Theater
Layout
+--------------------+---------------------------+
| Artifact Selector | Replay Comparison |
| | |
| | Original vs Replay |
| | |
+--------------------+---------------------------+
Components
ArtifactListReplayComparisonPanelReplayStatusBadgeReplayDiffViewerReplayMetadataTable
Important
No fake “thinking” animations.
Replay evidence should feel:
- precise,
- quiet,
- inspectable.
Proposal Queue
Layout
+----------------------+--------------------------+
| Proposal List | Proposal Detail |
| | |
| pending | replay evidence |
| accepted | proposed chain |
| rejected | downstream effect |
| | provenance |
+----------------------+--------------------------+
Components
List
ProposalTableProposalStateBadgeProposalReplayBadge
Detail
ProposalSummaryCardReplayEvidenceCardProposalChainViewerProposalProvenanceViewerSuggestedCLIBox
Forbidden
- accept button
- reject button
- workflow trigger
Eval Center
Layout
+--------------------+----------------------------+
| Eval Lane List | Eval Result Viewer |
| | |
| cognition | metrics |
| contemplation | failures |
| learning-arc | artifacts |
+--------------------+----------------------------+
Components
EvalLaneCardEvalRunButtonEvalMetricGridEvalFailureViewerEvalArtifactLink
UX Rule
Failures should be easier to inspect than successes.
Artifact Explorer
Layout
+--------------------+----------------------------+
| Artifact Tree | Artifact Viewer |
+--------------------+----------------------------+
Components
ArtifactTreeArtifactMetadataPanelArtifactJSONViewerArtifactTextViewerDigestBadge
Runtime Screen
Components
EngineStateCardCheckpointCardRevisionMismatchAlertRebootEventTimelineBackendStatusCard
Shared Components
Badges
- replay passed/failed
- grounded
- pending review
- refusal
- mutation state
- revision warning
Data viewers
StableJsonViewerDigestValueMetadataTableTimestamp
UX Principle
All shared components should prefer:
- stable layout,
- low motion,
- readable density,
- deterministic ordering.
Components intentionally deferred
Not allowed in v1:
- AI avatar system
- agent marketplace
- plugin panels
- node graph builders
- workflow automation canvas
- hidden background orchestration
- animated cognition theater