refactor(ui): slim HeaderBar — kill sidebar duplicates, logout to profile menu (Phase 2) - #342
Merged
Merged
Conversation
Qodo reviews are paused for this user.Troubleshooting steps vary by plan Learn more → On a Teams plan? Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center? |
5 tasks
krisarmstrong
force-pushed
the
chore/phase1-canonical-shell-modernize
branch
from
May 27, 2026 20:57
2b66042 to
0b87848
Compare
…file menu
Phase 2 of the harmonization. Removes header items that duplicated
sidebar footer affordances or were misplaced page-level actions. The
header now carries only what the user needs at every page: brand
identity, live connection state, per-product context selectors, theme.
Removed from header
- Settings button — already in sidebar footer.
- Help button — already in sidebar footer.
- Refresh button — page-specific action; pages mount their own.
- History button — sidebar nav has History; was a duplicate.
- Standalone Logout button — moved inside ProfileDropdown menu.
- Tagline ("Mustard Seed Networks") — marketing copy, not app chrome.
Kept in header
- Logo + product name + ConnectionBadge (left slot)
- InterfaceDropdown + ProfileDropdown + ThemeToggle (right slot)
ProfileDropdown additions
- `onLogout?` prop renders a "Logout" menu item under the existing
Manage divider. Tinted with text-status-error.
Deprecated props (kept optional for back-compat; ignored)
- onRefresh, onHistoryOpen, onHelpOpen, onSettingsOpen — App.tsx and
any callers can keep passing them; future cleanup PR will remove
the props and the callers' wiring.
ui/SHELL.md
- New "HeaderBar shape convention" section: documents the three-slot
layout (left / center / right), what belongs in each, what's banned
from the header. Per-product variance is permitted in the right slot
but the shape is uniform across stem/seed/niac.
Validated: build, lint, token discipline all green.
krisarmstrong
force-pushed
the
chore/phase2-slim-headerbar
branch
from
May 27, 2026 21:03
d550cec to
14c63d9
Compare
Contributor
License Compliance ReportAll dependencies pass license compliance checksGo Dependencies
npm DependenciesSee full report in workflow artifacts Allowed Licenses: MIT, Apache-2.0, BSD-*, ISC, CC0-1.0, MPL-2.0 |
3 tasks
krisarmstrong
added a commit
that referenced
this pull request
May 29, 2026
…360) Applies the same design-token consolidation as seed, scoped to stem's (much smaller) debt. Stem has no canvas/PDF/cable features, so unlike seed it needs no tokens.ts JS-reader — SVG and inline styles consume the CSS variables directly. - ModuleSelector + ModuleSettingsContext: the six module colors were hardcoded as inline hex (color: '#0891b2' …), duplicating --color-module-* and NOT adapting to dark mode. Now color: 'var(--color-module-reflector)' etc. — single source of truth, theme-aware via the cascade. - LicenseSection: bg-red-500/bg-green-500 + bg-opacity-10 -> bg-status-error/10 and bg-status-success/10. - InputModal: placeholder-gray-500 -> placeholder:text-text-muted. - Sidebar nav-group label -> section-title (keeps semibold); SecurityPage page title -> heading-1. - index.css: add the .z-overlay/.z-max z-index scale; CommandPalette z-[60] -> z-overlay. - Add styles/DESIGN_SYSTEM.md documenting the three-tier token architecture and the SVG-uses-var()/no-canvas distinction. Verified: biome clean, tsc passes, build succeeds. (7 pre-existing HeaderBar.test failures are unrelated stale tests from the #342 HeaderBar slim — present on main, not in the blocking CI path.) Co-authored-by: Kris Armstrong <kris.armstrong@icloud.com>
2 tasks
krisarmstrong
added a commit
that referenced
this pull request
May 29, 2026
* test(ui): sync HeaderBar tests with the slimmed header (#342) HeaderBar was slimmed in #342 — refresh/history/help/settings moved to the sidebar footer / page level (their props are now @deprecated and ignored), logout moved into the profile dropdown, and the "Mustard Seed Networks" tagline was dropped. The tests still asserted the old toolbar, leaving 7 failures on main. - Drop the deprecated onRefresh/onHistoryOpen/onHelpOpen/onSettingsOpen from defaultProps. - Remove the stale tagline test and the four dead interaction tests for the relocated buttons. - Rewrite the toolbar test to assert the theme toggle is present and the relocated buttons are absent. - Rewrite the logout test to open the profile dropdown and click Logout there. All 153 stem UI tests now pass (was 7 failing). * style(ui): biome format HeaderBar test (collapse wrapped expect) --------- Co-authored-by: Kris Armstrong <kris.armstrong@icloud.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
Phase 2 of the seed/stem/niac harmonization. Slims the HeaderBar by killing items that duplicated the sidebar footer or were misplaced page-level actions. Logout moves inside the profile dropdown. Stem becomes the reference; seed and niac follow with their own per-product slim headers.
Stacked on #339 (Phase 1). Will rebase onto main once that lands.
Header before → after
Result: ~5 things in the right slot instead of ~10.
ProfileDropdown gets a Logout menu item
New optional
onLogoutprop. When provided, renders a Logout row at the bottom of the dropdown (under the existing Manage divider). Tintedtext-status-error.Deprecated props (kept optional, ignored)
onRefresh,onHistoryOpen,onHelpOpen,onSettingsOpen— App.tsx and any other callers can keep passing them. Future cleanup PR will remove the props and the call sites.ui/SHELL.md— HeaderBar shape conventionNew section documents the 3-slot layout that ALL three repos' HeaderBars now follow:
What belongs in the header (per product) and what's banned (Settings/Help/Logout/Refresh/History/taglines) is codified.
Test plan
./scripts/check-token-discipline.sh— PASSnpm run build— PASSnpm run lint— PASSnpx tsc --noEmit— clean for HeaderBar (2 unused icons removed)Next
🤖 Generated with Claude Code