This commit is contained in:
2026-06-02 00:20:38 +03:00
parent 5b915bbc22
commit 6a399ea7ca
8 changed files with 67 additions and 3 deletions

View File

@@ -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;

View File

@@ -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
</div>
</div>
{insufficientBalance && (
<p className={styles.warning}>
Введённое количество превышает баланс кошелька бридж будет отклонён.
</p>
)}
<button className={styles.confirmBtn} onClick={onConfirm} disabled={isExecuting}>
{isExecuting ? 'Обработка...' : 'Подтвердить бридж'}
</button>

View File

@@ -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() {
<BridgeConfirmModal
quote={quote}
fromAmountHuman={fromAmount}
insufficientBalance={insufficientBalance}
isExecuting={isExecuting}
onConfirm={handleExecute}
onClose={() => setQuote(null)}

View File

@@ -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;

View File

@@ -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) {
</div>
</div>
{insufficientBalance && (
<p className={styles.warning}>
Введённое количество превышает баланс кошелька своп будет отклонён.
</p>
)}
<button className={styles.confirmBtn} onClick={onConfirm}>
Подтвердить
</button>

View File

@@ -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 && (
<SwapConfirmModal
data={modalData}
insufficientBalance={insufficientBalance}
onClose={() => 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)

View File

@@ -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;

View File

@@ -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
</div>
</div>
{insufficientBalance && (
<p className={styles.warning}>
Введённое количество превышает баланс кошелька своп будет отклонён.
</p>
)}
<button className={styles.confirmBtn} onClick={onConfirm}>
Подтвердить
</button>