Release 1.14.0

.env.example

@@ -31,3 +31,6 @@ NEXT_PUBLIC_CYPRESS_MNEMONIC=
 # Safe Gelato relay service
 NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION=
 NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING=
+
+# Redefine
+NEXT_PUBLIC_REDEFINE_API=

.github/workflows/build/action.yml

@@ -42,3 +42,4 @@ runs:
         NEXT_PUBLIC_SAFE_RELAY_SERVICE_URL_PRODUCTION: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION }}
         NEXT_PUBLIC_SAFE_RELAY_SERVICE_URL_STAGING: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING }}
         NEXT_PUBLIC_IS_OFFICIAL_HOST: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_IS_OFFICIAL_HOST }}
+        NEXT_PUBLIC_REDEFINE_API: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_REDEFINE_API }}

README.md

@@ -19,28 +19,29 @@ Create a `.env` file with environment variables. You can use the `.env.example`
 
 Here's the list of all the required and optional variables:
 
-| Env variable                                           |              | Description                                                                                                                                                             |
-| ------------------------------------------------------ | ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --- |
-| `NEXT_PUBLIC_INFURA_TOKEN`                             | **required** | [Infura](https://docs.infura.io/infura/networks/ethereum/how-to/secure-a-project/project-id) RPC API token                                                              |
-| `NEXT_PUBLIC_SAFE_APPS_INFURA_TOKEN`                   | optional     | Infura token for Safe Apps, falls back to `NEXT_PUBLIC_INFURA_TOKEN`                                                                                                    |
-| `NEXT_PUBLIC_IS_PRODUCTION`                            | optional     | Set to `true` to build a minified production app                                                                                                                        |
-| `NEXT_PUBLIC_GATEWAY_URL_PRODUCTION`                   | optional     | The base URL for the [Safe Client Gateway](https://github.com/safe-global/safe-client-gateway)                                                                          |
-| `NEXT_PUBLIC_GATEWAY_URL_STAGING`                      | optional     | The base CGW URL on staging                                                                                                                                             |
-| `NEXT_PUBLIC_SAFE_VERSION`                             | optional     | The latest version of the Safe contract, defaults to 1.3.0                                                                                                              |     |
-| `NEXT_PUBLIC_WC_BRIDGE`                                | optional     | [WalletConnect v1](https://docs.walletconnect.com/1.0/bridge-server) bridge URL, falls back to the public WC bridge                                                     |
-| `NEXT_PUBLIC_WC_PROJECT_ID`                            | optional     | [WalletConnect v2](https://docs.walletconnect.com/2.0/cloud/relay) project ID                                                                                           |
-| `NEXT_PUBLIC_TENDERLY_ORG_NAME`                        | optional     | [Tenderly](https://tenderly.co) org name for Transaction Simulation                                                                                                     |
-| `NEXT_PUBLIC_TENDERLY_PROJECT_NAME`                    | optional     | Tenderly project name                                                                                                                                                   |
-| `NEXT_PUBLIC_TENDERLY_SIMULATE_ENDPOINT_URL`           | optional     | Tenderly simulation URL                                                                                                                                                 |
-| `NEXT_PUBLIC_BEAMER_ID`                                | optional     | [Beamer](https://www.getbeamer.com) is a news feed for in-app announcements                                                                                             |
-| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID`                    | optional     | [GTM](https://tagmanager.google.com) project id                                                                                                                         |
-| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_DEVELOPMENT_AUTH`      | optional     | Dev GTM key                                                                                                                                                             |
-| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LATEST_AUTH`           | optional     | Preview GTM key                                                                                                                                                         |
-| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LIVE_AUTH`             | optional     | Production GTM key                                                                                                                                                      |
-| `NEXT_PUBLIC_SENTRY_DSN`                               | optional     | [Sentry](https://sentry.io) id for tracking runtime errors                                                                                                              |
-| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION` | optional     | [Safe Gelato Relay Service](https://github.com/safe-global/safe-gelato-relay-service) URL to allow relaying transactions via Gelato                                     |
-| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING`    | optional     | Relay URL on staging                                                                                                                                                    |
-| `NEXT_PUBLIC_IS_OFFICIAL_HOST`                         | optional     | Whether it's the official distribution of the app, or a fork; has legal implications. Set to true only if you also update the legal pages like Imprint and Terms of use |
+| Env variable                                           |              | Description
+| ------------------------------------------------------ | ------------ | -----------
+| `NEXT_PUBLIC_INFURA_TOKEN`                             | **required** | [Infura](https://docs.infura.io/infura/networks/ethereum/how-to/secure-a-project/project-id) RPC API token
+| `NEXT_PUBLIC_SAFE_APPS_INFURA_TOKEN`                   | optional     | Infura token for Safe Apps, falls back to `NEXT_PUBLIC_INFURA_TOKEN`
+| `NEXT_PUBLIC_IS_PRODUCTION`                            | optional     | Set to `true` to build a minified production app
+| `NEXT_PUBLIC_GATEWAY_URL_PRODUCTION`                   | optional     | The base URL for the [Safe Client Gateway](https://github.com/safe-global/safe-client-gateway)
+| `NEXT_PUBLIC_GATEWAY_URL_STAGING`                      | optional     | The base CGW URL on staging
+| `NEXT_PUBLIC_SAFE_VERSION`                             | optional     | The latest version of the Safe contract, defaults to 1.3.0
+| `NEXT_PUBLIC_WC_BRIDGE`                                | optional     | [WalletConnect v1](https://docs.walletconnect.com/1.0/bridge-server) bridge URL, falls back to the public WC bridge
+| `NEXT_PUBLIC_WC_PROJECT_ID`                            | optional     | [WalletConnect v2](https://docs.walletconnect.com/2.0/cloud/relay) project ID
+| `NEXT_PUBLIC_TENDERLY_ORG_NAME`                        | optional     | [Tenderly](https://tenderly.co) org name for Transaction Simulation
+| `NEXT_PUBLIC_TENDERLY_PROJECT_NAME`                    | optional     | Tenderly project name
+| `NEXT_PUBLIC_TENDERLY_SIMULATE_ENDPOINT_URL`           | optional     | Tenderly simulation URL
+| `NEXT_PUBLIC_BEAMER_ID`                                | optional     | [Beamer](https://www.getbeamer.com) is a news feed for in-app announcements
+| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID`                    | optional     | [GTM](https://tagmanager.google.com) project id
+| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_DEVELOPMENT_AUTH`      | optional     | Dev GTM key
+| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LATEST_AUTH`           | optional     | Preview GTM key
+| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LIVE_AUTH`             | optional     | Production GTM key
+| `NEXT_PUBLIC_SENTRY_DSN`                               | optional     | [Sentry](https://sentry.io) id for tracking runtime errors
+| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION` | optional     | [Safe Gelato Relay Service](https://github.com/safe-global/safe-gelato-relay-service) URL to allow relaying transactions via Gelato
+| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING`    | optional     | Relay URL on staging
+| `NEXT_PUBLIC_IS_OFFICIAL_HOST`                         | optional     | Whether it's the official distribution of the app, or a fork; has legal implications. Set to true only if you also update the legal pages like Imprint and Terms of use
+| `NEXT_PUBLIC_REDEFINE_API`                             | optional     | Redefine API base URL
 
 If you don't provide some of the optional vars, the corresponding features will be disabled in the UI.
 

cypress/e2e/smoke/dashboard.cy.js

@@ -23,7 +23,7 @@ describe('Dashboard', () => {
       cy.contains('2/3')
       cy.get(`a[href="/balances?safe=${SAFE}"]`).contains('View assets')
       // Text next to Tokens contains a number greater than 0
-      cy.contains('p', 'Tokens').next().contains('3')
+      cy.contains('p', 'Tokens').next().contains('4')
       cy.contains('p', 'NFTs').next().contains('0')
     })
   })

jest.setup.js

@@ -9,7 +9,7 @@ import 'whatwg-fetch'
 jest.mock('@web3-onboard/coinbase', () => jest.fn())
 jest.mock('@web3-onboard/injected-wallets', () => ({ ProviderLabel: { MetaMask: 'MetaMask' } }))
 jest.mock('@web3-onboard/keystone/dist/index', () => jest.fn())
-jest.mock('@web3-onboard/ledger', () => jest.fn())
+jest.mock('@web3-onboard/ledger/dist/index', () => jest.fn())
 jest.mock('@web3-onboard/trezor', () => jest.fn())
 jest.mock('@web3-onboard/walletconnect', () => jest.fn())
 jest.mock('@web3-onboard/taho', () => jest.fn())

package.json

@@ -3,7 +3,7 @@
   "homepage": "https://github.com/safe-global/safe-wallet-web",
   "license": "GPL-3.0",
   "type": "module",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "scripts": {
     "dev": "next dev",
     "start": "next dev",
@@ -20,7 +20,7 @@
     "routes": "node scripts/generate-routes.js > src/config/routes.ts && prettier -w src/config/routes.ts && cat src/config/routes.ts",
     "css-vars": "ts-node-esm ./scripts/css-vars.ts > ./src/styles/vars.css && prettier -w src/styles/vars.css",
     "generate-types": "typechain --target ethers-v5 --out-dir src/types/contracts ./node_modules/@safe-global/safe-deployments/dist/assets/**/*.json ./node_modules/@safe-global/safe-modules-deployments/dist/assets/**/*.json ./node_modules/@openzeppelin/contracts/build/contracts/ERC20.json ./node_modules/@openzeppelin/contracts/build/contracts/ERC721.json",
-    "postinstall": "yarn patch-package && yarn generate-types && yarn css-vars",
+    "postinstall": "yarn generate-types && yarn css-vars",
     "analyze": "cross-env ANALYZE=true yarn build",
     "cypress:open": "cross-env TZ=UTC cypress open --e2e",
     "cypress:canary": "cross-env TZ=UTC cypress open --e2e -b chrome:canary",
@@ -43,24 +43,24 @@
     "@mui/x-date-pickers": "^5.0.12",
     "@reduxjs/toolkit": "^1.9.5",
     "@safe-global/safe-apps-sdk": "7.11.0",
-    "@safe-global/safe-core-sdk": "^3.3.3",
-    "@safe-global/safe-core-sdk-utils": "^1.7.3",
-    "@safe-global/safe-deployments": "^1.22.0",
-    "@safe-global/safe-ethers-lib": "^1.9.3",
+    "@safe-global/safe-core-sdk": "^3.3.4",
+    "@safe-global/safe-core-sdk-utils": "^1.7.4",
+    "@safe-global/safe-deployments": "^1.25.0",
+    "@safe-global/safe-ethers-lib": "^1.9.4",
     "@safe-global/safe-gateway-typescript-sdk": "^3.7.3",
     "@safe-global/safe-modules-deployments": "^1.0.0",
     "@safe-global/safe-react-components": "^2.0.5",
     "@sentry/react": "^7.28.1",
     "@sentry/tracing": "^7.28.1",
     "@truffle/hdwallet-provider": "^2.1.4",
     "@web3-onboard/coinbase": "^2.2.4",
-    "@web3-onboard/core": "2.20.1",
+    "@web3-onboard/core": "2.20.4",
     "@web3-onboard/injected-wallets": "^2.10.0",
     "@web3-onboard/keystone": "^2.3.7",
-    "@web3-onboard/ledger": "^2.4.6",
-    "@web3-onboard/taho": "^2.0.4",
+    "@web3-onboard/ledger": "2.3.2",
+    "@web3-onboard/taho": "^2.0.5",
     "@web3-onboard/trezor": "^2.4.2",
-    "@web3-onboard/walletconnect": "2.3.9",
+    "@web3-onboard/walletconnect": "2.4.0",
     "classnames": "^2.3.1",
     "date-fns": "^2.29.2",
     "ethereum-blockies-base64": "^1.0.2",
@@ -81,7 +81,7 @@
     "react-papaparse": "^4.0.2",
     "react-qr-reader": "2.2.1",
     "react-redux": "^8.0.5",
-    "semver": "^7.3.7"
+    "semver": "^7.5.2"
   },
   "devDependencies": {
     "@next/bundle-analyzer": "^13.1.1",
@@ -115,7 +115,6 @@
     "eslint-plugin-unused-imports": "^2.0.0",
     "jest": "^28.1.2",
     "jest-environment-jsdom": "^28.1.2",
-    "patch-package": "^7.0.0",
     "pre-commit": "^1.2.2",
     "prettier": "^2.7.0",
     "ts-node": "^10.8.2",

src/components/common/CheckWallet/index.tsx

@@ -27,7 +27,7 @@ const CheckWallet = ({ children, allowSpendingLimit, allowNonOwner }: CheckWalle
     ? Message.WalletNotConnected
     : !isSafeOwner && !isSpendingLimit && !allowNonOwner
     ? Message.NotSafeOwner
-    : isSpendingLimit && !allowSpendingLimit
+    : isSpendingLimit && !allowSpendingLimit && !allowNonOwner
     ? Message.OnlySpendingLimitBeneficiary
     : ''
 

src/components/common/CookieBanner/styles.module.css

@@ -22,3 +22,11 @@
     bottom: 0;
   }
 }
+
+.container :global(.Mui-checked) {
+  color: var(--color-background-paper);
+}
+
+.container :global(.Mui-checked.Mui-disabled) {
+  opacity: 0.5;
+}

src/components/common/PaginatedTxns/index.tsx

@@ -12,6 +12,7 @@ import { type TxFilter, useTxFilter } from '@/utils/tx-history-filter'
 import { isTransactionListItem } from '@/utils/transaction-guards'
 import NoTransactionsIcon from '@/public/images/transactions/no-transactions.svg'
 import { useHasPendingTxs } from '@/hooks/usePendingTxs'
+import useSafeInfo from '@/hooks/useSafeInfo'
 
 const NoQueuedTxns = () => {
   return <PagePlaceholder img={<NoTransactionsIcon />} text="Queued transactions will appear here" />
@@ -68,11 +69,12 @@ const TxPage = ({
 const PaginatedTxns = ({ useTxns }: { useTxns: typeof useTxHistory | typeof useTxQueue }): ReactElement => {
   const [pages, setPages] = useState<string[]>([''])
   const [filter] = useTxFilter()
+  const { safeAddress, safe } = useSafeInfo()
 
-  // Reset the pages when the filter changes
+  // Reset the pages when the Safe Account or filter changes
   useEffect(() => {
     setPages([''])
-  }, [filter, useTxns])
+  }, [filter, safe.chainId, safeAddress, useTxns])
 
   // Trigger the next page load
   const onNextPage = (pageUrl: string) => {

src/components/dashboard/CreationDialog/index.tsx

@@ -1,5 +1,6 @@
 import React, { type ElementType } from 'react'
 import { Box, Button, Dialog, DialogContent, Grid, SvgIcon, Typography } from '@mui/material'
+import { useRouter } from 'next/router'
 
 import HomeIcon from '@/public/images/sidebar/home.svg'
 import TransactionIcon from '@/public/images/sidebar/transactions.svg'
@@ -9,6 +10,7 @@ import BeamerIcon from '@/public/images/sidebar/whats-new.svg'
 import HelpCenterIcon from '@/public/images/sidebar/help-center.svg'
 import { useRemoteSafeApps } from '@/hooks/safe-apps/useRemoteSafeApps'
 import { useCurrentChain } from '@/hooks/useChains'
+import { CREATION_MODAL_QUERY_PARM } from '@/components/new-safe/create/logic'
 
 const HintItem = ({ Icon, title, description }: { Icon: ElementType; title: string; description: string }) => {
   return (
@@ -26,10 +28,18 @@ const HintItem = ({ Icon, title, description }: { Icon: ElementType; title: stri
 }
 
 const CreationDialog = () => {
+  const router = useRouter()
   const [open, setOpen] = React.useState(true)
   const [remoteSafeApps = []] = useRemoteSafeApps()
   const chain = useCurrentChain()
 
+  const onClose = () => {
+    const { [CREATION_MODAL_QUERY_PARM]: _, ...query } = router.query
+    router.replace({ pathname: router.pathname, query })
+
+    setOpen(false)
+  }
+
   return (
     <Dialog open={open}>
       <DialogContent sx={{ paddingX: 8, paddingTop: 9, paddingBottom: 6 }}>
@@ -64,7 +74,7 @@ const CreationDialog = () => {
           />
         </Grid>
         <Box display="flex" justifyContent="center">
-          <Button onClick={() => setOpen(false)} variant="contained" size="stretched">
+          <Button onClick={onClose} variant="contained" size="stretched">
             Got it
           </Button>
         </Box>

src/components/dashboard/index.tsx

@@ -10,11 +10,12 @@ import { useRouter } from 'next/router'
 import Relaying from '@/components/dashboard/Relaying'
 import { FEATURES } from '@/utils/chains'
 import { useHasFeature } from '@/hooks/useChains'
+import { CREATION_MODAL_QUERY_PARM } from '../new-safe/create/logic'
 
 const Dashboard = (): ReactElement => {
   const router = useRouter()
   const supportsRelaying = useHasFeature(FEATURES.RELAYING)
-  const { showCreationModal = '' } = router.query
+  const { [CREATION_MODAL_QUERY_PARM]: showCreationModal = '' } = router.query
 
   return (
     <>

src/components/new-safe/create/logic/index.ts

@@ -235,6 +235,8 @@ export const checkSafeCreationTx = async (
   }
 }
 
+export const CREATION_MODAL_QUERY_PARM = 'showCreationModal'
+
 export const getRedirect = (
   chainPrefix: string,
   safeAddress: string,
@@ -248,7 +250,7 @@ export const getRedirect = (
 
   // Go to the dashboard if no specific redirect is provided
   if (!redirectUrl) {
-    return { pathname: AppRoutes.home, query: { safe: address, showCreationModal: true } }
+    return { pathname: AppRoutes.home, query: { safe: address, [CREATION_MODAL_QUERY_PARM]: true } }
   }
 
   // Otherwise, redirect to the provided URL (e.g. from a Safe App)

src/components/safe-messages/PaginatedMsgs/index.tsx

@@ -1,6 +1,6 @@
 import { Box } from '@mui/material'
 import { Typography, Link, SvgIcon } from '@mui/material'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 import type { ReactElement } from 'react'
 
 import ErrorMessage from '@/components/tx/ErrorMessage'
@@ -12,6 +12,7 @@ import PagePlaceholder from '@/components/common/PagePlaceholder'
 import MsgList from '@/components/safe-messages/MsgList'
 import SkeletonTxList from '@/components/common/PaginatedTxns/SkeletonTxList'
 import { HelpCenterArticle } from '@/config/constants'
+import useSafeInfo from '@/hooks/useSafeInfo'
 
 const NoMessages = (): ReactElement => {
   return (
@@ -62,12 +63,18 @@ const MsgPage = ({
 
 const PaginatedMsgs = (): ReactElement => {
   const [pages, setPages] = useState<string[]>([''])
+  const { safeAddress, safe } = useSafeInfo()
 
   // Trigger the next page load
   const onNextPage = (pageUrl: string) => {
     setPages((prev) => prev.concat(pageUrl))
   }
 
+  // Reset the pages when the Safe Account changes
+  useEffect(() => {
+    setPages([''])
+  }, [safe.chainId, safeAddress])
+
   return (
     <Box mb={4} position="relative">
       {pages.map((pageUrl, index) => (