<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- RECURSEML_SUMMARY:START -->
## High-level PR Summary
This PR adds a new `priceId` field to the `OneTimePurchase` and
`Subscription` models in the database to store Stripe price identifiers.
The change includes database schema updates, corresponding migration
files, and modifications to payment processing logic to properly track
and store price IDs throughout the purchase flow. The implementation
consistently propagates the price ID from Stripe's API responses through
various payment processing endpoints and webhooks handlers, ensuring the
data is properly stored and synced with the database models.
⏱️ Estimated Review Time: 15-30 minutes
<details>
<summary>💡 Review Order Suggestion</summary>
| Order | File Path |
|-------|-----------|
| 1 | `apps/backend/prisma/schema.prisma` |
| 2 |
`apps/backend/prisma/migrations/20250917193043_store_price_id/migration.sql`
|
| 3 | `apps/backend/src/lib/stripe.tsx` |
| 4 |
`apps/backend/src/app/api/latest/payments/purchases/purchase-session/route.tsx`
|
| 5 |
`apps/backend/src/app/api/latest/internal/payments/test-mode-purchase-session/route.tsx`
|
| 6 |
`apps/backend/src/app/api/latest/integrations/stripe/webhooks/route.tsx`
|
| 7 | `apps/e2e/tests/backend/endpoints/api/v1/stripe-webhooks.test.ts`
|
</details>
<!-- RECURSEML_SUMMARY:END -->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Add `priceId` field to track Stripe price identifiers in purchase and
subscription models, updating schema, payment logic, and tests.
>
> - **Database Changes**:
> - Add `priceId` field to `OneTimePurchase` and `Subscription` models
in `schema.prisma`.
> - Update database schema with migration
`20250917193043_store_price_id/migration.sql`.
> - **Payment Processing**:
> - Update `processStripeWebhookEvent()` in `webhooks/route.tsx` to
handle `priceId`.
> - Modify `POST` handlers in `purchase-session/route.tsx` and
`test-mode-purchase-session/route.tsx` to include `priceId` in metadata.
> - Update `syncStripeSubscriptions()` in `stripe.tsx` to sync
`priceId`.
> - **Testing**:
> - Add tests in `stripe-webhooks.test.ts` to validate `priceId`
handling in webhook and purchase flows.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 4950494d62. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
----
<!-- ELLIPSIS_HIDDEN -->
<!-- RECURSEML_ANALYSIS:START -->
## Review by RecurseML
_🔍 Review performed on
[e48ffa6..4950494](e48ffa67ee...4950494d62)_
| Severity | Location | Issue
| Delete |
|:----------:|----------|-------|:--------:|
|  |
[apps/e2e/tests/backend/endpoints/api/v1/stripe-webhooks.test.ts:153](https://github.com/stack-auth/stack-auth/pull/900#discussion_r2356623574)
| The field `priceId` uses camelCase instead of the required snake_case
for API parameters |
[
|
|  |
[apps/e2e/tests/backend/endpoints/api/v1/stripe-webhooks.test.ts:245](https://github.com/stack-auth/stack-auth/pull/900#discussion_r2356623664)
| The field `priceId` uses camelCase instead of the required snake_case
for API parameters |
[
|
|  |
[apps/e2e/tests/backend/endpoints/api/v1/stripe-webhooks.test.ts:358](https://github.com/stack-auth/stack-auth/pull/900#discussion_r2356623721)
| The field `priceId` uses camelCase instead of the required snake_case
for API parameters |
[
|
<details>
<summary>✅ Files analyzed, no issues (4)</summary>
• `apps/backend/src/lib/stripe.tsx`
•
`apps/backend/src/app/api/latest/payments/purchases/purchase-session/route.tsx`
•
`apps/backend/src/app/api/latest/integrations/stripe/webhooks/route.tsx`
•
`apps/backend/src/app/api/latest/internal/payments/test-mode-purchase-session/route.tsx`
</details>
<details>
<summary>⏭️ Files skipped (trigger manually) (2)</summary>
| Locations | Trigger Analysis |
|-----------|:------------------:|
`apps/backend/prisma/migrations/20250917193043_store_price_id/migration.sql`
|
[
`apps/backend/prisma/schema.prisma` |
[
</details>
[](https://discord.gg/n3SsVDAW6U)
<!-- RECURSEML_ANALYSIS:END -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- New Features
- Persist the selected price ID with one-time purchases and
subscriptions.
- Carry the price ID through payment flows and Stripe metadata for
better tracking and reporting.
- Test mode purchases now also record the price ID.
- Chores
- Database migration adds a price ID field to purchase and subscription
records.
- Tests
- Updated end-to-end tests to validate price ID handling in webhook and
purchase flows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Takes `stripeAccountId` out of the schema, adds a new endpoint for
getting a user's account ifo, and adds a new notification banner for
un-onboarded accounts.
<img width="1203" height="524" alt="Screenshot 2025-08-25 at 16 40 18"
src="https://github.com/user-attachments/assets/a2b0626d-dc86-4090-b221-0969ec34f124"
/>
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Enhances payments UX with new UI components, refactors, and expanded
tests, while introducing breaking changes and improved error handling.
>
> - **Behavior**:
> - Removes `stripeAccountId` from schema and adds new endpoint in
`route.ts` for user account info.
> - Adds notification banner for un-onboarded accounts in `layout.tsx`.
> - Updates `createCheckoutUrl` to expect options object.
> - **UI Componets**:
> - Adds `CreateGroupDialog`, `IncludedItemDialog`, `ItemDialog`,
`OfferDialog`, `PriceDialog`, and `ListSection` in `payments` directory.
> - Implements `Stepper` component in `stepper.tsx` for multi-step
processes.
> - Adds `IllustratedInfo` component in `illustrated-info.tsx`.
> - **Refactor**:
> - Refactors `use-hover.tsx` to improve hover detection.
> - Updates `admin-interface.ts` to handle known errors more robustly.
> - Removes feature gating from Payments and Offers pages.
> - **Tests**:
> - Expands E2E and unit tests in `internal-metrics.test.ts` to cover
new payment flows and error handling.
> - **Misc**:
> - Updates `mapProperty` and `removeProperty` functions in `schema.ts`
for better property handling.
> - Adds `StripeAccountInfoNotFound` error in `known-errors.tsx`.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for aed61b5857. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
----
<!-- ELLIPSIS_HIDDEN -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Stripe onboarding UI, account-status display, and in-app setup flow.
* Quantity support across checkout, test-mode purchases, and purchase
flows.
* Payments dashboard revamp: Offers/Items management, groups, add‑ons,
price editor, included-item dialogs, visual connections, and welcome/DEV
modes.
* **Refactor**
* Stripe account stored per-project and resolved asynchronously;
subscription sync made more robust.
* Payments and Offers pages no longer feature-gated.
* **Breaking Changes**
* createCheckoutUrl now expects an options object ({ offerId }).
* **Tests**
* Expanded E2E and unit tests covering payments, onboarding, and
purchase flows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Bilal Godil <bg2002@gmail.com>
<!-- ELLIPSIS_HIDDEN -->
> [!IMPORTANT]
> Add Twitch as a new OAuth provider, updating backend logic and UI
components to support Twitch authentication.
>
> - **Behavior**:
> - Add `TwitchProvider` class in `providers/twitch.tsx` to handle OAuth
with Twitch, including user info post-processing.
> - Update `_providers` in `index.tsx` to include `TwitchProvider`.
> - Add `TWITCH` to `StandardOAuthProviderType` enum in `schema.prisma`.
> - **UI Components**:
> - Add Twitch icon and color in `brand-icons.tsx` and `BRAND_COLORS`.
> - Update `ProviderIcon`, `ProviderSettingDialog`, and `OAuthButton` to
support Twitch in `providers.tsx` and `oauth-button.tsx`.
> - **Misc**:
> - Add `twitch` to `standardProviders` in `oauth.tsx`.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 08c0de5762. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Zai Shi <zaishi00@outlook.com>
<img width="719" alt="image"
src="https://github.com/user-attachments/assets/1a9d10a9-a571-4c61-9702-4cfb4d2efa1c"
/>
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Enhances dashboard onboarding with a new setup page, refactors metrics
components, and improves UI components and code organization.
>
> - **Behavior**:
> - Introduces `SetupPage` in `setup-page.tsx` for onboarding, with
framework selection and key generation.
> - Replaces `OnboardingDialog` with `SetupPage` for a more interactive
onboarding experience.
> - `PageClient` in `page-client.tsx` now toggles between `SetupPage`
and `MetricsPage` based on user count.
> - **UI Components**:
> - Adds `CodeBlock` component in `code-block.tsx` for displaying code
snippets with syntax highlighting.
> - Enhances `EnvKeys` in `env-keys.tsx` to support downloading keys and
displaying them in tabs.
> - Introduces `InlineCode` component in `inline-code.tsx` for inline
code styling.
> - **Refactoring**:
> - Moves metrics-related components to `(overview)/(metrics)`
directory.
> - Renames and reorganizes files for better structure, e.g.,
`globe.tsx` and `line-chart.tsx`.
> - Updates `SidebarLayout` and `PageLayout` for improved layout
handling.
> - **Dependencies**:
> - Adds `react-syntax-highlighter` and its types to `package.json` for
code highlighting.
> - **Misc**:
> - Updates `theme.tsx` to improve theme watching logic.
> - Fixes minor issues and improves code readability across several
files.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 194d1ef8da. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Disable OAuth in iframes using `useInIframe` hook and update
`SimpleTooltip` to support conditional disabling.
>
> - **Behavior**:
> - Disable OAuth buttons in iframes by using `useInIframe` hook in
`oauth-button.tsx`.
> - Show tooltip "OAuth is disabled in iFrame" when OAuth buttons are
disabled.
> - **Components**:
> - Add `useInIframe` hook in `use-in-iframe.tsx` to detect iframe
context.
> - Remove `IframePreventer` component and its usage in
`stack-handler.tsx`.
> - Update `SimpleTooltip` in `simple-tooltip.tsx` to accept `disabled`
prop to conditionally disable tooltips.
> - **Misc**:
> - Remove unused `useTranslation` import in `auth-page.tsx`.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 35793e8055. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Update dependencies, add bundle analyzer, and enhance
`ProfileImageEditor` with `react-easy-crop`.
>
> - **Dependencies**:
> - Update `lucide-react` to `^0.508.0` in
`apps/dashboard/package.json`, `packages/stack-emails/package.json`, and
`packages/stack-ui/package.json`.
> - Replace `react-avatar-editor` with `react-easy-crop` in
`packages/react/package.json`, `packages/stack/package.json`, and
`packages/template/package-template.json`.
> - Add `@next/bundle-analyzer` to `examples/demo/package.json`.
> - **Build Configuration**:
> - Add bundle analyzer configuration to `examples/demo/next.config.js`.
> - Add `analyze` script to `examples/demo/package.json`.
> - **Component Changes**:
> - Replace `AvatarEditor` with `Cropper` in `ProfileImageEditor` in
`packages/template/src/components/profile-image-editor.tsx`.
> - Update `Calendar` component styles in
`packages/stack-ui/src/components/ui/calendar.tsx`.
> - **Utility Functions**:
> - Update `isBase32`, `isBase64`, and `isBase64Url` test cases in
`bytes.tsx` to handle specific edge cases.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for ae4574dba0. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Reworked Stack Auth demo with UI enhancements and code refactoring for
improved user experience and maintainability.
>
> - **UI Enhancements**:
> - Updated `global.css` to change background colors for light and dark
themes.
> - Added `Image` components in `page-client.tsx` and `header.tsx` for
visual elements.
> - Refactored `page-client.tsx` to use `Card`, `CardContent`,
`CardFooter`, and `CardHeader` for user information display.
> - **Code Refactoring**:
> - Removed `stack-scope` class from `SelectTrigger` in `select.tsx`.
> - Updated button layout and text in `page-client.tsx` for
sign-in/sign-up and user information.
> - Enhanced header layout in `header.tsx` with logo and theme toggle
improvements.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for c7a9f30371. It will automatically
update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
<!-- ELLIPSIS_HIDDEN -->
> [!IMPORTANT]
> Adds `stack-scope` class to component variants across multiple files
for consistent styling.
>
> - **Styling Update**:
> - Adds `stack-scope` class to `alertVariants` in `alert.tsx`.
> - Adds `stack-scope` class to `badgeVariants` in `badge.tsx`.
> - Adds `stack-scope` class to `buttonVariants` in `button.tsx`.
> - Adds `stack-scope` class to `labelVariants` in `label.tsx`.
> - Adds `stack-scope` class to `navigationMenuTriggerStyle` in
`navigation-menu.tsx`.
> - Adds `stack-scope` class to `sheetVariants` in `sheet.tsx`.
> - Adds `stack-scope` class to `toastVariants` in `toast.tsx`.
> - Adds `stack-scope` class to `toggleVariants` in `toggle.tsx`.
> - Adds `stack-scope` class to `typographyVariants` in
`typography.tsx`.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for e0b4d17ba9. It will automatically
update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<img width="1510" alt="image"
src="https://github.com/user-attachments/assets/99619123-6be5-4788-aebe-5fc2a9a36245"
/>
<img width="1510" alt="image"
src="https://github.com/user-attachments/assets/660677bf-f19a-4673-94c8-59ac50eb6ae5"
/>
<img width="1510" alt="image"
src="https://github.com/user-attachments/assets/11ae63c4-5813-4fd8-aa01-fa580d2103be"
/>
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Introduces API key management for users and teams, integrating with
existing project configurations and permissions, and adds comprehensive
tests and examples.
>
> - **API Key Management**:
> - Introduces `ProjectApiKey` model in `schema.prisma` for managing API
keys.
> - Adds `createApiKeyHandlers` in `handlers.tsx` to handle API key CRUD
operations.
> - Implements API key creation, revocation, and validation logic.
> - **Permissions and Configurations**:
> - Adds `allowUserApiKeys` and `allowTeamApiKeys` to `ProjectConfig` in
`schema.prisma`.
> - Updates `TeamSystemPermission` enum to include `MANAGE_API_KEYS`.
> - Ensures API key operations respect project configurations and
user/team permissions.
> - **Testing and Examples**:
> - Adds extensive tests in `api-keys.test.ts` to cover various API key
scenarios.
> - Updates example projects to demonstrate API key usage.
> - **Miscellaneous**:
> - Refactors existing code to integrate API key functionalities.
> - Updates documentation and type definitions to reflect new API key
features.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 96f60c57f0. It will automatically
update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
Updates `examples/demo` to Next.js 15 and adds Next.js 15 support to `packages/stack`.
The other packages and apps are still running on Next.js 14 to ensure compatibility.
Added contact channels to stack-app
Added emails, OTP, and password settings to the account settings page
Added /api/v1/auth/password/set
Added otp_auth_enabled to users endpoints
