docs: add Phase 4 (Web Interface) design spec - #12
Merged
Conversation
Covers visual design tokens (dark theme, Geist, accessible icon+color pairing for the four confidence/error states), layout, the Radix-primitives- plus-custom-Tailwind architecture choice, component tree, the confidence- state and index-status discriminators (both spelled out explicitly against real API/DB shapes to remove ambiguity), data flow via TanStack Query, error handling (frontend never renders 5xx bodies verbatim, checked against the actual backend exception behavior), and testing per 09-testing.md's existing split.
1 task
The spec called the index-status interaction "hover/click" while the component tree paired it with Popover, which only opens on click by default -- a silent narrowing the implementation plan then inherited without flagging. Resolved (Ben's call): swap to HoverCard, Radix's purpose-built primitive for hover+focus-triggered content, and document the real caveat (click opens it via the focus side-effect, which isn't guaranteed in Safari) rather than asserting perfect click support.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
docs/superpowers/specs/2026-07-19-phase-4-web-interface-design.md— the design spec for Phase 4, covering visual design tokens (dark theme, Geist, an accessible icon+color pairing so the four confidence/error states don't rely on hue alone), layout, the Radix-primitives-plus-custom-Tailwind architecture choice, component tree, the confidence-state and index-status discriminators (both spelled out against the real API/DB shapes to remove ambiguity), data flow via TanStack Query, error handling (frontend never renders 5xx bodies verbatim — checked against the actual backend's current exception behavior), and testing per09-testing.md's existing split.Test plan