All Stripe payment processing is configured and operational!
- ✅ Stripe API Key: Configured (live key)
- ✅ Webhook Secret: Configured
- ✅ Price IDs:
- Tier 1 (Starter $9/month):
price_1SziWp43zM5TljobnlU6XsjR - Tier 2 (Pro $29/month):
price_1SziXj43zM5TljobowIBZwid
- Tier 1 (Starter $9/month):
- ✅ Endpoints:
POST /billing/checkout- Create checkout sessionPOST /billing/webhook- Handle Stripe webhooksGET /billing/portal- Customer portal access
- ✅ CheckoutButton Component: React component for Stripe checkout
- ✅ API Integration:
createCheckout()function inlib/api.ts - ✅ Pricing Page: Starter and Pro buttons trigger Stripe checkout
- ✅ Return Flow: Redirects to dashboard after successful payment
- User visits https://fabslabssprites.com/pricing
- User clicks "Get Started" on Starter ($9) or Pro ($29)
- Frontend calls
POST /billing/checkout?plan=tier1(or tier2) - Backend creates Stripe Customer (if needed)
- Backend creates Stripe Checkout Session
- User redirected to Stripe hosted checkout page
- User enters payment details on Stripe
- User completes payment
- Stripe redirects back to dashboard
- Stripe sends webhook to
/billing/webhook - Backend updates user plan and allocates credits
- ✅ Customer created in Stripe
- ✅ Subscription created
- ✅ Credits allocated (100 or 500 pictures)
- ✅ User plan upgraded (tier1 or tier2)
- ✅ Monthly auto-renewal
- ✅ Invoice.paid webhook allocates new credits
- User plan updated to
tier1ortier2 - Plan status:
active - Credits allocated: 100 or 500 pictures/month
- Auto-renewal: Monthly
- ✅
checkout.session.completed- Initial subscription created - ✅
invoice.paid- Monthly renewal, allocate new credits - ✅
customer.subscription.updated- Plan changes, status updates - ✅
customer.subscription.deleted- Cancellation, downgrade to free
Users can access GET /billing/portal to:
- Update payment method
- Cancel subscription
- View invoices
- Change plan
# 1. Check backend health
curl https://api.fabslabssprites.com/health
# 2. Visit pricing page
open https://fabslabssprites.com/pricing
# 3. Click "Get Started" on Starter or Pro
# Should redirect to Stripe checkout
# 4. Use Stripe test card
# 4242 4242 4242 4242, any future date, any CVC
# 5. Complete checkout
# Should redirect back to dashboard with creditsssh droid@192.168.178.30
cd /home/droid/.ssh/sprite-pipeline-backend
docker compose logs backend | grep "stripe_webhook"- Mode: Live (production keys)
- Webhook Endpoint:
https://api.fabslabssprites.com/billing/webhook - Webhook Events:
checkout.session.completedinvoice.paidcustomer.subscription.updatedcustomer.subscription.deleted
SPRITE_STRIPE_SECRET_KEY=sk_live_***************************
SPRITE_STRIPE_WEBHOOK_SECRET=whsec_***************************
SPRITE_STRIPE_TIER1_PRICE_ID=price_1SziWp43zM5TljobnlU6XsjR
SPRITE_STRIPE_TIER2_PRICE_ID=price_1SziXj43zM5TljobowIBZwid- Component:
src/components/react/CheckoutButton.tsx - API Function:
src/lib/api.ts→createCheckout() - Usage: PricingTable.astro for Starter and Pro plans
- Click "Get Started" on paid plans → Stripe checkout ✅
- Enter payment details → Subscription created ✅
- Return to dashboard → Credits allocated ✅
- Generate sprites with Pool mode → Credits deducted ✅
- Monthly renewal → New credits allocated automatically ✅
- View subscriptions in Stripe dashboard ✅
- Monitor webhook events ✅
- See user plan upgrades in database ✅
- Track revenue and MRR ✅
Status: Fully operational payment processing
Users can:
- ✅ Subscribe to paid plans immediately
- ✅ Pay via Stripe (credit card, Apple Pay, Google Pay)
- ✅ Receive credits automatically
- ✅ Auto-renew monthly
- ✅ Manage subscription via customer portal
No manual intervention needed!
# Check for successful checkouts
docker compose logs backend | grep "checkout.session.completed"
# Check for payment issues
docker compose logs backend | grep "invoice.paid"
# Check for subscription updates
docker compose logs backend | grep "customer.subscription"- Monitor successful payments
- Check for failed payments
- Review customer subscriptions
- Watch for webhook failures
- Check Stripe API key is set correctly
- Verify Price IDs match Stripe dashboard
- Check webhook endpoint is reachable
- Review backend logs for errors
- Check
invoice.paidwebhook received - Verify user has stripe_subscription_id
- Check credit allocation in database
- Review backend logs for allocation errors
- "Invalid plan" - Check plan name is "tier1" or "tier2"
- "No subscription" - User needs to complete checkout first
- Webhook failures - Check webhook secret matches Stripe
Payment processing is LIVE and fully operational!
- Backend: Stripe integration complete ✅
- Frontend: Checkout buttons functional ✅
- Webhooks: Event handling active ✅
- Credits: Auto-allocation working ✅
- Portal: Customer self-service ready ✅
Users can start subscribing and paying immediately!
No additional setup needed. The system is production-ready and handling payments end-to-end.
Deployment Date: 2026-02-12 Status: ✅ LIVE Mode: Production (live keys)