FinaDOCS

Interactive Demo

The integration you're about to build: FINA as a payment method inside your own storefront. Play the buyer — the console shows every API call your backend would make, and each request, response and error code matches the integration guide.

  • Regions tagged FINA API are rendered from FINA API data — everything else is your own UI.
  • Web / App flips the same integration between a desktop website and a mobile app.
  • The small grey notes at the bottom of the screens (iframe embedding, webhooks, redirect URLs) are annotations for you, the integrator, linking to the relevant reference page — not part of the buyer-facing UI.
What each scenario shows
  • New buyerSara isn't on FINA yet — Check Eligibility returns a signup_url and she onboards in the embedded iframe before checking out.
  • Happy pathMohammed's credit covers every plan and none of them needs a down payment — the straight eligibility → plans → OTP → AUTHORISED run. Enter a wrong OTP once here to see error 809 handling.
  • Down paymentEvery plan offered to Fatima requires a down payment (requires_prepaid_collection) — after OTP the order waits at AUTHORIZATION_INITIATED and she pays SAR 25 on FINA's hosted payment_url page. On that page you can also simulate a failed payment (failure redirect + Reconcile Prepaid Payment) or the buyer leaving mid-payment and resuming later from your orders list — plus the signed webhook on success.
  • Low creditKhalid's SAR 80 credit is below the SAR 100 cart, so every plan comes back with has_enough_credits: false and all of them are disabled. FINA is a dead end for this cart — the checkout falls back to mada or cash on delivery, and no further FINA call is made.
  1. 1 Eligibility
  2. 2 Choose plan
  3. 3 Place order
  4. 4 Verify OTP
  5. 5 Delivered
Your storefront UIPowered by FINA APIDemo controls

Demo controls

Choose a scenario

Pick the buyer you want to play. The storefront checkout opens signed in as that buyer — each scenario exercises a different API path.

Switch anytime — every scenario starts a fresh order and a clean console.

API consoleSandbox · simulated

Your integration's API calls will appear here as the buyer moves through checkout.

Responses are simulated — shapes, statuses and error codes match the API reference. Live sandbox mode ships in Phase 2.