Merge branch 'main' of github.com:safe-global/safe-wallet-web into dev

package.json

@@ -2,7 +2,7 @@
   "name": "safe-wallet-web",
   "homepage": "https://github.com/safe-global/safe-wallet-web",
   "license": "GPL-3.0",
-  "version": "1.41.5",
+  "version": "1.43.0",
   "type": "module",
   "scripts": {
     "dev": "next dev",

src/components/common/Chip/index.tsx

@@ -13,8 +13,6 @@ export function Chip({ color = 'primary', label = 'New' }: ChipProps) {
       sx={{
         backgroundColor: `${color}.background`,
         color: `${color}.light`,
-        position: 'absolute',
-        right: 0,
         mt: '-2px',
       }}
       label={

src/components/common/CookieAndTermBanner/index.tsx

@@ -75,9 +75,10 @@ export const CookieAndTermBanner = ({
           <Grid item xs>
             <Typography variant="body2" mb={2}>
               By browsing this page, you accept our{' '}
-              <ExternalLink href={AppRoutes.terms}>Terms & Conditions</ExternalLink> (last updated August 2024) and the
-              use of necessary cookies. By clicking &quot;Accept all&quot; you additionally agree to the use of Beamer
-              and Analytics cookies as listed below. <ExternalLink href={AppRoutes.cookie}>Cookie policy</ExternalLink>
+              <ExternalLink href={AppRoutes.terms}>Terms & Conditions</ExternalLink> (last updated September 2024) and
+              the use of necessary cookies. By clicking &quot;Accept all&quot; you additionally agree to the use of
+              Beamer and Analytics cookies as listed below.{' '}
+              <ExternalLink href={AppRoutes.cookie}>Cookie policy</ExternalLink>
             </Typography>
 
             <Grid container alignItems="center" gap={4}>

src/components/transactions/ExecuteTxButton/index.tsx

@@ -50,7 +50,7 @@ const ExecuteTxButton = ({
 
   return (
     <>
-      <CheckWallet allowNonOwner checkNetwork={!isDisabled}>
+      <CheckWallet allowNonOwner>
         {(isOk) => (
           <Tooltip title={isOk && !isNext ? 'You must execute the transaction with the lowest nonce first' : ''}>
             <span>

src/components/transactions/SignTxButton/index.tsx

@@ -34,7 +34,7 @@ const SignTxButton = ({
   }
 
   return (
-    <CheckWallet checkNetwork={!isDisabled}>
+    <CheckWallet>
       {(isOk) => (
         <Tooltip title={isOk && !isSignable ? "You've already signed this transaction" : ''}>
           <span>

src/components/tx-flow/common/TxLayout/index.tsx

@@ -83,7 +83,7 @@ const TxLayout = ({
 
   const theme = useTheme()
   const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'))
-  const isDesktop = useMediaQuery(theme.breakpoints.down(1399.95))
+  const isDesktop = useMediaQuery(theme.breakpoints.down('lg'))
 
   const steps = Array.isArray(children) ? children : [children]
   const progress = Math.round(((step + 1) / steps.length) * 100)

src/components/tx-flow/common/TxLayout/styles.module.css

@@ -108,7 +108,7 @@
   /* Height of transaction type title */
   margin-top: 46px;
 }
-@media (max-width: 1399.95px) {
+@media (max-width: 1199px) {
   .backButton {
     left: 50%;
     transform: translateX(-50%);

src/features/recovery/components/ExecuteRecoveryButton/index.tsx

@@ -12,6 +12,8 @@ import { Errors, trackError } from '@/services/exceptions'
 import { asError } from '@/services/exceptions/utils'
 import { RecoveryListItemContext } from '../RecoveryListItem/RecoveryListItemContext'
 import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
+import useIsWrongChain from '@/hooks/useIsWrongChain'
+import { useCurrentChain } from '@/hooks/useChains'
 
 export function ExecuteRecoveryButton({
   recovery,
@@ -26,6 +28,8 @@ export function ExecuteRecoveryButton({
   const wallet = useWallet()
   const { safe } = useSafeInfo()
   const isDisabled = !isExecutable || isPending
+  const isWrongChain = useIsWrongChain()
+  const chain = useCurrentChain()
 
   const onClick = async (e: SyntheticEvent) => {
     e.stopPropagation()
@@ -58,7 +62,9 @@ export function ExecuteRecoveryButton({
           <Tooltip
             title={
               !isOk || isDisabled
-                ? isNext
+                ? isWrongChain
+                  ? `Switch your wallet network to ${chain?.chainName} to execute this transaction`
+                  : isNext
                   ? 'You can execute the recovery after the specified review window'
                   : 'Previous recovery proposals must be executed or cancelled first'
                 : null

src/features/recovery/components/RecoverySigners/index.tsx

@@ -13,6 +13,7 @@ import { formatDateTime } from '@/utils/date'
 import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 import txSignersCss from '@/components/transactions/TxSigners/styles.module.css'
+import NetworkWarning from '@/components/new-safe/create/NetworkWarning'
 
 export function RecoverySigners({ item }: { item: RecoveryQueueItem }): ReactElement {
   const { isExecutable, isExpired, isNext, remainingSeconds } = useRecoveryTxState(item)
@@ -70,6 +71,8 @@ export function RecoverySigners({ item }: { item: RecoveryQueueItem }): ReactEle
         {isNext && <Countdown seconds={remainingSeconds} />}
       </Box>
 
+      <NetworkWarning />
+
       <RecoveryValidationErrors item={item} />
 
       <Box display="flex" alignItems="center" justifyContent="center" gap={1} mt={2}>