import { useGetExchangeRate } from '@0xsequence/hooks'
function CurrencyConverter() {
const usdAmount = 100
const {
data: rate = 1,
isLoading,
error,
isError,
isSuccess
} = useGetExchangeRate('EUR')
if (isLoading) {
return <div>Loading rates...</div>
}
if (isError) {
return <div>Error: {error.message}</div>
}
return (
<div>
<h2>Currency Conversion</h2>
{isSuccess && (
<div>
<p>{usdAmount} USD = {usdAmount * rate} EUR</p>
<p>Current Rate: 1 USD = {rate} EUR</p>
</div>
)}
</div>
)
}
// Example with multiple currencies
function MultiCurrencyDisplay() {
const currencies = ['EUR', 'GBP', 'JPY']
return (
<div>
<h2>USD Exchange Rates</h2>
{currencies.map(currency => (
<CurrencyRate
key={currency}
currency={currency}
/>
))}
</div>
)
}
function CurrencyRate({ currency }) {
const { data: rate = 1 } = useGetExchangeRate(currency)
return (
<div>
1 USD = {rate} {currency}
</div>
)
}