# Common Frontend Flows

1. Call `paymentClient.getSupportedBlockchains({ currency })` to display available chains and currencies to the user.
2. Create a session with `paymentClient.createCryptoCheckout(...)`, passing the merchant reference, amount, currency, buyer info, and an expiry window.
3. Render the returned payment address and amount in your pay screen. Display the expiry countdown to the user.
4. Poll `paymentClient.getCryptoCheckout({ clientReference })` on an interval to track status transitions (e.g. pending → completed → settled).
5. On terminal status, update your order state and present the settlement confirmation to the user.

#### Recommended Integration Composition

For the best user experience, we recommend splitting payment data into two sources:

* **Client-side reads** (`getCryptoCheckout`, `getSupportedBlockchains`) for live status polling, chain discovery, and checkout rehydration.
* **Server-side writes** (`createCryptoCheckout`) for session creation, where `clientId` and `clientSecret` remain secure and are never exposed to the browser.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://city-protocol.gitbook.io/docs/software-development-kit/payment/common-frontend-flows.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
