See Demo
General
Billing

Paywall

Learn how to set up a paywall to have the user select a plan.

By default the starter kit includes a free plan, allowing users to access your application immediately after signing up without making a payment.

Remove the free plan

If you prefer to restrict access, either by offering only paid plans or a trial, you can enable a paywall by removing the free plan from your configuration.

To do this, simply update your packages/billing/src/config.ts file and remove any plan with isFree: true. Remove the following lines:

packages/billing/src/config.ts
export const billingConfig = createBillingConfig({
  products: [
    // [\!code highlight:39]
    {
      id: 'free',
      name: 'Free',
      description: 'Start for free.',
      label: 'Get started',
      isFree: true,
      features: [Feature.AICustomerScoring, Feature.SmartEmailAnalysis],
      // Even if it is free, keep the plans and prices to display the interval and currency correctly
      plans: [
        {
          id: 'plan-free-month',
          displayIntervals: [PriceInterval.Month],
          prices: [
            {
              id: 'price-free-month-id', // a placebo ID is fine here
              type: PriceType.Recurring,
              model: PriceModel.Flat,
              interval: PriceInterval.Month,
              cost: 0,
              currency
            }
          ]
        },
        {
          id: 'plan-free-year',
          displayIntervals: [PriceInterval.Year],
          prices: [
            {
              id: 'price-free-year-id', // a placebo ID is fine here
              interval: PriceInterval.Year,
              type: PriceType.Recurring,
              model: PriceModel.Flat,
              cost: 0,
              currency
            }
          ]
        }
      ]
    }
    // ..
  ]
});

Redirect

This change disables the free plan and redirects users to the /choose-plan page after creating or navigation to an organization.