Escrowed SNX on V3

liquidity/cypress/cypress/e2e/8453-andromeda/USDC_Withdraw.e2e.js

@@ -10,7 +10,7 @@ describe(__filename, () => {
     cy.task('startAnvil', {
       chainId: Cypress.env('chainId'),
       forkUrl: `https://base-mainnet.infura.io/v3/${Cypress.env('INFURA_KEY')}`,
-      block: '24030036',
+      block: '24043002',
     }).then(() => cy.log('Anvil started'));
     cy.pythBypass();
     cy.on('window:before:load', (win) => {
@@ -26,9 +26,6 @@ describe(__filename, () => {
   it(__filename, () => {
     cy.setEthBalance({ balance: 100 });
     cy.getUSDC({ amount: 1000 });
-    // Reduce delegation to 150
-    cy.delegateCollateralAndromeda({ symbol: 'sUSDC', amount: 150, poolId: 1 });
-    // Remove withdrawals delay
     cy.setWithdrawTimeout({ timeout: '0' });
 
     cy.visit(

liquidity/lib/ChangeStat/ChangeStat.tsx

@@ -50,6 +50,7 @@ export function ChangeStat({
       data-cy={dataCy}
     >
       <Text
+        as="div"
         data-cy="change stats current"
         textAlign="center"
         opacity={value && value.eq(0) ? '70%' : undefined}
@@ -61,6 +62,7 @@ export function ChangeStat({
         <Flex gap="1" alignItems="center" isTruncated>
           <ArrowForwardIcon />
           <Text
+            as="div"
             data-cy="change stats new"
             textAlign="center"
             opacity={newValue.eq(0) ? '70%' : undefined}

liquidity/lib/DebtAmount/DebtAmount.tsx

@@ -18,15 +18,15 @@ export function getDebtColor(debt?: Wei) {
 
 export function PnlAmount({ debt, ...props }: TextProps & { debt?: Wei }) {
   return (
-    <Text {...props} color={getDebtColor(debt)}>
+    <Text as="span" {...props} color={getDebtColor(debt)}>
       <Amount prefix={`${debt && debt.gt(0) ? '-' : ''}$`} value={debt ? debt.abs() : ZEROWEI} />
     </Text>
   );
 }
 
 export function DebtAmount({ debt, ...props }: TextProps & { debt?: Wei }) {
   return (
-    <Text {...props} color={getDebtColor(debt)}>
+    <Text as="span" {...props} color={getDebtColor(debt)}>
       <Amount prefix={`${debt && debt.lt(0) ? '-' : ''}$`} value={debt ? debt.abs() : ZEROWEI} />
     </Text>
   );

liquidity/lib/useLiquidityPosition/useLiquidityPosition.ts

@@ -22,6 +22,9 @@ export type LiquidityPositionType = {
   collateralValue: Wei;
   debt: Wei;
   cRatio: Wei;
+  totalDeposited: Wei;
+  totalAssigned: Wei;
+  totalLocked: Wei;
 };
 
 export const useLiquidityPosition = ({
@@ -71,17 +74,19 @@ export const useLiquidityPosition = ({
       );
       const getCollateralPriceCallPromised =
         CoreProxyContract.populateTransaction.getCollateralPrice(collateralType.tokenAddress);
-      const getAccountAvailableCollateralCallPromised =
-        CoreProxyContract.populateTransaction.getAccountAvailableCollateral(
+
+      const getAccountCollateralCallPromised =
+        CoreProxyContract.populateTransaction.getAccountCollateral(
           accountId,
           collateralType.tokenAddress
         );
+
       const calls = await Promise.all([
         getAccountAvailableSystemTokenCallPromised,
         getPositionCollateralCallPromised,
         getPositionDebtCallPromised,
         getCollateralPriceCallPromised,
-        getAccountAvailableCollateralCallPromised,
+        getAccountCollateralCallPromised,
       ]);
 
       return await erc7412Call(
@@ -119,13 +124,20 @@ export const useLiquidityPosition = ({
           );
           log('collateralPriceRaw', collateralPriceRaw);
 
-          const [accountAvailableCollateral] = CoreProxyContract.interface.decodeFunctionResult(
-            'getAccountAvailableCollateral',
-            encoded[1 + 3]
-          );
-          log('accountAvailableCollateral', accountAvailableCollateral);
+          const [totalDepositedBigNumber, totalAssignedBigNumber, totalLockedBigNumber] =
+            CoreProxyContract.interface.decodeFunctionResult(
+              'getAccountCollateral',
+              encoded[1 + 3]
+            );
+
+          const totalDeposited = wei(totalDepositedBigNumber);
+          const totalAssigned = wei(totalAssignedBigNumber);
+          const totalLocked = wei(totalLockedBigNumber);
+          log('totalDeposited', totalDeposited);
+          log('totalAssigned', totalAssigned);
+          log('totalLocked', totalLocked);
 
-          const availableCollateral = wei(accountAvailableCollateral);
+          const availableCollateral = wei(totalDeposited.sub(totalAssigned).sub(totalLocked));
           const availableSystemToken = wei(accountAvailableSystemToken);
 
           const collateralPrice = wei(collateralPriceRaw);
@@ -143,6 +155,9 @@ export const useLiquidityPosition = ({
             collateralValue,
             debt,
             cRatio,
+            totalDeposited,
+            totalAssigned,
+            totalLocked,
           };
 
           log('liquidityPosition', liquidityPosition);

liquidity/lib/useLiquidityPositions/useLiquidityPositions.ts

@@ -18,7 +18,7 @@ export const useLiquidityPositions = ({ accountId }: { accountId?: string }) =>
   const { data: CoreProxy } = useCoreProxy();
   const { data: collateralTypes } = useCollateralTypes();
   const { network } = useNetwork();
-  const provider = useProviderForChain(network!);
+  const provider = useProviderForChain(network);
   const { data: systemToken } = useSystemToken();
 
   const queryClient = useQueryClient();
@@ -63,8 +63,8 @@ export const useLiquidityPositions = ({ accountId }: { accountId?: string }) =>
       const getCollateralPriceCallsPromised = collateralTypes.map((collateralType) =>
         CoreProxyContract.populateTransaction.getCollateralPrice(collateralType.tokenAddress)
       );
-      const getAccountAvailableCollateralCallsPromised = collateralTypes.map((collateralType) =>
-        CoreProxyContract.populateTransaction.getAccountAvailableCollateral(
+      const getAccountCollateralCallPromised = collateralTypes.map((collateralType) =>
+        CoreProxyContract.populateTransaction.getAccountCollateral(
           accountId,
           collateralType.tokenAddress
         )
@@ -74,7 +74,7 @@ export const useLiquidityPositions = ({ accountId }: { accountId?: string }) =>
         ...getPositionCollateralCallsPromised,
         ...getPositionDebtCallsPromised,
         ...getCollateralPriceCallsPromised,
-        ...getAccountAvailableCollateralCallsPromised,
+        ...getAccountCollateralCallPromised,
       ]);
 
       return await erc7412Call(
@@ -107,20 +107,27 @@ export const useLiquidityPositions = ({ accountId }: { accountId?: string }) =>
               encoded[1 + 2 * collateralTypes.length + i]
             );
 
-            const [accountAvailableCollateral] = CoreProxyContract.interface.decodeFunctionResult(
-              'getAccountAvailableCollateral',
-              encoded[1 + 3 * collateralTypes.length + i]
-            );
+            const [totalDepositedBigNumber, totalAssignedBigNumber, totalLockedBigNumber] =
+              CoreProxyContract.interface.decodeFunctionResult(
+                'getAccountCollateral',
+                encoded[1 + 3 * collateralTypes.length + i]
+              );
+
+            const totalDeposited = wei(totalDepositedBigNumber);
+            const totalAssigned = wei(totalAssignedBigNumber);
+            const totalLocked = wei(totalLockedBigNumber);
 
             log({
               collateralType,
               positionCollateral,
               positionDebt,
               collateralPriceRaw,
-              accountAvailableCollateral,
+              totalDeposited,
+              totalAssigned,
+              totalLocked,
             });
 
-            const availableCollateral = wei(accountAvailableCollateral);
+            const availableCollateral = wei(totalDeposited.sub(totalAssigned).sub(totalLocked));
             const availableSystemToken = wei(accountAvailableSystemToken);
 
             const collateralPrice = wei(collateralPriceRaw);
@@ -138,6 +145,9 @@ export const useLiquidityPositions = ({ accountId }: { accountId?: string }) =>
               collateralValue,
               debt,
               cRatio,
+              totalDeposited,
+              totalAssigned,
+              totalLocked,
             };
           });
           log(liquidityPositions);

liquidity/lib/useLocks/index.ts

@@ -0,0 +1 @@
+export * from './useLocks';

liquidity/lib/useLocks/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "@snx-v3/useLocks",
+  "private": true,
+  "main": "index.ts",
+  "version": "0.0.2",
+  "dependencies": {
+    "@snx-v3/tsHelpers": "workspace:*",
+    "@snx-v3/useBlockchain": "workspace:*",
+    "@snx-v3/useCoreProxy": "workspace:*",
+    "@tanstack/react-query": "^5.8.3",
+    "ethers": "^5.7.2",
+    "react": "^18.2.0"
+  }
+}

liquidity/lib/useLocks/useLocks.ts

@@ -0,0 +1,37 @@
+import { contractsHash } from '@snx-v3/tsHelpers';
+import { Network, useNetwork, useProviderForChain } from '@snx-v3/useBlockchain';
+import { useCoreProxy } from '@snx-v3/useCoreProxy';
+import { useQuery } from '@tanstack/react-query';
+import { BigNumber, ethers } from 'ethers';
+
+export function useLocks(accountId?: string, collateralType?: string, customNetwork?: Network) {
+  const { network } = useNetwork();
+  const targetNetwork = customNetwork || network;
+  const { data: CoreProxy } = useCoreProxy(targetNetwork);
+  const provider = useProviderForChain(targetNetwork);
+
+  return useQuery({
+    enabled: Boolean(provider && CoreProxy),
+    queryKey: [
+      `${targetNetwork?.id}-${targetNetwork?.preset}`,
+      'Locks',
+      { contractsHash: contractsHash([CoreProxy]), accountId, collateralType },
+    ],
+    queryFn: async () => {
+      if (!(provider && CoreProxy && accountId && collateralType)) throw 'OMFG';
+
+      const CoreProxyContract = new ethers.Contract(CoreProxy.address, CoreProxy.abi, provider);
+
+      const locks: {
+        amountD18: BigNumber;
+        lockExpirationTime: BigNumber;
+      }[] = await CoreProxyContract.getLocks(accountId, collateralType, 0, 100);
+
+      return locks.map((lock) => ({
+        timestamp: lock.lockExpirationTime,
+        expirationDate: new Date(lock.lockExpirationTime.toNumber() * 1000),
+        amount: lock.amountD18,
+      }));
+    },
+  });
+}

liquidity/lib/useParams/useParams.ts

@@ -49,6 +49,7 @@ export const ManageActionSchema = z.union([
   z.literal('withdraw'),
   z.literal('withdraw-debt'),
   z.literal('close'),
+  z.literal('locked'),
 ]);
 export type ManageActionType = z.infer<typeof ManageActionSchema>;
 

liquidity/ui/package.json

@@ -38,7 +38,6 @@
     "@snx-v3/icons": "workspace:*",
     "@snx-v3/isBaseAndromeda": "workspace:*",
     "@snx-v3/theme": "workspace:*",
-    "@snx-v3/useAccountCollateral": "workspace:*",
     "@snx-v3/useAccountCollateralUnlockDate": "workspace:*",
     "@snx-v3/useAccountPermissions": "workspace:*",
     "@snx-v3/useAccountProxy": "workspace:*",
@@ -65,6 +64,7 @@
     "@snx-v3/useLiquidityPosition": "workspace:*",
     "@snx-v3/useLiquidityPositions": "workspace:*",
     "@snx-v3/useLocalStorage": "workspace:*",
+    "@snx-v3/useLocks": "workspace:*",
     "@snx-v3/useManagePermissions": "workspace:*",
     "@snx-v3/useMigrate": "workspace:*",
     "@snx-v3/useMigrateUSD": "workspace:*",
@@ -110,6 +110,7 @@
     "@web3-onboard/react": "^2.10.0",
     "@web3-onboard/trezor": "^2.4.6",
     "@web3-onboard/walletconnect": "^2.6.1",
+    "date-fns": "^2.30.0",
     "debug": "^4.3.7",
     "ethers": "^5.7.2",
     "framer-motion": "^10.16.5",

liquidity/ui/src/components/Manage/CollateralStats.tsx

@@ -1,13 +1,12 @@
-import { Flex, Text } from '@chakra-ui/react';
+import { Flex, Link, Text } from '@chakra-ui/react';
 import { Amount } from '@snx-v3/Amount';
 import { BorderBox } from '@snx-v3/BorderBox';
 import { ChangeStat } from '@snx-v3/ChangeStat';
 import { ZEROWEI } from '@snx-v3/constants';
 import { currency } from '@snx-v3/format';
-import { useAccountCollateral } from '@snx-v3/useAccountCollateral';
 import { useCollateralType } from '@snx-v3/useCollateralTypes';
 import { useLiquidityPosition } from '@snx-v3/useLiquidityPosition';
-import { type PositionPageSchemaType, useParams } from '@snx-v3/useParams';
+import { makeSearch, type PositionPageSchemaType, useParams } from '@snx-v3/useParams';
 import { type Wei } from '@synthetixio/wei';
 
 export function CollateralStats({
@@ -17,16 +16,12 @@ export function CollateralStats({
   newCollateralAmount: Wei;
   hasChanges: boolean;
 }) {
-  const [params] = useParams<PositionPageSchemaType>();
+  const [params, setParams] = useParams<PositionPageSchemaType>();
   const { data: collateralType } = useCollateralType(params.collateralSymbol);
   const { data: liquidityPosition, isPending: isPendingLiquidityPosition } = useLiquidityPosition({
     accountId: params.accountId,
     collateralType,
   });
-  const { data: accountCollateral } = useAccountCollateral({
-    accountId: params.accountId,
-    tokenAddress: collateralType?.address,
-  });
 
   return (
     <BorderBox maxW={['100%', '50%']} p={4} flex="1" flexDirection="row" bg="navy.700">
@@ -74,26 +69,36 @@ export function CollateralStats({
           </Flex>
         </Flex>
 
-        {accountCollateral?.totalLocked.gt(0) && (
-          <Flex mt={4} alignItems="center" gap={3}>
+        {liquidityPosition ? (
+          <Flex mt={4} alignItems="center" gap={2} alignContent="center">
             <Text color="gray.500" fontSize="sm" fontFamily="heading" lineHeight="16px">
               Escrowed
             </Text>
-            <Text
+            <Link
               color="white"
               fontSize="sm"
               fontFamily="heading"
               lineHeight="16px"
               fontWeight={700}
+              ml={1}
+              href={`?${makeSearch({
+                ...params,
+                page: 'position',
+                manageAction: 'locked',
+              })}`}
+              onClick={(e) => {
+                e.preventDefault();
+                setParams({ ...params, page: 'position', manageAction: 'locked' });
+              }}
             >
               <Amount
-                value={accountCollateral.totalLocked}
+                value={liquidityPosition.totalLocked}
                 suffix={` ${collateralType?.displaySymbol}`}
                 showTooltip
               />
-            </Text>
+            </Link>
           </Flex>
-        )}
+        ) : null}
       </Flex>
     </BorderBox>
   );

liquidity/ui/src/components/Manage/PnlStats.tsx

@@ -41,7 +41,7 @@ export function PnlStats({ newDebt, hasChanges }: { newDebt: Wei; hasChanges: bo
             value={liquidityPosition?.debt.mul(-1)}
             isPending={Boolean(params.accountId && isPendingLiquidityPosition)}
             newValue={newDebt.mul(-1)}
-            formatFn={(val?: Wei) => <PnlAmount debt={val ? val.mul(-1) : val} as="span" />}
+            formatFn={(val?: Wei) => <PnlAmount debt={val ? val.mul(-1) : val} />}
             hasChanges={hasChanges}
             data-cy="stats pnl"
           />