Skip to content

feat(onboarding): make the "next quest" cards actionable#7941

Open
talissoncosta wants to merge 4 commits into
mainfrom
feat/onboarding-next-quest-cards-7739
Open

feat(onboarding): make the "next quest" cards actionable#7941
talissoncosta wants to merge 4 commits into
mainfrom
feat/onboarding-next-quest-cards-7739

Conversation

@talissoncosta

Copy link
Copy Markdown
Contributor
  • I have read the Contributing Guide.
  • I have added information to docs/ if required so people know about the feature.
  • I have filled in the "Changes" section below.
  • I have filled in the "How did you test this code" section below.

Changes

Closes #7739

The three "next quest" cards on the onboarding flow (gradual rollout, experiment, remote config) are now actionable. Each one deep-links to the flag's real configuration, nothing faked:

  • Gradual rollout → the flag's segment overrides tab
  • Experiment → the environment's experiments page
  • Remote config → the flag's value tab

The cards stay locked and dimmed until the app connects, matching the flags table above them.

Also folded in two small fixes for the cards: the rollout deep-link now uses the slugified tab label so it resolves to the right tab, and the cards' secondary text no longer renders gold (a Bootstrap .text-secondary collision).

How did you test this code?

Added e2e coverage in onboarding-tests.pw.ts: it asserts the cards are locked before the first evaluation, and that once connected each card deep-links to the right destination (segment overrides tab, value tab, experiments page).

Manually:

  1. Enable onboarding_quickstart_flow, sign up, land on /getting-started.
  2. Before connecting, confirm the next-quest cards are dimmed with an "Unlocks after your first evaluation" note.
  3. Force the connected state via /getting-started?connected.
  4. Click each card and confirm it lands on the flag's segment overrides tab, the flag's value tab, and the experiments page respectively.

@talissoncosta talissoncosta requested a review from a team as a code owner July 2, 2026 12:33
@talissoncosta talissoncosta requested review from kyle-ssg and removed request for a team July 2, 2026 12:33
@vercel

vercel Bot commented Jul 2, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
flagsmith-frontend-preview Ready Ready Preview, Comment Jul 2, 2026 1:55pm
flagsmith-frontend-staging Ready Ready Preview, Comment Jul 2, 2026 1:55pm
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Ignored Ignored Preview Jul 2, 2026 1:55pm

Request Review

@github-actions

github-actions Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Docker builds report

Image Build Status Security report
ghcr.io/flagsmith/flagsmith-e2e:pr-7941 Finished ✅ Skipped
ghcr.io/flagsmith/flagsmith-api-test:pr-7941 Finished ✅ Skipped
ghcr.io/flagsmith/flagsmith-frontend:pr-7941 Finished ✅ Results
ghcr.io/flagsmith/flagsmith-api:pr-7941 Finished ✅ Results
ghcr.io/flagsmith/flagsmith-private-cloud:pr-7941 Finished ✅ Results
ghcr.io/flagsmith/flagsmith:pr-7941 Finished ✅ Results

@github-actions

github-actions Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  10.7 seconds
commit  87645ed
info  🔄 Run: #18027 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  18.5 seconds
commit  87645ed
info  🔄 Run: #18027 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  7 passed

Details

stats  7 tests across 6 suites
duration  57.3 seconds
commit  87645ed
info  🔄 Run: #18027 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  6 passed

Details

stats  6 tests across 4 suites
duration  1 minute, 2 seconds
commit  87645ed
info  🔄 Run: #18027 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  5 passed

Details

stats  5 tests across 4 suites
duration  33.9 seconds
commit  2a96bc4
info  🔄 Run: #18029 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  6 passed

Details

stats  6 tests across 4 suites
duration  45 seconds
commit  2a96bc4
info  🔄 Run: #18029 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  1 passed

Details

stats  1 test across 1 suite
duration  6.9 seconds
commit  2a96bc4
info  🔄 Run: #18029 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  7 passed

Details

stats  7 tests across 6 suites
duration  42.8 seconds
commit  2a96bc4
info  🔄 Run: #18029 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  1 passed

Details

stats  1 test across 1 suite
duration  16.8 seconds
commit  eb9646f
info  🔄 Run: #18030 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  45.1 seconds
commit  eb9646f
info  🔄 Run: #18030 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  1 passed

Details

stats  1 test across 1 suite
duration  6.1 seconds
commit  eb9646f
info  🔄 Run: #18030 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  2 passed

Details

stats  2 tests across 2 suites
duration  46.8 seconds
commit  eb9646f
info  🔄 Run: #18030 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  5 passed

Details

stats  5 tests across 4 suites
duration  5.4 seconds
commit  f2c4e9f
info  🔄 Run: #18031 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  44.8 seconds
commit  f2c4e9f
info  🔄 Run: #18031 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  6 passed

Details

stats  6 tests across 5 suites
duration  6.8 seconds
commit  f2c4e9f
info  🔄 Run: #18031 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  7.2 seconds
commit  f2c4e9f
info  🔄 Run: #18031 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  40 seconds
commit  eb9646f
info  🔄 Run: #18032 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  5 passed

Details

stats  5 tests across 4 suites
duration  11.9 seconds
commit  eb9646f
info  🔄 Run: #18032 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  3 passed

Details

stats  3 tests across 2 suites
duration  11.8 seconds
commit  eb9646f
info  🔄 Run: #18032 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  1 passed

Details

stats  1 test across 1 suite
duration  47.1 seconds
commit  eb9646f
info  🔄 Run: #18032 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  33.9 seconds
commit  12e69c9
info  🔄 Run: #18033 (attempt 1)

Playwright Test Results (oss - depot-ubuntu-latest-arm-16)

passed  4 passed

Details

stats  4 tests across 3 suites
duration  34.9 seconds
commit  12e69c9
info  🔄 Run: #18033 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)

passed  6 passed

Details

stats  6 tests across 4 suites
duration  1 minute, 1 second
commit  12e69c9
info  🔄 Run: #18033 (attempt 1)

Playwright Test Results (private-cloud - depot-ubuntu-latest-16)

passed  2 passed

Details

stats  2 tests across 2 suites
duration  47.2 seconds
commit  12e69c9
info  🔄 Run: #18033 (attempt 1)

@github-actions

github-actions Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Visual Regression

19 screenshots compared. See report for details.
View full report

talissoncosta and others added 3 commits July 2, 2026 10:53
Add an optional content slot (children), make selected optional, and pass
through className, so SelectableCard can back a navigational card and not just
a selection tile. Additive: existing consumers are unaffected.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The three next-quest cards (gradual rollout, experiment, remote config) are
built on SelectableCard and each deep-links to the flag's real config: rollout
to the segment overrides tab, remote config to the value tab, experiment to
the experiments page. The tab param is the slugified tab label. Locked and
dimmed (inert) until the app connects.

Closes #7739

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Add the "Flip it once your app connects" lock affordance beside the Your
flags heading while the toggle is waiting to connect.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Assert the cards are locked before the first evaluation, and that once
connected each one deep-links to the right destination.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature New feature or request front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Onboarding: make the "next quest" cards actionable

3 participants