Center plugin capability icons by brsbl · Pull Request #995 · get-bb/bb

brsbl · 2026-08-04T17:28:05Z

Summary

vertically center each capability glyph with its capability name
remove the prior one-pixel glyph offset
preserve table density, spacing, and description layout

Verification

pnpm exec turbo run test --filter=@bb/app -- --run src/components/tools/detail-page-recipes.test.tsx (38 tests passed)
pnpm exec turbo run typecheck --filter=@bb/app
branch-built desktop app: captured pre/post screenshots on the Automations plugin detail page and verified all capability name/icon pairs are centered

Stack

Parent: Unify plugin browse action buttons #994
This PR: capability name/icon alignment

SawyerHood · 2026-08-04T18:34:00Z

🚨 SLOP COP 🚨 · review

I am SlopCop. I am reviewing this pull request under the review rule.

The stack contains #993, #994, #995, #996, #997, #1000, and #1001. All seven pull requests are ready for review, and @brsbl has write access.

I will run security, code quality, performance, architecture, and end-to-end checks. I will post each phase result when it completes.

SawyerHood · 2026-08-04T18:34:08Z

🚨 SLOP COP 🚨 · review

I am SlopCop. I am reviewing this pull request now.

The stack contains #992, #993, #994, #995, #996, #997, #1000, and #1001, from bottom to top.

I will review security, code quality, performance, architecture, and tests. I will run the end-to-end test on #1001.

SawyerHood · 2026-08-04T18:34:11Z

🚨 SLOP COP 🚨 · review

I am the SlopCop. I am reviewing this pull request under the review rule.

The stack contains #994, #995, #996, #997, #1000, and #1001. I will review each change separately. I will judge each change against the final stack state.

I found no skipped pull requests. All stack pull requests are ready. The author has write access.

I started parallel security, code quality, and performance reviews. I will test the top pull request once through the application, if possible.

SawyerHood

🚨 SLOP COP 🚨 · review

I am SlopCop. I am reviewing this pull request with the security, code quality, performance, architecture, and end-to-end guidelines.

The stack contains #995, #996, #997, #1000, and #1001, from bottom to top. I will judge each pull request after the full stack lands. I will run the end-to-end test once on #1001.

SawyerHood · 2026-08-04T18:34:51Z

🚨 SLOP COP 🚨 · review

I am SlopCop. I am reviewing this stack under the review rule.

The stack contains these pull requests, from bottom to top:

Paginate skill detail content #991: Paginate skill detail content
Reduce plugin capability name size #992: Reduce plugin capability name size
Align plugin browse cards and filters #993: Align plugin browse cards and filters
Unify plugin browse action buttons #994: Unify plugin browse action buttons
Center plugin capability icons #995: Center plugin capability icons
Emphasize plugin release labels #996: Emphasize plugin release labels
Compact automation filter menus #997: Compact automation filter menus
Unify Docs right-panel navigation #1000: Unify Docs right-panel navigation
Restore Skills Type filter terminology #1001: Restore Skills Type filter terminology

I will run security, code quality and architecture, performance, and one end-to-end phase on top PR #1001.

I skipped no pull requests.

SawyerHood

🚨 SLOP COP 🚨 · review

Security phase complete for #995.

The security phase is complete. I found no security issues in this pull request after the full stack lands.

The changes add no untrusted input paths, HTML injection, network calls, file access, process execution, or credential handling.

SawyerHood

🚨 SLOP COP 🚨 · review

Performance phase complete for #995.

The performance phase is complete. I found no performance or resource-use issues in this pull request after the full stack lands.

The changes add no loops, subscriptions, timers, network calls, or persistent data structures. The React and layout work stays small.

SawyerHood · 2026-08-04T18:42:12Z

🚨 SLOP COP 🚨 · review

Security phase complete.

I found no security issue in this PR after I reviewed the complete stack.

The changes do not add a trust-boundary change, unsafe render sink, data exposure, dependency risk, or protocol change.

SawyerHood · 2026-08-04T18:42:18Z

🚨 SLOP COP 🚨 · review

Performance phase complete.

I found no performance or resource-use defects in this pull request. I reviewed it against the final seven-pull-request stack.

I checked render work, value stability, filtering, sorting, memoization, requests, subscriptions, and test cost.

SawyerHood · 2026-08-04T18:42:47Z

🚨 SLOP COP 🚨 · review

Security phase complete.

I found no security or privacy defects in this pull request. I reviewed it against the final seven-pull-request stack.

I checked unsafe rendering, injection, links, actions, permissions, data disclosure, configuration, dependencies, and trust boundaries.

SawyerHood · 2026-08-04T19:04:08Z

          {/*
            `flex`, not a plain span: as a block it wrapped the inline-level
            glyph in a line box, which added four invisible pixels to every row
            in every one of these tables.


🚨 slopcop/review — Wrapped names now move the icon away from the first line.

The name column is narrow and permits word breaks. A long capability name can use two or more lines. items-center centers the icon against the full text block.

Keep first-line alignment. Center the icon inside a box that has the first line height.

SawyerHood

🚨 SLOP COP 🚨 · review

Result: I found one medium user-interface issue.

Long capability names can wrap in the fixed-width name column. The new items-center class centers the icon against all text lines. The icon no longer aligns with the first line.

The change has no material performance or security cost. Current CI passed.

Inline finding: #995 (comment)

SawyerHood

🚨 SLOP COP 🚨 · review

Review complete.

I found no issues in this pull request after the complete stack lands.

The security, code-quality, architecture, performance, and final review phases found no issue here.

I used a comment-only review. I did not approve or request changes.

SawyerHood

🚨 SLOP COP 🚨 · review

Code quality and architecture phase complete for #995.

I found no actionable code quality, correctness, test, duplication, or architecture issue after the full stack lands. The code matches the stated goal to center each glyph with its complete capability name. The rendered rows also keep the shared layout in one component.

SawyerHood

🚨 SLOP COP 🚨 · review

Final review for #995: no findings.

The security, code quality, architecture, duplication, and performance reviews found no actionable issue after the full stack lands. The top-stack browser test confirmed a zero-pixel center difference for all three rendered capability icon and label pairs.

All GitHub CI jobs passed on the top pull request. I did not approve or request changes, and I posted no inline findings.

SawyerHood

🚨 SLOP COP 🚨 · review

Final comment-only review for #995.

No actionable findings.

The security review found no security or privacy defect. The quality and architecture review found no defect or useful refactor. The performance review found no defect.

I ran the end-to-end attempt only on the top pull request. The shared host did not produce a ready development server.

GitHub CI passed on the latest stack head. The GPT-5.6 review gate approved this review result.

SawyerHood · 2026-08-04T19:16:14Z

🚨 SLOP COP 🚨 · review

Performance phase complete.

I found no material performance issue in this PR after I reviewed the complete stack.

The render scope, allocations, bundle inputs, and pagination behavior stay stable.

SawyerHood · 2026-08-04T19:17:18Z

        colSpan={hasDetail ? undefined : 2}
      >
-        <span className="flex min-w-0 items-start gap-2">
+        <span className="flex min-w-0 items-center gap-2">


🚨 slopcop/review — Center alignment moves icons below the first line of wrapped names.

The fixed column and break-words make long capability names wrap. The icon then centers across the complete name block.

Keep start alignment and correct the small offset. Add a test with a wrapped capability name.

SawyerHood · 2026-08-04T19:17:29Z

🚨 SLOP COP 🚨 · review

Code-quality and architecture phase complete.

I left one visual finding. Center alignment moves icons below the first line of wrapped names.

I checked the full stack and checked later PRs before I reported each issue.

SawyerHood

🚨 SLOP COP 🚨 · review

Review result: one visual finding.

Security review found no issue.
Performance review found no material render, allocation, bundle, or pagination issue.
Turbo type checks passed for the app, shared UI, Automations, and Docs packages.
The affected tests passed after clean reruns. The latest Docs suite passed all 57 tests.

The new center alignment misplaces icons when capability names wrap. See the inline comment.

## Summary - make the Delivery/Installed and Version labels in the plugin Release table medium weight - preserve the existing typography of capability rows and release values - add focused regression coverage for the Release label emphasis ## Verification - `pnpm exec turbo run test --filter=@bb/app -- --run src/components/tools/detail-page-recipes.test.tsx` (38 passed) - `pnpm exec turbo run typecheck --filter=@bb/app` - visually verified the hot-reloaded Automations plugin detail in the branch desktop app ## Stack - Parent: #995

Center plugin capability icons

0014af0

brsbl mentioned this pull request Aug 4, 2026

Emphasize plugin release labels #996

Merged

This was referenced Aug 4, 2026

Unify plugin browse action buttons #994

Merged

Unify Docs right-panel navigation #1000

Merged

Align plugin browse cards and filters #993

Merged

Compact automation filter menus #997

Merged

Restore Skills Type filter terminology #1001

Merged

SawyerHood mentioned this pull request Aug 4, 2026

Reduce plugin capability name size #992

Merged

SawyerHood reviewed Aug 4, 2026

View reviewed changes

SawyerHood mentioned this pull request Aug 4, 2026

Paginate skill detail content #991

Merged

SawyerHood reviewed Aug 4, 2026

View reviewed changes

brsbl merged commit 191c7be into bb/plugin-browse-installed-button-thr_cxz5rwzns3 Aug 4, 2026
10 checks passed

brsbl deleted the bb/plugin-capability-icon-alignment-thr_cxz5rwzns3 branch August 4, 2026 23:46

Uh oh!

Conversation

brsbl commented Aug 4, 2026

Summary

Verification

Stack

Uh oh!

SawyerHood commented Aug 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood Aug 4, 2026

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood Aug 4, 2026

Choose a reason for hiding this comment

Uh oh!

SawyerHood commented Aug 4, 2026

Uh oh!

SawyerHood left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

SawyerHood commented Aug 4, 2026 •

edited

Loading

SawyerHood left a comment •

edited

Loading