DopeyCode/technikoin
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Update Exchange.js

Browse Source
This commit is contained in:
Daniel
2022-11-05 13:23:29 +01:00
parent c3ee6e7a14
commit db65a242ba
1 changed files with 60 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
packages/react-app/src/components/Exchange.js vendored
View File

@@ -21,66 +21,66 @@ const Exchange = ({ pools }) => {
return ( return (
<div className="flex flex-col w-full items-center"> <div className="flex flex-col w-full items-center">
<div className="mb-8"> <div className="mb-8">
<AmountIn <AmountIn
value={fromValue} value={fromValue}
onChange={onFromValueChange} onChange={onFromValueChange}
currencyValue={fromToken} currencyValue={fromToken}
onSelect={onFromTokenChange} onSelect={onFromTokenChange}
currencies={availableTokens} currencies={availableTokens}
isSwapping={isSwapping && hasEnoughBalance} isSwapping={isSwapping && hasEnoughBalance}
/> />
<Balance tokenBalance={fromTokenBalance} /> <Balance tokenBalance={fromTokenBalance} />
</div> </div>
<div className="mb-8 w-[100%]"> <div className="mb-8 w-[100%]">
<AmountOut <AmountOut
fromToken={fromToken} fromToken={fromToken}
toToken={toToken} toToken={toToken}
amountIn={fromValueBigNumber} amountIn={fromValueBigNumber}
pairContract={pairAddress} pairContract={pairAddress}
currencyValue={toToken} currencyValue={toToken}
onSelect={onToTokenChange} onSelect={onToTokenChange}
currencies={counterpartTokens} currencies={counterpartTokens}
/> />
<Balance tokenBalance={toTokenBalance} /> <Balance tokenBalance={toTokenBalance} />
</div> </div>
{approvedNeeded && !isSwapping ? ( {approvedNeeded && !isSwapping ? (
<button <button
disabled={!canApprove} disabled={!canApprove}
onClick={onApproveRequested} onClick={onApproveRequested}
className={`${ className={`${
canApprove canApprove
? "bg-site-pink text-white" ? "bg-site-pink text-white"
: "bg-site-dim2 text-site-dim2" : "bg-site-dim2 text-site-dim2"
} ${styles.actionButton}`} } ${styles.actionButton}`}
> >
{isApproving ? "Approving..." : "Approve"} {isApproving ? "Approving..." : "Approve"}
</button> </button>
) : ( ) : (
<button <button
disabled={!canSwap} disabled={!canSwap}
onClick={onSwapRequested} onClick={onSwapRequested}
className={`${ className={`${
canSwap ? "bg-site-pink text-white" : "bg-site-dim2 text-site-dim2" canSwap ? "bg-site-pink text-white" : "bg-site-dim2 text-site-dim2"
} ${styles.actionButton}`} } ${styles.actionButton}`}
> >
{isSwapping {isSwapping
? "Swapping..." ? "Swapping..."
: hasEnoughBalance : hasEnoughBalance
? "Swap" ? "Swap"
: "Insufficient balance"} : "Insufficient balance"}
</button> </button>
)} )}
{failureMessage && !resetState ? ( {failureMessage && !resetState ? (
<p className={styles.message}>{failureMessage}</p> <p className={styles.message}>{failureMessage}</p>
) : successMessage ? ( ) : successMessage ? (
<p className={styles.message}>{successMessage}</p> <p className={styles.message}>{successMessage}</p>
) : ( ) : (
"" ""
)} )}
</div> </div>
); );
} }