feat: frontend redesign (Direction E) + scoring protocol + new skills - #42
Merged
Conversation
Verifies health, TLS, frontend, API routes, admin panel, CORS headers, and claude-runner image in a single pass. Exit code = number of failures.
Replace the existing color palette with the warm dark Direction E theme (#14110e bg, #e2a039 amber accent, #f2ede4 bone text). Swap primary mono font to JetBrains Mono, add grain overlay utility, and overline class. Old token names kept as deprecated aliases for backward compat.
Reusable UI primitives matching Direction E design spec: Button (primary/secondary/ghost/danger), Card, Chip (status variants), StatCard, TerminalBlock (macOS chrome), GrainOverlay, Overline, Dot. All components use the new design tokens and Tailwind classes.
Shared layout wrapping all protected routes: 56px sticky topbar (logo, live dot, user avatar, sign out) + max-width centered content + warm grain overlay. Landing and auth callback remain full-bleed.
Complete rewrite using shared components (Card, StatCard, TerminalBlock, GrainOverlay, Overline, Button). New hero headline, example session card, stats strip, and updated copy positioning helPRs as a learning companion.
Replace code-review/security-audit (passive, removed from product) with interactive skills: eli5, pair-debug, hot-seat, test-me (all coming soon). Uses shared Card/Chip/Button components with Direction E styling.
Add helprs-scorecard JSON block extraction from Claude session output.
New scorecard.py module parses the fenced code block, validates structure
(3 dimensions, 0-10 range). Scorecard is persisted to container_sessions
table after mark_completed. New GET /sessions/{id}/scorecard endpoint.
Replace inline styles with shared components (Card, Chip, Dot, StatCard, Overline). Add greeting header, stat strip, dashed add-installation card. Remove duplicate topbar (now provided by AppShell).
Restyle session history table with Direction E tokens. StatusBadge now uses shared Chip component with semantic variants. Add breadcrumb nav, overline copy, pagination with Button component.
Apply shared components (Card, Button, Chip, Overline, Dot) and Direction E design tokens to SetupView and SettingsView. Add step indicator, repository access link, and danger zone section.
Split the session view into a two-column layout: transcript left, right rail (260px) with progress tracker, scorecard display, session meta, and privacy note. Apply Direction E styling to all message blocks (amber border for assistant, ruleStr border for user, // comment ornament for system). Add post-session CTAs and scorecard fetch on completion.
Add GET /api/v1/auth/me/stats endpoint returning daily session counts (last 30 days) and status totals across all accessible installations. Add SVG-based ActivityChart component (no external deps). Wire stats into dashboard stat strip and display chart above installation cards.
Update challenge-me CLAUDE.md to emit helprs-scorecard JSON block alongside the existing markdown results. Align dimensions to depth/clarity/rigor per the redesign spec. Add 4 new interactive skills: eli5 (explain your code simply), pair-debug (find the injected bug), hot-seat (defend your design), test-me (predict test outcomes). Each skill has config.yaml, CLAUDE.md, and prompt.md per SKILL_SPEC.md.
Fixes: - Session replay crash: extract nested scorecard from API wrapper - Topbar logo: use React Router Link instead of <a href> - Sign-out: navigate to / before logout to avoid OAuth redirect - SkillSelector: remove nested <button> (use <span> for Run) - Add ErrorBoundary wrapping the entire app Design alignment: - ActivityChart: div-based flex bars matching mockup (3px gap, 120px height, accent color with active highlight, 30-day fill, axis labels) - InstallationList: avatar + 2-column status grid + action buttons - InstallationDetail: completion bar with stacked segments + legend, grid-based session table with proper columns, filter buttons
…ail header - Set html/body/#root background to #14110e (no more white on scroll) - Remove AppShell from session replay and live session routes (full page) - Make installation detail header/completion bar sticky with scrollable table
Restructure installation detail so the table header row stays sticky at the top, only the data rows scroll, and pagination stays at the bottom outside the scroll area.
Add DELETE /api/v1/containers/sessions/{id} endpoint with access
control. CASCADE deletes associated session events. Add delete
button (x) on each session row in installation detail, visible on
hover. Optimistic removal from the list on click.
- Add modal with danger styling for session deletion confirmation - Reduce per_page to 10, tighten row/header padding - Fix height calc to account for AppShell padding (120px total) - Smaller filter buttons and completion bar
|
helPRs session created for this PR. Skill: |
- test_scorecard.py: fix import block formatting (I001) - test_byok_router.py: rename validate_anthropic_api_key mock to validate_claude_key (function was renamed, test mock wasn't) - ContainerSession: wrap Chip in span for data-testid forwarding - ConversationOutput.test: update text assertions for new // prefix on system messages and empty state
mariuspruvot
added a commit
that referenced
this pull request
Jul 30, 2026
mariuspruvot
added a commit
that referenced
this pull request
Jul 30, 2026
* chore: remove stale scaffolding, dead config, and BMAD leftovers - Untrack the two BMAD skill files left behind under .claude/ (missed by 70483d7) - Remove mkdocs.yml and docs/assets/: mkdocs is wired to no build step and its nav references seven files pruned in #52 - Remove docs/.archive/ (internal debug note + project scan report) from the public repo - Remove empty features/demo scaffolding and redundant .gitkeep placeholders - Drop dead Berkeley Mono @font-face declarations: the woff2 files were never shipped, every visitor 404s then falls back to JetBrains Mono - Prune .gitignore entries for tooling that no longer exists (site/, _bmad, redisign scratchpads) - Update CLAUDE.md and docs to match * docs: note recoverable stats tests lost in #42 squash
mariuspruvot
added a commit
that referenced
this pull request
Jul 30, 2026
…#42) * feat: add production smoke test script Verifies health, TLS, frontend, API routes, admin panel, CORS headers, and claude-runner image in a single pass. Exit code = number of failures. * feat(web): implement Direction E design system tokens Replace the existing color palette with the warm dark Direction E theme (#14110e bg, #e2a039 amber accent, #f2ede4 bone text). Swap primary mono font to JetBrains Mono, add grain overlay utility, and overline class. Old token names kept as deprecated aliases for backward compat. * feat(web): add shared component library Reusable UI primitives matching Direction E design spec: Button (primary/secondary/ghost/danger), Card, Chip (status variants), StatCard, TerminalBlock (macOS chrome), GrainOverlay, Overline, Dot. All components use the new design tokens and Tailwind classes. * feat(web): add AppShell layout with topbar and grain overlay Shared layout wrapping all protected routes: 56px sticky topbar (logo, live dot, user avatar, sign out) + max-width centered content + warm grain overlay. Landing and auth callback remain full-bleed. * feat(web): rebuild landing page with Direction E design Complete rewrite using shared components (Card, StatCard, TerminalBlock, GrainOverlay, Overline, Button). New hero headline, example session card, stats strip, and updated copy positioning helPRs as a learning companion. * feat(web): rebuild skill selector with new skills lineup Replace code-review/security-audit (passive, removed from product) with interactive skills: eli5, pair-debug, hot-seat, test-me (all coming soon). Uses shared Card/Chip/Button components with Direction E styling. * feat(api): add scorecard extraction and persistence Add helprs-scorecard JSON block extraction from Claude session output. New scorecard.py module parses the fenced code block, validates structure (3 dimensions, 0-10 range). Scorecard is persisted to container_sessions table after mark_completed. New GET /sessions/{id}/scorecard endpoint. * feat(web): rebuild dashboard with Direction E design Replace inline styles with shared components (Card, Chip, Dot, StatCard, Overline). Add greeting header, stat strip, dashed add-installation card. Remove duplicate topbar (now provided by AppShell). * feat(web): rebuild installation detail and StatusBadge Restyle session history table with Direction E tokens. StatusBadge now uses shared Chip component with semantic variants. Add breadcrumb nav, overline copy, pagination with Button component. * feat(web): restyle setup wizard and settings with Direction E design Apply shared components (Card, Button, Chip, Overline, Dot) and Direction E design tokens to SetupView and SettingsView. Add step indicator, repository access link, and danger zone section. * feat(web): redesign session UI with split layout and scorecard rail Split the session view into a two-column layout: transcript left, right rail (260px) with progress tracker, scorecard display, session meta, and privacy note. Apply Direction E styling to all message blocks (amber border for assistant, ruleStr border for user, // comment ornament for system). Add post-session CTAs and scorecard fetch on completion. * feat: add dashboard activity chart and user stats endpoint Add GET /api/v1/auth/me/stats endpoint returning daily session counts (last 30 days) and status totals across all accessible installations. Add SVG-based ActivityChart component (no external deps). Wire stats into dashboard stat strip and display chart above installation cards. * feat: update challenge-me scoring and add 4 new skills Update challenge-me CLAUDE.md to emit helprs-scorecard JSON block alongside the existing markdown results. Align dimensions to depth/clarity/rigor per the redesign spec. Add 4 new interactive skills: eli5 (explain your code simply), pair-debug (find the injected bug), hot-seat (defend your design), test-me (predict test outcomes). Each skill has config.yaml, CLAUDE.md, and prompt.md per SKILL_SPEC.md. * fix(web): fix QA bugs and align dashboard/detail with R2 mockup Fixes: - Session replay crash: extract nested scorecard from API wrapper - Topbar logo: use React Router Link instead of <a href> - Sign-out: navigate to / before logout to avoid OAuth redirect - SkillSelector: remove nested <button> (use <span> for Run) - Add ErrorBoundary wrapping the entire app Design alignment: - ActivityChart: div-based flex bars matching mockup (3px gap, 120px height, accent color with active highlight, 30-day fill, axis labels) - InstallationList: avatar + 2-column status grid + action buttons - InstallationDetail: completion bar with stacked segments + legend, grid-based session table with proper columns, filter buttons * fix(web): dark background on html/body, full-page session, sticky detail header - Set html/body/#root background to #14110e (no more white on scroll) - Remove AppShell from session replay and live session routes (full page) - Make installation detail header/completion bar sticky with scrollable table * fix(web): only table rows scroll, header and pagination stay fixed Restructure installation detail so the table header row stays sticky at the top, only the data rows scroll, and pagination stays at the bottom outside the scroll area. * feat: add session delete endpoint and UI button Add DELETE /api/v1/containers/sessions/{id} endpoint with access control. CASCADE deletes associated session events. Add delete button (x) on each session row in installation detail, visible on hover. Optimistic removal from the list on click. * fix(web): add delete confirmation modal and fit table to viewport - Add modal with danger styling for session deletion confirmation - Reduce per_page to 10, tighten row/header padding - Fix height calc to account for AppShell padding (120px total) - Smaller filter buttons and completion bar * fix: fix CI failures — lint, test mocks, and updated assertions - test_scorecard.py: fix import block formatting (I001) - test_byok_router.py: rename validate_anthropic_api_key mock to validate_claude_key (function was renamed, test mock wasn't) - ContainerSession: wrap Chip in span for data-testid forwarding - ConversationOutput.test: update text assertions for new // prefix on system messages and empty state
mariuspruvot
added a commit
that referenced
this pull request
Jul 30, 2026
* chore: remove stale scaffolding, dead config, and planning leftovers - Untrack the two stale skill files left behind under .claude/ (missed by 1006a1f) - Remove mkdocs.yml and docs/assets/: mkdocs is wired to no build step and its nav references seven files pruned in #52 - Remove docs/.archive/ (internal debug note + project scan report) from the public repo - Remove empty features/demo scaffolding and redundant .gitkeep placeholders - Drop dead Berkeley Mono @font-face declarations: the woff2 files were never shipped, every visitor 404s then falls back to JetBrains Mono - Prune .gitignore entries for tooling that no longer exists (site/, _planning, redisign scratchpads) - Update CLAUDE.md and docs to match * docs: note recoverable stats tests lost in #42 squash
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
Complete frontend redesign implementing the Direction E design system (warm dark, amber accent, monospace-first), plus backend scoring protocol and 4 new interactive skills.
Design System
Pages Rebuilt
Backend
GET /api/v1/auth/me/stats— user-level session stats (daily counts + status totals)GET /api/v1/containers/sessions/{id}/scorecard— parsed scorecard for completed sessionsDELETE /api/v1/containers/sessions/{id}— session deletion with CASCADEscorecardJSONB column oncontainer_sessions(migration included)container/scorecard.py)Skills
challenge-meto emithelprs-scorecardJSON block (dimensions: depth/clarity/rigor)eli5,pair-debug,hot-seat,test-me(each with config.yaml, CLAUDE.md, prompt.md)Test plan
make lintpasses (ruff + eslint)make testpasses (pytest + vitest)