Add Stripe integration for payment processing

Author: ianirudhkhabya

app/api/create-checkout-session/route.ts

@@ -0,0 +1,51 @@
+import { createRouteHandlerClient } from "@supabase/auth-helpers-nextjs";
+import { cookies } from "next/headers";
+import { NextResponse } from "next/server";
+
+import { stripe } from "@/libs/stripe";
+import { getURL } from "@/libs/helpers";
+import { createOrRetrieveCustomer } from "@/libs/supabaseAdmin";
+
+export async function POST(request: Request) {
+  const { price, quantity = 1, metadata = {} } = await request.json();
+
+  try {
+    const supabase = createRouteHandlerClient({
+      cookies,
+    });
+    const {
+      data: { user },
+    } = await supabase.auth.getUser();
+
+    const customer = await createOrRetrieveCustomer({
+      uuid: user?.id || "",
+      email: user?.email || "",
+    });
+
+    //@ts-ignore
+    const session = await stripe.checkout.sessions.create({
+      payment_method_types: ["card"],
+      billing_address_collection: "required",
+      customer,
+      line_items: [
+        {
+          price: price.id,
+          quantity,
+        },
+      ],
+      mode: "subscription",
+      allow_promotion_codes: true,
+      subscription_data: {
+        trial_from_plan: true,
+        metadata,
+      },
+      success_url: `${getURL()}/account`,
+      cancel_url: `${getURL()}/`,
+    });
+
+    return NextResponse.json({ sessionId: session.id });
+  } catch (err: any) {
+    console.error(err);
+    return new NextResponse("Internal Error", { status: 500 });
+  }
+}

app/api/create-portal-link/route.ts

@@ -0,0 +1,37 @@
+import { createRouteHandlerClient } from "@supabase/auth-helpers-nextjs";
+import { cookies } from "next/headers";
+import { NextResponse } from "next/server";
+
+import { stripe } from "@/libs/stripe";
+import { getURL } from "@/libs/helpers";
+import { createOrRetrieveCustomer } from "@/libs/supabaseAdmin";
+
+export async function POST() {
+  try {
+    const supabase = createRouteHandlerClient({
+      cookies,
+    });
+
+    const {
+      data: { user },
+    } = await supabase.auth.getUser();
+
+    if (!user) throw Error("Could not get user");
+
+    const customer = await createOrRetrieveCustomer({
+      uuid: user.id || "",
+      email: user.email || "",
+    });
+
+    if (!customer) throw Error("Could not get customer");
+    const { url } = await stripe.billingPortal.sessions.create({
+      customer,
+      return_url: `${getURL()}/account`,
+    });
+
+    return NextResponse.json({ url });
+  } catch (error: any) {
+    console.error(error);
+    new NextResponse("Internal Error", { status: 500 });
+  }
+}

app/api/webhooks/route.ts

@@ -0,0 +1,84 @@
+import Stripe from "stripe";
+import { NextResponse } from "next/server";
+import { headers } from "next/headers";
+
+import { stripe } from "@/libs/stripe";
+import {
+  upsertProductRecord,
+  upsertPriceRecord,
+  manageSubscriptionStatusChange,
+} from "@/libs/supabaseAdmin";
+
+const relevantEvents = new Set([
+  "product.created",
+  "product.updated",
+  "price.created",
+  "price.updated",
+  "checkout.session.completed",
+  "customer.subscription.created",
+  "customer.subscription.updated",
+  "customer.subscription.deleted",
+]);
+
+export async function POST(request: Request) {
+  const body = await request.text();
+  const sig = headers().get("Stripe-Signature");
+
+  const webhookSecret =
+    process.env.STRIPE_WEBHOOK_SECRET_LIVE ?? process.env.STRIPE_WEBHOOK_SECRET;
+  let event: Stripe.Event;
+
+  try {
+    if (!sig || !webhookSecret) return;
+    event = stripe.webhooks.constructEvent(body, sig, webhookSecret);
+  } catch (error: any) {
+    console.error(error.message);
+    return new NextResponse(`Webhook Error: ${error.message}`, { status: 400 });
+  }
+
+  if (relevantEvents.has(event.type)) {
+    try {
+      switch (event.type) {
+        case "product.created":
+        case "product.updated":
+          await upsertProductRecord(event.data.object as Stripe.Product);
+          break;
+        case "price.created":
+        case "price.updated":
+          await upsertPriceRecord(event.data.object as Stripe.Price);
+          break;
+        case "customer.subscription.created":
+        case "customer.subscription.updated":
+        case "customer.subscription.deleted":
+          const subscription = event.data.object as Stripe.Subscription;
+          await manageSubscriptionStatusChange(
+            subscription.id,
+            subscription.customer as string,
+            event.type === "customer.subscription.created"
+          );
+          break;
+        case "checkout.session.completed":
+          const checkoutSession = event.data.object as Stripe.Checkout.Session;
+          if (checkoutSession.mode === "subscription") {
+            const subscriptionId = checkoutSession.subscription;
+            await manageSubscriptionStatusChange(
+              subscriptionId as string,
+              checkoutSession.customer as string,
+              true
+            );
+          }
+          break;
+        default:
+          throw new Error("Unhandled relevant event!");
+      }
+    } catch (error) {
+      console.error(error);
+      return new NextResponse(
+        'Webhook Error: "Webhook handler failed. View logs."',
+        { status: 400 }
+      );
+    }
+  }
+
+  return NextResponse.json({ received: true }, { status: 200 });
+}

libs/helpers.ts

@@ -0,0 +1,43 @@
+import { Price } from "@/types/types";
+
+export const getURL = () => {
+  let url =
+    process?.env?.NEXT_PUBLIC_SITE_URL ?? // Set this to your site URL in production env.
+    process?.env?.NEXT_PUBLIC_VERCEL_URL ?? // Automatically set by Vercel.
+    "http://localhost:3000/";
+  // Make sure to include `https://` when not localhost.
+  url = url.includes("http") ? url : `https://${url}`;
+  // Make sure to including trailing `/`.
+  url = url.charAt(url.length - 1) === "/" ? url : `${url}/`;
+  return url;
+};
+
+export const postData = async ({
+  url,
+  data,
+}: {
+  url: string;
+  data?: { price: Price };
+}) => {
+  console.log("posting pstData,", url, data);
+
+  const res: Response = await fetch(url, {
+    method: "POST",
+    headers: new Headers({ "Content-Type": "application/json" }),
+    credentials: "same-origin",
+    body: JSON.stringify(data),
+  });
+
+  if (!res.ok) {
+    console.error("Error in postData", { url, data, res });
+    throw Error(res.statusText);
+  }
+
+  return res.json();
+};
+
+export const toDateTime = (secs: number) => {
+  var t = new Date("1970-01-01T00:30:00Z"); // Unix epoch start.
+  t.setSeconds(secs);
+  return t;
+};

libs/stripe.ts

@@ -0,0 +1,9 @@
+import Stripe from "stripe";
+
+export const stripe = new Stripe(process.env.STRIPE_SECRET_KEY ?? "", {
+  apiVersion: "2023-10-16",
+  appInfo: {
+    name: "Spotify Clone Application",
+    version: "0.1.0",
+  },
+});

libs/stripeClient.ts

@@ -0,0 +1,13 @@
+import { loadStripe, Stripe } from "@stripe/stripe-js";
+
+let stripePromise: Promise<Stripe | null>;
+
+export const getStripe = () => {
+  if (!stripePromise) {
+    stripePromise = loadStripe(
+      process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY ?? ""
+    );
+  }
+
+  return stripePromise;
+};