Skip to content

Commit

Permalink
univ3 - allow change pool via fee
Browse files Browse the repository at this point in the history
  • Loading branch information
shendel committed Aug 7, 2024
1 parent 8fb96af commit bb69ac8
Show file tree
Hide file tree
Showing 5 changed files with 113 additions and 11 deletions.
2 changes: 2 additions & 0 deletions src/front/shared/pages/Exchange/QuickSwap/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ function Footer(props: FooterProps) {
swapFee,
serviceFee,
fiat,
uniV3ActivePoolFee,
} = parentState

const [finalizeSwap, setFinalizeSwap] = useState<boolean>(false)
Expand Down Expand Up @@ -200,6 +201,7 @@ function Footer(props: FooterProps) {
isNative: !(fromWallet.isToken && toWallet.isToken),
fromNative: !fromWallet.isToken,
toNative: !toWallet.isToken,
fee: uniV3ActivePoolFee,
})

} else {
Expand Down
32 changes: 32 additions & 0 deletions src/front/shared/pages/Exchange/QuickSwap/InputForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ type InputFormProps = {
setReceivedAmount: (v: string) => void
insufficientBalanceA: boolean
insufficientBalanceB: boolean
switchUniV3SourcePool: (fee: number, address: string) => void
}

function InputForm(props: InputFormProps) {
Expand All @@ -59,6 +60,7 @@ function InputForm(props: InputFormProps) {
setReceivedAmount,
insufficientBalanceA,
insufficientBalanceB,
switchUniV3SourcePool,
} = props

const {
Expand All @@ -75,6 +77,9 @@ function InputForm(props: InputFormProps) {
fromWallet,
toWallet,
isPending,
useUniSwapV3,
uniV3PoolsByFee,
uniV3ActivePoolFee,
} = parentState

const [fromBalancePending, setFromBalancePending] = useState(false)
Expand Down Expand Up @@ -231,6 +236,30 @@ function InputForm(props: InputFormProps) {
const showFiatExchangeBtn = window.transakApiKey
|| supportedCurrencies.includes(spendedCurrency.value)

const renderUniV3PoolsByFee = () => {
return (
<div styleName="univ3SwitchPoolFee">
<strong>
<FormattedMessage
id="qe_UNIV3_PoolsByFee"
defaultMessage="Pool fee:"
/>
</strong>
{uniV3PoolsByFee.map(({ fee, address }) => {
return (
<a styleName={(fee == uniV3ActivePoolFee) ? 'active' : ''}
key={fee}
onClick={() => {
switchUniV3SourcePool(fee, address)
}}
>
{(fee / 10000)}%
</a>
)
})}
</div>
)
}
return (
<form action="">
<QuickSwapFormTour isTourOpen={isTourOpen} closeTour={closeTour} />
Expand Down Expand Up @@ -323,6 +352,9 @@ function InputForm(props: InputFormProps) {
})
}}
/>
{useUniSwapV3 && uniV3PoolsByFee.length > 0 && (
<>{renderUniV3PoolsByFee()}</>
)}
</div>
{receivedCurrency.notExist && (
<div styleName="addCustomTokenBtn">
Expand Down
39 changes: 39 additions & 0 deletions src/front/shared/pages/Exchange/QuickSwap/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,45 @@ $maxWidth: 38em;
}
}

.univ3SwitchPoolFee {
display: flex;
color: var(--color-indicating);
border: 1px solid var(--color-border);
background-color: var(--color-background);
padding: 4px;
padding-left: 10px;
align-items: center;
flex-direction: row;
justify-content: flex-start;
margin-top: -16px;
margin-bottom: 10px;
text-align: left;
position: relative;
> STRONG {
padding-right: 1em;
}
> A {
padding-left: 0.5em;
}
> A::after {
display: inline-block;
content: "|";
padding-left: 0.5em;
color: var(--color-indicating);
}
> A:last-child::after {
display: none;
}
> A:hover {
text-decoration: underline;
color: var(--color-brand-hover);
cursor: pointer;
}
> A.active {
color: var(--color-brand);
font-weight: bold;
}
}
.formCenter {
padding-bottom: 1.2rem;
position: relative;
Expand Down
36 changes: 31 additions & 5 deletions src/front/shared/pages/Exchange/QuickSwap/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -729,15 +729,21 @@ class QuickSwap extends PureComponent<IUniversalObj, ComponentState> {
tokenA,
tokenB,
})
console.log('>>> updateCurrentPairAddress', useUniSwapV3, hasUniSwapV3, pairAddress)
let newFee = 0
if (useUniSwapV3 && hasUniSwapV3) {
if (pairAddress.length) {
// check exists pool for active fee
const { uniV3ActivePoolFee } = this.state
const existsCurrenctFeePool = pairAddress.filter(({ fee }) => {
return (fee == uniV3ActivePoolFee)
})
const _pairAddress = pairAddress
pairAddress = pairAddress[0].address
pairAddress = (existsCurrenctFeePool.length > 0) ? existsCurrenctFeePool[0].address : pairAddress[0].address
this.setState(() => ({
uniV3PoolsByFee: _pairAddress,
uniV3ActivePoolFee: _pairAddress[0].fee,
uniV3ActivePoolFee: (existsCurrenctFeePool.length > 0) ? existsCurrenctFeePool[0].fee: _pairAddress[0].fee
}))
newFee = (existsCurrenctFeePool.length > 0) ? existsCurrenctFeePool[0].fee : _pairAddress[0].fee
} else {
pairAddress = ZERO_ADDRESS
this.setState(() => ({
Expand All @@ -746,7 +752,6 @@ class QuickSwap extends PureComponent<IUniversalObj, ComponentState> {
}))
}
}
console.log('>>> updateCurrentPairAddress', pairAddress)
const SECONDS = 15

cacheStorageSet(
Expand Down Expand Up @@ -780,7 +785,15 @@ class QuickSwap extends PureComponent<IUniversalObj, ComponentState> {
}

fetchAmountOut = async () => {
const { network, baseChainWallet, spendedAmount, fromWallet, toWallet, useUniSwapV3 } = this.state
const {
network,
baseChainWallet,
spendedAmount,
fromWallet,
toWallet,
useUniSwapV3,
uniV3ActivePoolFee,
} = this.state

const tokenA = fromWallet.contractAddress ?? EVM_COIN_ADDRESS
const tokenB = toWallet.contractAddress ?? EVM_COIN_ADDRESS
Expand All @@ -799,6 +812,7 @@ class QuickSwap extends PureComponent<IUniversalObj, ComponentState> {
amountIn: spendedAmount,
tokenB,
tokenBDecimals: toWallet.decimals ?? COIN_DECIMALS,
fee: uniV3ActivePoolFee,
})

this.setState(() => ({
Expand Down Expand Up @@ -861,6 +875,17 @@ class QuickSwap extends PureComponent<IUniversalObj, ComponentState> {
this.resetReceivedAmount()
}

switchUniV3SourcePool = (fee, poolAddress) => {
this.setState(() => ({
uniV3ActivePoolFee: fee,
currentLiquidityPair: poolAddress,
}), () => {
console.log('>>> UPDATE DATA ON FEE CHANGE')
this.onInputDataChange()
})

}

checkApprove = async (direction) => {
const { network, isSourceMode, spendedAmount, receivedAmount, fromWallet, toWallet, useUniSwapV3 } = this.state
const hasUniSwapV3 = this.getHasUniSwapV3()
Expand Down Expand Up @@ -1273,6 +1298,7 @@ console.log('>>> sourceAction', sourceAction)
insufficientBalanceB={insufficientBalanceB}
resetReceivedAmount={this.resetReceivedAmount}
setReceivedAmount={this.setReceivedAmount}
switchUniV3SourcePool={this.switchUniV3SourcePool}
/>
</div>
</>
Expand Down
15 changes: 9 additions & 6 deletions src/front/shared/redux/actions/uniswap.ts
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,7 @@ const getAmountOutV3 = async (params) => {
const callParams = [
wrappedTokenA,
wrappedTokenB,
fee || 10000,
fee || 100,//00,
unitAmountIn,
0
]
Expand All @@ -285,9 +285,11 @@ const calcPriceV3 = (params) => {
Decimal1,
} = params
// @ts-ignore
const buyOneOfToken0 = ((sqrtPriceX96 / 2**96)**2) / (10**Decimal1 / 10**Decimal0).toFixed(Decimal1);
// @ts-ignore
const buyOneOfToken1 = (1 / buyOneOfToken0).toFixed(Decimal0);

const buyOneOfToken0 = (new BigNumber(sqrtPriceX96).dividedBy(new BigNumber(2).pow(96))).pow(2).dividedBy(
new BigNumber(10).pow(Decimal1).dividedBy(new BigNumber(10).pow(Decimal0))
).toFixed(Decimal1)
const buyOneOfToken1 = new BigNumber(1).dividedBy(buyOneOfToken0).toFixed(Decimal0);
// console.log("price of token0 in value of token1 : " + buyOneOfToken0.toString());
// console.log("price of token1 in value of token0 : " + buyOneOfToken1.toString());
// console.log("");
Expand Down Expand Up @@ -807,9 +809,10 @@ const swapCallbackV3 = async (params) => {
isNative = false,
fromNative = false,
toNative = false,
fee = 10000,
} = params


console.log('>>>> DO swapCallbackV3 ->>>> FEE', fee)
try {
const routerAddress = config?.UNISWAP_V3_CONTRACTS[chainId]?.router
const provider = actions[baseCurrency.toLowerCase()].getWeb3()
Expand All @@ -822,7 +825,7 @@ const swapCallbackV3 = async (params) => {

const tokenIn = wrapCurrency(chainId, fromToken)
const tokenOut = wrapCurrency(chainId, toToken)
const fee = 10000

const recipient = owner
const deadline = await getDeadline(provider, deadlinePeriod)

Expand Down

0 comments on commit bb69ac8

Please sign in to comment.