fix(demos): pass the plugin explicitly when discovering gateways

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).

[farhan-t-ottu]

Production (main) counterpart of #174, which targets dev. Same two commits, cherry-picked.

Fixes the interactive Checkout SDK demo failing at the Creating session step.

Refs #159191

Root cause

CheckoutDemoInner.tsx called callPaymentMethods without a plugin, which callPaymentMethods silently defaulted to payment_request, and then created the session with type: "e_commerce". Gateways are enabled per plugin, so discovery returned a gateway the session type does not accept.

This branch matters more than #174: main runs ACTIVE_CONNECT = SANDBOX, which is the merchant the bug actually reproduces on.

Payment Methods call	gateways returned
plugin: "payment_request" (what the demo sent)	14 — includes cbk-private
plugin: "e_commerce"	13 — cbk-private dropped

POST /b/checkout/v1/pymt-txn/ (type: e_commerce, 14 codes) → 400
["pg code `cbk-private` is not enabled for `e_commerce` plugin."]

Changes

• src/utils/sandbox.ts — added PaymentPlugin ("e_commerce" | "payment_request", matching the Checkout API type enum). plugin on callPaymentMethods and type on CreateSessionOptions are both now required, removing the two ?? "payment_request" defaults that hid this.
• All four demos — each declares one plugin source of truth and uses it for both the Payment Methods call and the session type, including the ApiPanel request previews, so the displayed request cannot drift from what is sent.
• WalletDemo — dropped a || ({} as any) that widened the filter to any and would have silently defeated the new required-plugin check.

Cherry-pick notes

main and dev differ in this area, so reviewers should confirm nothing dev-only leaked. Verified — the diff against main is only the plugin fix, and these stay untouched:

• ACTIVE_CONNECT = SANDBOX and its docs.ottu.com comment block (dev has KSA)
• walletDemoConfig.ts keeps currency: "USD" / 10.00 / 8.00 for ottu-sandbox-usd (dev uses KWD)
• WalletDemo's "Try Wallet at Checkout" / tagged "demo" wording

Verification

Run on this branch against sandbox.ottu.net (main's own merchant), driving each demo in the browser with a fetch recorder capturing real request bodies:

Demo	Payment Methods	Session
CheckoutDemo	plugin: "e_commerce" → 200	201, 13 codes, cbk-private absent
RecurringDemo	plugin: "e_commerce" → 200	201, type: "e_commerce"
PaymentJourney	plugin: "payment_request" → 200	201, Step 3 panel renders type from the constant
WalletDemo	plugin: "e_commerce" → 200, returns ottu-sandbox-usd	not reached locally — see below

npm run typecheck and npm run build both pass. Omitting plugin, omitting type, or misspelling either is now a compile error.

WalletDemo's seed step returns 502 {"error":"keycloak_error","message":"Missing Keycloak client secret for backend@sandbox.ottu.net"} locally — SANDBOX_KEYCLOAK_CLIENT_SECRET is not in my .env.local, so the flow stops before session creation. Unrelated to this change: step 1 (the call this PR touches) succeeds, and the step 3 change is type: "e_commerce" → type: filter.plugin where filter.plugin === "e_commerce", an identical value. Worth a re-run by someone holding that secret.

🤖 Generated with Claude Code

[farhan-t-ottu]

@claude review

[claude]

Claude finished @farhan-t-ottu's task in 1m 20s —— View job

---

Review complete

• Gather context (PR description, changed files list)
• Read diff for all 6 changed files
• Review for correctness, consistency with cherry-pick claims, and code quality
• Post review feedback

Verdict: LGTM. This is a clean, well-scoped fix — the root cause analysis holds up and the diff matches exactly what the description claims.

What I checked

• src/utils/sandbox.ts: PaymentPlugin type added, both type on CreateSessionOptions and plugin on callPaymentMethods are now required (no more ?? "payment_request" defaults). This correctly turns the silent-mismatch bug class into a compile error.
• All 4 demos (CheckoutDemoInner.tsx, PaymentJourneyInner.tsx, RecurringDemoInner.tsx, WalletDemoInner.tsx): each declares one PLUGIN/filter.plugin source of truth and threads it through both the Payment Methods discovery call and the session type. I grepped for stray "e_commerce"/"payment_request" string literals across src/ — the only ones left are the five legitimate single-source declarations (one per demo + the walletDemoConfig.ts default + the type definition itself). No drift risk.
• WalletDemoInner.tsx: confirmed filter (from WALLET_DEMO.pgFilter) stays in scope across step 1 and step 3 inside the same try block in launch, so type: filter.plugin at the session-creation call is valid and correctly mirrors what was discovered. Since pgFilter is a required, non-optional field on WALLET_DEMO, dropping || ({} as any) is safe — it was a needless escape hatch that would've silently defeated the new required-plugin check.
• ApiPanel previews: in RecurringDemoInner.tsx these render from state.pmRequest/state.citRequest/state.mitRequest, which are built from PLUGIN earlier — so the displayed request can't drift from what's sent. PaymentJourneyInner.tsx's inline ApiPaneldata={{...}} objects were updated in the same diff to use PLUGIN.
• Cherry-pick hygiene (the PR's main ask for reviewers): verified ACTIVE_CONNECT = SANDBOX in sandbox.ts, walletDemoConfig.ts still has currency: "USD" / 10.00 / 8.00, and the WalletDemo tagged "demo" copy is untouched — nothing dev-only leaked into this branch.

Minor notes (non-blocking)

• I wasn't able to run npm run typecheck / npm run build myself in this sandbox (no shell approval for npm here), so I relied on static review — the PR body states both pass locally, and the type changes (required fields replacing optional-with-default) are exactly the kind of change tsc would catch immediately if a call site were missed. A CI run would be good confirmation before merge if not already green.
• Nothing else stood out — no leftover any widening, no unrelated changes, diff size matches the stated scope (58/-15 across 6 files).