14.05.2026 rip

This commit is contained in:
2026-05-14 22:04:30 +03:00
parent ca3dd78783
commit 789d99aa12
4 changed files with 27 additions and 17 deletions

View File

@@ -177,6 +177,11 @@ export interface RelayQuoteResponse {
amountUsd: string amountUsd: string
} }
} }
fees: {
gas: {
amountUsd: string
}
}
} }
export async function getTokensList(): Promise<TokenInfo[]> { export async function getTokensList(): Promise<TokenInfo[]> {

View File

@@ -7,7 +7,7 @@ interface Props {
token: Token token: Token
tokenOptions: Token[] tokenOptions: Token[]
amount: string amount: string
usd: string usd?: string
slippage?: string slippage?: string
onTokenChange: (token: Token) => void onTokenChange: (token: Token) => void
onAmountChange?: (v: string) => void onAmountChange?: (v: string) => void
@@ -84,7 +84,7 @@ export function SwapCard({
) : ( ) : (
<div className={styles.display}> <div className={styles.display}>
<span className={styles.int}>{intPart}</span> <span className={styles.int}>{intPart}</span>
<span className={styles.dec}>.{decPart}</span> {decPart && <span className={styles.dec}>.{decPart}</span>}
</div> </div>
)} )}
@@ -95,10 +95,11 @@ export function SwapCard({
</div> </div>
<div className={styles.bottom}> <div className={styles.bottom}>
{usd && (
<span className={styles.usd}> <span className={styles.usd}>
${usd} ${usd}
{slippage && <span className={styles.neg}> ({slippage})</span>}
</span> </span>
)}
<span className={styles.balance}> <span className={styles.balance}>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--text-secondary)" strokeWidth="2"> <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--text-secondary)" strokeWidth="2">
<rect x="2" y="6" width="20" height="14" rx="3" /> <rect x="2" y="6" width="20" height="14" rx="3" />

View File

@@ -65,8 +65,9 @@ export function SwapForm() {
const { data: quoteData } = useRelayQuote(quotePayload) const { data: quoteData } = useRelayQuote(quotePayload)
const displayToAmount = quoteData?.details.currencyOut.amountFormatted ?? toAmount const displayToAmount = quoteData?.details.currencyOut.amountFormatted ?? '0'
const displayToUsd = quoteData?.details.currencyOut.amountUsd ?? toUsd const displayToUsd = quoteData?.details.currencyOut.amountUsd
const gasFee = quoteData?.fees.gas.amountUsd
return ( return (
<div className={styles.form}> <div className={styles.form}>
@@ -91,7 +92,6 @@ export function SwapForm() {
tokenOptions={tokenOptions} tokenOptions={tokenOptions}
amount={displayToAmount} amount={displayToAmount}
usd={displayToUsd} usd={displayToUsd}
slippage="0.16%"
onTokenChange={setToToken} onTokenChange={setToToken}
/> />
@@ -103,7 +103,7 @@ export function SwapForm() {
onRefresh={refreshRate} onRefresh={refreshRate}
/> />
<SwapInfoPanel /> <SwapInfoPanel gasFee={gasFee} />
<PrimaryButton /> <PrimaryButton />
</div> </div>

View File

@@ -1,15 +1,19 @@
import styles from './SwapInfoPanel.module.css' import styles from './SwapInfoPanel.module.css'
const ROWS = [ interface Props {
gasFee?: string
}
export function SwapInfoPanel({ gasFee }: Props) {
const rows = [
{ label: 'ПРОВАЙДЕР', value: 'ЛУЧШИЙ', link: false }, { label: 'ПРОВАЙДЕР', value: 'ЛУЧШИЙ', link: false },
{ label: 'СКОЛЬЖЕНИЕ', value: 'АВТО (0.5%)', link: true }, { label: 'СКОЛЬЖЕНИЕ', value: 'АВТО (0.5%)', link: true },
{ label: 'СЕТЕВОЙ СБОР', value: '$0.10', link: false }, { label: 'СЕТЕВОЙ СБОР', value: gasFee ? `$${gasFee}` : '', link: false },
] ]
export function SwapInfoPanel() {
return ( return (
<div className={styles.panel}> <div className={styles.panel}>
{ROWS.map(({ label, value, link }) => ( {rows.map(({ label, value, link }) => (
<div key={label} className={styles.row}> <div key={label} className={styles.row}>
<span className={styles.label}>{label}</span> <span className={styles.label}>{label}</span>
<span className={`${styles.value} ${link ? styles.link : ''}`}>{value}</span> <span className={`${styles.value} ${link ? styles.link : ''}`}>{value}</span>