diff --git a/liquidity/components/Pools/VaultRow.tsx b/liquidity/components/Pools/VaultRow.tsx
index 904cf59de..0c1a9ec71 100644
--- a/liquidity/components/Pools/VaultRow.tsx
+++ b/liquidity/components/Pools/VaultRow.tsx
@@ -5,12 +5,12 @@ import { generatePath, Link, useLocation } from 'react-router-dom';
import { useConnectWallet } from '@web3-onboard/react';
import { CollateralType } from '@snx-v3/useCollateralTypes';
import { useIsConnected, useNetwork } from '@snx-v3/useBlockchain';
-import { CollateralIcon } from '@snx-v3/icons';
import { wei } from '@synthetixio/wei';
import { calculateCRatio } from '@snx-v3/calculations';
import { LiquidityPositionType } from '@snx-v3/useLiquidityPositions';
import { isBaseAndromeda } from '@snx-v3/isBaseAndromeda';
import { Tooltip } from '@snx-v3/Tooltip';
+import { TokenIcon } from '../../ui/src/components';
function VaultRowUi({
collateralType,
@@ -39,7 +39,7 @@ function VaultRowUi({
-
+
{liquidityPosition?.collateralValue.gt(0) ? (
diff --git a/liquidity/components/Pools/package.json b/liquidity/components/Pools/package.json
index b09415301..fb02f39c1 100644
--- a/liquidity/components/Pools/package.json
+++ b/liquidity/components/Pools/package.json
@@ -10,7 +10,6 @@
"@snx-v3/Tooltip": "workspace:*",
"@snx-v3/calculations": "workspace:*",
"@snx-v3/formatters": "workspace:*",
- "@snx-v3/icons": "workspace:*",
"@snx-v3/isBaseAndromeda": "workspace:*",
"@snx-v3/useBlockchain": "workspace:*",
"@snx-v3/useCollateralTypes": "workspace:*",
diff --git a/liquidity/components/icons/BitcoinIcon/BitcoinIcon.tsx b/liquidity/components/icons/BitcoinIcon/BitcoinIcon.tsx
index b06f57f0c..1545c17a4 100644
--- a/liquidity/components/icons/BitcoinIcon/BitcoinIcon.tsx
+++ b/liquidity/components/icons/BitcoinIcon/BitcoinIcon.tsx
@@ -4,7 +4,7 @@ interface BitcoinIconProps extends IconProps {
fill?: string;
}
-export const BitcoinIcon = ({ width = '42px', height = '42px' }: BitcoinIconProps) => {
+export const BitcoinIcon = ({ width = '24px', height = '24px' }: BitcoinIconProps) => {
return (
diff --git a/liquidity/components/icons/CollateralIcon/CollateralIcon.tsx b/liquidity/components/icons/CollateralIcon/CollateralIcon.tsx
index 454239573..0c39fb7f9 100644
--- a/liquidity/components/icons/CollateralIcon/CollateralIcon.tsx
+++ b/liquidity/components/icons/CollateralIcon/CollateralIcon.tsx
@@ -30,6 +30,7 @@ export const CollateralIcon = ({
return ;
case 'USDx':
case 'sUSD':
+ case 'USDe':
case 'snxUSD':
return ;
case 'WBTC':
@@ -47,7 +48,7 @@ export const CollateralIcon = ({
}
};
-export const UnknownIcon = ({ width = '32px', height = '32px', ...props }: IconProps) => {
+export const UnknownIcon = ({ width = '24px', height = '24px', ...props }: IconProps) => {
return (
diff --git a/liquidity/components/icons/DollarCircle/DollarCircle.tsx b/liquidity/components/icons/DollarCircle/DollarCircle.tsx
index 435ffa7c8..ded6e107d 100644
--- a/liquidity/components/icons/DollarCircle/DollarCircle.tsx
+++ b/liquidity/components/icons/DollarCircle/DollarCircle.tsx
@@ -4,7 +4,7 @@ interface DollarCircleProps extends IconProps {
fill?: string;
}
-export const DollarCircle = ({ width = '15px', height = '15px', ...props }: DollarCircleProps) => {
+export const DollarCircle = ({ width = '24px', height = '24px', ...props }: DollarCircleProps) => {
return (
{
+export const SUSDCIcon = ({ width = '24px', height = '24px' }: IconProps) => {
return (
diff --git a/liquidity/ui/src/components/Deposit/Deposit.tsx b/liquidity/ui/src/components/Deposit/Deposit.tsx
index ac1c558fd..bbc821969 100644
--- a/liquidity/ui/src/components/Deposit/Deposit.tsx
+++ b/liquidity/ui/src/components/Deposit/Deposit.tsx
@@ -1,7 +1,6 @@
import { Button, Flex, Text } from '@chakra-ui/react';
import { Amount } from '@snx-v3/Amount';
import { BorderBox } from '@snx-v3/BorderBox';
-import { CollateralIcon } from '@snx-v3/icons';
import { ManagePositionContext } from '@snx-v3/ManagePositionContext';
import { NumberInput } from '@snx-v3/NumberInput';
import { PercentBadges } from '@snx-v3/PercentBadges';
@@ -12,7 +11,7 @@ import { FC, useContext, useMemo, useState } from 'react';
import { useParams } from '@snx-v3/useParams';
import { AccountCollateralType } from '@snx-v3/useAccountCollateral';
import { useTransferableSynthetix } from '@snx-v3/useTransferableSynthetix';
-import { CollateralAlert } from '../';
+import { CollateralAlert, TokenIcon } from '../';
import { useTokenBalance } from '@snx-v3/useTokenBalance';
import { LiquidityPosition } from '@snx-v3/useLiquidityPosition';
import { useNetwork } from '@snx-v3/useBlockchain';
@@ -71,7 +70,7 @@ export const DepositUi: FC<{
-
+
{displaySymbol}
diff --git a/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx b/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx
index ab8bc4a93..ee5693269 100644
--- a/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx
+++ b/liquidity/ui/src/components/Positions/PositionsTable/PositionsRow.tsx
@@ -40,7 +40,11 @@ export function PositionRow({
collateralTypeAddress: collateralType.tokenAddress,
});
- const parsedCRatio = collateralType.issuanceRatioD18.gt(cRatio) ? 'MANAGE' : 'HEALTHY';
+ const parsedCRatio = cRatio.eq(0)
+ ? 'N/A'
+ : collateralType.issuanceRatioD18.gt(cRatio)
+ ? 'MANAGE'
+ : 'HEALTHY';
return (
@@ -145,15 +149,17 @@ export function PositionRow({
- {(cRatio.toNumber() * 100).toFixed(2) + '%'}
+ {debt.gt(0) ? (cRatio.toNumber() * 100).toFixed(2) + '%' : 'Infinite'}
-
- {parsedCRatio}
-
+ {parsedCRatio !== 'N/A' && (
+
+ {parsedCRatio}
+
+ )}
diff --git a/liquidity/ui/src/components/Undelegate/Undelegate.tsx b/liquidity/ui/src/components/Undelegate/Undelegate.tsx
index c537bd12e..77758c578 100644
--- a/liquidity/ui/src/components/Undelegate/Undelegate.tsx
+++ b/liquidity/ui/src/components/Undelegate/Undelegate.tsx
@@ -10,7 +10,6 @@ import {
} from '@chakra-ui/react';
import { Amount } from '@snx-v3/Amount';
import { BorderBox } from '@snx-v3/BorderBox';
-import { CollateralIcon } from '@snx-v3/icons';
import { ManagePositionContext } from '@snx-v3/ManagePositionContext';
import { NumberInput } from '@snx-v3/NumberInput';
import { useCollateralType } from '@snx-v3/useCollateralTypes';
@@ -22,6 +21,7 @@ import React, { FC, useContext } from 'react';
import { useParams } from '@snx-v3/useParams';
import { isBaseAndromeda } from '@snx-v3/isBaseAndromeda';
import { useNetwork } from '@snx-v3/useBlockchain';
+import { TokenIcon } from '../TokenIcon';
export const UndelegateUi: FC<{
collateralChange: Wei;
@@ -73,7 +73,7 @@ export const UndelegateUi: FC<{
-
+
{displaySymbol}
diff --git a/liquidity/ui/src/pages/Manage.tsx b/liquidity/ui/src/pages/Manage.tsx
index c7c1298dc..ca363b7ae 100644
--- a/liquidity/ui/src/pages/Manage.tsx
+++ b/liquidity/ui/src/pages/Manage.tsx
@@ -3,8 +3,7 @@ import { Box, Divider, Flex, Heading, Link, Text } from '@chakra-ui/react';
import { BorderBox } from '@snx-v3/BorderBox';
import { useParams } from '@snx-v3/useParams';
import { CollateralType, useCollateralType } from '@snx-v3/useCollateralTypes';
-import { CollateralIcon } from '@snx-v3/icons';
-import { AccountBanner, ManageAction } from '../components';
+import { AccountBanner, ManageAction, TokenIcon } from '../components';
import { ManagePositionProvider } from '@snx-v3/ManagePositionContext';
import { ManageStats } from '../components';
import { HomeLink } from '@snx-v3/HomeLink';
@@ -72,10 +71,10 @@ export const ManageUi: FC<{
borderRadius="100%"
display="flex"
>
-
diff --git a/yarn.lock b/yarn.lock
index 4650fabfb..b0e1537a1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5423,7 +5423,6 @@ __metadata:
"@snx-v3/Tooltip": "workspace:*"
"@snx-v3/calculations": "workspace:*"
"@snx-v3/formatters": "workspace:*"
- "@snx-v3/icons": "workspace:*"
"@snx-v3/isBaseAndromeda": "workspace:*"
"@snx-v3/useBlockchain": "workspace:*"
"@snx-v3/useCollateralTypes": "workspace:*"
|