pnpm install @polar-sh/tanstack-start zod

Checkout

Create a Checkout handler which takes care of redirections.

// routes/api/checkout.ts
import { Checkout } from "@polar-sh/tanstack-start";
import { createAPIFileRoute } from "@tanstack/react-start/api";

export const APIRoute = createAPIFileRoute("/api/checkout")({
  GET: Checkout({
    accessToken: process.env.POLAR_ACCESS_TOKEN,
    successUrl: process.env.SUCCESS_URL,
    server: "sandbox", // Use sandbox if you're testing Polar - omit the parameter or pass 'production' otherwise
  }),
});

Query Params

Pass query params to this route.

  • products ?products=123
  • customerId (optional) ?products=123&customerId=xxx
  • customerExternalId (optional) ?products=123&customerExternalId=xxx
  • customerEmail (optional) ?products=123&customerEmail=janedoe@gmail.com
  • customerName (optional) ?products=123&customerName=Jane
  • metadata (optional) URL-Encoded JSON string

Customer Portal

Create a customer portal where your customer can view orders and subscriptions.

// routes/api/portal.ts
import { CustomerPortal } from "@polar-sh/tanstack-start";
import { createAPIFileRoute } from "@tanstack/react-start/api";
import { getSupabaseServerClient } from "~/servers/supabase-server";

export const APIRoute = createAPIFileRoute("/api/portal")({
  GET: CustomerPortal({
    accessToken: process.env.POLAR_ACCESS_TOKEN,
    getCustomerId: async (request: Request) => "", // Fuction to resolve a Polar Customer ID
    server: "sandbox", // Use sandbox if you're testing Polar - omit the parameter or pass 'production' otherwise
  }),
});

Webhooks

A simple utility which resolves incoming webhook payloads by signing the webhook secret properly.

// api/webhook/polar.ts
import { Webhooks } from "@polar-sh/tanstack-start";
import { createAPIFileRoute } from "@tanstack/react-start/api";

export const APIRoute = createAPIFileRoute("/api/webhook/polar")({
  POST: Webhooks({
    webhookSecret: process.env.POLAR_WEBHOOK_SECRET!,
    onPayload: async (payload) => {
      // Handle the payload
      // No need to return an acknowledge response
    },
  }),
});

Payload Handlers

The Webhook handler also supports granular handlers for easy integration.

  • onCheckoutCreated: (payload) =>
  • onCheckoutUpdated: (payload) =>
  • onOrderCreated: (payload) =>
  • onOrderUpdated: (payload) =>
  • onOrderPaid: (payload) =>
  • onSubscriptionCreated: (payload) =>
  • onSubscriptionUpdated: (payload) =>
  • onSubscriptionActive: (payload) =>
  • onSubscriptionCanceled: (payload) =>
  • onSubscriptionRevoked: (payload) =>
  • onProductCreated: (payload) =>
  • onProductUpdated: (payload) =>
  • onOrganizationUpdated: (payload) =>
  • onBenefitCreated: (payload) =>
  • onBenefitUpdated: (payload) =>
  • onBenefitGrantCreated: (payload) =>
  • onBenefitGrantUpdated: (payload) =>
  • onBenefitGrantRevoked: (payload) =>
  • onCustomerCreated: (payload) =>
  • onCustomerUpdated: (payload) =>
  • onCustomerDeleted: (payload) =>
  • onCustomerStateChanged: (payload) =>