Skip to content

Add shared nudge, suggestion card, and inline confirmation components - #5393

Open
brsbl wants to merge 4 commits into
mainfrom
bb/shared-onboarding-components-thr_gt5eeahuym
Open

brsbl wants to merge 4 commits into
mainfrom
bb/shared-onboarding-components-thr_gt5eeahuym

Conversation

@brsbl

@brsbl brsbl commented Oct 12, 2026 •

Copy link
Copy Markdown
Collaborator

Human comments

What was wrong

The notification card, first-task suggestions, and related prompts need reusable UI pieces that can be reviewed and used independently.

What changed

Add SidebarNudge, SuggestionCard, and InlineConfirmation to shared-ui, with registry entries and focused Ladle stories.

Extracted from #5222 without rewriting its history.

How you verified

Remote CI passed at 7af427b8e457c69069631adf27feebbbe2bfa0cd (run). The cumulative review found no unresolved P0/P1 findings in this layer; the merge from main preserves the reviewed components.

QA PASS at that exact head: Chrome for Testing 154.0.8037.92, production-component Ladle stories at 1440 × 900 and 390 × 844, 2× density. Verified initial rendering, card selection and inline confirmation, complete selection transition, hard reload and reset, light/dark nudge rendering, and no horizontal overflow or page errors. Story selection changes only fixture state.

Before: main d34a3d219193d37bf4bb31b6b345dd113800c3f1; after: the PR head above. These are new components, so their story routes are absent on the baseline.

Screen / state Before After
Suggestion cards · desktop Before Suggestion cards · desktop After Suggestion cards · desktop
Selected card and confirmation · desktop Before Selected card and confirmation · desktop After Selected card and confirmation · desktop
Sidebar nudge · desktop Before Sidebar nudge · desktop After Sidebar nudge · desktop
Suggestion cards · phone Before Suggestion cards · phone After Suggestion cards · phone
Selected card and confirmation · phone Before Selected card and confirmation · phone After Selected card and confirmation · phone
Sidebar nudge · phone Before Sidebar nudge · phone After Sidebar nudge · phone
Sidebar nudge · dark Before Sidebar nudge · dark After Sidebar nudge · dark

User screenshot sign-off is pending.

BB-Thread-ID: thr_gt5eeahuym

BB-Thread: Onboarding

AGENT GENERATED

@brsbl
brsbl removed this pull request from stack #5397 October 12, 2026 22:22
@brsbl
brsbl added this pull request to stack #5407 October 12, 2026 22:22
@brsbl
brsbl marked this pull request as ready for review October 12, 2026 22:22
@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 12, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-12T22:25:33.680003Z f82b04b Draft marked ready
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@brsbl
brsbl removed this pull request from stack #5407 October 12, 2026 22:23
@brsbl
brsbl added this pull request to stack #5408 October 12, 2026 22:23

@chatgpt-codex-connector chatgpt-codex-connector 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.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: f82b04ba91

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment on lines +37 to +42
<button
type="button"
data-suggestion-card=""
aria-pressed={onSelect && !grouped ? selected : undefined}
aria-label={ariaLabel}
onClick={onSelect}

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

P2 Badge Avoid rendering callback-less cards as buttons

When onSelect is omitted, as it is for the thread and tip examples in the added story, this still renders an enabled, focusable <button> with pointer and hover styling. Keyboard and screen-reader users can therefore tab to and activate controls that do nothing. Make onSelect required for button cards, or render a non-interactive element when no callback is supplied.

Useful? React with 👍 / 👎.

@brsbl
brsbl removed this pull request from stack #5408 October 12, 2026 22:53
@brsbl
brsbl added this pull request to stack #5409 October 12, 2026 22:54
@brsbl
brsbl removed this pull request from stack #5409 October 12, 2026 22:57
@brsbl
brsbl added this pull request to stack #5410 October 12, 2026 22:57
brsbl and others added 2 commits October 12, 2026 16:19
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

This branch has not been deployed

No deployments
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.

1 participant