with force gassless

Uniswap · Aug 24, 2023 · b56f37e · b56f37e
1 parent 473d5ca
commit b56f37e
Show file tree

Hide file tree

Showing 4 changed files with 248 additions and 15 deletions.
diff --git a/web3-react/package.json b/web3-react/package.json
@@ -5,6 +5,7 @@
   "dependencies": {
     "@coinbase/wallet-sdk": "3.3.0",
     "@ethersproject/bignumber": "^5.7.0",
+    "@ethersproject/contracts": "^5.7.0",
     "@walletconnect/ethereum-provider": "1.8",
     "@web3-react/coinbase-wallet": "^8.2.0",
     "@web3-react/core": "^8.2.0",

diff --git a/web3-react/src/example/Example.tsx b/web3-react/src/example/Example.tsx
@@ -33,12 +33,17 @@ const useOnBlockUpdated = (callback: (blockNumber: number) => void) => {
 }
 
 // Parameters
-const API_KEY = ''
-const API_URL = 'https://beta.api.uniswap.org/v2/trade'
+const LOCAL_API_KEY = ''
+const BETA_API_KEY = ''
+const API_KEY = BETA_API_KEY
+
+const LOCAL_API_URL = ''
+const BETA_API_URL = 'https://beta.api.uniswap.org/v2/trade'
+const API_URL = BETA_API_URL
+
 const headers = {
   'x-api-key': API_KEY,
 }
-const forceGasless = false
 
 // UI
 const Example = () => {
@@ -67,7 +72,7 @@ const Example = () => {
     }
   })
 
-  const onPerformAction = async (tokenIn: string, tokenOut: string, amount: string) => {
+  const onPerformAction = async (tokenIn: string, tokenOut: string, amount: string, forceGasless: string) => {
     if (!provider) {
       console.error('Error: No provider')
       return
@@ -101,7 +106,7 @@ const Example = () => {
         tokenOut,
         amount,
         swapper: await signer.getAddress(),
-        forceGasless,
+        forceGasless: !!forceGasless,
       },
       {
         headers,
@@ -122,7 +127,7 @@ const Example = () => {
         {
           signature,
           quote,
-          permitData,
+          permitData: permitData ?? undefined,
         },
         {
           headers,
@@ -146,6 +151,7 @@ const Example = () => {
   const [tokenIn, setTokenIn] = useState('')
   const [tokenOut, setTokenOut] = useState('')
   const [amount, setAmount] = useState('')
+  const [forceGasless, setForceGasless] = useState('')
 
   return (
     <div className="App">
@@ -193,19 +199,23 @@ const Example = () => {
               onChange={(event) => setAmount(event.target.value)}
             />
           </label>
+          <p />
+          <label>
+            ForceGasless:
+            <p />
+            <input
+              style={{ width: 400 }}
+              type="text"
+              value={forceGasless}
+              onChange={(event) => setForceGasless(event.target.value)}
+            />
+          </label>
         </form>
-        {/* {Object.keys(CHAIN_INFO).map((chainId) => (
-          <div key={chainId}>
-            <button onClick={() => switchNetwork(parseInt(chainId), connectionType)}>
-              {`Switch to ${CHAIN_INFO[chainId].label}`}
-            </button>
-          </div>
-        ))} */}
         <div>
           <button
             disabled={tokenIn === '0' || tokenOut === '0' || amount === '0'}
             onClick={() => {
-              onPerformAction(tokenIn, tokenOut, amount)
+              onPerformAction(tokenIn, tokenOut, amount, forceGasless)
             }}
           >
             Trade

diff --git a/web3-react/src/example/abi.json b/web3-react/src/example/abi.json
@@ -0,0 +1,222 @@
+[
+    {
+        "constant": true,
+        "inputs": [],
+        "name": "name",
+        "outputs": [
+            {
+                "name": "",
+                "type": "string"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "constant": false,
+        "inputs": [
+            {
+                "name": "_spender",
+                "type": "address"
+            },
+            {
+                "name": "_value",
+                "type": "uint256"
+            }
+        ],
+        "name": "approve",
+        "outputs": [
+            {
+                "name": "",
+                "type": "bool"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "nonpayable",
+        "type": "function"
+    },
+    {
+        "constant": true,
+        "inputs": [],
+        "name": "totalSupply",
+        "outputs": [
+            {
+                "name": "",
+                "type": "uint256"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "constant": false,
+        "inputs": [
+            {
+                "name": "_from",
+                "type": "address"
+            },
+            {
+                "name": "_to",
+                "type": "address"
+            },
+            {
+                "name": "_value",
+                "type": "uint256"
+            }
+        ],
+        "name": "transferFrom",
+        "outputs": [
+            {
+                "name": "",
+                "type": "bool"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "nonpayable",
+        "type": "function"
+    },
+    {
+        "constant": true,
+        "inputs": [],
+        "name": "decimals",
+        "outputs": [
+            {
+                "name": "",
+                "type": "uint8"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "constant": true,
+        "inputs": [
+            {
+                "name": "_owner",
+                "type": "address"
+            }
+        ],
+        "name": "balanceOf",
+        "outputs": [
+            {
+                "name": "balance",
+                "type": "uint256"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "constant": true,
+        "inputs": [],
+        "name": "symbol",
+        "outputs": [
+            {
+                "name": "",
+                "type": "string"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "constant": false,
+        "inputs": [
+            {
+                "name": "_to",
+                "type": "address"
+            },
+            {
+                "name": "_value",
+                "type": "uint256"
+            }
+        ],
+        "name": "transfer",
+        "outputs": [
+            {
+                "name": "",
+                "type": "bool"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "nonpayable",
+        "type": "function"
+    },
+    {
+        "constant": true,
+        "inputs": [
+            {
+                "name": "_owner",
+                "type": "address"
+            },
+            {
+                "name": "_spender",
+                "type": "address"
+            }
+        ],
+        "name": "allowance",
+        "outputs": [
+            {
+                "name": "",
+                "type": "uint256"
+            }
+        ],
+        "payable": false,
+        "stateMutability": "view",
+        "type": "function"
+    },
+    {
+        "payable": true,
+        "stateMutability": "payable",
+        "type": "fallback"
+    },
+    {
+        "anonymous": false,
+        "inputs": [
+            {
+                "indexed": true,
+                "name": "owner",
+                "type": "address"
+            },
+            {
+                "indexed": true,
+                "name": "spender",
+                "type": "address"
+            },
+            {
+                "indexed": false,
+                "name": "value",
+                "type": "uint256"
+            }
+        ],
+        "name": "Approval",
+        "type": "event"
+    },
+    {
+        "anonymous": false,
+        "inputs": [
+            {
+                "indexed": true,
+                "name": "from",
+                "type": "address"
+            },
+            {
+                "indexed": true,
+                "name": "to",
+                "type": "address"
+            },
+            {
+                "indexed": false,
+                "name": "value",
+                "type": "uint256"
+            }
+        ],
+        "name": "Transfer",
+        "type": "event"
+    }
+]
diff --git a/web3-react/yarn.lock b/web3-react/yarn.lock
@@ -1322,7 +1322,7 @@
   dependencies:
     "@ethersproject/bignumber" "^5.7.0"
 
-"@ethersproject/[email protected]":
+"@ethersproject/[email protected]", "@ethersproject/contracts@^5.7.0":
   version "5.7.0"
   resolved "https://registry.yarnpkg.com/@ethersproject/contracts/-/contracts-5.7.0.tgz#c305e775abd07e48aa590e1a877ed5c316f8bd1e"
   integrity sha512-5GJbzEU3X+d33CdfPhcyS+z8MzsTrBGk/sc+G+59+tPa9yFkl6HQ9D6L0QMgNTA9q8dT0XKxxkyp883XsQvbbg==