feat(output): Four-Act narrative — restructure the 28-tab output view (Pillar A)#36
Merged
Conversation
Restructure the 28-tab output view into a Decide → Understand → Go Deeper → Act narrative. Two-tier nav, every section keeps a home, decision control to the top, lenses labeled with prereq/time/progress, legacy deep-link map. Scope-bounded (container/IA reorg, no pipeline rewrite). Part of a 3-pillar effort (A output-tab [this], B journey, 3 Knowledge Game). Includes a rendered HTML version for review.
Bite-sized TDD plan: pure output-acts.js model (full code + tests), two-tier nav, act-aware show(), then targeted UX fixes (decision-to-top, highlights anchor, previews jump, run-all relocation) + circular library nav. Keeps all panels/render/show + deep links; no background.js changes. Includes a rendered HTML overview for review.
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.
Summary
Pillar A of the "simpler to use + digest" effort. Restructures the output tab's flat 28-tab nav into a four-act narrative — Decide → Understand → Go Deeper → Act — without removing any information. Every panel, render function,
show(), and deep link is preserved; only the nav becomes two-tier andshow()becomes act-aware.Built spec-first (brainstorm → approved spec → plan → subagent-driven execution). Spec:
docs/superpowers/specs/2026-06-16-output-tab-four-acts-design.md; plan:docs/superpowers/plans/2026-06-16-output-tab-four-acts.md(both with rendered HTML).Approach (low-risk by design)
output-acts.jsgroups the existing#t0–#t27panels into four ordered acts. Fully unit-tested (every index 0–27 covered exactly once).#act-navprimary acts +#act-subnavactive act's tabs), generated from the model. Secondary buttons keepdata-tab, so the existingshow()path is reused.show(n)now selects panels by id (#t${n}— removes a fragile DOM-order coupling) and marks the active act + renders its subnav.TAB_SLUGSis unchanged, so deep links and per-repo recall keep working as-is.background.jsare untouched — this is a front-end reorganization only.UX fixes folded in
How it was built + reviewed
Subagent-driven: 11 implementation tasks, each gated by an independent spec-compliance review then a code-quality review (with fix loops) — all 11 approved on both. A final whole-branch review then found 2 Important issues, both fixed in
875a23f:id) — restored.show(9)on the default path.Verification
npx vitest run→ 862 passed (91 files; +5 newtests/output-acts.test.js)npx eslint .→ 0 errors (25 pre-existing warnings, none new)npm run check:html→ 22 files parse cleanlynode --checkonoutput-acts.js,output-tab.js,library.js#health/#deep-dive/#versusdeep-links open the right act; keyboard nav; SKTPG toggle hides/shows its Go-Deeper button; reduced-motion honored.Out of scope (deliberate, per spec)
Gamification/juice (Pillar 3 — the "Knowledge Game" for library/corkboard), settings redesign, and richer per-lens progress for Maintenance/Docs (would require
background.jsstreaming the spec excludes — Deep Dive's staged progress is unchanged).