Base Goerli (main) deployment support in UI (#102)

* Support multiple deployments per chain in UI * Update erc7412-related functions to support multi-deployments for same network * Lint harder
Synthetixio · Oct 24, 2023 · e897cfb · e897cfb
1 parent 9faa358
commit e897cfb
Show file tree

Hide file tree

Showing 42 changed files with 200 additions and 145 deletions.
diff --git a/liquidity/components/BorrowModal/BorrowModal.tsx b/liquidity/components/BorrowModal/BorrowModal.tsx
@@ -158,7 +158,7 @@ export const BorrowModal: React.FC<{
     try {
       await execBorrow();
       await queryClient.invalidateQueries({
-        queryKey: [network.name, 'LiquidityPosition'],
+        queryKey: [`${network.id}-${network.preset}`, 'LiquidityPosition'],
         exact: false,
       });
     } catch (error: any) {
@@ -178,7 +178,7 @@ export const BorrowModal: React.FC<{
       });
       throw Error('Borrow failed', { cause: error });
     }
-  }, [errorParserCoreProxy, execBorrow, queryClient, toast, network.name]);
+  }, [execBorrow, queryClient, network.id, network.preset, errorParserCoreProxy, toast]);
 
   const { txnStatus } = txnState;
   if (!params.poolId || !params.accountId || !collateralType) return null;

diff --git a/liquidity/components/DepositModal/DepositModal.tsx b/liquidity/components/DepositModal/DepositModal.tsx
@@ -320,18 +320,22 @@ export const DepositModal: DepositModalProps = ({
 
           await Promise.all([
             queryClient.invalidateQueries({
-              queryKey: [network.name, 'EthBalance'],
+              queryKey: [`${network.id}-${network.preset}`, 'EthBalance'],
+            }),
+            queryClient.invalidateQueries({
+              queryKey: [`${network.id}-${network.preset}`, 'LiquidityPosition'],
             }),
-            queryClient.invalidateQueries({ queryKey: [network.name, 'LiquidityPosition'] }),
             collateralType?.symbol === 'SNX'
-              ? queryClient.invalidateQueries({ queryKey: [network.name, 'TransferableSynthetix'] })
+              ? queryClient.invalidateQueries({
+                  queryKey: [`${network.id}-${network.preset}`, 'TransferableSynthetix'],
+                })
               : Promise.resolve(),
             queryClient.invalidateQueries({
-              queryKey: [network.name, 'Allowance'],
+              queryKey: [`${network.id}-${network.preset}`, 'Allowance'],
             }),
             !params.accountId
               ? queryClient.invalidateQueries({
-                  queryKey: [network.name, 'Accounts'],
+                  queryKey: [`${network.id}-${network.preset}`, 'Accounts'],
                 })
               : Promise.resolve(),
           ]);

diff --git a/liquidity/components/RepayModal/RepayModal.tsx b/liquidity/components/RepayModal/RepayModal.tsx
@@ -174,13 +174,13 @@ export const RepayModal: React.FC<{
 
           await Promise.all([
             queryClient.invalidateQueries({
-              queryKey: [network.name, 'TokenBalance'],
+              queryKey: [`${network.id}-${network.preset}`, 'TokenBalance'],
             }),
             queryClient.invalidateQueries({
-              queryKey: [network.name, 'Allowance'],
+              queryKey: [`${network.id}-${network.preset}`, 'Allowance'],
             }),
             queryClient.invalidateQueries({
-              queryKey: [network.name, 'LiquidityPosition'],
+              queryKey: [`${network.id}-${network.preset}`, 'LiquidityPosition'],
             }),
           ]);
 

diff --git a/liquidity/components/UndelegateModal/UndelegateModal.tsx b/liquidity/components/UndelegateModal/UndelegateModal.tsx
@@ -123,7 +123,7 @@ export const UndelegateModal: UndelegateModalProps = ({ onClose, isOpen, liquidi
         try {
           await execUndelegate();
           await queryClient.invalidateQueries({
-            queryKey: [network.name, 'LiquidityPosition'],
+            queryKey: [`${network.id}-${network.preset}`, 'LiquidityPosition'],
             exact: false,
           });
         } catch (error: any) {

diff --git a/liquidity/components/WithdrawModal/WithdrawModal.tsx b/liquidity/components/WithdrawModal/WithdrawModal.tsx
@@ -134,7 +134,7 @@ export function WithdrawModal({
         try {
           await execWithdraw();
           await queryClient.invalidateQueries({
-            queryKey: [network.name, 'AccountSpecificCollateral'],
+            queryKey: [`${network.id}-${network.preset}`, 'AccountSpecificCollateral'],
           });
         } catch (error: any) {
           const contractError = errorParserCoreProxy(error);

diff --git a/liquidity/cypress/cypress/support/e2e.js b/liquidity/cypress/cypress/support/e2e.js
@@ -24,13 +24,7 @@ beforeEach(() => {
   cy.on('window:before:load', async (win) => {
     const provider = new ethers.providers.JsonRpcProvider('http://127.0.0.1:8545');
     const network = await provider.getNetwork();
-    const networkName = {
-      1: 'mainnet',
-      10: 'optimism-mainnet',
-      5: 'goerli',
-      420: 'optimism-goerli',
-    }[network.chainId];
-    win.localStorage.setItem('DEFAULT_NETWORK', networkName);
+    win.localStorage.setItem('DEFAULT_NETWORK', `${network.chainId}-main`);
     win.localStorage.setItem('UNSAFE_IMPORT', 'true');
     win.localStorage.setItem('connectedWallets', '["MetaMask"]');
     win.localStorage.setItem('CONTRACT_ERROR_OPEN', 'true');

diff --git a/liquidity/lib/useAccountCollateral/useAccountCollateral.ts b/liquidity/lib/useAccountCollateral/useAccountCollateral.ts
@@ -70,7 +70,12 @@ export function useAccountCollateral({
   const tokenAddresses = collateralTypes.data?.map((c) => c.tokenAddress) ?? [];
 
   return useQuery({
-    queryKey: [network.name, { accountId }, 'AccountCollateral', { tokens: tokenAddresses }],
+    queryKey: [
+      `${network.id}-${network.preset}`,
+      'AccountCollateral',
+      { accountId },
+      { tokens: tokenAddresses },
+    ],
     enabled: Boolean(CoreProxy && accountId && tokenAddresses.length > 0),
     queryFn: async function () {
       if (!CoreProxy || !accountId || tokenAddresses.length < 1) {
@@ -81,7 +86,13 @@ export function useAccountCollateral({
         tokenAddresses,
         CoreProxy,
       });
-      const data = await erc7412Call(CoreProxy.provider, calls, decoder, 'useAccountCollateral');
+      const data = await erc7412Call(
+        network,
+        CoreProxy.provider,
+        calls,
+        decoder,
+        'useAccountCollateral'
+      );
 
       return data.map((x) => ({
         ...x,
@@ -97,7 +108,7 @@ export function useAccountSpecificCollateral(accountId?: string, collateralAddre
   const network = useNetwork();
   return useQuery({
     queryKey: [
-      network.name,
+      `${network.id}-${network.preset}`,
       'AccountSpecificCollateral',
       { accountId },
       { token: collateralAddress },
@@ -113,6 +124,7 @@ export function useAccountSpecificCollateral(accountId?: string, collateralAddre
         CoreProxy,
       });
       const data = await erc7412Call(
+        network,
         CoreProxy.provider,
         calls,
         decoder,

diff --git a/liquidity/lib/useAccountCollateralUnlockDate/useAccountCollateralUnlockDate.ts b/liquidity/lib/useAccountCollateralUnlockDate/useAccountCollateralUnlockDate.ts
@@ -8,7 +8,7 @@ export function useAccountCollateralUnlockDate({ accountId }: { accountId?: stri
   const network = useNetwork();
 
   return useQuery({
-    queryKey: [network.name, { accountId }, 'AccountCollateralUnlockDate'],
+    queryKey: [`${network.id}-${network.preset}`, 'AccountCollateralUnlockDate', { accountId }],
     enabled: Boolean(CoreProxy && accountId),
     queryFn: async function () {
       if (!CoreProxy || !accountId) throw 'OMG';

diff --git a/liquidity/lib/useAccountProxy/useAccountProxy.ts b/liquidity/lib/useAccountProxy/useAccountProxy.ts
@@ -11,7 +11,7 @@ export function useAccountProxy() {
   const withSigner = Boolean(signer);
 
   return useQuery({
-    queryKey: [network.name, 'AccountProxy', { withSigner }],
+    queryKey: [`${network.id}-${network.preset}`, 'AccountProxy', { withSigner }],
     queryFn: async function () {
       const { address, abi } = await importAccountProxy(network.id, network.preset);
       return new Contract(address, abi, signerOrProvider) as AccountProxyType;

diff --git a/liquidity/lib/useAccounts/useAccounts.ts b/liquidity/lib/useAccounts/useAccounts.ts
@@ -11,7 +11,7 @@ export function useAccounts() {
   const network = useNetwork();
 
   return useQuery({
-    queryKey: [network.name, 'Accounts', { accountAddress: wallet?.address }],
+    queryKey: [`${network.id}-${network.preset}`, 'Accounts', { accountAddress: wallet?.address }],
     queryFn: async function () {
       if (!AccountProxy || !wallet?.address) throw new Error('Should be disabled');
       const numberOfAccountTokens = await AccountProxy.balanceOf(wallet.address);

diff --git a/liquidity/lib/useAllCollateralPriceIds/useAllCollateralPriceIds.ts b/liquidity/lib/useAllCollateralPriceIds/useAllCollateralPriceIds.ts
@@ -6,7 +6,7 @@ import { z } from 'zod';
 import { notNil } from '@snx-v3/tsHelpers';
 import { useCoreProxy } from '@snx-v3/useCoreProxy';
 import { CoreProxyType } from '@synthetixio/v3-contracts';
-import { networksWithERC7412, useNetwork } from '@snx-v3/useBlockchain';
+import { deploymentsWithERC7412, useNetwork } from '@snx-v3/useBlockchain';
 import { ZodBigNumber } from '@snx-v3/zod';
 import { wei } from '@synthetixio/wei';
 
@@ -51,14 +51,14 @@ export const useAllCollateralPriceIds = () => {
     staleTime: Infinity,
     cacheTime: Infinity,
 
-    queryKey: [network.name, 'Collateral Price IDs'],
+    queryKey: [`${network.id}-${network.preset}`, 'Collateral Price IDs'],
 
     queryFn: async () => {
       if (!CoreProxy || !Multicall3 || !OracleProxy) {
         throw Error('useAllCollateralPriceIds should not be enabled ');
       }
 
-      if (!networksWithERC7412[network.name]) return [];
+      if (!deploymentsWithERC7412.includes(`${network.id}-${network.preset}`)) return [];
       const configs = await loadConfigs({ CoreProxy });
       const oracleNodeIds = configs.map((x) => x.oracleNodeId);
       const calls = oracleNodeIds.map((oracleNodeId) => ({

diff --git a/liquidity/lib/useAllowance/useAllowance.ts b/liquidity/lib/useAllowance/useAllowance.ts
@@ -19,7 +19,7 @@ export const useAllowance = ({
 
   return useQuery({
     queryKey: [
-      network.name,
+      `${network.id}-${network.preset}`,
       'Allowance',
       { accountAddress: wallet?.address },
       { contractAddress, spender },