Replace the mock with a high-fidelity one realising the context spine (1A) - #6
Merged
Conversation
… (1A) The shipped read-only UI was built to a different information architecture than the agreed one: a profile dropdown plus four flat sibling tabs, with no context spine, no fleet tree, no breadcrumb, no level-scoped tabs and no global/scoped distinction. The previous low-fidelity mock already carried the rail, tree, contextbar and six workspace tabs, so the built UI is further from the agreed design than the mock it was meant to realise. Recorded in REVIEW-UI §7. This replaces mock-app/ with a high-fidelity, clickable design artifact: - Realises decision 1A: persistent left rail whose fleet tree is the selection spine; Releases/Operations/Registry/Settings as the only global areas; a breadcrumb that is always visible; tabs that appear by level. - Both streams everywhere as a pair, never fused (REVIEW #2). - Evidence provenance always on screen, with the degraded state designed rather than promised (REVIEW #13). - Approvals in their agreed home — rendered from CODEOWNERS on the Releases gate, not a top-level tab (REVIEW #10) — correcting where Access shipped. - The declared-write honesty layer: every editing surface states which file it writes, at which scope, and its blast radius. Fidelity is guaranteed structurally: styles/product.css is generated from the shipped UI bundle, so the mock and the product share one Carbon build and one brand-token mapping and cannot visually diverge. Closes U2b by construction: the mock is data-driven and ships two deliberately different hierarchies — enterprise/site/line/device and region/plant/cell/device — rendered by the same code, every badge/breadcrumb/chain derived from the fixture's own hierarchy.levels. No level name appears in the logic, matching the kernel where only the terminal `device` is special. The second fixture also carries the degraded paths (no CODEOWNERS, no evidence source, unresolved digests) so those are designed, not left to chance. Scope is the shell plus the screens the kernel can already serve (Overview, Config, Render, Releases gate); Components/Topology/History and the remaining global areas render as explicit "not designed yet" states, never invented content. Verified in a browser across both hierarchies; console clean. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LsX7cWVGLszurNYMVwMJGo
The mock was written to double as an argument that it complied with the agreed decisions, so the compliance case ended up rendered inside the UI: register citations (S-4, S-7, REVIEW #4, decision 3A), advocacy prose ("the honesty layer that keeps the Studio from becoming a second, hidden configuration system", "it never holds a parallel approval store"), and roadmap markers ("not this pass", "next pass", "the write-path cut"). Wrong audience, and duplicated what REVIEW-UI §7 and the README already say. It also defeated the mock's purpose. Text density is one of the main things a high-fidelity mock exists to let you judge; rationale paragraphs above every table overstate the real copy budget and obscure layout, density and hierarchy. Roadmap markers and internal references in a user-facing surface are ruled out anyway. The screens now state what the system does, in the product's voice. Rationale moved behind a "Design notes" toggle in the context bar, off by default and styled as obvious non-product chrome (dashed copper, "design note" label). Undesigned areas still say so — a reviewer needs that — but as chrome, without product voice or register citations. Verified by rendering every screen state headlessly: 264 states across both hierarchies × every scope/node/global selection × every tab × both toggle states — 0 rationale leaks with notes off, 132 regions annotated with notes on, no throws. The one surviving register string with notes off is the evidence bundle's own `pass (S-1..S-9)` value, which is the literal field the kernel's evidence.json records, shown as recorded. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LsX7cWVGLszurNYMVwMJGo
Two panels survived the first pass because they were neither citations nor
advocacy — but they still explained design rules instead of showing state, on a
screen with no editor on it:
- "What an edit here would write" described a capability that isn't present.
The declared-write panel belongs attached to an actual editor, at commit time.
- "Set from placement — hierarchy and identity cannot be authored in a layer"
stated a rule. In the product that surfaces as a validation error when someone
tries it, not as permanent furniture.
Replaced with the equivalent facts:
- "Layer at this scope" — the file authored at the selection, what it applies to,
and its restart impact. Properties of the thing on screen.
- "Derived" — the actual computed hierarchy.levels and identity values merged
into every component here. More useful to an author than the rule was, since
it shows what is stamped rather than what is forbidden.
Both rationales moved behind the Design notes toggle. The verification guard now
also catches this subtler class ("would write", "cannot be authored", "is never",
"are stamped"): 264 screen states, 0 leaks with notes off, 132 annotated with
notes on.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LsX7cWVGLszurNYMVwMJGo
mbreissi
force-pushed
the
design/high-fidelity-mock
branch
from
July 24, 2026 14:50
a56950b to
e6168a1
Compare
mbreissi
added a commit
that referenced
this pull request
Jul 24, 2026
W8 ruled by the user 2026-07-24: optimistic concurrency with semantic, output-level conflict detection, and no user-visible branches. Seven rulings recorded in REVIEW.md §6 #16: 1. A draft is a named change; the branch is an implementation detail. The author names the change, the Studio derives the ref, and the vocabulary is propose -> review -> apply. A draft opens implicitly on first edit. 2. Optimistic concurrency, no locks at any granularity — a lock is a second control plane over Git, goes stale, blocks across teams, and needs the identity work that is deliberately deferred. 3. Conflict detection is semantic at the effective-config level, never textual: render base, draft, main-now and merge(draft, main-now) and compare outputs. This catches what Git cannot see — two drafts touching different files, no textual conflict, changed effective config. 4. Rebase is continuous and invisible; a moved base surfaces as a consequence diff, not a Git conflict. 5. Detect and surface, never auto-resolve. Scope delete/rename across drafts is an unconditional conflict. 6. Presence is advisory, not a claim. 7. Apply is the host's PR merge, gated by CODEOWNERS (register #10). Two consequences recorded with it: the write path forces a Git-credential decision (ship a bot/App identity behind the same port as per-user acting-as-user OAuth; design for the latter), and the authorization posture must not drift — authentication buys attribution and acting-as-user, never a role system; authorization stays CODEOWNERS + branch protection on the host. Propagated in the same change: the W8 finding and the "remains open" line in REVIEW.md; REVIEW-UI F2 and M8; PLAN.md (write path unblocked, W8 struck from the open list); the deck's two draft cards, which said the UI "creates a Git branch and locks the editing context" — both now wrong on two counts; and the mock's draft chip, which showed a raw ref and now shows the change's title. Also fixes a regression from #6: seven deck links still pointed at mock pages that PR deleted. They now resolve to the single-page mock, and the mock gained minimal hash deep-linking (#area=Releases, #tab=Config) so those links land where they claim. Verified: all six hash forms resolve to the right selection and tab, and the full sweep is still clean (264 screen states, 0 rationale leaks). Claude-Session: https://claude.ai/code/session_01LsX7cWVGLszurNYMVwMJGo Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
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.
Why
You flagged that the shipped UI "bears little resemblance to what was mocked". Confirmed — and it's a regression, not a fidelity gap. The shipped read-only UI (edgecommons#70/#71/#72) is a profile dropdown plus four flat sibling tabs, with no context spine, no fleet tree, no breadcrumb, no level-scoped tabs, no global/scoped distinction — none of decision 1A. The previous low-fi mock already carried the rail, tree, contextbar and six workspace tabs, so the built UI is further from the agreed design than the mock it was meant to realise.
Two placements are also wrong against decisions already taken:
The server side is unaffected: the four read-only endpoints map cleanly onto the agreed tabs. What must be rebuilt is the shell and the placement. Recorded in
REVIEW-UI§7.What this is
design/mock-app/replaced by a high-fidelity, clickable design artifact realising 1A: persistent left rail whose fleet tree is the selection spine; Releases/Operations/Registry/Settings as the only global areas; always-visible breadcrumb; tabs that appear by level. Plus both streams as a pair (never fused), always-on evidence provenance with a designed degraded state, approvals on the gate, and the declared-write honesty layer (every editing surface states which file it writes, at which scope, and its blast radius).Fidelity is structural, not aspirational:
styles/product.cssis generated from the shipped UI bundle, so mock and product share one Carbon build and one brand-token mapping and cannot visually diverge.Closes U2b by construction
Data-driven, shipping two deliberately different hierarchies rendered by the same code:
dallas-bottlingenterprise / site / line / devicenorthwind-pressregion / plant / cell / deviceEvery level badge, breadcrumb, tree depth, merge chain and aggregate is derived from the fixture's own
hierarchy.levels. No level name appears in the logic — matching the kernel, where only the terminaldeviceis special. The second fixture also carries the degraded paths (no CODEOWNERS, no evidence source, unresolved digests) so those are designed rather than left to chance.Scope
Agreed: the shell plus the screens the kernel can already serve — Overview, Config, Render, Releases gate. Components / Topology / History and the remaining global areas render as explicit "not designed yet" states, never invented content.
Verified in a browser across both hierarchies; console clean.
Consequence: the shipped shell should be rebuilt against this mock before further UI work, with Evidence/Access relocated to their agreed homes.
🤖 Generated with Claude Code
https://claude.ai/code/session_01LsX7cWVGLszurNYMVwMJGo