Appearance
useExchangePaySelection
Full snapshot of the Exchange Pay deposit selection for review screens and submit gating.
When to use
When a component needs provider + currency + amount together (for example a confirm step). Prefer the focused hooks (providers, currency, amount) for pickers.
Example
tsx
import {
useExchangePayOrder,
useExchangePaySelection,
} from '@swapped/connect-sdk/react'
function ReviewAndSubmit() {
const {
selectedProvider,
selectedCurrency,
amount,
canSubmit,
reset,
} = useExchangePaySelection()
const { createOrder, isCreating } = useExchangePayOrder()
return (
<div>
<p>
Deposit ${amount} as {selectedCurrency?.symbol} via {selectedProvider}
</p>
<button type="button" onClick={reset}>
Reset
</button>
<button
type="button"
disabled={!canSubmit || isCreating}
onClick={() => void createOrder()}
>
Continue
</button>
</div>
)
}Returns
| Field | Purpose |
|---|---|
selectedProvider | Exchange |
selectedCurrency | Receive currency |
amount / amountFloat / minAmountFiat | Amount |
canSubmit | Ready to call createOrder() |
reset() | Clear selection back toward defaults |
Requires ExchangePayContextProvider.