From 10835d346ef9e5c94ad1bc55b89130bb37a3b2ad Mon Sep 17 00:00:00 2001
From: Spacebean <wndgud00@gmail.com>
Date: Mon, 21 Oct 2024 23:46:50 -0400
Subject: [PATCH] feat: update deposits table

---
 .../components/Silo/Token/DepositsTable.tsx   | 30 +++++++++++--------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/projects/ui/src/components/Silo/Token/DepositsTable.tsx b/projects/ui/src/components/Silo/Token/DepositsTable.tsx
index 75c42170c..70a023f21 100644
--- a/projects/ui/src/components/Silo/Token/DepositsTable.tsx
+++ b/projects/ui/src/components/Silo/Token/DepositsTable.tsx
@@ -30,10 +30,9 @@ import {
 } from '~/components/App/muiTheme';
 import Row from '~/components/Common/Row';
 import AddressIcon from '~/components/Common/AddressIcon';
-import NorthEastIcon from '@mui/icons-material/NorthEast';
 import { useAppSelector } from '~/state';
 import { minimizeWindowIcon } from '~/img/icon';
-import { Link } from 'react-router-dom';
+import { useResolvedChainId } from '~/hooks/chain/useChainId';
 import useSdk from '~/hooks/sdk';
 import {
   TokenDepositsContextType,
@@ -255,7 +254,9 @@ const SingleTokenDepositDialogContent = ({
   account: string;
   setSlug: TokenDepositsContextType['setSlug'];
 }) => {
+  const chainId = useResolvedChainId();
   const sdk = useSdk();
+
   return (
     <Stack p={2} gap={2} width="100%" maxWidth={{ xs: '100%', md: '491px' }}>
       {/* Deposit */}
@@ -339,20 +340,18 @@ const SingleTokenDepositDialogContent = ({
         </Row>
       </Row>
       <Row
-        direction={{ xs: 'column', sm: 'row' }}
+        direction={{ xs: 'column', md: 'row' }}
         gap={1}
         justifyContent="space-between"
-        sx={(t) => ({
+        sx={{
           button: {
-            [t.breakpoints.down('sm')]: {
-              width: '100%',
-            },
+            width: '100%',
             'img, svg': {
               height: '16px',
               width: 'auto',
             },
           },
-        })}
+        }}
       >
         <Button
           variant="outlined-secondary"
@@ -372,22 +371,27 @@ const SingleTokenDepositDialogContent = ({
         >
           Update Deposit
         </Button>
-        <Button
+        {/**
+         * Keeping this for now. This doesn't work b/c OpenSea hasn't
+         * indexed the events
+         */}
+        {/* <Button
           variant="outlined-secondary"
           color="secondary"
           size="small"
           endIcon={<NorthEastIcon />}
-          LinkComponent={Link}
           onClick={() => {
             window.open(
-              `https://arbiscan.io/1155/${row.id.toHexString()}`,
+              `https://opensea.io/assets/${
+                chainId === SupportedChainId.ARBITRUM_MAINNET ? 'arbitrum/' : ''
+              }${sdk.contracts.beanstalk.address}/${row.id.toString()}`,
               '_blank',
               'noopener,noreferrer'
             );
           }}
         >
-          View on Arbiscan
-        </Button>
+          View on OpenSea
+        </Button> */}
       </Row>
     </Stack>
   );