Skip to content

feat: Onboarding Pill#2440

Open
camielvs wants to merge 1 commit into
06-17-feat_onboarding_checklistfrom
06-18-feat_onboarding_pill
Open

feat: Onboarding Pill#2440
camielvs wants to merge 1 commit into
06-17-feat_onboarding_checklistfrom
06-18-feat_onboarding_pill

Conversation

@camielvs

@camielvs camielvs commented Jun 19, 2026

Copy link
Copy Markdown
Collaborator

Description

Second PR in the onboarding series (stacked on #2421). Makes onboarding progress visible from anywhere in the app, not just the Learning Hub.

  • Top-nav OnboardingNavPill — a compact Onboarding · X/Y pill that opens a popover with the full checklist. Mounted in both the v1 and v2 editor navs (hidden in tour mode). It hides itself once onboarding is complete or dismissed.
  • Provider readiness gating — adds isReady / isResolved so the pill (and other surfaces) only render once backend state has actually resolved, avoiding a flash of default/incorrect state on load.
  • Toasts — fire when a step is completed, when onboarding is fully complete, and an informational toast on dismiss ("you can resume from the Learning Hub").

No new routes or page-level changes — purely an always-available entry point plus the supporting provider state.

Stacked PR — base: Onboarding Checklist (#2421). Followed by the Onboarding Welcome Page (#2435).

Related Issue and Pull requests

Progresses https://github.com/Shopify/oasis-frontend/issues/622

Stacked on #2421 → followed by #2435

Type of Change

  • New feature

Checklist

  • I have tested this does not break current pipelines / runs functionality
  • I have tested the changes on staging

Screenshots (if applicable)

image.png

Test Instructions

  1. With onboarding in progress, confirm the Onboarding · X/Y pill appears in the top nav in both the v1 and v2 editors.
  2. Open the pill — the popover should show the same checklist as the Learning Hub.
  3. Complete a step — a success toast should appear and the pill count should update.
  4. Complete all steps — a completion toast should fire and the pill should disappear.
  5. Dismiss onboarding — an info toast should appear and the pill should hide.
  6. Confirm the pill does not flash on initial load before backend state resolves, and is hidden in tour mode.

Additional Comments

Gating is on isResolved (backend resolved + state loaded) rather than isReady, so the pill never renders against unresolved state.

@github-actions

github-actions Bot commented Jun 19, 2026

Copy link
Copy Markdown

🎩 Preview

A preview build has been created at: 06-18-feat_onboarding_pill/0b64d0e

camielvs commented Jun 19, 2026

Copy link
Copy Markdown
Collaborator Author

@camielvs camielvs mentioned this pull request Jun 19, 2026
3 tasks
@camielvs camielvs added the #gsd:50583 Learning Hub label Jun 19, 2026 — with Graphite App
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from a27cdb0 to 72eadf3 Compare June 19, 2026 02:09
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch 2 times, most recently from c38d713 to 5f5d39b Compare June 19, 2026 02:25
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 72eadf3 to 14fbe7b Compare June 19, 2026 02:25
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from 5f5d39b to c994062 Compare June 19, 2026 15:43
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 14fbe7b to a39fbd9 Compare June 19, 2026 15:43
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from c994062 to bbdf96e Compare June 19, 2026 15:44
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from a39fbd9 to ebc0b79 Compare June 19, 2026 15:51
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from bbdf96e to 5ea2aaa Compare June 19, 2026 15:51
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from ebc0b79 to 3b09b65 Compare June 19, 2026 17:40
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch 4 times, most recently from 7b70ec6 to 601fa2a Compare June 19, 2026 20:59
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 30b5b30 to 5d180fd Compare June 19, 2026 20:59
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from 601fa2a to 0da37a4 Compare June 19, 2026 21:08
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 5d180fd to 4e68a1c Compare June 19, 2026 21:08
@camielvs camielvs marked this pull request as ready for review June 19, 2026 21:24
@camielvs camielvs requested a review from a team as a code owner June 19, 2026 21:24
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 4e68a1c to c818dc8 Compare June 19, 2026 21:48
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from 0da37a4 to 5a2f860 Compare June 19, 2026 21:48

@camielvs camielvs left a comment

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

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

Pill + readiness gating + toasts look good. The isResolved = (backendReady || !configured) && isReady contract is a clean way to avoid the flash, and the completedRef baseline correctly suppresses toast spam on first load. Two inline notes.

Comment thread src/components/layout/AppMenu.tsx
Comment thread src/components/Onboarding/OnboardingNavPill.tsx
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch 2 times, most recently from b5d4e02 to f838ac6 Compare June 19, 2026 23:09
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 3cce650 to 8bdff0e Compare June 19, 2026 23:09
@camielvs camielvs force-pushed the 06-17-feat_onboarding_checklist branch from 8bdff0e to 2741cce Compare June 19, 2026 23:17
@camielvs camielvs force-pushed the 06-18-feat_onboarding_pill branch from f838ac6 to 0b64d0e Compare June 19, 2026 23:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

#gsd:50583 Learning Hub

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant