fix(onboarding): remove referral code step from onboarding flow#772
Conversation
Simplify onboarding from 4 steps to 3: Welcome → Skills → Context Gathering. The referral step added unnecessary friction; the feature may return later so ReferralApplyStep.tsx is preserved but unused. Closes tinyhumansai#752
📝 WalkthroughWalkthroughThe PR removes the referral-step from the onboarding flow by eliminating referral-gating logic, state management, and the ReferralApplyStep component render from the Onboarding controller. The WelcomeStep props interface is simplified by removing loading/disabled state controls. E2E tests and documentation are updated to validate the new 3-step flow (Welcome → Skills → Context Gathering). Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@app/src/pages/onboarding/steps/WelcomeStep.tsx`:
- Line 86: The CTA label in WelcomeStep was changed to "Let's Start" causing E2E
tests that click the "Continue" button to fail; update the OnboardingNextButton
usage in WelcomeStep (the component named OnboardingNextButton) to use the
original/expected label text used by the E2E test suite (or add a data-test-id
prop) so the test can reliably find it—either restore the label prop to
"Continue" or add a stable selector (e.g., data-testid or data-cy) on the
OnboardingNextButton and update/onNext accordingly so the E2E step selection
targets that selector instead of visible text.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 88041c0b-3e7e-4869-94af-d80911612a68
📒 Files selected for processing (4)
.claude/memory.mdapp/src/pages/onboarding/Onboarding.tsxapp/src/pages/onboarding/steps/WelcomeStep.tsxapp/test/e2e/specs/login-flow.spec.ts
| loading={nextLoading} | ||
| loadingLabel={nextLoadingLabel} | ||
| /> | ||
| <OnboardingNextButton label="Let's Start" onClick={onNext} /> |
There was a problem hiding this comment.
CTA label change breaks existing onboarding E2E step selection.
Line 86 changed the button text to "Let's Start", but the onboarding walkthrough still clicks "Continue" on step 0. That can leave the flow stuck on Welcome during E2E runs.
💡 Proposed fix
- <OnboardingNextButton label="Let's Start" onClick={onNext} />
+ <OnboardingNextButton label="Continue" onClick={onNext} />📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <OnboardingNextButton label="Let's Start" onClick={onNext} /> | |
| <OnboardingNextButton label="Continue" onClick={onNext} /> |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@app/src/pages/onboarding/steps/WelcomeStep.tsx` at line 86, The CTA label in
WelcomeStep was changed to "Let's Start" causing E2E tests that click the
"Continue" button to fail; update the OnboardingNextButton usage in WelcomeStep
(the component named OnboardingNextButton) to use the original/expected label
text used by the E2E test suite (or add a data-test-id prop) so the test can
reliably find it—either restore the label prop to "Continue" or add a stable
selector (e.g., data-testid or data-cy) on the OnboardingNextButton and
update/onNext accordingly so the E2E step selection targets that selector
instead of visible text.
There was a problem hiding this comment.
Not a regression from this PR — the label was already "Let's Start" on main before this change (see git show main:app/src/pages/onboarding/steps/WelcomeStep.tsx line 95). The E2E test's clickFirstMatch(['Continue']) is a pre-existing mismatch that doesn't block the test (it returns null gracefully and the flow continues). Out of scope for this PR.
There was a problem hiding this comment.
@graycyrus, thanks for the correction — you're right, this is not a regression from this PR. I apologize for the noise.
✏️ Learnings added
Learnt from: graycyrus
Repo: tinyhumansai/openhuman PR: 772
File: app/src/pages/onboarding/steps/WelcomeStep.tsx:86-86
Timestamp: 2026-04-22T08:39:00.335Z
Learning: In `app/src/pages/onboarding/steps/WelcomeStep.tsx`, the `OnboardingNextButton` label on `WelcomeStep` has always been `"Let's Start"` on `main` (not `"Continue"`). This is a pre-existing state and should not be flagged as a regression in any future PR. The E2E helper `clickFirstMatch(['Continue'])` returns `null` gracefully when no match is found, so the label mismatch is non-blocking for the test flow.
Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.
🧠 Learnings used
Learnt from: graycyrus
Repo: tinyhumansai/openhuman PR: 307
File: app/src/components/ConnectionIndicator.tsx:29-36
Timestamp: 2026-04-03T14:57:27.517Z
Learning: In `app/src/components/ConnectionIndicator.tsx`, the `description` prop was intentionally removed from `ConnectionIndicatorProps` as part of the light-theme redesign (PR `#307`). The component now renders only as a compact pill badge; any surrounding description text is the responsibility of the parent component (e.g., `Home.tsx`). Do not flag the absence of `description` rendering as a regression.
Learnt from: graycyrus
Repo: tinyhumansai/openhuman PR: 167
File: app/src/components/OnboardingOverlay.tsx:30-39
Timestamp: 2026-04-01T13:52:17.936Z
Learning: In React components, do not perform synchronous `setState` (or other state-updating calls) directly inside `useEffect` bodies. The lint rule `react-hooks/set-state-in-effect` (enforced in this codebase) disallows patterns such as resetting state flags at the top of an effect before returning. Refactor to avoid calling state setters in the effect; prefer deriving state from props/render, using refs, or restructuring logic so state updates occur outside `useEffect`.
… WelcomeStep test - Rebase onto upstream/main (20 commits since PR merge base) - Resolve PrivacyPanel.tsx conflict: keep upstream capability-backed dynamic privacy list (PR tinyhumansai#760) rather than the static whatLeavesItems fallback — the dynamic system supersedes the static one - Resolve WelcomeStep.tsx conflict: keep simplified interface from upstream (nextDisabled/nextLoading/nextLoadingLabel removed) plus WhatLeavesLink footer from this PR - Resolve login-flow.spec.ts conflict: remove ReferralApplyStep comment (step was removed in upstream PR tinyhumansai#772), keep ContextGatheringStep user-driven gate copy from this PR - Fix WelcomeStep.test.tsx: remove test that passes now-removed props (nextDisabled, nextLoading, nextLoadingLabel) — update to verify CTA is always enabled in simplified interface - Apply Prettier formatting across files reformatted post-rebase - All quality checks pass: typecheck clean, lint 0 errors, format unchanged, 534 unit tests passed (2 pre-existing skips)
…humansai#772) Simplify onboarding from 4 steps to 3: Welcome → Skills → Context Gathering. The referral step added unnecessary friction; the feature may return later so ReferralApplyStep.tsx is preserved but unused. Closes tinyhumansai#752
Summary
ReferralApplyStep) from the onboarding overlay, simplifying the flow from 4 steps to 3: Welcome → Skills → Context GatheringOnboarding.tsxnextDisabled/nextLoading/nextLoadingLabelprops fromWelcomeStepTest plan
yarn typecheckpassesyarn lintpassesyarn format:checkpassesyarn buildpassesyarn tauri devlaunches successfullyReferralApplyStep.tsxpreserved but unusedCloses #752
Summary by CodeRabbit
Refactor
Tests