brandbrandv1.0
Integration
Utilities
Data Display
Data Entry
Feedback
Tables
Charts
Maps
Navigation
BEHAVIORAL
Layout

Supported Payment Providers

The starter ships with three payment providers wired into the same pricing config, checkout actions, success flows, and webhook routes.

  • Stripe
  • Paddle
  • Lemon Squeezy

Where Payment Configuration Lives

All paid plans are defined in config/pricing.ts.

The free plan keeps empty gateway IDs, while pro and enterprise already include monthly and yearly IDs for Stripe, Lemon Squeezy, and Paddle.

variantIds: {
  stripe: { monthly: "price_xxx", yearly: "price_yyy" },
  lemonsqueezy: { monthly: "123", yearly: "456" },
  paddle: { monthly: "pri_xxx", yearly: "pri_yyy" },
}

Authenticated App Billing Flow

  1. User opens /pricing inside the app.
  2. The checkout page calls createSubscriptionCheckout() from actions/payment/checkout.ts.
  3. The action verifies Supabase auth and also verifies that the user belongs to the selected organization.
  4. Stripe returns a hosted checkout URL, Lemon Squeezy returns a hosted checkout URL, and Paddle returns a client checkout payload.
  5. After success, the app lands on /pricing/success and final sync happens through Stripe session confirmation or provider webhook processing.

Landing Billing Flow

  1. Public checkout starts from landing-app/views/Checkout.tsx.
  2. That page calls createLandingUserSubscriptionCheckout() from actions/payment/landing-checkout.ts.
  3. Stripe redirects directly to hosted checkout, Lemon Squeezy creates a hosted checkout URL, and Paddle opens the overlay with @paddle/paddle-js.
  4. After success, the landing flow redirects users to NEXT_PUBLIC_JAMPACK_APP_URL/dashboard?source=landing&status=success&plan=....
  5. Stripe landing purchases are confirmed with confirmLandingStripeCheckoutSession(), while Paddle and Lemon Squeezy are marked active optimistically and then kept in sync by webhooks.

Webhook Routes

Each provider has its own route handler under the parent app project.

All three routes update billing state on both Profile and Organization records when enough metadata is present.

Stripe additionally maintains Subscription and OrganizationSubscription tables with recurring period data.

  • app/api/webhooks/stripe/route.ts
  • app/api/webhooks/paddle/route.ts
  • app/api/webhooks/lemonsqueezy/route.ts

Recommended Setup Order

  1. Confirm DATABASE_URL, DIRECT_URL, and Supabase auth are working first.
  2. Review all IDs in config/pricing.ts.
  3. Enable exactly one provider first.
  4. Test app checkout at /pricing.
  5. Test landing checkout at /landing/checkout.
  6. Verify webhook delivery and billing updates in Prisma.
Jump to