feat(onboarding): add a personalize onboarding section by jul-dan · Pull Request #2781 · Qovery/console

jul-dan · 2026-06-26T14:35:14Z

Summary

JIRA ticket: QOV-2052

Adds a Getting Started onboarding checklist on the organization overview page, guiding new users through their first deployment on Qovery.

What's new

Onboarding checklist (SectionOnboarding) displayed at the top of the org overview with:

4 required steps: workspace setup (auto-done), cluster deploy, environment creation, first service deploy
2 optional steps based on selected use cases: preview environments (ephemeral-environments) and AI Builder Portal (rde)
Progress bar (% completed)
Contextual CTAs per step with live status (deploying / queued / failed / stopped)
MCP skills suggestion card visible until all steps are done
"You're all set!" completion screen with links relevant to the user's use cases

API integration

New GET/POST /organization/{organizationId}/onboarding endpoints consumed via qovery-typescript-axios@1.1.919
Dismiss (DISMISSED) and complete (COMPLETED) persisted server-side + localStorage

Key behaviors

Hidden for existing orgs (no use_cases set)
Cluster step: only marked done when status === DEPLOYED && is_deployed (avoids false positive on unavailable clusters)
Service step: only marked do
Deployment failure links to onId), not service logs
Stopped service shows a dedicated "Service stopped" link

Screenshots / Recordings

https://www.loom.com/share/72fa2c62139040649152b8036edf9e65

Testing

Changes tested locally in the relevant Console's pages and Storybooks
yarn test or yarn test -u (if you need to regenerate snapshots)
yarn format
yarn lint

PR Checklist

I followed naming, styling, and TypeScript rules (see .cursor/rules)
I performed a self-review (diff inspected, dead code removed)
I titled the PR using Conventional Commits with a scope when possible (e.g. feat(service): add new Terraform service) - required for semantic-release
I only kept necessary comments, written in English (watch for useless AI comments)
I involved a designer to validate UI changes if I am not a designer
I covered new business logic with tests (unit)
I confirmed CI is green (Codecov red can be accepted)
I reviewed and executed locally any AI-assisted code

- Add SectionOnboarding component with 4-step checklist (workspace, cluster, environment, service) - Fetch onboarding status from new GET /organization/{id}/onboarding endpoint - Persist dismiss via POST /organization/{id}/onboarding with status DISMISSED - Hide section for existing orgs (null status) and invited members - Show animated deploying/failed states with cluster and service log links - Add McpSuggestionCard when no cluster exists - Add dev-only reset button to clear dismissed state - Simplify section-production-health (cluster creation moved to onboarding) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…ent_status for service step Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

- Cluster: require both status===DEPLOYED and is_deployed to avoid showing as done when cluster is unavailable (stale status field) - Service: use state===DEPLOYED for running check; add isServiceStopped visual state showing "Service stopped" link when no service is running - Remove unused ServiceDeploymentStatusEnum import Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Old orgs have no onboarding record or use_cases=null — only show the section when use_cases is set (new orgs that went through the wizard). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Preview environments link only if ephemeral-environments was selected, AI Builder Portal only if rde was selected. Invite teammates always shown. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

jul-dan · 2026-06-29T11:30:46Z

@copilot resolve the merge conflicts in this pull request

…ction # Conflicts: # package.json # yarn.lock

Copilot · 2026-06-29T11:33:06Z

@copilot resolve the merge conflicts in this pull request

Merge conflicts resolved in commit 91ff1e6. The only conflict was qovery-typescript-axios version in package.json and yarn.lock — kept our branch's version (1.1.919) over staging's (1.1.913).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…ons moved to onboarding Cluster option cards (Qovery managed, BYOC, Local machine) and MCP skills card were moved to SectionOnboarding. Tests now reflect the simplified EmptyState with a single "Create cluster" CTA. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

codecov · 2026-06-29T12:44:39Z

Codecov Report

❌ Patch coverage is 83.33333% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 47.76%. Comparing base (640bcb7) to head (e75e39e).
⚠️ Report is 4 commits behind head on staging.

Files with missing lines	Patch %	Lines
...vironment-modal/create-clone-environment-modal.tsx	66.66%	1 Missing and 1 partial ⚠️

Additional details and impacted files

@@             Coverage Diff             @@
##           staging    #2781      +/-   ##
===========================================
+ Coverage    47.44%   47.76%   +0.32%     
===========================================
  Files         1267     1246      -21     
  Lines        26812    26564     -248     
  Branches      7913     7747     -166     
===========================================
- Hits         12721    12689      -32     
+ Misses       11892    11681     -211     
+ Partials      2199     2194       -5

Flag	Coverage Δ
unittests	`47.76% <83.33%> (+0.32%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

… and navigation

…ction # Conflicts: # package.json # yarn.lock

Copilot

Pull request overview

Adds a “Getting started” onboarding checklist to the organization overview page, backed by new organization onboarding API endpoints, to guide new users through initial setup and first deployment.

Changes:

Bump qovery-typescript-axios to consume the new organization onboarding endpoints.
Add organization onboarding query/mutation (and unit tests) and a new SectionOnboarding UI rendered on the org overview page.
Simplify the org overview “Production health” empty state and add an onSuccess escape hatch to the clone/create environment modal.

Reviewed changes

Copilot reviewed 13 out of 14 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
yarn.lock	Locks `qovery-typescript-axios` to `1.1.919`.
package.json	Bumps `qovery-typescript-axios` to `1.1.919`.
libs/shared/auth/src/lib/use-auth/use-auth.tsx	Clears React Query cache on logout.
libs/domains/organizations/data-access/src/lib/domains-organizations-data-access.ts	Adds onboarding query key + update mutation calling new endpoints.
libs/domains/organizations/data-access/src/lib/domains-organizations-data-access.spec.ts	Adds unit tests for onboarding query and update mutation.
libs/domains/environments/feature/src/lib/create-clone-environment-modal/create-clone-environment-modal.tsx	Adds optional `onSuccess(environmentId)` callback to override default navigation.
libs/domains/clusters/feature/src/lib/section-production-health/section-production-health.tsx	Removes the previous “cluster options” onboarding-like UI, leaving a simpler empty state CTA.
libs/domains/clusters/feature/src/lib/section-production-health/section-production-health.spec.tsx	Updates tests to match the simplified empty state behavior.
apps/console/src/routes/_authenticated/organization/$organizationId/overview.tsx	Renders the new onboarding section above production health.
apps/console/src/app/components/section-onboarding/use-update-user-signup.ts	Introduces a user signup mutation hook (currently unused).
apps/console/src/app/components/section-onboarding/use-rde-access.ts	Introduces an RDE access query hook (currently unused).
apps/console/src/app/components/section-onboarding/use-organization-onboarding.ts	Adds onboarding query + update-status mutation hooks.
apps/console/src/app/components/section-onboarding/section-onboarding.tsx	Implements the onboarding checklist UI, progress calculation, and completion modal flow.
apps/console/src/app/components/header/user-menu/user-menu.tsx	Changes displayed email to `userToken?.email` only (drops `communication_email` fallback).

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

…ntegrate into section onboarding

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

- Remove dead code: use-rde-access.ts, use-update-user-signup.ts - Extract CompletionPartyHornIllustration to its own file (~200 lines removed from main) - Replace organizationId prop with useParams() in SectionOnboarding - Add enabled: !!firstEnvironment?.id to useDeploymentRule to prevent empty queries - Add enabled prop to UseDeploymentRuleProps - Memoize computed values in SectionOnboarding (useMemo on status flags, allServiceStatuses, completedCount) - Restore user?.communication_email ?? userToken?.email fallback in UserMenu - Extract duplicated navigate/onSuccess logic into handleResult() in CreateCloneEnvironmentModal Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

… resolution - Remove SectionOnboardingProps, use useParams instead of organizationId prop - Add useMemo for all computed status flags and derived values - Add isOnboardingActive guard to prevent unnecessary API calls - Add enabled: !!firstEnvironment?.id to useDeploymentRule Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Shared-device scenarios are not a supported use case. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

rmnbrd

Looks good to me now 👍

RemiBonnet · 2026-07-07T13:31:30Z

🎉 This PR is included in version 1.326.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

jul-dan and others added 14 commits June 24, 2026 17:23

feat(onboarding): add COMPLETED status when all steps are done

254b3b9

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(qov-1844): update onboarding hooks to use generated axios client

17e558b

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): use is_deployed for cluster step and service_deploym…

92cba75

…ent_status for service step Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): show MCP skills card until all steps are completed

b1e2e60

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): hide section for orgs without use_cases (old orgs)

40afc6d

Old orgs have no onboarding record or use_cases=null — only show the section when use_cases is set (new orgs that went through the wizard). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): redirect to deployment logs on service failure

605be46

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): show completion links based on selected use cases

3555f70

Preview environments link only if ephemeral-environments was selected, AI Builder Portal only if rde was selected. Invite teammates always shown. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

chore(onboarding): remove dev-only reset dismiss button

f2bab59

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

chore: revert latest.json to staging

8f1cd9c

style(onboarding): apply prettier formatting

623ad2c

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(onboarding): remove unused variables flagged by lint

e0f8508

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

test(onboarding): add tests for onboarding query and mutation

d2802c0

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Copilot started work on behalf of jul-dan June 29, 2026 11:31 View session

Merge remote-tracking branch 'origin/staging' into feat/onboarding-se…

91ff1e6

…ction # Conflicts: # package.json # yarn.lock

Copilot finished work on behalf of jul-dan June 29, 2026 11:33

jul-dan changed the title ~~Feat/onboarding section~~ feat(onboarding): add a personalize onboarding section Jun 29, 2026

style(onboarding): apply prettier formatting to spec file

f195a8d

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

jul-dan marked this pull request as ready for review June 29, 2026 12:22

TheoGrandin74 added 3 commits June 30, 2026 19:45

feat(onboarding): update checklist completion modal

89db126

feat(onboarding): enhance section onboarding with completion handling…

725f467

… and navigation

Merge remote-tracking branch 'origin/staging' into feat/onboarding-se…

e1f05dc

…ction # Conflicts: # package.json # yarn.lock

rmnbrd requested a review from Copilot July 2, 2026 13:29

Copilot started reviewing on behalf of rmnbrd July 2, 2026 13:29 View session

Copilot AI reviewed Jul 2, 2026

View reviewed changes

rmnbrd requested changes Jul 2, 2026

View reviewed changes

TheoGrandin74 and others added 5 commits July 3, 2026 11:15

feat(onboarding): add CompletionPartyHornIllustration component and i…

7ae49c1

…ntegrate into section onboarding

fix(on-boarding): Avoid unnecessary calls when the onboarding is done

0e25618

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

refactor(auth): remove queryClient.clear() on logout

e75e39e

Shared-device scenarios are not a supported use case. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

jul-dan requested a review from rmnbrd July 3, 2026 13:14

rmnbrd approved these changes Jul 3, 2026

View reviewed changes

rmnbrd merged commit 7fa0b36 into staging Jul 3, 2026
12 checks passed

rmnbrd deleted the feat/onboarding-section branch July 3, 2026 14:59

RemiBonnet added the released label Jul 7, 2026

Uh oh!

Conversation

jul-dan commented Jun 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Screenshots / Recordings

Testing

PR Checklist

Uh oh!

jul-dan commented Jun 29, 2026

Uh oh!

Copilot AI commented Jun 29, 2026

Uh oh!

codecov Bot commented Jun 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

rmnbrd left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

RemiBonnet commented Jul 7, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

jul-dan commented Jun 26, 2026 •

edited

Loading

codecov Bot commented Jun 29, 2026 •

edited

Loading