Merge pull request #1076 from AelinXYZ/add-aumount-pre-waiver

amounts added

src/components/burn/MintNft.tsx

@@ -3,6 +3,7 @@ import styled from 'styled-components'
 
 import { Contents, Wrapper } from '../pools/actions/Wrapper'
 import { ButtonGradient } from '../pureStyledComponents/buttons/Button'
+import { TextPrimary } from '../pureStyledComponents/text/Text'
 import { genericSuspense } from '@/src/components/helpers/SafeSuspense'
 import { NFT_WAIVER_CONTRACT } from '@/src/constants/misc'
 import { useNftWaiverTransaction } from '@/src/hooks/contracts/useNftWaiverTransaction'
@@ -17,7 +18,7 @@ const ButtonsWrapper = styled.div`
 `
 
 const MintNFT: React.FC = () => {
-  const { refetchNftContract } = useBurnAelin()
+  const { refetchNftContract, userReceiveAmtUSDC, userReceiveAmtVK } = useBurnAelin()
 
   const { isSubmitting, setConfigAndOpenModal } = useTransactionModal()
 
@@ -58,6 +59,10 @@ const MintNFT: React.FC = () => {
         .<br />
         <br /> By minting the NFT pursuant to the instructions on this page, you will be agreeing to
         the terms of the waiver.
+        <br />
+        <br />
+        After swapping you'll receive <TextPrimary>{userReceiveAmtUSDC} USDC</TextPrimary> and{' '}
+        <TextPrimary>{userReceiveAmtVK} veKWENTA</TextPrimary>
       </Contents>
       <ButtonsWrapper>
         <ButtonGradient disabled={isSubmitting} onClick={handleMint}>

src/components/burn/SwapTokens.tsx

@@ -2,6 +2,7 @@ import styled from 'styled-components'
 
 import { Contents, Wrapper } from '../pools/actions/Wrapper'
 import { ButtonGradient } from '../pureStyledComponents/buttons/Button'
+import { TextPrimary } from '../pureStyledComponents/text/Text'
 import { genericSuspense } from '@/src/components/helpers/SafeSuspense'
 import { BURN_AELIN_CONTRACT } from '@/src/constants/misc'
 import { useSwapAelinTransaction } from '@/src/hooks/contracts/useSwapAelinTransaction'
@@ -16,7 +17,14 @@ const ButtonsWrapper = styled.div`
 `
 
 const SwapAelinToken: React.FC = () => {
-  const { refetchUserBalance, setHasSwapped, setSwapTransactionHash, userBalance } = useBurnAelin()
+  const {
+    refetchUserBalance,
+    setHasSwapped,
+    setSwapTransactionHash,
+    userBalance,
+    userReceiveAmtUSDC,
+    userReceiveAmtVK,
+  } = useBurnAelin()
 
   const { refetchNftContract } = useBurnAelin()
 
@@ -43,7 +51,13 @@ const SwapAelinToken: React.FC = () => {
 
   return (
     <Wrapper title={`Swap Tokens`}>
-      <Contents>Call the swap method to burn your AELIN for a share of treasury assets</Contents>
+      <Contents>
+        Call the swap method to burn your AELIN for a share of treasury assets
+        <br />
+        <br />
+        You'll receive <TextPrimary>{userReceiveAmtUSDC} USDC</TextPrimary> and{' '}
+        <TextPrimary>{userReceiveAmtVK} veKWENTA</TextPrimary>
+      </Contents>
       <ButtonsWrapper>
         <ButtonGradient disabled={isSubmitting} onClick={handleSwapTokens}>
           Swap

src/hooks/contracts/useSwapAelinCall.ts

@@ -0,0 +1,22 @@
+import { JsonRpcProvider } from '@ethersproject/providers'
+
+import useContractCall from './useContractCall'
+import swapAelin from '@/src/abis/SwapAelin.json'
+import { ChainsValues, getNetworkConfig } from '@/src/constants/chains'
+import { SwapAelin } from '@/types/typechain'
+
+export function useSwapAelinCall<
+  MethodName extends keyof SwapAelin['functions'],
+  Params extends Parameters<SwapAelin[MethodName]> | null,
+  Return extends Awaited<ReturnType<SwapAelin[MethodName]>>,
+>(
+  chainId: ChainsValues,
+  address: string,
+  method: MethodName,
+  params: Params,
+): [Return | null, () => void] {
+  const provider = new JsonRpcProvider(getNetworkConfig(chainId).rpcUrl)
+
+  const [data, refetch] = useContractCall(provider, address, swapAelin, method, params)
+  return [data, refetch]
+}

src/providers/burnAelinProvider.tsx

@@ -7,6 +7,8 @@ import { contracts } from '../constants/contracts'
 import { BURN_AELIN_CONTRACT, NFT_WAIVER_CONTRACT, ZERO_ADDRESS, ZERO_BN } from '../constants/misc'
 import useERC20Call from '../hooks/contracts/useERC20Call'
 import { useNftWaiverCall } from '../hooks/contracts/useERC721Call'
+import { useSwapAelinCall } from '../hooks/contracts/useSwapAelinCall'
+import { formatToken } from '../web3/bigNumber'
 
 type BurnAelinReducerContext = {
   state: BurnAelinState
@@ -18,6 +20,8 @@ type BurnAelinReducerContext = {
   refetchUserAllowance: () => void
   userBalance: BigNumber
   swapTransactionHash: string
+  userReceiveAmtUSDC: string
+  userReceiveAmtVK: string
 }
 
 export const BurnAelinState = {
@@ -36,7 +40,7 @@ const BuenAelinContext = createContext<BurnAelinReducerContext>({} as BurnAelinR
 
 const BurnAelinContextProvider = ({ children }: { children: ReactNode }) => {
   const { address, appChainId } = useWeb3Connection()
-  const [state, setState] = useState<BurnAelinState>(BurnAelinState.SUCCESS)
+  const [state, setState] = useState<BurnAelinState>(BurnAelinState.MINT)
   const [hasSwapped, setHasSwapped] = useState<boolean>(false)
   const [swapTransactionHash, setSwapTransactionHash] = useState<string>('')
 
@@ -60,6 +64,16 @@ const BurnAelinContextProvider = ({ children }: { children: ReactNode }) => {
     [address || ZERO_ADDRESS, BURN_AELIN_CONTRACT],
   )
 
+  const [userReceiveAmt, refecthUserReceiveAmt] = useSwapAelinCall(
+    appChainId,
+    BURN_AELIN_CONTRACT,
+    'getSwapAmount',
+    [userBalance || ZERO_BN],
+  )
+
+  const userReceiveAmtUSDC = formatToken(userReceiveAmt?.[0] || ZERO_BN, 6, 4) || ''
+  const userReceiveAmtVK = formatToken(userReceiveAmt?.[1] || ZERO_BN, 18, 4) || ''
+
   useEffect(() => {
     if (!hasMinted) {
       setState(BurnAelinState.MINT)
@@ -88,6 +102,8 @@ const BurnAelinContextProvider = ({ children }: { children: ReactNode }) => {
         refetchUserBalance,
         refetchUserAllowance,
         userBalance: userBalance ?? ZERO_BN,
+        userReceiveAmtUSDC,
+        userReceiveAmtVK,
       }}
     >
       {children}