Fix/UI issues (#432)

* feat: contracts update * fix: initial deposit UI * fix: negative c-ratio issue * fix: l1 multicall error
Synthetixio · Sep 2, 2024 · 0426444 · 0426444
1 parent 6afa966
commit 0426444
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 35 deletions.
diff --git a/contracts/importers/importMulticall3.js b/contracts/importers/importMulticall3.js
@@ -21,12 +21,18 @@ export async function importMulticall3(chainId, preset) {
   const deployment = `${Number(chainId).toFixed(0)}-${preset}`;
   switch (deployment) {
     case '1-main': {
-      const { mainnet } = await import('viem/chains');
-      return { address: mainnet.contracts.multicall3.address, abi: abi };
+      const [{ default: meta }, { default: abi }] = await Promise.all([
+        import('@synthetixio/v3-contracts/1-main/meta.json'),
+        import('@synthetixio/v3-contracts/1-main/TrustedMulticallForwarder.readable.json'),
+      ]);
+      return { address: meta.contracts.TrustedMulticallForwarder, abi };
     }
     case '11155111-main': {
-      const { sepolia } = await import('viem/chains');
-      return { address: sepolia.contracts.multicall3.address, abi: abi };
+      const [{ default: meta }, { default: abi }] = await Promise.all([
+        import('@synthetixio/v3-contracts/11155111-main/meta.json'),
+        import('@synthetixio/v3-contracts/11155111-main/TrustedMulticallForwarder.readable.json'),
+      ]);
+      return { address: meta.contracts.TrustedMulticallForwarder, abi };
     }
     case '10-main': {
       const { optimism } = await import('viem/chains');

diff --git a/liquidity/lib/withERC7412/withERC7412.ts b/liquidity/lib/withERC7412/withERC7412.ts
@@ -4,7 +4,7 @@ import { EvmPriceServiceConnection } from '@pythnetwork/pyth-evm-js';
 import { z } from 'zod';
 import { ZodBigNumber } from '@snx-v3/zod';
 import { offchainMainnetEndpoint, offchainTestnetEndpoint } from '@snx-v3/constants';
-import { deploymentsWithERC7412, Network } from '@snx-v3/useBlockchain';
+import { Network } from '@snx-v3/useBlockchain';
 import type { Modify } from '@snx-v3/tsHelpers';
 import { importCoreProxy, importMulticall3, importAllErrors } from '@snx-v3/contracts';
 import { withMemoryCache } from './withMemoryCache';
@@ -129,7 +129,7 @@ function makeMulticall(
 
 // This should be used for networks that doesn't have a multicall setup as a trusted forwarder
 // TODO remove when all networks have a trusted forwarder
-const makeCoreProxyMulticall = (
+export const makeCoreProxyMulticall = (
   calls: TransactionRequest[],
   senderAddr: string,
   coreProxyAddress: string,
@@ -198,7 +198,7 @@ const parseError = async (error: any, provider: providers.JsonRpcProvider, netwo
 // simulate w/ wETH contract because it will have eth balance
 // This is useful when we do read/static calls but still need an balance for the price update
 // TODO: this probably need to be network aware, maybe look into a different solution even.
-const getDefaultFromAddress = (chainName: string) => {
+export const getDefaultFromAddress = (chainName: string) => {
   switch (chainName) {
     case 'cannon':
       return '0x4200000000000000000000000000000000000006'; // TODO, unclear what to put here
@@ -247,12 +247,12 @@ export const withERC7412 = async (
 
   // If from is set to the default address (wETH) we can assume it's a read rather than a write
   const isRead = from === getDefaultFromAddress(network.name);
-  const networkHaveERC7412 = deploymentsWithERC7412.includes(`${network.id}-${network.preset}`);
-  const useCoreProxy = !networkHaveERC7412 && !isRead;
+  // const networkHaveERC7412 = deploymentsWithERC7412.includes(`${network.id}-${network.preset}`);
 
-  const { address: multicallAddress, abi: multiCallAbi } = useCoreProxy
-    ? await importCoreProxy(network.id, network.preset)
-    : await importMulticall3(network.id, network.preset);
+  const { address: multicallAddress, abi: multiCallAbi } = await importMulticall3(
+    network.id,
+    network.preset
+  );
 
   while (true) {
     try {
@@ -292,10 +292,7 @@ export const withERC7412 = async (
       }
       // If we're here it means we now added a tx to do .
       // Some networks doesn't have ERC7412 and a trusted forwarder setup, on write calls we still need to use the coreproxy for those
-      const multicallTxn = useCoreProxy
-        ? makeCoreProxyMulticall(multicallCalls, from, multicallAddress, multiCallAbi)
-        : makeMulticall(multicallCalls, from, multicallAddress, multiCallAbi);
-
+      const multicallTxn = makeMulticall(multicallCalls, from, multicallAddress, multiCallAbi);
       const gasLimit = await jsonRpcProvider.estimateGas(multicallTxn);
 
       console.log(

diff --git a/liquidity/ui/src/components/CRatioBar/CRatioBar.utils.ts b/liquidity/ui/src/components/CRatioBar/CRatioBar.utils.ts
@@ -10,7 +10,7 @@ export const getHealthVariant = ({
   if (!liquidationCratio || !targetCratio || !cRatio) {
     return 'success';
   }
-  if (cRatio === 0) {
+  if (cRatio <= 0) {
     return 'success';
   }
   if (cRatio < liquidationCratio) {
@@ -22,7 +22,7 @@ export const getHealthVariant = ({
   return 'success';
 };
 
-export const ratioIsMaxUInt = (ratio: number) => ratio >= Number.MAX_SAFE_INTEGER;
+export const ratioIsMaxUInt = (ratio: number) => ratio >= Number.MAX_SAFE_INTEGER || ratio < 0;
 
 export const getProgressSize = ({
   targetCratio,

diff --git a/liquidity/ui/src/components/Manage/DebtStats.tsx b/liquidity/ui/src/components/Manage/DebtStats.tsx
@@ -10,6 +10,7 @@ import { ZEROWEI } from '../../utils/constants';
 import { ChangeStat } from './ChangeStat';
 import { isBaseAndromeda } from '@snx-v3/isBaseAndromeda';
 import { useNetwork } from '@snx-v3/useBlockchain';
+import { DebtAmount } from '../Positions/PositionsTable/DebtAmount';
 
 export const DebtStats: FC<{
   liquidityPosition?: LiquidityPosition;
@@ -62,13 +63,7 @@ export const DebtStats: FC<{
             <ChangeStat
               value={liquidityPosition.debt}
               newValue={newDebt}
-              formatFn={(val: Wei) =>
-                currency(val, {
-                  currency: 'USD',
-                  style: 'currency',
-                  maximumFractionDigits: 4,
-                })
-              }
+              formatFn={(val: Wei) => <DebtAmount debt={val} />}
               hasChanges={hasChanges}
               dataTestId="manage-stats-debt-value"
             />

diff --git a/liquidity/ui/src/components/Positions/PositionsTable/DebtAmount.tsx b/liquidity/ui/src/components/Positions/PositionsTable/DebtAmount.tsx
@@ -1,23 +1,18 @@
-import { Text } from '@chakra-ui/react';
+import { Text, TextProps } from '@chakra-ui/react';
 import { Amount } from '@snx-v3/Amount';
 import Wei from '@synthetixio/wei';
 import { FC } from 'react';
 
-interface Props {
+interface Props extends TextProps {
   debt: Wei;
   showPNL?: boolean;
 }
 
-export const DebtAmount: FC<Props> = ({ debt, showPNL }) => {
+export const DebtAmount: FC<Props> = ({ debt, showPNL, ...props }) => {
   const amount = showPNL ? debt.mul(-1) : debt;
 
   return (
-    <Text
-      color={debt.eq(0) ? 'white.500' : debt.lt(0) ? 'green.500' : 'red.500'}
-      lineHeight="1.25rem"
-      fontFamily="heading"
-      fontSize="sm"
-    >
+    <Text {...props} color={debt.eq(0) ? 'white.500' : debt.lt(0) ? 'green.500' : 'red.500'}>
       <Amount prefix={`${amount.gte(0) ? '' : '-'}$`} value={amount.abs()} />
     </Text>
   );

diff --git a/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx b/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx
@@ -150,7 +150,13 @@ export function PositionRow({
 
       <Td border="none">
         <Flex flexDirection="column" alignItems="flex-end">
-          <DebtAmount debt={debt} showPNL={isBase} />
+          <DebtAmount
+            debt={debt}
+            showPNL={isBase}
+            lineHeight="1.25rem"
+            fontFamily="heading"
+            fontSize="sm"
+          />
           <Collapse in={!debt.eq(0)}>
             <Text
               color="cyan.500"