Appearance
useExchangePayProviders
Read available Exchange Pay providers and update the selected exchange.
When to use
On the provider picker. Payment methods are already filtered to type: exchange_pay inside ExchangePayContextProvider.
Example
tsx
import { useExchangePayProviders } from '@swapped/connect-sdk/react'
function ProviderPicker() {
const {
paymentMethods,
selectedProvider,
selectProvider,
isLoading,
error,
} = useExchangePayProviders()
if (isLoading) return <p>Loading…</p>
if (error) return <p>{error.message}</p>
return (
<ul>
{paymentMethods.map(method => (
<li key={method.id}>
<button
type="button"
aria-pressed={selectedProvider === method.provider}
onClick={() => selectProvider(method.provider)}
>
{method.name}
{selectedProvider === method.provider ? ' ✓' : ''}
</button>
</li>
))}
</ul>
)
}Returns
| Field | Purpose |
|---|---|
paymentMethods | exchange_pay payment methods |
selectedProvider | Current exchange (or undefined) |
selectProvider(provider) | Set the selected exchange |
clearProvider() | Clear selection |
isLoading / error | Payment-methods fetch state |
Requires ExchangePayContextProvider.