Skip to content

Improve failed payment recovery flow (in-product payment update) - #25332

Closed
FelixMalfait wants to merge 1 commit into
mainfrom
codex/improve-credit-card-handling-experience
Closed

Improve failed payment recovery flow (in-product payment update)#25332
FelixMalfait wants to merge 1 commit into
mainfrom
codex/improve-credit-card-handling-experience

Conversation

@FelixMalfait

@FelixMalfait FelixMalfait commented Sep 4, 2026

Copy link
Copy Markdown
Member

Motivation

  • Clicking billing actions sent users to the Stripe billing portal which surfaced an alarming “outstanding invoice” UI and prevented a simple in-product card update flow for trial / failed-payment recovery.
  • Provide a smoother, permission-gated in-product path to add or update a card and retry payment without forcing users into the Stripe portal for every payment fix.
  • Ensure server-side recovery re-attempts cover both past_due and unpaid subscription states after a successful payment method setup.

Description

  • Add an UpdatePaymentMethodModal component and open it from failed-payment banners and billing-page update actions so users can add a card in-product using Stripe’s PaymentElement instead of immediately redirecting to the billing portal. (packages/twenty-front/src/modules/settings/billing/components/UpdatePaymentMethodModal.tsx, .../InformationBannerFailPaymentInfo.tsx, .../SettingsBillingContent.tsx)
  • Add shouldStartSubscriptionAfterPaymentMethod flag to AddPaymentMethodForm and wire it so an update flow does not accidentally trigger the “start subscription after payment method” redirect path. (packages/twenty-front/src/modules/settings/billing/components/AddPaymentMethodForm.tsx)
  • Preserve the billing portal for invoice viewing / subscription management while using the new modal for card updates by splitting “manage billing” vs “update payment” handlers and adding an onManageBilling callback across billing components. (updated SettingsBillingContent, SettingsBillingSubscriptionInfo, SettingsBillingCreditsSection, and SettingsBillingSubscriptionInfoCardHeaderActions)
  • Improve information-banner copy and permission usage to be more neutral and action-oriented, and gate the in-product add-card action on the billing permission. (InformationBannerFailPaymentInfo.tsx)
  • Server-side: extend handleUnpaidInvoices to retry collection for both SubscriptionStatus.PastDue and SubscriptionStatus.Unpaid after a successful setup intent. (packages/twenty-server/src/engine/core-modules/billing/services/billing-subscription.service.ts)

Testing

  • Ran typecheck for packages with npx tsgo -p tsconfig.json --noEmit inside packages/twenty-front and packages/twenty-server, which completed without blocking errors.
  • Ran lint/format and checks including npx nx lint:diff-with-main twenty-front, npx nx format:write --files=... and git diff --check, all of which completed with no blocking failures reported.
  • End-to-end visual verification could not be performed here because the Stripe flows require a running workspace and configured Stripe keys; the code changes are localized and rely on existing Stripe setup hooks/components used elsewhere.

Codex Task

Review in cubic

@twenty-ci-bot-public

Copy link
Copy Markdown

🚀 Preview Environment Ready!

Your preview environment is available at: https://computational-video-packed-requested.trycloudflare.com

This environment will automatically shut down after 5 hours.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant