mcpField
A
autumn-add-payments

autumn-add-payments

github.com/useautumnDevelopment154 installsUpdated 4w ago
Repository

About autumn-add-payments

Autumn Payments is a skill guide for implementing Autumn payment flows with Stripe checkout. It covers checkout and purchase confirmation, product scenarios, prepaid quantities, and common integration details for React and backend code.

Key features

  1. 01Checkout and purchase confirmation flows
  2. 02Handles upgrade, downgrade, and cancellation scenarios
  3. 03Supports quantities for prepaid products
  4. 04Guidance for React and backend implementations
  5. 05Documents common integration pitfalls

Use cases

  1. 01Building a subscription checkout flow
  2. 02Showing actions based on a customer's product scenario
  3. 03Selling seat-based or prepaid products

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/useautumn/skills --skill autumn-add-payments

After installing, type/autumn-add-paymentsin Claude Code to confirm it loaded.

Details

From the project README

Autumn Payments

Always consult docs.useautumn.com for code examples and latest API.

Autumn handles Stripe checkout, upgrades, downgrades, and cancellations automatically.


Quick Reference

Payment Flow
  1. checkout - Returns Stripe URL (new) or preview data (returning customer)
  2. attach - Confirms purchase when card already on file
Checkout Result
FieldDescription
urlStripe checkout URL (null if card on file)
productTarget product with scenario
current_productCustomer's current product
linesInvoice line items
totalAmount in major currency units
currencyCurrency code

Product Scenarios

ScenarioMeaningAction
newNot subscribedSubscribe
activeCurrent planCurrent Plan
scheduledScheduledAlready Scheduled
upgradeHigher tierUpgrade
downgradeLower tierDowngrade
renewCancelledRenew

React Implementation

import { useCustomer, usePricingTable } from "autumn-js/react";

const { checkout, attach } = useCustomer();
const { products } = usePricingTable();

// Checkout flow
const data = await checkout({ productId: "pro" });
if (data.url) {
  window.location.href = data.url;  // New customer
} else {
  // Show confirmation dialog, then:
  await attach({ productId: "pro" });
}

// Cancel
const { cancel } = useCustomer();
await cancel({ productId: "pro" });
// Or downgrade to free:
await attach({ productId: "free" });

Backend Implementation

import { Autumn } from "autumn-js";

const autumn = new Autumn({ secretKey: process.env.AUTUMN_SECRET_KEY });

// Checkout
const { data } = await autumn.checkout({ customer_id, product_id: "pro" });
if (data.url) return redirect(data.url);

// Attach (after user confirms)
await autumn.attach({ customer_id, product_id: "pro" });

// Get products with scenarios
const { data: productsData } = await autumn.products.list({ customer_id });

Prepaid Pricing

For seat-based or prepaid products, pass quantities:

await autumn.checkout({
  customer_id,
  product_id: "credits_pack",
  options: [{ feature_id: "credits", quantity: 500 }],
});

Button Text Pattern

function getButtonText(product: Product): string {
  const { scenario, properties } = product;
  if (properties?.has_trial) return "Start Trial";
  if (scenario === "active") return "Current Plan";
  
  const text = { upgrade: "Upgrade", downgrade: "Downgrade", new: "Subscribe" };
  return text[scenario] ?? "Enable";
}

Common Gotchas

  1. URL field - It's data.url, not data.checkout_url
  2. Don't build custom logic - Use products.list for scenarios
  3. Proration automatic - Autumn handles upgrade/downgrade proration
  4. Cancel via free - Prefer attaching free plan over hard cancel
  5. Success URL - Pass success_url to redirect after Stripe checkout

Resources

Comments

Markdown supported