Add Mollie checkout flow, billing UI, and payment UX polish #71

2026-03-28T10:27:15Z

uz1mani commented

2026-03-28 10:27:15 +00:00

(Migrated from github.com)

Summary

Full checkout page with embedded card payments (Mollie Components) and redirect methods (iDEAL, Bancontact, Apple Pay, Google Pay)
VAT calculation with VIES verification, company info display, and EU reverse charge support
Checkout UX polish: split layout with feature slideshow, payment method selector, success polling after 3DS/redirect

Changes

Checkout flow: New /checkout page with auth guard, subscription guard, param validation, and post-payment success polling. PlanSummary shows
real-time VAT breakdown with verify button. PaymentForm supports 6 payment methods with foldable card form. FeatureSlideshow auto-cycles product
screenshots.

Billing tab: Updated for Mollie response format, in-app cancel confirmation modal (replaces browser confirm), updatePaymentMethod redirect flow.

Pricing page: CTAs redirect to /checkout with plan params, excl. VAT label, pending checkout intent stored in localStorage for pre-auth users.

Shared utilities: Extracted lib/plans.ts (pricing config synced with backend), lib/countries.ts, lib/mollie.ts (Mollie.js init with testmode
toggle), lib/api/billing.ts (calculateVAT, createEmbeddedCheckout).

Other fixes: Auth refresh preserves org_id, org switcher uses SPA navigation, PageSpeed learn links mapped to ciphera.net/learn articles, referrer
registry expanded, accessible button color tokens.

Test Plan

Complete checkout with card (embedded) — verify 3DS redirect and success polling
Complete checkout with iDEAL/Bancontact — verify redirect returns to success page
Verify VAT calculation updates on country change and VAT ID verification
Verify already-subscribed users are redirected away from checkout
Verify unauthenticated users are redirected to login with return URL
Verify cancel subscription modal works with at_period_end flag
Verify pricing page CTA stores intent in localStorage and resumes after login

## Summary - Full checkout page with embedded card payments (Mollie Components) and redirect methods (iDEAL, Bancontact, Apple Pay, Google Pay) - VAT calculation with VIES verification, company info display, and EU reverse charge support - Checkout UX polish: split layout with feature slideshow, payment method selector, success polling after 3DS/redirect ## Changes **Checkout flow**: New `/checkout` page with auth guard, subscription guard, param validation, and post-payment success polling. `PlanSummary` shows real-time VAT breakdown with verify button. `PaymentForm` supports 6 payment methods with foldable card form. `FeatureSlideshow` auto-cycles product screenshots. **Billing tab**: Updated for Mollie response format, in-app cancel confirmation modal (replaces browser confirm), `updatePaymentMethod` redirect flow. **Pricing page**: CTAs redirect to `/checkout` with plan params, excl. VAT label, pending checkout intent stored in localStorage for pre-auth users. **Shared utilities**: Extracted `lib/plans.ts` (pricing config synced with backend), `lib/countries.ts`, `lib/mollie.ts` (Mollie.js init with testmode toggle), `lib/api/billing.ts` (calculateVAT, createEmbeddedCheckout). **Other fixes**: Auth refresh preserves org_id, org switcher uses SPA navigation, PageSpeed learn links mapped to ciphera.net/learn articles, referrer registry expanded, accessible button color tokens. ## Test Plan - [x] Complete checkout with card (embedded) — verify 3DS redirect and success polling - [x] Complete checkout with iDEAL/Bancontact — verify redirect returns to success page - [x] Verify VAT calculation updates on country change and VAT ID verification - [x] Verify already-subscribed users are redirected away from checkout - [x] Verify unauthenticated users are redirected to login with return URL - [x] Verify cancel subscription modal works with at_period_end flag - [x] Verify pricing page CTA stores intent in localStorage and resumes after login

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: ciphera-net/pulse#71