diff --git a/src/widgets/bridge-form/ui/BridgeConfirmModal.module.css b/src/widgets/bridge-form/ui/BridgeConfirmModal.module.css index 60ea7e6..64c49b7 100644 --- a/src/widgets/bridge-form/ui/BridgeConfirmModal.module.css +++ b/src/widgets/bridge-form/ui/BridgeConfirmModal.module.css @@ -113,6 +113,18 @@ font-weight: 600; } +.warning { + margin: 0; + padding: 12px 16px; + border-radius: 12px; + background: rgba(255, 70, 70, 0.1); + border: 1px solid var(--error); + color: var(--error); + font-size: 13px; + line-height: 1.4; + font-weight: 600; +} + .confirmBtn { width: 100%; height: 56px; diff --git a/src/widgets/bridge-form/ui/BridgeConfirmModal.tsx b/src/widgets/bridge-form/ui/BridgeConfirmModal.tsx index bbc2475..b284960 100644 --- a/src/widgets/bridge-form/ui/BridgeConfirmModal.tsx +++ b/src/widgets/bridge-form/ui/BridgeConfirmModal.tsx @@ -6,12 +6,13 @@ import styles from './BridgeConfirmModal.module.css' interface Props { quote: JumperQuote fromAmountHuman: string + insufficientBalance?: boolean isExecuting?: boolean onConfirm: () => void onClose: () => void } -export function BridgeConfirmModal({ quote, fromAmountHuman, isExecuting, onConfirm, onClose }: Props) { +export function BridgeConfirmModal({ quote, fromAmountHuman, insufficientBalance, isExecuting, onConfirm, onClose }: Props) { const { action, estimate, toolDetails } = quote const toSymbol = action.toToken.symbol const fromSymbol = action.fromToken.symbol @@ -57,6 +58,12 @@ export function BridgeConfirmModal({ quote, fromAmountHuman, isExecuting, onConf + {insufficientBalance && ( +

+ Введённое количество превышает баланс кошелька — бридж будет отклонён. +

+ )} + diff --git a/src/widgets/bridge-form/ui/BridgeForm.tsx b/src/widgets/bridge-form/ui/BridgeForm.tsx index cb1117c..e7ec360 100644 --- a/src/widgets/bridge-form/ui/BridgeForm.tsx +++ b/src/widgets/bridge-form/ui/BridgeForm.tsx @@ -108,6 +108,8 @@ export function BridgeForm() { const parsedAmount = parseFloat(fromAmount) + const insufficientBalance = (parsedAmount || 0) > fromToken.balance + const fromJumper = jumperData?.[CHAIN_ID_BY_NET[fromNetwork]]?.find(t => t.symbol === fromToken.symbol) const toJumper = jumperData?.[CHAIN_ID_BY_NET[toNetwork]]?.find(t => t.symbol === toToken.symbol) const fromAddress = addresses?.find(a => a.chain === fromNetwork)?.address @@ -246,6 +248,7 @@ export function BridgeForm() { setQuote(null)} diff --git a/src/widgets/swap-form/ui/SwapConfirmModal.module.css b/src/widgets/swap-form/ui/SwapConfirmModal.module.css index 6968432..40095ba 100644 --- a/src/widgets/swap-form/ui/SwapConfirmModal.module.css +++ b/src/widgets/swap-form/ui/SwapConfirmModal.module.css @@ -117,6 +117,18 @@ color: var(--error); } +.warning { + margin: 0; + padding: 12px 16px; + border-radius: 12px; + background: rgba(255, 70, 70, 0.1); + border: 1px solid var(--error); + color: var(--error); + font-size: 13px; + line-height: 1.4; + font-weight: 600; +} + .confirmBtn { width: 100%; height: 56px; diff --git a/src/widgets/swap-form/ui/SwapConfirmModal.tsx b/src/widgets/swap-form/ui/SwapConfirmModal.tsx index c3328c5..d8fd1ab 100644 --- a/src/widgets/swap-form/ui/SwapConfirmModal.tsx +++ b/src/widgets/swap-form/ui/SwapConfirmModal.tsx @@ -14,11 +14,12 @@ interface SwapData { interface Props { data: SwapData + insufficientBalance?: boolean onConfirm: () => void onClose: () => void } -export function SwapConfirmModal({ data, onConfirm, onClose }: Props) { +export function SwapConfirmModal({ data, insufficientBalance, onConfirm, onClose }: Props) { const { details, fees } = data const { currencyIn, currencyOut, totalImpact, rate } = details @@ -72,6 +73,12 @@ export function SwapConfirmModal({ data, onConfirm, onClose }: Props) { + {insufficientBalance && ( +

+ Введённое количество превышает баланс кошелька — своп будет отклонён. +

+ )} + diff --git a/src/widgets/swap-form/ui/SwapForm.tsx b/src/widgets/swap-form/ui/SwapForm.tsx index 708e678..6d3955a 100644 --- a/src/widgets/swap-form/ui/SwapForm.tsx +++ b/src/widgets/swap-form/ui/SwapForm.tsx @@ -94,6 +94,8 @@ export function SwapForm() { const isProcessing = isSigning || isExecutingTrxSwap + const insufficientBalance = (parseFloat(fromAmount) || 0) > fromToken.balance + // ── Display values ─────────────────────────────────────────────────────── const displayToAmount = isTrxNetwork ? (trxQuoteData?.expectedOutFormatted ?? '0') @@ -162,6 +164,7 @@ export function SwapForm() { {modalData && ( setModalData(null)} onConfirm={() => { const txData = modalData.steps[0]?.items[0]?.data @@ -192,6 +195,7 @@ export function SwapForm() { fromSymbol={fromToken.symbol} toSymbol={toToken.symbol} amountHuman={fromAmount} + insufficientBalance={insufficientBalance} onClose={() => setTrxModalQuote(null)} onConfirm={() => { setErrorMessage(null) diff --git a/src/widgets/swap-form/ui/TrxConfirmModal.module.css b/src/widgets/swap-form/ui/TrxConfirmModal.module.css index 9383871..2425856 100644 --- a/src/widgets/swap-form/ui/TrxConfirmModal.module.css +++ b/src/widgets/swap-form/ui/TrxConfirmModal.module.css @@ -113,6 +113,18 @@ font-weight: 600; } +.warning { + margin: 0; + padding: 12px 16px; + border-radius: 12px; + background: rgba(255, 70, 70, 0.1); + border: 1px solid var(--error); + color: var(--error); + font-size: 13px; + line-height: 1.4; + font-weight: 600; +} + .confirmBtn { width: 100%; height: 56px; diff --git a/src/widgets/swap-form/ui/TrxConfirmModal.tsx b/src/widgets/swap-form/ui/TrxConfirmModal.tsx index 47464ac..b3514b3 100644 --- a/src/widgets/swap-form/ui/TrxConfirmModal.tsx +++ b/src/widgets/swap-form/ui/TrxConfirmModal.tsx @@ -6,11 +6,12 @@ interface Props { fromSymbol: string toSymbol: string amountHuman: string + insufficientBalance?: boolean onConfirm: () => void onClose: () => void } -export function TrxConfirmModal({ quote, fromSymbol, toSymbol, amountHuman, onConfirm, onClose }: Props) { +export function TrxConfirmModal({ quote, fromSymbol, toSymbol, amountHuman, insufficientBalance, onConfirm, onClose }: Props) { const { expectedOutFormatted, minOutFormatted, fees } = quote return ( @@ -45,6 +46,12 @@ export function TrxConfirmModal({ quote, fromSymbol, toSymbol, amountHuman, onCo + {insufficientBalance && ( +

+ Введённое количество превышает баланс кошелька — своп будет отклонён. +

+ )} +