From dc9d02225cbba81aecfdeb8f467ac05e6f03d5f0 Mon Sep 17 00:00:00 2001
From: Usame Algan <5880855+usame-algan@users.noreply.github.com>
Date: Mon, 13 Nov 2023 00:39:37 +0100
Subject: [PATCH] fix: Hydration error on the NFTs page (#2788)

---
 cypress/e2e/smoke/balances.cy.js               |  1 +
 cypress/e2e/smoke/nfts.cy.js                   |  2 +-
 src/components/dashboard/Overview/Overview.tsx |  2 +-
 src/components/nfts/NftGrid/index.tsx          |  2 +-
 src/components/nfts/config.ts                  | 10 +++++++++-
 5 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/cypress/e2e/smoke/balances.cy.js b/cypress/e2e/smoke/balances.cy.js
index 0b1da92302..9638173827 100644
--- a/cypress/e2e/smoke/balances.cy.js
+++ b/cypress/e2e/smoke/balances.cy.js
@@ -16,6 +16,7 @@ describe('Balance tests', () => {
     cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
     main.acceptCookies()
     cy.contains('Assets')
+    balances.selectTokenList(balances.tokenListOptions.default)
     cy.get(balances.balanceSingleRow).should('have.length.lessThan', ASSETS_LENGTH)
     balances.selectTokenList(balances.tokenListOptions.allTokens)
     cy.get(balances.balanceSingleRow).should('have.length', ASSETS_LENGTH)
diff --git a/cypress/e2e/smoke/nfts.cy.js b/cypress/e2e/smoke/nfts.cy.js
index 1ecc5c1c20..01680d3f72 100644
--- a/cypress/e2e/smoke/nfts.cy.js
+++ b/cypress/e2e/smoke/nfts.cy.js
@@ -9,7 +9,7 @@ const nftsTokenID = 'CF'
 describe('NFTs tests', () => {
   beforeEach(() => {
     cy.clearLocalStorage()
-    cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
+    cy.visit(constants.balanceNftsUrl + constants.SEPOLIA_TEST_SAFE_5)
     main.acceptCookies()
     nfts.clickOnNftsTab()
   })
diff --git a/src/components/dashboard/Overview/Overview.tsx b/src/components/dashboard/Overview/Overview.tsx
index 2cf957e96d..42e9144d3d 100644
--- a/src/components/dashboard/Overview/Overview.tsx
+++ b/src/components/dashboard/Overview/Overview.tsx
@@ -200,7 +200,7 @@ const Overview = (): ReactElement => {
                         variant="contained"
                         color="primary"
                         startIcon={<AddIcon />}
-                        sx={{ height: 1 }}
+                        sx={{ minHeight: '40px' }}
                         fullWidth
                       >
                         Buy crypto
diff --git a/src/components/nfts/NftGrid/index.tsx b/src/components/nfts/NftGrid/index.tsx
index 44905957ff..13e79cb71b 100644
--- a/src/components/nfts/NftGrid/index.tsx
+++ b/src/components/nfts/NftGrid/index.tsx
@@ -90,7 +90,7 @@ const NftGrid = ({
   onPreview,
 }: NftsTableProps): ReactElement => {
   const chainId = useChainId()
-  const linkTemplates = nftPlatforms[chainId]
+  const linkTemplates = nftPlatforms[chainId] || []
   // Filter string
   const [filter, setFilter] = useState<string>('')
 
diff --git a/src/components/nfts/config.ts b/src/components/nfts/config.ts
index 6e4610ace7..f03045ec1e 100644
--- a/src/components/nfts/config.ts
+++ b/src/components/nfts/config.ts
@@ -66,7 +66,15 @@ export const nftPlatforms: Record<keyof typeof chains, Array<NftPlatform>> = {
     {
       title: 'OpenSea',
       logo: '/images/common/nft-opensea.svg',
-      getUrl: (item) => `https://testnets.opensea.io/assets/${item.address}/${item.id}`,
+      getUrl: (item) => `https://testnets.opensea.io/assets/goerli/${item.address}/${item.id}`,
+    },
+  ],
+
+  [chains.sep]: [
+    {
+      title: 'OpenSea',
+      logo: '/images/common/nft-opensea.svg',
+      getUrl: (item) => `https://testnets.opensea.io/assets/sepolia/${item.address}/${item.id}`,
     },
   ],