diff --git a/src/features/wallet/api/walletApi.ts b/src/features/wallet/api/walletApi.ts index e409e29..ceed614 100644 --- a/src/features/wallet/api/walletApi.ts +++ b/src/features/wallet/api/walletApi.ts @@ -177,6 +177,11 @@ export interface RelayQuoteResponse { amountUsd: string } } + fees: { + gas: { + amountUsd: string + } + } } export async function getTokensList(): Promise { diff --git a/src/widgets/swap-form/ui/SwapCard.tsx b/src/widgets/swap-form/ui/SwapCard.tsx index 5233150..06d0a8e 100644 --- a/src/widgets/swap-form/ui/SwapCard.tsx +++ b/src/widgets/swap-form/ui/SwapCard.tsx @@ -7,7 +7,7 @@ interface Props { token: Token tokenOptions: Token[] amount: string - usd: string + usd?: string slippage?: string onTokenChange: (token: Token) => void onAmountChange?: (v: string) => void @@ -84,7 +84,7 @@ export function SwapCard({ ) : (
{intPart} - .{decPart} + {decPart && .{decPart}}
)} @@ -95,10 +95,11 @@ export function SwapCard({
- - ≈ ${usd} - {slippage && ({slippage})} - + {usd && ( + + ≈ ${usd} + + )} diff --git a/src/widgets/swap-form/ui/SwapForm.tsx b/src/widgets/swap-form/ui/SwapForm.tsx index 7203ba5..29f1b1e 100644 --- a/src/widgets/swap-form/ui/SwapForm.tsx +++ b/src/widgets/swap-form/ui/SwapForm.tsx @@ -65,8 +65,9 @@ export function SwapForm() { const { data: quoteData } = useRelayQuote(quotePayload) - const displayToAmount = quoteData?.details.currencyOut.amountFormatted ?? toAmount - const displayToUsd = quoteData?.details.currencyOut.amountUsd ?? toUsd + const displayToAmount = quoteData?.details.currencyOut.amountFormatted ?? '0' + const displayToUsd = quoteData?.details.currencyOut.amountUsd + const gasFee = quoteData?.fees.gas.amountUsd return (
@@ -91,7 +92,6 @@ export function SwapForm() { tokenOptions={tokenOptions} amount={displayToAmount} usd={displayToUsd} - slippage="−0.16%" onTokenChange={setToToken} /> @@ -103,7 +103,7 @@ export function SwapForm() { onRefresh={refreshRate} /> - +
diff --git a/src/widgets/swap-form/ui/SwapInfoPanel.tsx b/src/widgets/swap-form/ui/SwapInfoPanel.tsx index fe6f2c7..56cf93b 100644 --- a/src/widgets/swap-form/ui/SwapInfoPanel.tsx +++ b/src/widgets/swap-form/ui/SwapInfoPanel.tsx @@ -1,15 +1,19 @@ import styles from './SwapInfoPanel.module.css' -const ROWS = [ - { label: 'ПРОВАЙДЕР', value: 'ЛУЧШИЙ', link: false }, - { label: 'СКОЛЬЖЕНИЕ', value: 'АВТО (0.5%)', link: true }, - { label: 'СЕТЕВОЙ СБОР', value: '$0.10', link: false }, -] +interface Props { + gasFee?: string +} + +export function SwapInfoPanel({ gasFee }: Props) { + const rows = [ + { label: 'ПРОВАЙДЕР', value: 'ЛУЧШИЙ', link: false }, + { label: 'СКОЛЬЖЕНИЕ', value: 'АВТО (0.5%)', link: true }, + { label: 'СЕТЕВОЙ СБОР', value: gasFee ? `$${gasFee}` : '—', link: false }, + ] -export function SwapInfoPanel() { return (
- {ROWS.map(({ label, value, link }) => ( + {rows.map(({ label, value, link }) => (
{label} {value}