Skip to content

Add payment sessions to the orders app - #487

Draft
marcomontalbano wants to merge 2 commits into
mainfrom
feat/662_order_app_new_payments
Draft

Add payment sessions to the orders app#487
marcomontalbano wants to merge 2 commits into
mainfrom
feat/662_order_app_new_payments

Conversation

@marcomontalbano

Copy link
Copy Markdown
Member

Related to commercelayer/issues-app#662

What I did

Adds support for the new payment model (API version 2026-05), where an order is funded by a list of payment sessions instead of a single payment_method/payment_source. Both models can coexist on an order indefinitely, so this is additive rather than a cutover.

  • Show an order's payment sessions on the details page, one row per session with the card brand or gateway logo, the status, the amount and an actions dropdown.
  • Rename OrderPayment.tsx to OrderPaymentLegacy.tsx and render both it and the new OrderPaymentSessions unconditionally. Each self-gates on its own data, so only one ever shows anything for a given order.
  • Add usePaymentSessionActions with Capture and Void authorization, both behind a confirmation dialog.
  • Add a payment details modal built on useResourceDetailsModal from app-elements, adding a payments-specific Transactions tab between Attributes and Events.
  • Recover each transaction's kind in that tab by matching ids against the session's typed relationships, since entries in payment_transactions come back as the generic payment_transactions type rather than payment_captures or payment_authorizations.
  • Add paymentDisplay.ts, resolving the logo, label and last 4 digits for a session, falling back from card brand to gateway to a generic credit-card icon. Card details are extracted per gateway, since response_data is verbatim gateway output with no shared shape.
  • Extend the useOrderDetails include list with the payment session relationships.
  • Bump @commercelayer/app-elements across the workspace to the preview carrying useResourceDetailsModal.

How to test

  1. Open an order created on API version 2026-05 and check the Payments section lists one row per payment session.
  2. Check each row shows the card brand when it can be determined (Visa, Mastercard, and so on), otherwise the gateway (Stripe, Adyen, Gift Card), with the last 4 digits where available.
  3. Open the ··· menu on a session and pick View details. Check the modal shows Attributes, Transactions and Events.
  4. On Transactions, check each row reads as authorization succeeded, capture succeeded and so on, rather than a generic transaction, and that expanding one shows its raw JSON.
  5. On an authorized session, use Capture and Void authorization from the dropdown and check the order refreshes afterwards.
  6. Open an order created on API version 2017-08 and check the legacy payment display is unchanged.
  7. Check an order with a gift card session shows the gift card logo and the code's last 4 digits.

Checklist

  • Make sure your changes are tested (stories and/or unit, integration, or end-to-end tests).
  • Make sure to add/update documentation regarding your changes.
  • You are NOT deprecating/removing a feature.

@marcomontalbano
marcomontalbano force-pushed the feat/662_order_app_new_payments branch from 8b28dab to 7196ab6 Compare August 17, 2026 10:07
@malessani
malessani force-pushed the feat/more-desktop-apps branch from 026d955 to 9ca5353 Compare August 20, 2026 08:56
@marcomontalbano
marcomontalbano force-pushed the feat/662_order_app_new_payments branch from 7196ab6 to 4b54c71 Compare August 20, 2026 13:09
@marcomontalbano
marcomontalbano changed the base branch from feat/more-desktop-apps to main August 20, 2026 13:10
@netlify

netlify Bot commented Aug 21, 2026

Copy link
Copy Markdown

Deploy Preview for commercelayer-dashboard-apps failed.

Name Link
🔨 Latest commit bda828d
🔍 Latest deploy log https://app.netlify.com/projects/commercelayer-dashboard-apps/deploys/6a8862d775a0370008779902

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant