feat: support tokenize-only flow in dynamic checkout - #271
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds support for a “tokenize-only” card flow in Dynamic Checkout by introducing a tokenize_only flag on card payment methods and adapting the UI/behavior accordingly.
Changes:
- Adds a
tokenize_onlyflag to the Card API type and uses it to drive tokenize-only behavior. - Updates the card payment method UI to hide “save for future” and change the pay button label when tokenize-only is enabled.
- Hides saved payment methods in the payment-method list when a tokenize-only card method is present, and adds translations for the new button label key.
Reviewed changes
Copilot reviewed 18 out of 18 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| src/dynamic-checkout/views/payment-methods.ts | Hides saved payment methods when a tokenize-only card payment method is available. |
| src/dynamic-checkout/types/api.ts | Extends the Card type with an optional tokenize_only flag. |
| src/dynamic-checkout/payment-methods/card.ts | Adjusts card flow to force saving, hide save UI, and use a tokenize-specific button label. |
| src/dynamic-checkout/locales/en.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/fr.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/de.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/es.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/it.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/pt.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/pl.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/nb.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/fi.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/ja.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/ko.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/ta.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/vi.ts | Adds translation for tokenize-payment-button-text. |
| src/dynamic-checkout/locales/ar.ts | Adds translation for tokenize-payment-button-text. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| cardPaymentOptions["save_source"] = saveForFutureCheckbox.checked | ||
| } | ||
|
|
||
| if (this.paymentMethod.card.tokenize_only) { |
There was a problem hiding this comment.
Unsure where to comment but; for tokenize only we're only ever allowing tokenize via card verification here?
Customer can't solely add a card for future re-use (or merchant can't configure if they wish to perform a card verification etc?)
There was a problem hiding this comment.
Correct - in tokenize-only mode the SDK still goes through the invoice capture call with save_source forced, so tokenization happens via the verification on the invoice. Whether that's a card verification or something else is controlled by how the invoice + tokenize_only flag are configured server-side; the SDK doesn't expose a standalone "save card without an invoice" path
Summary
Adds client-side support for the tokenize-only verification flow (POROK-574). When a verification invoice's workflow has
invoice_verification_enable_tokenize_only_flowenabled, the payment-methods response contains a single card markedtokenize_only: true— Dynamic Checkout now adapts the card UI and payment options accordingly.Changes
tokenize_onlyfield to theCardAPI type (absent on the wire meansfalse— bare proto3 bool)tokenize_onlyis set on the card:payButtonTextoverride still takes precedence)save_source: trueis forced on the capture callcard_customer_token/apm_customer_token) are filtered out client-side, which also hides the manage-methods buttontokenize-payment-button-textlocale key to all 14 DC localesImpact
tokenize→POST /invoices/{id}/captureincl. 3DS) — only the request options and UI differAdditional Context
porok-574-dynamiccheckout-tokenize-only-flow-plan.md; the API repo already serializes the field, router CRUD + modifier work is still pendingjakub-dc-tokenize-only-flow-togglein dashboard-next),@processout/types-apiv5.35.0