<img width="2778" height="1633" alt="CleanShot 2025-10-30 at 16 42 23" src="https://github.com/user-attachments/assets/45d84980-26c9-4cb4-ac85-21dc174dba35" />
<!-- This is an auto-generated description by cubic. -->
---
## Summary by cubic
Added a sign-out button to the onboarding v3 layout and refactored Getting Started to use the shared OnboardingLayout for a consistent header and structure.
- **New Features**
- Sign-out button in the onboarding footer using next-auth (redirects to /auth/logout).
- Localized button label via useLocale.
- **Refactors**
- Getting Started view now wraps content with OnboardingLayout.
- Removed duplicated header and progress UI from the view.
- Simplified content container and spacing; layout handles max width and flex.
<sup>Written for commit 830bfd1. Summary will update automatically on new commits.</sup>
<!-- End of auto-generated description by cubic. -->
## What does this PR do?
Pass invites to submit hook instead of relying on state. State can be out of sync on last step as its not commited onChange but onsubmit.
<!-- This is an auto-generated description by cubic. -->
---
## Summary by cubic
Pass the invite list directly to the onboarding submit hook to avoid stale state and ensure the final step submits the correct invites. Fixes missed or outdated invites during onboarding.
- **Bug Fixes**
- submitOnboarding now accepts invites as a parameter and uses them for submission.
- OrganizationInviteView passes invitesData to submitOnboarding instead of relying on store.invites.
<!-- End of auto-generated description by cubic. -->
\## What does this PR do?
Refactors the onboarding UI components to use shared layout components across personal and organization onboarding flows. This change:
- Creates reusable `OnboardingCard` and `OnboardingLayout` components
- Implements these components across all onboarding views
- Maintains consistent UI and reduces code duplication
- Improves maintainability by centralizing layout logic
## Visual Demo (For contributors especially)
#### Image Demo:
Before this change, each onboarding view had its own layout implementation with duplicated header, footer, and card structure. After this change, the shared components provide consistent styling and structure.
## Mandatory Tasks (DO NOT REMOVE)
- [x] I have self-reviewed the code.
- [x] I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox.
- [x] I confirm automated tests are in place that prove my fix is effective or that my feature works.
## How should this be tested?
- Navigate through the onboarding flow for both personal and organization accounts
- Verify that all screens maintain consistent layout and styling
- Check that progress indicators correctly show the current step
- Ensure all functionality (form submissions, navigation between steps) works as expected
## Checklist
- I have read the [contributing guide](https://github.com/calcom/cal.com/blob/main/CONTRIBUTING.md)
- My code follows the style guidelines of this project
- I have commented my code, particularly in hard-to-understand areas
- I have checked if my changes generate no new warnings
## What does this PR do?
- Redirects users to the personal settings page after organization creation instead of the getting-started page
- Adds a new `skipToPersonal` function in `useSubmitOnboarding` hook to handle this redirection
- Creates a new `getGettingStartedPathWhenInvited` method in `OnboardingPathService` to provide the correct path for invited users
- Updates all invitation-related code to use the new path method
- Improves UI spacing in the organization invite view
## Visual Demo (For contributors especially)
#### Image Demo (if applicable):
- Before: Users were redirected to `/onboarding/getting-started` or `/getting-started` after organization creation
- After: Users are now redirected to `/onboarding/personal/settings` or `/getting-started` based on feature flag
## Mandatory Tasks (DO NOT REMOVE)
- [ ] I have self-reviewed the code.
- [ ] I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox.
- [ ] I confirm automated tests are in place that prove my fix is effective or that my feature works.
## How should this be tested?
1. Create a new organization through the onboarding flow
2. Verify you are redirected to the personal settings page instead of getting-started
3. Accept an invitation to an organization as a new user
4. Verify you are directed to the personal settings page after signup
5. Check that the UI spacing in the organization invite view looks correct
## Checklist
- I have read the [contributing guide](https://github.com/calcom/cal.com/blob/main/CONTRIBUTING.md)
- My code follows the style guidelines of this project
- I have commented my code, particularly in hard-to-understand areas
- I have checked if my changes generate no new warnings
* i18n
* WIP icon stuff
* More icon work
* More gradient tuning
* Mvoe plan-icon to planicon.tsx
* Fix cubic suggestion
* Fix darkmode icon and gradients
* Fix type error
* Onboarding path service
* Update usages of onboarding path and getting started hook
## What does this PR do?
Refactors the personal onboarding flow by creating reusable components for better code organization and maintainability. The changes include:
- Creates shared components for the onboarding experience: `OnboardingLayout`, `OnboardingCard`, `InstallableAppCard`, and `SkipButton`
- Implements a custom hook `useAppInstallation` to manage app installation state and callbacks
- Enhances the video app connection step to automatically set the first connected video app as default
- Improves the calendar connection flow with proper installation handling
- Adds visual indicators for connected apps
## Visual Demo (For contributors especially)
The refactored components maintain the same visual appearance while improving code structure and reusability.
## Mandatory Tasks
- [x] I have self-reviewed the code
- [x] I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. N/A
- [x] I confirm automated tests are in place that prove my fix is effective or that my feature works.
## How should this be tested?
- Go through the personal onboarding flow
- Test connecting calendar apps in step 3
- Test connecting video apps in step 4
- Verify that the first connected video app is automatically set as default
- Check that connected apps show the "connected" indicator
- Verify that skipping steps works correctly
## Checklist
- I have read the [contributing guide](https://github.com/calcom/cal.com/blob/main/CONTRIBUTING.md)
- My code follows the style guidelines of this project
- I have commented my code, particularly in hard-to-understand areas
- I have checked if my changes generate no new warnings
## What does this PR do?
This PR is stacked on https://github.com/calcom/cal.com/pull/24299 this adds the v3 flow for onboarding with teams.
<!-- This is an auto-generated description by cubic. -->
---
## Summary by cubic
Adds the v3 team onboarding flow with Details, Brand, and Invite steps, including slug validation, branding, and member invites. Updates routing to support the Team plan and creates teams with Stripe checkout when needed.
- **New Features**
- Team Details: name and slug with async availability check and URL preview.
- Team Brand: hex color picker and logo upload with live preview.
- Team Invite: add/remove emails, invite role toggle (Member/Admin), and form validation.
- State: adds teamDetails, teamBrand, and teamInvites to the onboarding store with actions.
- Creation: new useCreateTeam hook; redirects to Stripe if checkout URL is returned, or to Getting Started on success.
- Routing/Auth: protected team pages (details, brand, invite) and updates plan selection to route to /onboarding/teams.
<!-- End of auto-generated description by cubic. -->
* feat: redirect to new onboarding flow
* Getting started
* Brand details
* Preview organization brands
* Orgs team pages
* Invite team steps
* Move to global zustand store
* Few darkmdoe fixes
* Wip onboarding + stripe flow
* Default plan state
Server Action for gettting slug satus of org
* Remove onboardingId
* Confirmation prompt
* Update old onboarding flow handlers to handle new fields
* update onboarding hook
* Filter out organization section for none -company emails
* Match placeholders to users domain
* Drop migration
* Wip new onboarding intent
* WIP flow for self-hosted. Same service call just split logic
* WIP
* Add TODO
* Use onboarding user type instead of trpc session
* WIP
* WIP
* pass role and team name from onboarding to save in schema
* Add test to ensure role + name + team are persisted into onboarding table
* migrate roles to enum values
* Update ENUM
* Fix type error
* Redirect if flag is disabled
* Revert packages
* Revert all packages/* changes to original branch point
* Layout fixes + design
* Add slugify
* Support saving brand,logo and banner
* Cleanup
* iMobile fixes
* More mobile and darkmdoe fixes
* Add I18n
* Fix lock file
* Fix types
* Fix types errors
* Copy changes
