feat: support pending changes for plan upgrades

[kevcodez]

This PR implements the new flow to confirm subscription upgrades using Orb pending changes. This is backwards compatible and based on a flag exposed by the backend (subscriptionPreview.pending_subscription_flow).

Just like the organization creation, the entire flow is slightly different - instead of creating a payment method separately, the payment method is added inline while doing the upgrade and then attached to the customer. If payment fails, the upgrade will not go through. If payment requires additional action, the user needs to confirm the payment before allowing the upgrade.

For testing the new flow locally, toggle the flag in flags.ts on the backend.

Changes include

• No longer rely on the changeType from the plans endpoint as this is regularly out-of-sync and displays wrong up/downgrade info due to race conditions
• readOnly mode for Stripe elements if anything is loading/submitting
• Reduced prop drilling for some components
• Hide payment method and address selection on downgrade

---

Tested

Old flow (feature toggle off)

• [x] Upgrade from free -> Pro
• [x] Upgrade from Pro -> Team
• [x] Downgrade from Team -> Pro
• [x] Downgrade from Pro -> Free
• [x] Use already present payment method
• [x] Put down new payment method in the modal
• [x] 3DS confirmation on setup works

New flow (feature toggle on)

• [x] Upgrade from free -> Pro
• [x] Upgrade from Pro -> Team
• [x] Downgrade from Team -> Pro
• [x] Downgrade from Pro -> Free
• [x] Use already present payment method
• [x] Put down new payment method inline
• [x] Should fail upgrade if the payment fails
• [ ] 3DS confirmation on payment works
• [ ] If 3DS confirmation fails, user gets an appropriate message and can try again

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
design-system	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am
docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am
studio-self-hosted	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am
studio-staging	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am
ui-library	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am
zone-www-dot-com	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2025 7:04am

2 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
cms	⬜️ Ignored (Inspect)			Jun 18, 2025 7:04am
studio	⬜️ Ignored (Inspect)	Visit Preview		Jun 18, 2025 7:04am

[supabase[bot]]

This pull request has been ignored for the connected project xguihxuzqibwxjnimxev because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase. Learn more about Supabase Branching ↗︎.

[coveralls]

coverage: 82.967%. remained the same when pulling 563f83b0f85fe1797865517bd4009ffdd045adf8 on kevin/billing-1388-use-orb-pending-changes-to-ensure-funds-before-confirming-2 into 7e5850bc701e11e8612a6a4cc42625d8e8578fc6 on master.

[ecktoteckto]

Looks good. Tested locally