@polar-sh/remix

Payments and Checkouts made dead simple with Remix and React Router

pnpm install @polar-sh/remix zod

CheckoutCopied!

Create a Checkout handler which takes care of redirections.

import { Checkout } from "@polar-sh/remix";

export const loader = Checkout({
  accessToken: 'xxx', // Or set an environment variable to 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 ParamsCopied!

Pass query params to this route.

  • productId (or productPriceId) ?productId=xxx

  • productPriceId (or productId) ?productPriceId=xxx

  • customerId (optional) ?productId=xxx&customerId=xxx

  • customerEmail (optional) ?productId=xxx&[email protected]

  • customerName (optional) ?productId=xxx&customerName=Jane

  • metadata (optional) URL-Encoded JSON string

Customer PortalCopied!

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

import { CustomerPortal } from "@polar-sh/remix";

export const loader = CustomerPortal({
  accessToken: 'xxx', // Or set an environment variable to POLAR_ACCESS_TOKEN
  getCustomerId: (event) => "", // Fuction to resolve a Polar Customer ID
  server: "sandbox", // Use sandbox if you're testing Polar - omit the parameter or pass 'production' otherwise
})

WebhooksCopied!

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

import { Webhooks } from "@polar-sh/remix";

export const action = Webhooks({
  webhookSecret: process.env.POLAR_WEBHOOK_SECRET!,
  onPayload: async (payload) => /** Handle payload */,
})

Payload HandlersCopied!

The Webhook handler also supports granular handlers for easy integration.

  • onCheckoutCreated: (payload) =>

  • onCheckoutUpdated: (payload) =>

  • onOrderCreated: (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) =>