Merge remote-tracking branch 'origin/dev' into web3authcoresdk

Dockerfile

@@ -5,6 +5,7 @@ COPY . .
 
 # install deps
 RUN yarn install --frozen-lockfile
+RUN yarn after-install
 
 ENV NODE_ENV production
 

cypress/e2e/pages/balances.pages.js

@@ -20,7 +20,6 @@ const hiddenTokenDeselectAllBtn = 'span[data-track="assets: Deselect all hide di
 const hiddenTokenIcon = 'svg[data-testid="VisibilityOffOutlinedIcon"]'
 
 const hideTokenDefaultString = 'Hide tokens'
-const gotItStr = 'Got it!'
 const assetNameSortBtnStr = 'Asset'
 const assetBalanceSortBtnStr = 'Balance'
 const sendBtnStr = 'Send'
@@ -184,14 +183,6 @@ export function verifyEachRowHasCheckbox(state) {
   })
 }
 
-export function acceptSpamWarning() {
-  cy.get('button').contains(gotItStr).click()
-  verifySpamWarningNotdisplayed()
-}
-
-export function verifySpamWarningNotdisplayed() {
-  cy.contains(gotItStr).should('not.exist')
-}
 export function verifyTokensTabIsSelected(option) {
   cy.get(`a[aria-selected="${option}"]`).contains('Tokens')
 }

cypress/e2e/pages/main.page.js

@@ -8,6 +8,11 @@ export function clickOnSideMenuItem(item) {
 
 export function acceptCookies() {
   cy.wait(1000)
+
+  cy.findAllByText('Got it!')
+    .should('have.length.at.least', 0)
+    .each(($el) => $el.click())
+
   cy.get('button')
     .contains(acceptSelection)
     .should(() => {})

cypress/e2e/pages/safeapps.pages.js

@@ -78,22 +78,28 @@ export function verifyNoAppsTextPresent() {
 }
 
 export function pinApp(app, pin = true) {
-  let str = 'Unpin'
-  if (!pin) str = 'Pin'
-  cy.findByLabelText(app)
-    .click()
-    .should(($el) => {
-      const ariaLabel = $el.attr('aria-label')
-      expect(ariaLabel).to.include(str)
-    })
+  cy.findByLabelText(app).click()
+  cy.wait(200)
+  cy.findByLabelText(app).should(($el) => {
+    const ariaLabel = $el.attr('aria-label')
+    expect(ariaLabel).to.include(pin ? 'Unpin' : 'Pin')
+  })
 }
 
 export function clickOnBookmarkedAppsTab() {
   cy.findByText(bookmarkedAppsStr).click()
 }
 
 export function verifyAppCount(count) {
-  cy.findByText(`ALL (${count})`).should('be.visible')
+  cy.findByText(`All apps (${count})`).should('be.visible')
+}
+
+export function verifyCustomAppCount(count) {
+  cy.findByText(`Custom apps (${count})`).should('be.visible')
+}
+
+export function verifyPinnedAppCount(count) {
+  cy.findByText(`My pinned apps (${count})`).should(count ? 'be.visible' : 'not.exist')
 }
 
 export function clickOnCustomAppsTab() {

cypress/e2e/safe-apps/apps_list.cy.js

@@ -34,17 +34,15 @@ describe('Safe Apps tests', () => {
     safeapps.clearSearchAppInput()
     safeapps.pinApp(safeapps.pinWalletConnectStr)
     safeapps.pinApp(safeapps.transactionBuilderStr)
-    safeapps.clickOnBookmarkedAppsTab()
-    safeapps.verifyAppCount(2)
+    safeapps.verifyPinnedAppCount(2)
   })
 
   it('Verify apps can be unpinned [C56134]', () => {
     safeapps.pinApp(safeapps.pinWalletConnectStr)
     safeapps.pinApp(safeapps.transactionBuilderStr)
     safeapps.pinApp(safeapps.pinWalletConnectStr, false)
     safeapps.pinApp(safeapps.transactionBuilderStr, false)
-    safeapps.clickOnBookmarkedAppsTab()
-    safeapps.verifyAppCount(0)
+    safeapps.verifyPinnedAppCount(0)
   })
 
   it('Verify there is an error when the app manifest is invalid [C56135]', () => {
@@ -70,7 +68,7 @@ describe('Safe Apps tests', () => {
     safeapps.verifyAppTitle(myCustomAppTitle)
     safeapps.acceptTC()
     safeapps.clickOnAddBtn()
-    safeapps.verifyAppCount(1)
+    safeapps.verifyCustomAppCount(1)
     safeapps.verifyAppDescription(myCustomAppDescrAdded)
   })
 })

cypress/e2e/smoke/assets.cy.js

@@ -14,7 +14,6 @@ describe('Assets tests', () => {
     cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
     cy.clearLocalStorage()
     main.acceptCookies()
-    balances.acceptSpamWarning()
   })
 
   it('Verify that the token tab is selected by default and the table is visible [C56039]', () => {
@@ -107,7 +106,6 @@ describe('Assets tests', () => {
   it('Verify that a tool tip is shown pointing to "Token list" dropdown [C56044]', () => {
     //Spam warning message is removed in beforeEach hook
     cy.reload()
-    balances.verifySpamWarningNotdisplayed()
   })
 
   it('Verify that Token list dropdown down options show/hide spam tokens [C56045]', () => {

cypress/e2e/smoke/balances.cy.js

@@ -15,7 +15,6 @@ describe('Balance tests', () => {
     cy.clearLocalStorage()
     cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
     main.acceptCookies()
-    balances.acceptSpamWarning()
     cy.contains('Assets')
     cy.get(balances.balanceSingleRow).should('have.length.lessThan', ASSETS_LENGTH)
     balances.selectTokenList(balances.tokenListOptions.allTokens)

cypress/e2e/smoke/balances_pagination.cy.js

@@ -12,7 +12,6 @@ describe('Balance tests', () => {
     // Table is loaded
     cy.contains('Görli Ether')
 
-    cy.contains('button', 'Got it').click()
     cy.contains('div', 'Default tokens').click()
     cy.wait(100)
     cy.contains('div', 'All tokens').click()

cypress/e2e/smoke/batch_tx.cy.js

@@ -1,7 +1,6 @@
 import * as batch from '../pages/batches.pages'
 import * as constants from '../../support/constants'
 import * as main from '../../e2e/pages/main.page'
-import * as balances from '../pages/balances.pages'
 
 const currentNonce = 3
 const funds_first_tx = '0.001'
@@ -12,7 +11,6 @@ describe('Batch transaction tests', () => {
     cy.clearLocalStorage()
     cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
     main.acceptCookies()
-    balances.acceptSpamWarning()
   })
 
   it('Verify empty batch list can be opened [C56082]', () => {

cypress/e2e/smoke/create_tx.cy.js

@@ -1,7 +1,6 @@
 import * as constants from '../../support/constants'
 import * as main from '../../e2e/pages/main.page'
 import * as createtx from '../../e2e/pages/create_tx.pages'
-import * as balances from '../pages/balances.pages'
 
 const sendValue = 0.00002
 const currentNonce = 1
@@ -11,7 +10,6 @@ describe('Create transactions tests', () => {
     cy.clearLocalStorage()
     cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_5)
     main.acceptCookies()
-    balances.acceptSpamWarning()
   })
 
   it('Verify a new send token transaction can be created [C56104]', () => {

cypress/e2e/smoke/tx_history.cy.js

@@ -15,6 +15,10 @@ describe('Transaction history tests', () => {
     cy.clearLocalStorage()
     // Go to the test Safe transaction history
     cy.visit(constants.transactionsHistoryUrl + constants.SEPOLIA_TEST_SAFE_5)
+
+    // So that tests that rely on this feature don't randomly fail
+    cy.window().then((win) => win.localStorage.setItem('SAFE_v2__AB_human-readable', true))
+
     main.acceptCookies()
   })
 

cypress/support/e2e.js

@@ -37,10 +37,4 @@ before(() => {
       }
     }
   })
-
-  cy.on('window:before:load', (window) => {
-    window.localStorage.setItem('SAFE_v2__show_terms', false)
-    // So that tests that rely on this feature don't randomly fail
-    window.localStorage.setItem('SAFE_v2__AB_human-readable', true)
-  })
 })

jest.config.cjs

@@ -23,15 +23,7 @@ const customJestConfig = {
 }
 
 // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
-// Jest does not allow modification of transformIgnorePatterns within createJestConfig, therefore we add one entry after initializing the config
-module.exports = async () => {
-  const jestConfig = await createJestConfig(customJestConfig)()
-  const existingTransformIgnorePatterns = jestConfig.transformIgnorePatterns.filter(
-    (pattern) => pattern !== '/node_modules/',
-  )
-
-  return {
-    ...jestConfig,
-    transformIgnorePatterns: [...existingTransformIgnorePatterns, '/node_modules/(?!(@web3-onboard/common)/)'],
-  }
-}
+module.exports = async () => ({
+  ...(await createJestConfig(customJestConfig)()),
+  transformIgnorePatterns: ['node_modules/(?!(uint8arrays|multiformats|@web3-onboard/common)/)'],
+})

package.json

@@ -3,7 +3,7 @@
   "homepage": "https://github.com/safe-global/safe-wallet-web",
   "license": "GPL-3.0",
   "type": "module",
-  "version": "1.19.1",
+  "version": "1.20.0",
   "scripts": {
     "dev": "next dev",
     "start": "next dev",
@@ -58,6 +58,8 @@
     "@sentry/tracing": "^7.74.0",
     "@tkey-mpc/common-types": "^8.2.2",
     "@truffle/hdwallet-provider": "^2.1.4",
+    "@walletconnect/utils": "^2.10.2",
+    "@walletconnect/web3wallet": "^1.9.2",
     "@web3-onboard/coinbase": "^2.2.6",
     "@web3-onboard/core": "^2.21.2",
     "@web3-onboard/injected-wallets": "^2.10.7",
@@ -114,6 +116,7 @@
     "@types/react-qr-reader": "^2.1.5",
     "@types/semver": "^7.3.10",
     "@typescript-eslint/eslint-plugin": "^5.47.1",
+    "@walletconnect/types": "^2.10.1",
     "cross-env": "^7.0.3",
     "cypress": "^12.15.0",
     "cypress-file-upload": "^5.0.8",

src/components/batch/BatchIndicator/index.tsx

@@ -11,9 +11,17 @@ const BatchIndicator = ({ onClick }: { onClick?: () => void }) => {
   return (
     <BatchTooltip>
       <Track {...BATCH_EVENTS.BATCH_SIDEBAR_OPEN} label={length}>
-        <ButtonBase onClick={onClick} sx={{ p: 0.5 }} title="Batch">
-          <Badge variant="standard" color="secondary" badgeContent={length}>
-            <SvgIcon component={BatchIcon} inheritViewBox fontSize="small" />
+        <ButtonBase title="Batch" onClick={onClick} sx={{ p: 2 }}>
+          <Badge
+            variant="standard"
+            badgeContent={length}
+            color={'secondary'}
+            anchorOrigin={{
+              vertical: 'bottom',
+              horizontal: 'right',
+            }}
+          >
+            <SvgIcon component={BatchIcon} inheritViewBox fontSize="medium" />
           </Badge>
         </ButtonBase>
       </Track>

src/components/common/AddressInput/index.test.tsx

@@ -201,8 +201,9 @@ describe('AddressInput tests', () => {
 
     const { input } = setup(`${mockChain.shortName}:${TEST_ADDRESS_A}`)
 
-    act(() => {
+    await act(() => {
       fireEvent.change(input, { target: { value: `${mockChain.shortName}:${TEST_ADDRESS_B}` } })
+      return Promise.resolve()
     })
 
     await waitFor(() => expect(input.previousElementSibling?.textContent).toBe(''))

src/components/common/ConnectWallet/AccountCenter.tsx

@@ -53,7 +53,11 @@ export const AccountCenter = ({ wallet }: { wallet: ConnectedWallet }) => {
           vertical: 'top',
           horizontal: 'center',
         }}
-        sx={{ marginTop: 1 }}
+        sx={{
+          '& > .MuiPaper-root': {
+            top: 'var(--header-height) !important',
+          },
+        }}
       >
         <Paper className={css.popoverContainer}>
           <WalletInfo wallet={wallet} handleClose={closeWalletInfo} />