@coin-voyage/paykit
Version:
Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.
45 lines (44 loc) • 2.03 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { getChainName } from "@coin-voyage/shared/common";
import usePayContext from "../components/contexts/pay";
import TokenChainLogo from "../components/ui/TokenChainLogo";
import { ROUTES } from "../types/routes";
export function useTokenOptions(disabled) {
const { paymentState, setRoute } = usePayContext();
const { setSelectedCurrencyOption, payOrderQuotes } = paymentState;
const filteredAndSortedQuotes = payOrderQuotes.quotes
?.filter((q) => q.balance?.value_usd !== 0)
.sort((a, b) => {
const valueUsdA = a.currency_amount.value_usd ?? 0;
const valueUsdB = b.currency_amount.value_usd ?? 0;
// Balance checks
const aInsufficient = Number(a?.balance?.value_usd ?? 0) < valueUsdA;
const bInsufficient = Number(b?.balance?.value_usd ?? 0) < valueUsdB;
if (aInsufficient && !bInsufficient)
return 1;
if (!aInsufficient && bInsufficient)
return -1;
if (aInsufficient && bInsufficient)
return 0;
return valueUsdA - valueUsdB;
});
return (filteredAndSortedQuotes?.map((quote, idx) => {
const title = `${quote.currency_amount.ui_amount_display} ${quote.ticker} on ${getChainName(quote.chain_id)}`;
const subtitle = `Balance: ${quote.balance?.ui_amount_display ?? "0"} ${quote.ticker}`;
const isDisabled = disabled || BigInt(quote.balance?.raw_amount ?? 0) < BigInt(quote.currency_amount.raw_amount);
return {
id: idx.toString(),
title,
subtitle,
disabled: isDisabled,
iconShape: "squircle",
icons: [
_jsx(TokenChainLogo, { src: quote.image_uri, alt: quote.ticker, chainId: quote.chain_id }, quote.ticker + quote.chain_id),
],
onClick: () => {
setSelectedCurrencyOption(quote);
setRoute(ROUTES.PAY_WITH_TOKEN);
},
};
}) ?? []);
}