From 0625d6d0e63c51cda57950e5199088120d83bc8e Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 10:45:17 +0100 Subject: [PATCH 01/22] Exchange.js imports --- packages/react-app/src/components/Exchange.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/components/Exchange.js b/packages/react-app/src/components/Exchange.js index 54e4e9e..878120b 100644 --- a/packages/react-app/src/components/Exchange.js +++ b/packages/react-app/src/components/Exchange.js @@ -1,4 +1,11 @@ -import React from 'react'; +import React, { useEffect, useState } from "react"; +import { Contract } from "@ethersproject/contracts"; +import { abis } from "@my-app/contracts"; +import { ERC20, useContractFunction, useEthers, useTokenAllowance, useTokenBalance } from "@usedapp/core"; +import { ethers } from "ethers"; +import { parseUnits } from "ethers/lib/utils"; + +import { ROUTER_ADDRESS } from "../config"; const Exchange = () => { return ( From d10a352efb11f97bc11310755fe2b174836c20f2 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 10:48:53 +0100 Subject: [PATCH 02/22] added provider URL from CRANQ --- packages/react-app/src/config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-app/src/config.js b/packages/react-app/src/config.js index c8e7975..5b0b6cd 100644 --- a/packages/react-app/src/config.js +++ b/packages/react-app/src/config.js @@ -5,6 +5,6 @@ export const ROUTER_ADDRESS = "[YOUR ADDRESS HERE]"; export const DAPP_CONFIG = { readOnlyChainId: Goerli.chainId, readOnlyUrls: { - [Goerli.chainId]: "[YOUR URL HERE]", + [Goerli.chainId]: "https://eth-goerli.g.alchemy.com/v2/HTekLlXug0hrSWhUk6dumCafQztJPTQy", }, }; \ No newline at end of file From d339403c319b573ab5d4ca1f6acbc904a6a8ca5b Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 10:57:27 +0100 Subject: [PATCH 03/22] usePools --- packages/react-app/src/App.js | 1 + packages/react-app/src/hooks/usePools.js | 0 2 files changed, 1 insertion(+) create mode 100644 packages/react-app/src/hooks/usePools.js diff --git a/packages/react-app/src/App.js b/packages/react-app/src/App.js index a850337..5ecb46e 100644 --- a/packages/react-app/src/App.js +++ b/packages/react-app/src/App.js @@ -1,6 +1,7 @@ import React from "react" import { useEthers } from "@usedapp/core"; +import { usePools } from "./hooks"; import styles from './styles'; import { fhtLogo } from './assets'; import { Exchange, Loader, WalletButton } from "./components"; diff --git a/packages/react-app/src/hooks/usePools.js b/packages/react-app/src/hooks/usePools.js new file mode 100644 index 0000000..e69de29 From 77a1320ff0712236bea2403793fc59d8002808d4 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:00:07 +0100 Subject: [PATCH 04/22] hooks --- packages/react-app/src/hooks/index.js | 1 + packages/react-app/src/hooks/usePools.js | 12 ++++++++++++ 2 files changed, 13 insertions(+) create mode 100644 packages/react-app/src/hooks/index.js diff --git a/packages/react-app/src/hooks/index.js b/packages/react-app/src/hooks/index.js new file mode 100644 index 0000000..18d9202 --- /dev/null +++ b/packages/react-app/src/hooks/index.js @@ -0,0 +1 @@ +export { usePools } from "./usePools"; diff --git a/packages/react-app/src/hooks/usePools.js b/packages/react-app/src/hooks/usePools.js index e69de29..35481a7 100644 --- a/packages/react-app/src/hooks/usePools.js +++ b/packages/react-app/src/hooks/usePools.js @@ -0,0 +1,12 @@ +import Web3 from "web3"; //one of the most popular packages when interacting with smart contracts +import { useEffect, useState } from "react"; +import { useConfig } from "@usedapp/core"; + +import { ROUTER_ADDRESS } from "../config"; + +export const usePools = () => { + const { readOnlyChainId, readOnlyUrls } = useConfig(); +} + + + From 00cd76219c91c038814ccdaef543c12d8da4ed43 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:03:05 +0100 Subject: [PATCH 05/22] Update usePools.js --- packages/react-app/src/hooks/usePools.js | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/hooks/usePools.js b/packages/react-app/src/hooks/usePools.js index 35481a7..bc3ae20 100644 --- a/packages/react-app/src/hooks/usePools.js +++ b/packages/react-app/src/hooks/usePools.js @@ -1,11 +1,27 @@ -import Web3 from "web3"; //one of the most popular packages when interacting with smart contracts +import Web3 from "web3"; //one of the most popular packages when interacting with smart contracts import { useEffect, useState } from "react"; import { useConfig } from "@usedapp/core"; import { ROUTER_ADDRESS } from "../config"; +export const loadPools = async (providerUrl) => { //fetch liquidity pool + const provider = new Web3.providers.HttpProvider(providerUrl); + +} export const usePools = () => { const { readOnlyChainId, readOnlyUrls } = useConfig(); + const [loading, setLoading] = useState(true); + const [pools, setPools] = useState({}); + + useEffect(() => { + loadPools(readOnlyUrls[readOnlyChainId]) + .then((pools) => { //callback function / asynchronous + setPools(pools); + setLoading(false); + }); + }, [readOnlyUrls, readOnlyChainId]); //dependency array + + return [loading, pools]; } From b6b846a7afe7dc02cc832ebecf7469a4ed247637 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:05:25 +0100 Subject: [PATCH 06/22] utils - helper files added --- packages/react-app/src/utils/getFactoryInfo.js | 0 packages/react-app/src/utils/getPairsInfo.js | 0 packages/react-app/src/utils/getRouterInfo.js | 0 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 packages/react-app/src/utils/getFactoryInfo.js create mode 100644 packages/react-app/src/utils/getPairsInfo.js create mode 100644 packages/react-app/src/utils/getRouterInfo.js diff --git a/packages/react-app/src/utils/getFactoryInfo.js b/packages/react-app/src/utils/getFactoryInfo.js new file mode 100644 index 0000000..e69de29 diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js new file mode 100644 index 0000000..e69de29 diff --git a/packages/react-app/src/utils/getRouterInfo.js b/packages/react-app/src/utils/getRouterInfo.js new file mode 100644 index 0000000..e69de29 From 2dc912293ef6cf36b6468b9758915b922ab497d7 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:07:11 +0100 Subject: [PATCH 07/22] Update index.js updated with util files - exports --- packages/react-app/src/utils/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/utils/index.js b/packages/react-app/src/utils/index.js index a244b2f..a16c563 100644 --- a/packages/react-app/src/utils/index.js +++ b/packages/react-app/src/utils/index.js @@ -1,4 +1,8 @@ -export { +export { getFactoryInfo } from "./getFactoryInfo"; +export { getPairsInfo } from "./getPairsInfo"; +export { getRouterInfo } from "./getRouterInfo"; + +export { getAvailableTokens, getCounterpartTokens, findPoolByTokens, From c0a2b8b15d2a2b32bd4c62443b931a037e557409 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:37:13 +0100 Subject: [PATCH 08/22] Update getRouterInfo.js --- packages/react-app/src/utils/getRouterInfo.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/react-app/src/utils/getRouterInfo.js b/packages/react-app/src/utils/getRouterInfo.js index e69de29..e7db21a 100644 --- a/packages/react-app/src/utils/getRouterInfo.js +++ b/packages/react-app/src/utils/getRouterInfo.js @@ -0,0 +1,9 @@ +import { abis } from "@my-app/contracts"; + +export const getRouterInfo = async (routerAddress, web3) => { + const router = new web3.eth.Contract(abis.router02, routerAddress); + + return { + factory: await router.methods.factory().call(), + }; +} From 1a203532c1c5bd81bd8886f3059c584e4deff48b Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:38:58 +0100 Subject: [PATCH 09/22] Update getFactoryInfo.js --- packages/react-app/src/utils/getFactoryInfo.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/react-app/src/utils/getFactoryInfo.js b/packages/react-app/src/utils/getFactoryInfo.js index e69de29..9ae5e0b 100644 --- a/packages/react-app/src/utils/getFactoryInfo.js +++ b/packages/react-app/src/utils/getFactoryInfo.js @@ -0,0 +1,6 @@ +import { abis } from "@my-app/contracts"; +import { getPairsInfo } from "./getPairsInfo"; + +export const getFactoryInfo = async (factoryAddress, web3) => { + +} \ No newline at end of file From c7dd0cc6664ae107fd4c5eb4d79bf9659e718dfb Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:39:02 +0100 Subject: [PATCH 10/22] Update usePools.js --- packages/react-app/src/hooks/usePools.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/react-app/src/hooks/usePools.js b/packages/react-app/src/hooks/usePools.js index bc3ae20..b44d354 100644 --- a/packages/react-app/src/hooks/usePools.js +++ b/packages/react-app/src/hooks/usePools.js @@ -3,10 +3,15 @@ import { useEffect, useState } from "react"; import { useConfig } from "@usedapp/core"; import { ROUTER_ADDRESS } from "../config"; +import { getFactoryInfo, getRouterInfo } from "../utils"; export const loadPools = async (providerUrl) => { //fetch liquidity pool const provider = new Web3.providers.HttpProvider(providerUrl); + const web3 = new Web3(provider); + const routerInfo = await getRouterInfo(ROUTER_ADDRESS, web3); + const factoryInfo = await getFactoryInfo(routerInfo.factory, web3); + return factoryInfo.pairsInfo; } export const usePools = () => { const { readOnlyChainId, readOnlyUrls } = useConfig(); From 72625511cbdeef5bf676345bd903ccd7c121df55 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:40:27 +0100 Subject: [PATCH 11/22] Update getFactoryInfo.js --- packages/react-app/src/utils/getFactoryInfo.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/utils/getFactoryInfo.js b/packages/react-app/src/utils/getFactoryInfo.js index 9ae5e0b..81d0531 100644 --- a/packages/react-app/src/utils/getFactoryInfo.js +++ b/packages/react-app/src/utils/getFactoryInfo.js @@ -2,5 +2,14 @@ import { abis } from "@my-app/contracts"; import { getPairsInfo } from "./getPairsInfo"; export const getFactoryInfo = async (factoryAddress, web3) => { - + const factory = new web3.eth.Contract(abis.factory, factoryAddress); + + const factoryInfo = { + feeTo: null, + feeToSetter: null, + allPairsLength: null, + allPairs: [], + }; + + } \ No newline at end of file From 18782460de54809e9cfa192e93764e78ca354d53 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:40:51 +0100 Subject: [PATCH 12/22] Update getFactoryInfo.js --- packages/react-app/src/utils/getFactoryInfo.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/react-app/src/utils/getFactoryInfo.js b/packages/react-app/src/utils/getFactoryInfo.js index 81d0531..4736412 100644 --- a/packages/react-app/src/utils/getFactoryInfo.js +++ b/packages/react-app/src/utils/getFactoryInfo.js @@ -5,11 +5,14 @@ export const getFactoryInfo = async (factoryAddress, web3) => { const factory = new web3.eth.Contract(abis.factory, factoryAddress); const factoryInfo = { - feeTo: null, - feeToSetter: null, - allPairsLength: null, + feeTo: await factory.methods.feeTo().call(), + feeToSetter: await factory.methods.feeToSetter().call(), + allPairsLength: await factory.methods.allPairsLength().call(), allPairs: [], }; + for (let i = 0; i < factoryInfo.allPairsLength; i++) { + factoryInfo.allPairs[i] = await factory.methods.allPairs(i).call(); + } } \ No newline at end of file From 78a08162710006218b98f2ecc51842d90fe9fc64 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:42:57 +0100 Subject: [PATCH 13/22] Update getFactoryInfo.js --- packages/react-app/src/utils/getFactoryInfo.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-app/src/utils/getFactoryInfo.js b/packages/react-app/src/utils/getFactoryInfo.js index 4736412..1f3a698 100644 --- a/packages/react-app/src/utils/getFactoryInfo.js +++ b/packages/react-app/src/utils/getFactoryInfo.js @@ -15,4 +15,7 @@ export const getFactoryInfo = async (factoryAddress, web3) => { factoryInfo.allPairs[i] = await factory.methods.allPairs(i).call(); } + factoryInfo.pairsInfo = await getPairsInfo(factoryInfo.allPairs, web3); + + return factoryInfo; } \ No newline at end of file From f5cecab1d80b42208d06acad533fab969896a96e Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:43:40 +0100 Subject: [PATCH 14/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index e69de29..f1741a6 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -0,0 +1,5 @@ +import { abis } from "@my-app/contracts"; + +export async function getPairsInfo(pairAddresses, web3) { + +} \ No newline at end of file From 9f4b695ff2e7afffd2dc494972dc93a0508831a0 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:44:09 +0100 Subject: [PATCH 15/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index f1741a6..e91907c 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -1,5 +1,12 @@ import { abis } from "@my-app/contracts"; export async function getPairsInfo(pairAddresses, web3) { - + const pairsInfo = []; + const pairABI = abis.pair; + const tokenABI = abis.erc20.abi; + + for (let i = 0; i < pairAddresses.length; ++i) { + + } + } \ No newline at end of file From 8928bd0576d1bbb1bd1d05d352c53be99e86cebc Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:44:36 +0100 Subject: [PATCH 16/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index e91907c..2b6dc34 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -6,6 +6,8 @@ export async function getPairsInfo(pairAddresses, web3) { const tokenABI = abis.erc20.abi; for (let i = 0; i < pairAddresses.length; ++i) { + const pairAddress = pairAddresses[i]; + const pair = new web3.eth.Contract(pairABI, pairAddresses[i]); } From a69c6190eedb8bab11999d01b6c08e982bc168b5 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:46:59 +0100 Subject: [PATCH 17/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index 2b6dc34..57cda45 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -8,7 +8,14 @@ export async function getPairsInfo(pairAddresses, web3) { for (let i = 0; i < pairAddresses.length; ++i) { const pairAddress = pairAddresses[i]; const pair = new web3.eth.Contract(pairABI, pairAddresses[i]); - + + const token0Address = await pair.methods.token0().call(); //get contract + const token1Address = await pair.methods.token1().call(); + const token0Contract = new web3.eth.Contract(tokenABI, token0Address); //get contract address + const token1Contract = new web3.eth.Contract(tokenABI, token1Address); + const token0Name = await token0Contract.methods.name().call(); //get contract address name + const token1Name = await token1Contract.methods.name().call(); + } } \ No newline at end of file From 257c7aa5c5df37ef734b6b08efb2c5efca7077a3 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:47:29 +0100 Subject: [PATCH 18/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index 57cda45..34f102d 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -16,6 +16,13 @@ export async function getPairsInfo(pairAddresses, web3) { const token0Name = await token0Contract.methods.name().call(); //get contract address name const token1Name = await token1Contract.methods.name().call(); + pairsInfo.push({ //pass eerything we need to pairsInfo Array + address: pairAddress, + token0Address, + token1Address, + token0Name, + token1Name + }); } } \ No newline at end of file From 02dcd4eb8a730efad097f90c6ee5d70610781f25 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:48:28 +0100 Subject: [PATCH 19/22] Update getPairsInfo.js --- packages/react-app/src/utils/getPairsInfo.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-app/src/utils/getPairsInfo.js b/packages/react-app/src/utils/getPairsInfo.js index 34f102d..11c2b60 100644 --- a/packages/react-app/src/utils/getPairsInfo.js +++ b/packages/react-app/src/utils/getPairsInfo.js @@ -24,5 +24,5 @@ export async function getPairsInfo(pairAddresses, web3) { token1Name }); } - + return pairsInfo; } \ No newline at end of file From 9d0aa5b74af5197bcd9dd02c6caaf38a65900e7b Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:50:12 +0100 Subject: [PATCH 20/22] Update usePools.js --- packages/react-app/src/hooks/usePools.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-app/src/hooks/usePools.js b/packages/react-app/src/hooks/usePools.js index b44d354..37e3617 100644 --- a/packages/react-app/src/hooks/usePools.js +++ b/packages/react-app/src/hooks/usePools.js @@ -8,7 +8,6 @@ import { getFactoryInfo, getRouterInfo } from "../utils"; export const loadPools = async (providerUrl) => { //fetch liquidity pool const provider = new Web3.providers.HttpProvider(providerUrl); const web3 = new Web3(provider); - const routerInfo = await getRouterInfo(ROUTER_ADDRESS, web3); const factoryInfo = await getFactoryInfo(routerInfo.factory, web3); return factoryInfo.pairsInfo; From e167461ab982a53bbbda9d57ddfd87866ed2ee14 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:51:50 +0100 Subject: [PATCH 21/22] Update App.js --- packages/react-app/src/App.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-app/src/App.js b/packages/react-app/src/App.js index 5ecb46e..42d47f3 100644 --- a/packages/react-app/src/App.js +++ b/packages/react-app/src/App.js @@ -9,7 +9,7 @@ import { Exchange, Loader, WalletButton } from "./components"; const App = () => { const { account } = useEthers(); - const poolsLoading = false; + const [poolsLoading, pools] = usePools(); return (
@@ -29,9 +29,9 @@ const App = () => {
{account ? ( - poolsLoading ? ( + loading ? ( - ) : + ) : ) : }
From 16ba492aa0657afc77666a6d48b9055034d3028d Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 5 Nov 2022 11:55:06 +0100 Subject: [PATCH 22/22] Update Exchange.js add pools --- packages/react-app/src/components/Exchange.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-app/src/components/Exchange.js b/packages/react-app/src/components/Exchange.js index 878120b..07da0ba 100644 --- a/packages/react-app/src/components/Exchange.js +++ b/packages/react-app/src/components/Exchange.js @@ -7,7 +7,7 @@ import { parseUnits } from "ethers/lib/utils"; import { ROUTER_ADDRESS } from "../config"; -const Exchange = () => { +const Exchange = ({ pools }) => { return (
Exchange
)