v3.0.8 (#1749)

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Patricie <99055449+Patricie29@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Patricie29 <patricie@marsprotocol.foundation>
Co-authored-by: Monkmansteve <sxatzakis@yahoo.gr>
Co-authored-by: Monkmansteve <47855432+StefChatz@users.noreply.github.com>

Author: 4 people

src/components/borrow/Table/Columns/BorrowButton.tsx

@@ -1,4 +1,4 @@
-import { useCallback } from 'react'
+import { useCallback, useMemo } from 'react'
 
 import ActionButton from 'components/common/Button/ActionButton'
 import { Plus } from 'components/common/Icons'
@@ -22,6 +22,23 @@ export default function BorrowButton(props: Props) {
   const address = useStore((s) => s.address)
   const hasNoDeposits = !account?.deposits?.length && !account?.lends?.length
 
+  const isUSDC = useMemo(
+    () => props.data.asset?.symbol?.toUpperCase().includes('USDC'),
+    [props.data.asset?.symbol],
+  )
+
+  const isDisabled = hasNoDeposits || isUSDC
+
+  const tooltipContent = useMemo(() => {
+    if (isUSDC) {
+      return 'USDC borrowing is temporarily disabled.'
+    }
+    if (hasNoDeposits) {
+      return `You don't have any collateral. Please first deposit into your Credit Account before borrowing.`
+    }
+    return null
+  }, [isUSDC, hasNoDeposits])
+
   const borrowHandler = useCallback(() => {
     if (!props.data.asset) return null
     useStore.setState({ borrowModal: { asset: props.data.asset, marketData: props.data } })
@@ -30,14 +47,11 @@ export default function BorrowButton(props: Props) {
   return (
     <div className='flex justify-end'>
       <ConditionalWrapper
-        condition={hasNoDeposits && !!address}
+        condition={isDisabled && !!address}
         wrapper={(children) => (
           <Tooltip
             type='warning'
-            content={
-              <Text size='sm'>{`You don’t have any collateral.
-             Please first deposit into your Credit Account before borrowing.`}</Text>
-            }
+            content={<Text size='sm'>{tooltipContent}</Text>}
             contentClassName='max-w-[200px]'
             className='ml-auto'
           >
@@ -47,7 +61,7 @@ export default function BorrowButton(props: Props) {
       >
         <ActionButton
           leftIcon={<Plus />}
-          disabled={hasNoDeposits}
+          disabled={isDisabled}
           color='tertiary'
           onClick={(e) => {
             borrowHandler()

src/components/borrow/Table/Columns/Manage.tsx

@@ -17,6 +17,11 @@ interface Props {
 export default function Manage(props: Props) {
   const address = useStore((s) => s.address)
 
+  const isUSDC = useMemo(
+    () => props.data.asset?.symbol?.toUpperCase().includes('USDC'),
+    [props.data.asset?.symbol],
+  )
+
   const borrowHandler = useCallback(() => {
     if (!props.data.asset) return null
     useStore.setState({ borrowModal: { asset: props.data.asset, marketData: props.data } })
@@ -30,6 +35,7 @@ export default function Manage(props: Props) {
   }, [props.data])
 
   const isDeprecatedAsset = props.data.asset.isDeprecated
+  const isBorrowDisabled = isDeprecatedAsset || isUSDC
 
   const ITEMS: DropDownItem[] = useMemo(
     () => [
@@ -38,20 +44,24 @@ export default function Manage(props: Props) {
         text: 'Repay',
         onClick: repayHandler,
       },
-      {
-        icon: <Plus />,
-        text: 'Borrow more',
-        onClick: borrowHandler,
-      },
+      ...(!isUSDC
+        ? [
+            {
+              icon: <Plus />,
+              text: 'Borrow more',
+              onClick: borrowHandler,
+            },
+          ]
+        : []),
     ],
-    [borrowHandler, repayHandler],
+    [borrowHandler, repayHandler, isUSDC],
   )
 
   if (!address) return null
 
   return (
     <div className='z-10 flex justify-end'>
-      {isDeprecatedAsset ? (
+      {isBorrowDisabled ? (
         <ActionButton
           leftIcon={<HandCoins />}
           color='tertiary'

src/components/perps/Module/PerpsModule.tsx

@@ -272,27 +272,30 @@ export function PerpsModule() {
   ])
 
   const renderDeprecatedMarketContent = () => (
-    <>
-      <div className='flex flex-col gap-2'>
-        <Text size='sm' uppercase>
+    <div className='flex flex-col gap-6'>
+      <div className='flex flex-col gap-4'>
+        <Text size='lg' uppercase className='font-bold'>
           Disabled Market
         </Text>
-        <Text size='xs'>
+        <Text size='sm' className='text-white/70'>
           The selected market is currently disabled, and opening new positions is unavailable.
         </Text>
-        <Text size='xs'>
-          You have an active position in this market. To manage your exposure, you may still close
-          your existing position by using the button below.
-        </Text>
-        <Text size='xs'>Click the button below to close your position.</Text>
-      </div>
-      <div className='flex flex-col gap-2'>
-        <ActionButton text='Close Position' onClick={closePosition} />
-        <Callout type={CalloutType.INFO}>
-          Please note: no new positions can be opened until the market is re-enabled.
-        </Callout>
+        {currentPerpPosition && (
+          <Text size='sm' className='text-white/70'>
+            You have an active position in this market. To manage your exposure, you may still close
+            your existing position by using the button below.
+          </Text>
+        )}
       </div>
-    </>
+      {currentPerpPosition && (
+        <div className='flex flex-col gap-4'>
+          <ActionButton text='Close Position' onClick={closePosition} color='secondary' />
+        </div>
+      )}
+      <Callout type={CalloutType.INFO}>
+        No new positions can be opened until the market is re-enabled.
+      </Callout>
+    </div>
   )
 
   const renderPriceInputs = () => (

src/components/v1/Table/borrowings/Columns/BorrowButton.tsx

@@ -1,3 +1,5 @@
+import { useMemo } from 'react'
+
 import ActionButton from 'components/common/Button/ActionButton'
 import { Plus } from 'components/common/Icons'
 import Text from 'components/common/Text'
@@ -15,16 +17,31 @@ export default function BorrowButton(props: Props) {
 
   const hasCollateral = account?.lends?.length ?? 0 > 0
 
+  const isUSDC = useMemo(
+    () => props.data.asset?.symbol?.toUpperCase().includes('USDC'),
+    [props.data.asset?.symbol],
+  )
+
+  const isDisabled = !hasCollateral || isUSDC
+
+  const tooltipContent = useMemo(() => {
+    if (isUSDC) {
+      return 'USDC borrowing is temporarily disabled.'
+    }
+    if (!hasCollateral) {
+      return `You don't have assets deposited in the Red Bank. Please deposit assets before you borrow.`
+    }
+    return null
+  }, [isUSDC, hasCollateral])
+
   return (
     <div className='flex justify-end'>
       <ConditionalWrapper
-        condition={!hasCollateral && !!address}
+        condition={isDisabled && !!address}
         wrapper={(children) => (
           <Tooltip
             type='warning'
-            content={
-              <Text size='sm'>{`You don’t have assets deposited in the Red Bank. Please deposit assets before you borrow.`}</Text>
-            }
+            content={<Text size='sm'>{tooltipContent}</Text>}
             contentClassName='max-w-[200px]'
             className='ml-auto'
           >
@@ -34,7 +51,7 @@ export default function BorrowButton(props: Props) {
       >
         <ActionButton
           leftIcon={<Plus />}
-          disabled={!hasCollateral}
+          disabled={isDisabled}
           color='tertiary'
           onClick={(e) => {
             useStore.setState({

src/components/v1/Table/borrowings/Columns/Manage.tsx

@@ -15,6 +15,11 @@ export default function Manage(props: Props) {
   const { data: balances } = useWalletBalances(address)
   const hasBalance = !!balances.find(byDenom(props.data.asset.denom))
 
+  const isUSDC = useMemo(
+    () => props.data.asset?.symbol?.toUpperCase().includes('USDC'),
+    [props.data.asset?.symbol],
+  )
+
   const ITEMS: DropDownItem[] = useMemo(
     () => [
       {
@@ -24,6 +29,8 @@ export default function Manage(props: Props) {
           useStore.setState({
             v1BorrowAndRepayModal: { type: 'borrow', data: props.data },
           }),
+        disabled: isUSDC,
+        disabledTooltip: isUSDC ? 'USDC borrowing is temporarily disabled.' : undefined,
       },
       {
         icon: <HandCoins />,
@@ -33,10 +40,10 @@ export default function Manage(props: Props) {
             v1BorrowAndRepayModal: { type: 'repay', data: props.data },
           }),
         disabled: !hasBalance,
-        disabledTooltip: `You don’t have any ${props.data.asset.symbol} in your Wallet.`,
+        disabledTooltip: `You don't have any ${props.data.asset.symbol} in your Wallet.`,
       },
     ],
-    [hasBalance, props.data],
+    [hasBalance, props.data, isUSDC],
   )
 
   return (