Skip to content

feat(onboarding): mobile web welcome flow with email signup#2624

Merged
evanhutnik merged 4 commits into
mainfrom
evan/mobile-web-flow-final
Apr 16, 2026
Merged

feat(onboarding): mobile web welcome flow with email signup#2624
evanhutnik merged 4 commits into
mainfrom
evan/mobile-web-flow-final

Conversation

@evanhutnik
Copy link
Copy Markdown
Contributor

Summary

  • Adds a mobile web welcome screen at /app/welcome for unauthenticated touch-device users, with an email signup form that sends a branded welcome email via SES
  • Welcome email links to macro.com/app/welcome?mobile_welcome_email=true so desktop landings from the email are tracked in PostHog (onboarding_start with source: 'mobile_welcome_email')
  • Backend returns { sent: bool } to distinguish first send from duplicate, frontend shows toast for already-sent / rate-limited / invalid cases
  • Fires mobile_web_welcome_viewed, onboarding_step_welcome, and mobile_web_signup_sent_viewed analytics events through the mobile flow

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Apr 16, 2026

Warning

Rate limit exceeded

@evanhutnik has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 35 minutes and 0 seconds before requesting another review.

Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 35 minutes and 0 seconds.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 2a40a721-7b63-4c69-91ae-3dac5c1d3e5d

📥 Commits

Reviewing files that changed from the base of the PR and between e2dabc6 and 6a06571.

📒 Files selected for processing (5)
  • js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx
  • js/app/packages/app/component/interactive-onboarding/MobileWebWelcome.tsx
  • js/app/packages/queries/auth/index.ts
  • js/app/packages/queries/auth/mobile-welcome-email.ts
  • js/app/packages/service-clients/service-auth/client.ts
📝 Walkthrough

Walkthrough

This PR adds a mobile-web specific onboarding flow for touch-based devices. It introduces new UI components (MobileWebWelcome and MobileWebSignupSent), updates the main onboarding entry point to conditionally route unauthenticated mobile-web users to this flow, implements email validation and sending, and adds backend support with database persistence and email template updates.

Changes

Cohort / File(s) Summary
Mobile Web Onboarding UI Components
js/app/packages/app/component/interactive-onboarding/MobileWeb*.tsx
New SolidJS components for mobile web onboarding: welcome screen with email input and form submission, and signup confirmation screen with redirect to home page.
Interactive Onboarding Entry Point
js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx
Added mobile-web user detection and conditional routing to new mobile signup flow for unauthenticated users; includes email validation, signup handler with error/rate-limit handling, and updated analytics tracking with mobile_welcome_email query parameter support.
Analytics Events
js/app/packages/app/lib/analytics/app-events.ts
Added new analytics event types: mobile_web_welcome_viewed and mobile_web_signup_sent_viewed for tracking mobile onboarding flow steps.
Authentication Service Client & API Schema
js/app/packages/service-clients/service-auth/client.ts, js/app/packages/service-clients/service-auth/openapi.json
Added sendMobileWelcomeEmail() client method posting to /mobile-welcome-email endpoint; updated OpenAPI schema with SendMobileWelcomeEmailResponse returning sent status.
Mobile Welcome Email Backend
rust/.../api/mobile_welcome_email/mod.rs, rust/.../api/mobile_welcome_email/_welcome_email_template.html, rust/.../api/swagger.rs
Updated handler to return structured response with boolean sent flag; appended query parameter to email template links; registered new schema component in OpenAPI documentation.

Possibly related PRs

  • PR #2404: Modifies InteractiveOnboarding.tsx to adjust touch-device detection and layout behavior in onboarding context.
  • PR #2187: Modifies InteractiveOnboarding.tsx onboarding entry point to change redirect and initialization logic.
  • PR #2446: Modifies InteractiveOnboarding component to handle onboarding lesson selection and persistence behavior.
🚥 Pre-merge checks | ✅ 2
✅ Passed checks (2 passed)
Check name Status Explanation
Title check ✅ Passed The title follows conventional commits format with 'feat:' prefix, is under 72 characters (59 characters), and accurately summarizes the main change: adding a mobile web welcome flow with email signup for onboarding.
Description check ✅ Passed The description is directly related to the changeset, providing specific details about the mobile web welcome screen, email signup, backend response structure, and analytics events tracked throughout the flow.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Apr 16, 2026

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 4

🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx`:
- Around line 65-71: The current error handling in InteractiveOnboarding.tsx
inspects the raw message string (const msg = result[0]?.[0]?.message) for
substrings '429' and '400', which misses structured responses; instead, read the
HTTP status from the client result (e.g., result[0]?.[0]?.status or
result[0]?.status) and branch on that, falling back to checking normalized
server message values like 'rate limit exceeded' or 'invalid email' when status
is unavailable, then call toast.failure(...) accordingly so the rate-limit and
invalid-email toasts are shown reliably.
- Around line 400-403: The analytics.track call that sets source based on params
currently uses params.has('mobile_welcome_email') which treats any presence
(including false or empty) as true; update the logic in the
InteractiveOnboarding component where analytics.track('onboarding_start', ...)
is called to check the actual parameter value by using
params.get('mobile_welcome_email') === 'true' (instead of params.has(...)) so
the source is set only when the query value equals the string 'true'.
- Line 56: Component calls authServiceClient.sendMobileWelcomeEmail directly;
move this into a TanStack Query mutation in the queries package and call that
from the component. Add a new mutation (e.g., export useSendMobileWelcomeEmail)
in queries/auth that uses useMutation and calls
authServiceClient.sendMobileWelcomeEmail(email), export the mutation hook and
any needed types, then update InteractiveOnboarding.tsx to import and use
useSendMobileWelcomeEmail (calling mutate or mutateAsync) instead of calling
authServiceClient.sendMobileWelcomeEmail directly; preserve existing
success/error handling and loading state.

In `@js/app/packages/app/component/interactive-onboarding/MobileWebWelcome.tsx`:
- Around line 59-65: The email input in the MobileWebWelcome component lacks an
explicit accessible name; add one by either wrapping the input with a <label>
tied to the input via an id or by adding an aria-label/aria-labelledby attribute
to the input element (the input using value={email()} and onInput={(e) =>
setEmail(e.currentTarget.value)}). Ensure the id on the input matches the
label's htmlFor if using a label, or provide a clear descriptive aria-label like
"Email address" so screen readers announce the field.
🪄 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: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 7bbef4d1-2480-4b86-9c66-4df1bf103e67

📥 Commits

Reviewing files that changed from the base of the PR and between 6dd80d5 and e2dabc6.

⛔ Files ignored due to path filters (3)
  • js/app/packages/service-clients/service-auth/generated/client.ts is excluded by !**/generated/**
  • js/app/packages/service-clients/service-auth/generated/schemas/index.ts is excluded by !**/generated/**
  • js/app/packages/service-clients/service-auth/generated/schemas/sendMobileWelcomeEmailResponse.ts is excluded by !**/generated/**
📒 Files selected for processing (9)
  • js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx
  • js/app/packages/app/component/interactive-onboarding/MobileWebSignupSent.tsx
  • js/app/packages/app/component/interactive-onboarding/MobileWebWelcome.tsx
  • js/app/packages/app/lib/analytics/app-events.ts
  • js/app/packages/service-clients/service-auth/client.ts
  • js/app/packages/service-clients/service-auth/openapi.json
  • rust/cloud-storage/authentication_service/src/api/mobile_welcome_email/_welcome_email_template.html
  • rust/cloud-storage/authentication_service/src/api/mobile_welcome_email/mod.rs
  • rust/cloud-storage/authentication_service/src/api/swagger.rs

Comment thread js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx Outdated
Comment thread js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx Outdated
Comment thread js/app/packages/app/component/interactive-onboarding/InteractiveOnboarding.tsx Outdated
@evanhutnik evanhutnik merged commit 48cfc81 into main Apr 16, 2026
40 checks passed
@evanhutnik evanhutnik deleted the evan/mobile-web-flow-final branch April 16, 2026 18:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant