From 3d3dd18dd1d451341a04c29df3ec5851426f5a4b Mon Sep 17 00:00:00 2001 From: Taehee Yoon Date: Wed, 22 Nov 2023 05:13:22 +0900 Subject: [PATCH] fix : quote logic --- src/components/Message.tsx | 77 ++++++++++++++++++++++-------------- src/components/Sidebar.tsx | 26 ++++++------ src/pages/_app.tsx | 34 ++++++++++------ src/pages/api/1inch/quote.ts | 2 +- src/pages/api/1inch/route.ts | 2 +- 5 files changed, 86 insertions(+), 55 deletions(-) diff --git a/src/components/Message.tsx b/src/components/Message.tsx index d5af413..90b5523 100644 --- a/src/components/Message.tsx +++ b/src/components/Message.tsx @@ -28,6 +28,8 @@ import approveTrasaction from "@/utils/approveTransaction"; import checkAllowance from "@/utils/checkAllowance"; import getQuote from "@/utils/getQuote"; import { fetchBalance } from "wagmi/actions"; +import { formatEther } from "viem"; +import { useWeb3Modal } from "@web3modal/wagmi/react"; const Message = (props: any) => { const { message } = props; @@ -37,11 +39,15 @@ const Message = (props: any) => { const { address, isConnected } = useAccount(); const [isLoading, setIsLoading] = useState(false); - const [sellToken, setSellToken] = useState(1); - const [sellAmount, setSellAmount] = useState(1); - const [buyToken, setBuyToken] = useState(2); - const [buyAmount, setBuyAmount] = useState(1); + const [sellToken, setSellToken] = useState(0); + const [sellAmount, setSellAmount] = useState(0); + const [buyToken, setBuyToken] = useState(0); + const [buyAmount, setBuyAmount] = useState(0); const [protocolInfo, setProtocolInfo] = useState(); + const [gas, setGas] = useState(0); + const [btnText, setBtnText] = useState("Approve"); + + const { open } = useWeb3Modal(); const toast = useToast(); @@ -59,9 +65,10 @@ const Message = (props: any) => { } }, [text]); - // useEffect(() => { - // setBuyAmount(0); - // }, [sellAmount, sellToken, buyToken]); + useEffect(() => { + setBuyAmount(0); + handleQuote(); + }, [sellAmount, sellToken, buyToken]); const { data: balance } = useBalance({ address: address, @@ -116,8 +123,6 @@ const Message = (props: any) => { "1", chain?.id as number ); - console.log(transaction); - console.log(transaction.protocols); setProtocolInfo(transaction.protocols && transaction.protocols[0][0][0]); if (transaction.tx) { sendTransaction({ @@ -150,23 +155,21 @@ const Message = (props: any) => { // setIsLoading(false); // return; // } - const allowance = await checkAllowance( - TOKENLIST[sellToken].address, - address, - chain?.id as number - ); - console.log(allowance); - if (allowance?.allowance === "0") { - await handleApproval(); - } - handleTransaction(); - setIsLoading(false); - if (isSuccess) { - toast({ - title: "Swapped successfully 🎉", - position: "top-right", - }); - } + + handleTransaction().then(() => { + setIsLoading(false); + if (isSuccess) { + toast({ + title: "Swapped successfully 🎉", + position: "top-right", + }); + } + }); + } else { + setBtnText("Connect Wallet"); + open().then(() => { + setBtnText("Approve"); + }); } } @@ -182,12 +185,27 @@ const Message = (props: any) => { console.log("quote : ", quote); if (quote.toAmount) { setBuyAmount(Number(quote.toAmount)); + setGas(quote.gas); + setProtocolInfo(quote.protocols && quote.protocols[0][0][0]); } else { toast({ title: quote.description, position: "top-right", }); } + + if (!address) return; + if (!text) return; + const allowance = await checkAllowance( + TOKENLIST[sellToken].address, + address, + chain?.id as number + ); + console.log("allowance : ", allowance); + if (allowance?.allowance === "0") { + await handleApproval(); + } + setBtnText("Swap"); setIsLoading(false); } @@ -227,7 +245,7 @@ const Message = (props: any) => {

{text}

) : ( - + nextui logo { src="https://avatars.githubusercontent.com/u/86160567?s=200&v=4" width={40} /> -
+
{!!protocolInfo ? (

{protocolInfo?.name}

) : ( @@ -248,6 +266,7 @@ const Message = (props: any) => {

fromToken : {text.fromToken}

toToken : {text.toToken}

amount : {text.amount}

+

gas(fee) : {formatEther(gas)}

))}
{ + setMounted(true); + }, []); return ( - - - - - - - {" "} - - - - - + <> + {mounted && ( + + + + + + + {" "} + + + + + + )} + ); } diff --git a/src/pages/api/1inch/quote.ts b/src/pages/api/1inch/quote.ts index dd0dae6..d33a462 100644 --- a/src/pages/api/1inch/quote.ts +++ b/src/pages/api/1inch/quote.ts @@ -10,7 +10,7 @@ export default async function handler( const chainId = req.query.chainId; try { const response = await fetch( - `https://api.1inch.dev/swap/v5.2/${chainId}/quote?src=${src}&dst=${dst}&amount=${amount}`, + `https://api.1inch.dev/swap/v5.2/${chainId}/quote?src=${src}&dst=${dst}&amount=${amount}&includeProtocols=true&includeGas=true `, { method: "GET", headers: { diff --git a/src/pages/api/1inch/route.ts b/src/pages/api/1inch/route.ts index 40ef056..d482222 100644 --- a/src/pages/api/1inch/route.ts +++ b/src/pages/api/1inch/route.ts @@ -10,7 +10,7 @@ export default async function handler( const chainId = req.query.chainId; try { const response = await fetch( - `https://api.1inch.dev/swap/v5.2/${chainId}/quote?src=${src}&dst=${dst}&amount=${amount}&includeProtocols=true`, + `https://api.1inch.dev/swap/v5.2/${chainId}/quote?src=${src}&dst=${dst}&amount=${amount}`, { method: "GET", headers: {