feat: upgrade protocol-kit to v5

package.json

@@ -37,7 +37,7 @@
     "node": ">=16"
   },
   "resolutions": {
-    "@safe-global/safe-core-sdk-types/**/ethers": "^6.11.1",
+    "@safe-global/types-kit/**/ethers": "^6.11.1",
     "@safe-global/protocol-kit/**/ethers": "^6.11.1",
     "@safe-global/api-kit/**/ethers": "^6.11.1",
     "@gnosis.pm/zodiac/**/ethers": "^6.11.1"
@@ -54,8 +54,8 @@
     "@mui/material": "^5.14.20",
     "@mui/x-date-pickers": "^5.0.20",
     "@reduxjs/toolkit": "^2.2.6",
-    "@safe-global/api-kit": "^2.4.6",
-    "@safe-global/protocol-kit": "^4.1.1",
+    "@safe-global/api-kit": "^2.5.0",
+    "@safe-global/protocol-kit": "^5.0.0",
     "@safe-global/safe-apps-sdk": "^9.1.0",
     "@safe-global/safe-deployments": "^1.37.10",
     "@safe-global/safe-gateway-typescript-sdk": "3.22.3-beta.15",
@@ -104,7 +104,7 @@
     "@next/bundle-analyzer": "^13.5.6",
     "@next/mdx": "^14.2.11",
     "@openzeppelin/contracts": "^4.9.6",
-    "@safe-global/safe-core-sdk-types": "^5.0.1",
+    "@safe-global/types-kit": "^1.0.0",
     "@sentry/types": "^7.74.0",
     "@storybook/addon-designs": "^8.0.3",
     "@storybook/addon-essentials": "^8.0.6",

src/components/common/NetworkSelector/index.tsx

@@ -36,7 +36,6 @@ import { useCompatibleNetworks } from '@/features/multichain/hooks/useCompatible
 import { useSafeCreationData } from '@/features/multichain/hooks/useSafeCreationData'
 import { type ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'
 import PlusIcon from '@/public/images/common/plus.svg'
-import useAddressBook from '@/hooks/useAddressBook'
 import { CreateSafeOnSpecificChain } from '@/features/multichain/components/CreateSafeOnNewChain'
 import { useGetSafeOverviewQuery } from '@/store/api/gateway'
 import { hasMultiChainAddNetworkFeature } from '@/components/welcome/MyAccounts/utils/multiChainSafe'
@@ -163,8 +162,6 @@ const UndeployedNetworks = ({
 }) => {
   const [open, setOpen] = useState(false)
   const [replayOnChain, setReplayOnChain] = useState<ChainInfo>()
-  const addressBook = useAddressBook()
-  const safeName = addressBook[safeAddress]
   const deployedChainInfos = useMemo(
     () => chains.filter((chain) => deployedChains.includes(chain.chainId)),
     [chains, deployedChains],
@@ -270,7 +267,6 @@ const UndeployedNetworks = ({
           safeAddress={safeAddress}
           open
           onClose={onFormClose}
-          currentName={safeName ?? ''}
           safeCreationResult={safeCreationResult}
         />
       )}

src/components/new-safe/create/index.tsx

@@ -18,7 +18,7 @@ import CreateSafeInfos from '@/components/new-safe/create/CreateSafeInfos'
 import { type ReactElement, useMemo, useState } from 'react'
 import ExternalLink from '@/components/common/ExternalLink'
 import { HelpCenterArticle } from '@/config/constants'
-import { type SafeVersion } from '@safe-global/safe-core-sdk-types'
+import { type SafeVersion } from '@safe-global/types-kit'
 import { getLatestSafeVersion } from '@/utils/chains'
 import { useCurrentChain } from '@/hooks/useChains'
 import type { ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'

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

@@ -1,15 +1,14 @@
-import type { SafeVersion } from '@safe-global/safe-core-sdk-types'
-import { type Eip1193Provider, type Provider } from 'ethers'
+import type { SafeVersion, TransactionOptions } from '@safe-global/types-kit'
+import { BrowserProvider, type TransactionResponse, type Eip1193Provider, type Provider } from 'ethers'
 import semverSatisfies from 'semver/functions/satisfies'
 
 import { getSafeInfo, type SafeInfo, type ChainInfo, relayTransaction } from '@safe-global/safe-gateway-typescript-sdk'
 import { getReadOnlyProxyFactoryContract } from '@/services/contracts/safeContracts'
 import type { UrlObject } from 'url'
 import { AppRoutes } from '@/config/routes'
 import { SAFE_APPS_EVENTS, trackEvent } from '@/services/analytics'
-import { predictSafeAddress, SafeFactory, SafeProvider } from '@safe-global/protocol-kit'
-import type { DeploySafeProps, PredictedSafeProps } from '@safe-global/protocol-kit'
-import { isValidSafeVersion } from '@/hooks/coreSDK/safeCoreSDK'
+import Safe, { predictSafeAddress, SafeProvider } from '@safe-global/protocol-kit'
+import type { PredictedSafeProps, SafeAccountConfig, SafeDeploymentConfig } from '@safe-global/protocol-kit'
 
 import { backOff } from 'exponential-backoff'
 import { EMPTY_DATA, ZERO_ADDRESS } from '@safe-global/protocol-kit/dist/src/utils/constants'
@@ -35,59 +34,53 @@ export type SafeCreationProps = {
   saltNonce: number
 }
 
-const getSafeFactory = async (
-  provider: Eip1193Provider,
-  safeVersion: SafeVersion,
-  isL1SafeSingleton?: boolean,
-): Promise<SafeFactory> => {
-  if (!isValidSafeVersion(safeVersion)) {
-    throw new Error('Invalid Safe version')
-  }
-  return SafeFactory.init({ provider, safeVersion, isL1SafeSingleton })
-}
-
 /**
  * Create a Safe creation transaction via Core SDK and submits it to the wallet
  */
 export const createNewSafe = async (
   provider: Eip1193Provider,
   undeployedSafeProps: UndeployedSafeProps,
-  safeVersion: SafeVersion,
   chain: ChainInfo,
-  options: DeploySafeProps['options'],
+  options: TransactionOptions,
   callback: (txHash: string) => void,
   isL1SafeSingleton?: boolean,
 ): Promise<void> => {
-  const safeFactory = await getSafeFactory(provider, safeVersion, isL1SafeSingleton)
+  let txResponse: TransactionResponse | undefined
 
   if (isPredictedSafeProps(undeployedSafeProps)) {
-    await safeFactory.deploySafe({ ...undeployedSafeProps, options, callback })
+    const safe = await Safe.init({ predictedSafe: undeployedSafeProps, provider, isL1SafeSingleton })
+    const deploymentTx = await safe.createSafeDeploymentTransaction()
+    txResponse = await (
+      await new BrowserProvider(provider).getSigner()
+    ).sendTransaction({
+      ...options,
+      ...deploymentTx,
+    })
   } else {
-    const txResponse = await activateReplayedSafe(chain, undeployedSafeProps, createWeb3(provider), options)
-    callback(txResponse.hash)
+    txResponse = await activateReplayedSafe(chain, undeployedSafeProps, createWeb3(provider), options)
   }
+  callback(txResponse.hash)
 }
 
 /**
  * Compute the new counterfactual Safe address before it is actually created
  */
 export const computeNewSafeAddress = async (
   provider: Eip1193Provider | string,
-  props: DeploySafeProps,
+  safeAccountConfig: SafeAccountConfig,
+  safeDeploymentConfig: SafeDeploymentConfig,
   chain: ChainInfo,
-  safeVersion?: SafeVersion,
 ): Promise<string> => {
   const safeProvider = new SafeProvider({ provider })
 
   return predictSafeAddress({
     safeProvider,
     chainId: BigInt(chain.chainId),
-    safeAccountConfig: props.safeAccountConfig,
+    safeAccountConfig,
     safeDeploymentConfig: {
-      saltNonce: props.saltNonce,
-      safeVersion: safeVersion ?? getLatestSafeVersion(chain),
+      ...safeDeploymentConfig,
+      safeVersion: safeDeploymentConfig.safeVersion ?? getLatestSafeVersion(chain),
     },
-    isL1SafeSingleton: true,
   })
 }
 
@@ -130,7 +123,7 @@ export const estimateSafeCreationGas = async (
 
   const gas = await provider.estimateGas({
     from,
-    to: await readOnlyProxyFactoryContract.getAddress(),
+    to: readOnlyProxyFactoryContract.getAddress(),
     data: encodedSafeCreationTx,
   })
 

src/components/new-safe/create/steps/AdvancedOptionsStep/index.tsx

@@ -7,7 +7,7 @@ import type { NewSafeFormData } from '@/components/new-safe/create'
 import useSyncSafeCreationStep from '@/components/new-safe/create/useSyncSafeCreationStep'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
 import layoutCss from '@/components/new-safe/create/styles.module.css'
-import { type SafeVersion } from '@safe-global/safe-core-sdk-types'
+import { type SafeVersion } from '@safe-global/types-kit'
 import NumberField from '@/components/common/NumberField'
 import { useCurrentChain } from '@/hooks/useChains'
 import useAsync from '@/hooks/useAsync'
@@ -58,15 +58,15 @@ const AdvancedOptionsStep = ({ onSubmit, onBack, data, setStep }: StepRenderProp
     return computeNewSafeAddress(
       wallet.provider,
       {
-        safeAccountConfig: {
-          owners: data.owners.map((owner) => owner.address),
-          threshold: data.threshold,
-          fallbackHandler: await readOnlyFallbackHandlerContract.getAddress(),
-        },
+        owners: data.owners.map((owner) => owner.address),
+        threshold: data.threshold,
+        fallbackHandler: readOnlyFallbackHandlerContract.getAddress(),
+      },
+      {
         saltNonce: selectedSaltNonce.toString(),
+        safeVersion: selectedSafeVersion,
       },
       chain,
-      selectedSafeVersion,
     )
   }, [
     chain,

src/components/new-safe/create/steps/ReviewStep/index.test.tsx

@@ -9,7 +9,7 @@ import * as useWallet from '@/hooks/wallets/useWallet'
 import { type ConnectedWallet } from '@/hooks/wallets/useOnboard'
 import { act, fireEvent, screen } from '@testing-library/react'
 import { LATEST_SAFE_VERSION } from '@/config/constants'
-import { type SafeVersion } from '@safe-global/safe-core-sdk-types'
+import { type SafeVersion } from '@safe-global/types-kit'
 
 const mockChainInfo = {
   chainId: '100',

src/components/new-safe/create/steps/ReviewStep/index.tsx

@@ -48,8 +48,8 @@ import { AppRoutes } from '@/config/routes'
 import { type ReplayedSafeProps } from '@/store/slices'
 import { predictAddressBasedOnReplayData } from '@/components/welcome/MyAccounts/utils/multiChainSafe'
 import { createWeb3ReadOnly } from '@/hooks/wallets/web3'
-import { type DeploySafeProps } from '@safe-global/protocol-kit'
 import { updateAddressBook } from '../../logic/address-book'
+import { type TransactionOptions } from '@safe-global/types-kit'
 
 export const NetworkFee = ({
   totalFee,
@@ -275,12 +275,12 @@ const ReviewStep = ({ data, onSubmit, onBack, setStep }: StepRenderProps<NewSafe
         gtmSetSafeAddress(safeAddress)
 
         trackEvent({ ...OVERVIEW_EVENTS.PROCEED_WITH_TX, label: 'counterfactual', category: CREATE_SAFE_CATEGORY })
-        replayCounterfactualSafeDeployment(chain.chainId, safeAddress, props, data.name, dispatch, payMethod)
+        replayCounterfactualSafeDeployment(chain.chainId, safeAddress, props, dispatch, payMethod)
         trackEvent({ ...CREATE_SAFE_EVENTS.CREATED_SAFE, label: 'counterfactual' })
         return
       }
 
-      const options: DeploySafeProps['options'] = isEIP1559
+      const options: TransactionOptions = isEIP1559
         ? {
             maxFeePerGas: maxFeePerGas?.toString(),
             maxPriorityFeePerGas: maxPriorityFeePerGas?.toString(),
@@ -290,7 +290,7 @@ const ReviewStep = ({ data, onSubmit, onBack, setStep }: StepRenderProps<NewSafe
 
       const onSubmitCallback = async (taskId?: string, txHash?: string) => {
         // Create a counterfactual Safe
-        replayCounterfactualSafeDeployment(chain.chainId, safeAddress, props, data.name, dispatch, payMethod)
+        replayCounterfactualSafeDeployment(chain.chainId, safeAddress, props, dispatch, payMethod)
 
         if (taskId) {
           safeCreationDispatch(SafeCreationEvent.RELAYING, { groupKey: CF_TX_GROUP_KEY, taskId, safeAddress })
@@ -317,7 +317,6 @@ const ReviewStep = ({ data, onSubmit, onBack, setStep }: StepRenderProps<NewSafe
         await createNewSafe(
           wallet.provider,
           props,
-          data.safeVersion,
           chain,
           options,
           (txHash) => {

src/components/new-safe/create/steps/SetNameStep/index.tsx

@@ -13,7 +13,7 @@ import MUILink from '@mui/material/Link'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import NoWalletConnectedWarning from '../../NoWalletConnectedWarning'
-import { type SafeVersion } from '@safe-global/safe-core-sdk-types'
+import { type SafeVersion } from '@safe-global/types-kit'
 import { useCurrentChain } from '@/hooks/useChains'
 import { useEffect } from 'react'
 import { getLatestSafeVersion } from '@/utils/chains'

src/components/new-safe/create/useEstimateSafeCreationGas.ts

@@ -3,7 +3,7 @@ import useWallet from '@/hooks/wallets/useWallet'
 import useAsync from '@/hooks/useAsync'
 import { useCurrentChain } from '@/hooks/useChains'
 import { estimateSafeCreationGas } from '@/components/new-safe/create/logic'
-import { type SafeVersion } from '@safe-global/safe-core-sdk-types'
+import { type SafeVersion } from '@safe-global/types-kit'
 import { type UndeployedSafeProps } from '@/store/slices'
 
 export const useEstimateSafeCreationGas = (

src/components/sidebar/SafeListContextMenu/MultiAccountContextMenu.tsx

@@ -94,13 +94,7 @@ const MultiAccountContextMenu = ({
       )}
 
       {open[ModalType.ADD_CHAIN] && (
-        <CreateSafeOnNewChain
-          onClose={handleCloseModal}
-          currentName={name}
-          deployedChainIds={chainIds}
-          open
-          safeAddress={address}
-        />
+        <CreateSafeOnNewChain onClose={handleCloseModal} deployedChainIds={chainIds} open safeAddress={address} />
       )}
     </>
   )

src/components/sidebar/SafeListContextMenu/index.tsx

@@ -122,13 +122,7 @@ const SafeListContextMenu = ({
       )}
 
       {open[ModalType.ADD_CHAIN] && (
-        <CreateSafeOnNewChain
-          onClose={handleCloseModal}
-          currentName={name}
-          deployedChainIds={[chainId]}
-          open
-          safeAddress={address}
-        />
+        <CreateSafeOnNewChain onClose={handleCloseModal} deployedChainIds={[chainId]} open safeAddress={address} />
       )}
     </>
   )

src/components/transactions/TxDetails/Summary/index.tsx

@@ -7,7 +7,7 @@ import type { TransactionDetails } from '@safe-global/safe-gateway-typescript-sd
 import { Operation } from '@safe-global/safe-gateway-typescript-sdk'
 import { dateString } from '@/utils/formatters'
 import css from './styles.module.css'
-import type { SafeTransaction } from '@safe-global/safe-core-sdk-types'
+import type { SafeTransaction } from '@safe-global/types-kit'
 import SafeTxGasForm from '../SafeTxGasForm'
 import DecodedData from '../TxData/DecodedData'
 

src/components/tx-flow/SafeTxProvider.tsx

@@ -1,6 +1,6 @@
 import { createContext, useState, useEffect, useCallback } from 'react'
 import type { Dispatch, ReactNode, SetStateAction, ReactElement } from 'react'
-import type { SafeTransaction } from '@safe-global/safe-core-sdk-types'
+import type { SafeTransaction } from '@safe-global/types-kit'
 import { createTx } from '@/services/tx/tx-sender'
 import { useRecommendedNonce, useSafeTxGas } from '../tx/SignOrExecuteForm/hooks'
 import { Errors, logError } from '@/services/exceptions'

src/components/tx-flow/flows/ConfirmBatch/index.tsx

@@ -3,8 +3,8 @@ import { type TransactionDetails } from '@safe-global/safe-gateway-typescript-sd
 import SignOrExecuteForm from '@/components/tx/SignOrExecuteForm'
 import { createMultiSendCallOnlyTx } from '@/services/tx/tx-sender'
 import { SafeTxContext } from '../../SafeTxProvider'
-import type { MetaTransactionData } from '@safe-global/safe-core-sdk-types'
-import { OperationType } from '@safe-global/safe-core-sdk-types'
+import type { MetaTransactionData } from '@safe-global/types-kit'
+import { OperationType } from '@safe-global/types-kit'
 import TxLayout from '../../common/TxLayout'
 import BatchIcon from '@/public/images/common/batch.svg'
 import { useDraftBatch } from '@/hooks/useDraftBatch'

src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx

@@ -86,7 +86,7 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => {
 
   const [multisendContractAddress = ''] = useAsync(async () => {
     if (!multiSendContract) return ''
-    return await multiSendContract.getAddress()
+    return multiSendContract.getAddress()
   }, [multiSendContract])
 
   const [multiSendTxs] = useAsync(async () => {
@@ -96,7 +96,7 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => {
 
   const multiSendTxData = useMemo(() => {
     if (!txsWithDetails || !multiSendTxs) return
-    return encodeMultiSendData(multiSendTxs)
+    return encodeMultiSendData(multiSendTxs) as `0x${string}`
   }, [txsWithDetails, multiSendTxs])
 
   const onExecute = async () => {
@@ -115,7 +115,6 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => {
       multiSendTxData,
       wallet.provider,
       wallet.address,
-      safe.address.value,
       overrides as Overrides & { nonce: number },
       safe.nonce,
     )

src/components/tx-flow/flows/SafeAppsTx/ReviewSafeAppsTx.tsx

@@ -1,7 +1,7 @@
 import useWallet from '@/hooks/wallets/useWallet'
 import { useContext, useEffect, useMemo } from 'react'
 import type { ReactElement } from 'react'
-import type { SafeTransaction } from '@safe-global/safe-core-sdk-types'
+import type { SafeTransaction } from '@safe-global/types-kit'
 import SignOrExecuteForm from '@/components/tx/SignOrExecuteForm'
 import type { SafeAppsTxParams } from '.'
 import { trackSafeAppTxCount } from '@/services/safe-apps/track-app-usage-count'

src/components/tx-flow/flows/SignMessageOnChain/ReviewSignMessageOnChain.tsx

@@ -7,7 +7,7 @@ import { Box } from '@mui/system'
 import { Typography, SvgIcon } from '@mui/material'
 import WarningIcon from '@/public/images/notifications/warning.svg'
 import { type EIP712TypedData, Methods, type RequestId } from '@safe-global/safe-apps-sdk'
-import { OperationType } from '@safe-global/safe-core-sdk-types'
+import { OperationType } from '@safe-global/types-kit'
 
 import SendFromBlock from '@/components/tx/SendFromBlock'
 import { InfoDetails } from '@/components/transactions/InfoDetails'
@@ -56,7 +56,7 @@ const ReviewSignMessageOnChain = ({ message, method, requestId }: SignMessageOnC
 
   useEffect(() => {
     if (!readOnlySignMessageLibContract) return
-    readOnlySignMessageLibContract.getAddress().then(setSignMessageAddress)
+    setSignMessageAddress(readOnlySignMessageLibContract.getAddress())
   }, [readOnlySignMessageLibContract])
 
   const [decodedMessage, readableMessage] = useMemo(() => {
@@ -75,7 +75,9 @@ const ReviewSignMessageOnChain = ({ message, method, requestId }: SignMessageOnC
     if (!readOnlySignMessageLibContract) return
 
     if (isTextMessage) {
-      txData = readOnlySignMessageLibContract.encode('signMessage', [hashMessage(getDecodedMessage(message))])
+      txData = readOnlySignMessageLibContract.encode('signMessage', [
+        hashMessage(getDecodedMessage(message)) as `0x${string}`,
+      ])
     } else if (isTypedMessage) {
       const typesCopy = { ...message.types }
 

src/components/tx-flow/flows/SuccessScreen/index.tsx

@@ -16,7 +16,7 @@ import { IndexingStatus } from '@/components/tx-flow/flows/SuccessScreen/statuse
 import { DefaultStatus } from '@/components/tx-flow/flows/SuccessScreen/statuses/DefaultStatus'
 import useDecodeTx from '@/hooks/useDecodeTx'
 import { isSwapConfirmationViewOrder } from '@/utils/transaction-guards'
-import type { SafeTransaction } from '@safe-global/safe-core-sdk-types'
+import type { SafeTransaction } from '@safe-global/types-kit'
 import { getTxLink } from '@/utils/tx-link'
 
 interface Props {