Skip to content

Make machine settings text-first and responsive - #2050

Merged
ymichael merged 2 commits into
mainfrom
bb/reduce-settings-page-icon-usage-thr_et4j5syr6e
Aug 20, 2026
Merged

Make machine settings text-first and responsive#2050
ymichael merged 2 commits into
mainfrom
bb/reduce-settings-page-icon-usage-thr_et4j5syr6e

Conversation

@ymichael

@ymichael ymichael commented Aug 20, 2026

Copy link
Copy Markdown
Collaborator

What was wrong

The machine list and detail redesign in #1996 compressed status, project count, permissions, and update state into a dense set of glyphs and tooltips. That made common metadata slower to scan, turned the add action into an ambiguous bare plus, and put the detail identity subtitle inside a card that implied a separate section. Several flex items were also forced to remain unshrinkable, so long metadata and detail key/value groups became cramped on phone-width screens. Tracks #2049.

What changed

  • Replaced decorative machine, project, permission, and update glyphs with visible metadata text while retaining status dots, provider marks, and action icons.
  • Restored the labeled “Add a machine” button.
  • Moved connection state, platform, and pairing age directly below the machine heading instead of wrapping that subtitle in a card.
  • Made section actions and detail key/value rows stack on compact screens, and allowed long update status text to wrap.
  • Added focused regression coverage for visible status/metadata, the labeled action, the subtitle header structure, and compact layout classes.
  • No wire, daemon protocol, CLI, persistence, or documentation contract changes.

Machine list

Original After #1996 This PR
Original machine list Machine list after PR 1996 Text-first machine list

Machine detail

Original After #1996 This PR
Original machine detail Machine detail after PR 1996 Text-first machine detail

Narrow screens at 320px

Page Before After
List Narrow machine list before Narrow machine list after
Detail Narrow machine detail before Narrow machine detail after

How you verified

  • pnpm exec turbo run test --filter=@bb/app -- src/components/settings/MachinesSettingsSection.test.tsx src/views/MachineSettingsView.test.tsx — 21 tests passed. The new assertions fail against the previous icon-only and card-based markup.
  • pnpm exec turbo run typecheck --filter=@bb/app — passed.
  • pnpm exec turbo run lint --filter=@bb/app — passed.
  • Rendered the real Settings story at true 320px, 390px, 768px, and 1440px viewports. Both pages stayed within the viewport at 320px and 390px with no visible horizontal overflow.

Fixes #2049

AGENT GENERATED: by GPT-5.6 Codex

@ymichael
ymichael force-pushed the bb/reduce-settings-page-icon-usage-thr_et4j5syr6e branch from d3eeec2 to 8e12be8 Compare August 20, 2026 17:40

@bb-slop-cop bb-slop-cop Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚨 SLOP COP 🚨 · review

I am SlopCop. I am reviewing commit d3eeec20bc3d9e4b7d0c2fd1accf2e63df8c99be for security, quality, performance, architecture, and end-to-end behavior.

This pull request makes the machine settings pages text-first and responsive on narrow screens.

The live pull request now points to 8e12be8f65fbdcaeadbe09d264b24ba3822d00bc. This review run applies to the supplied commit.

Comment thread apps/app/src/views/MachineSettingsView.tsx Outdated

@bb-slop-cop bb-slop-cop Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚨 SLOP COP 🚨 · review

Plain English summary: This PR replaces many machine settings icons with clear text. It also lets rows stack on narrow screens.

I found one non-blocking performance issue. MachineSettingsView still imports 95 extended icons, although the route now uses only core icons. I left an inline comment.

The live head removed the ten unreferenced images from the supplied commit. That later change removes 583,007 bytes.

Security review found no issue. React still escapes machine data, and the server still enforces all machine management limits.

The architecture scan found two optional cleanups. MachineStatusIcon has no consumers after this change. Both machine views also duplicate the platform labels and primary removal message. A shared host display helper can own these values.

Validation passed:

  • The full @bb/app suite passed 3,088 tests across 402 files. Three tests were skipped.
  • The focused machine settings tests passed all 21 tests.
  • The @bb/app type check passed.
  • The lint task completed with zero errors and 144 warnings.
  • Doobie verified the list and detail routes at 1280 and 320 pixels. Both routes had no horizontal overflow at 320 pixels.

This review applies to d3eeec20bc3d9e4b7d0c2fd1accf2e63df8c99be. The live pull request now points to 8e12be8f65fbdcaeadbe09d264b24ba3822d00bc.

@ymichael

Copy link
Copy Markdown
Collaborator Author

Addressed the SlopCop review in d2627ec:

  • removed the unused extended-icon registry from the machine detail route
  • removed the now-unreferenced MachineStatusIcon component and its dependencies

I kept the suggested shared platform-label/removal-message helper out of this PR because it is an optional, behavior-neutral refactor beyond the focused UI change.

Verification: focused machine settings tests (21/21), @bb/app typecheck, and @bb/app lint (0 errors; 144 existing warnings).

@ymichael
ymichael merged commit 4bf34b5 into main Aug 20, 2026
22 of 23 checks passed
@ymichael
ymichael deleted the bb/reduce-settings-page-icon-usage-thr_et4j5syr6e branch August 20, 2026 18:08
ymichael added a commit that referenced this pull request Aug 20, 2026
## What was wrong

runBuildProcess spawned its build process before registering SIGINT and
SIGTERM handlers. A fast child could become externally observable during
that window, allowing another process to send SIGTERM while Node still
had its default signal behavior. The parent then exited with
signal=SIGTERM instead of cleaning up the build leader and grandchild,
which caused the flaky packages job on PR #2050.

## What changed

Register the build signal handlers before spawning the child. Keep spawn
inside the existing try/finally lifecycle so synchronous startup
failures also remove both handlers. There are no wire, daemon protocol,
CLI, persistence, or documentation contract changes.

## How you verified

- The first CI attempt on PR #2050 failed in test/start-bb.test.mjs with
code=null and signal=SIGTERM; its rerun passed, confirming the
timing-dependent behavior.
- Repeated the focused @bb/scripts process-group integration test 100
times with Turbo cache bypass; all 100 passed without Vitest retries.
- pnpm exec turbo run test --filter=@bb/scripts --force — 18 files and
97 tests passed.
- pnpm exec turbo run typecheck --filter=@bb/scripts — passed.
- git diff --check — passed.

Follow-up to #2050.

> AGENT GENERATED: by GPT-5.6 Codex
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Make machine settings metadata text-first and responsive

1 participant