Payments

Stripe

Setup Stripe

Go in .env and add your Stripe keys.

Create products

A product is already created in the database/seeds/products.ts file.
To create a new seed file, you can use the following command: node ace make:seed name_of_the_seed

To seed the database, you can use the following command:

npm run db:seed

The product will be available in the Stripe dashboard.

Listen to webhooks

You can listen to webhooks in the app/stripe/controllers/stripe_controller.ts file.

But, before that, you'll need to listen to the webhooks locally. You can do this by running the following command:

npm run stripe:listen

You need to have a Stripe account & local endpoint to listen to webhooks (opens in a new tab)

Then, go to app/stripe/controllers/stripe_controller.ts

And listen to events:

      switch (body.type) {
        case "checkout.session.completed":
          await this.stripeShopService.completeCheckoutSession(body.data.object as Stripe.Checkout.Session);
          break;
 
        case "invoice.payment_succeeded":
          const invoice = body.data.object as Stripe.Invoice;
          await this.stripeShopService.renewSubscription(invoice);
          break;
        case "customer.subscription.deleted":
          await this.stripeShopService.cancelSubscription(body.data.object as Stripe.Subscription);
          break;
        default:
          break;
      }

Checkout a product

  const handleClick = (productId: number) => {
    makeRequest("checkout", { productId: productId });
  };
  
  <Button className="w-full" onClick={() => handleClick(product.id)}>Get in now!</Button>

And yeah, that's It! You can now checkout a product. The id is the id of the product in the database.

Update products

You can update products in the admin dashboard. Go to (http://localhost:3333/dashboard/admin (opens in a new tab)) and update the product. It will update the product in the Stripe dashboard,and the price will be updated in the database.

Showing plans in the landing page

A semi-automatic component was already made in the /inertia/app/components/landing/turbo_saas/automatic_pricing.tsx file.
You'll just need to update the benefitList property in the automatic_pricing.tsx file, the id is the id of the product in the database. An example of the component is available in the index.tsx file.

<AutomaticPricing productList={props.products} />

Ready for production

For production, you'll just need to add your stripe wekbook to your Stripe dashboard. It will listen to stripe/webhook route in stripe_router.ts file.