Refactor: message origin instead of safeAppId

package.json

@@ -58,7 +58,7 @@
     "@safe-global/protocol-kit": "^4.1.3",
     "@safe-global/safe-apps-sdk": "^9.1.0",
     "@safe-global/safe-client-gateway-sdk": "v1.60.1",
-    "@safe-global/safe-gateway-typescript-sdk": "3.22.4",
+    "@safe-global/safe-gateway-typescript-sdk": "3.22.6-beta.0",
     "@safe-global/safe-modules-deployments": "^2.2.1",
     "@sentry/react": "^7.91.0",
     "@spindl-xyz/attribution-lite": "^1.4.0",

src/components/tx-flow/flows/SignMessage/SignMessage.test.tsx

@@ -221,7 +221,7 @@ describe('SignMessage', () => {
         name="Test App"
         message="Hello world!"
         requestId="123"
-        safeAppId={25}
+        origin="http://localhost:3000"
       />,
     )
 
@@ -253,7 +253,7 @@ describe('SignMessage', () => {
       expect.objectContaining({
         safe: extendedSafeInfo,
         message: 'Hello world!',
-        safeAppId: 25,
+        origin: 'http://localhost:3000',
         //onboard: expect.anything(),
       }),
     )
@@ -362,7 +362,7 @@ describe('SignMessage', () => {
         name="Test App"
         message="Hello world!"
         requestId="123"
-        safeAppId={25}
+        origin="http://localhost:3000"
       />,
     )
 
@@ -384,7 +384,7 @@ describe('SignMessage', () => {
         name="Test App"
         message="Hello world!"
         requestId="123"
-        safeAppId={25}
+        origin="http://localhost:3000"
       />,
     )
 
@@ -409,7 +409,7 @@ describe('SignMessage', () => {
         name="Test App"
         message="Hello world!"
         requestId="123"
-        safeAppId={25}
+        origin="http://localhost:3000"
       />,
     )
 
@@ -491,7 +491,7 @@ describe('SignMessage', () => {
         name="Test App"
         message="Hello world!"
         requestId="123"
-        safeAppId={25}
+        origin="http://localhost:3000"
       />,
     )
 

src/components/tx-flow/flows/SignMessage/SignMessage.tsx

@@ -242,19 +242,12 @@ const SuccessCard = ({ safeMessage, onContinue }: { safeMessage: SafeMessage; on
 
 type BaseProps = Pick<SafeMessage, 'logoUri' | 'name' | 'message'>
 
-// Custom Safe Apps do not have a `safeAppId`
-export type ProposeProps = BaseProps & {
-  safeAppId?: number
-  requestId: RequestId
-}
-
-// A proposed message does not return the `safeAppId` but the `logoUri` and `name` of the Safe App that proposed it
-export type ConfirmProps = BaseProps & {
-  safeAppId?: never
+export type SignMessageProps = BaseProps & {
+  origin?: string
   requestId?: RequestId
 }
 
-const SignMessage = ({ message, safeAppId, requestId }: ProposeProps | ConfirmProps): ReactElement => {
+const SignMessage = ({ message, origin, requestId }: SignMessageProps): ReactElement => {
   // Hooks & variables
   const { setTxFlow } = useContext(TxModalContext)
   const { setSafeMessage: setContextSafeMessage } = useContext(SafeTxContext)
@@ -283,7 +276,7 @@ const SignMessage = ({ message, safeAppId, requestId }: ProposeProps | ConfirmPr
     decodedMessage,
     safeMessageHash,
     requestId,
-    safeAppId,
+    origin,
     () => setTxFlow(undefined),
   )
 

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

@@ -1,5 +1,5 @@
 import TxLayout from '@/components/tx-flow/common/TxLayout'
-import SignMessage, { type ConfirmProps, type ProposeProps } from '@/components/tx-flow/flows/SignMessage/SignMessage'
+import SignMessage, { type SignMessageProps } from '@/components/tx-flow/flows/SignMessage/SignMessage'
 import { getSwapTitle } from '@/features/swap'
 import { selectSwapParams } from '@/features/swap/store/swapParamsSlice'
 import { useAppSelector } from '@/store'
@@ -47,7 +47,7 @@ export const AppTitle = ({
   )
 }
 
-const SignMessageFlow = ({ ...props }: ProposeProps | ConfirmProps) => {
+const SignMessageFlow = ({ ...props }: SignMessageProps) => {
   return (
     <TxLayout
       title="Confirm message"

src/hooks/messages/useSyncSafeMessageSigner.ts

@@ -33,7 +33,7 @@ const useSyncSafeMessageSigner = (
   decodedMessage: string | EIP712TypedData,
   safeMessageHash: string,
   requestId: string | undefined,
-  safeAppId: number | undefined,
+  origin: string | undefined,
   onClose: () => void,
 ) => {
   const [submitError, setSubmitError] = useState<Error | undefined>()
@@ -60,7 +60,7 @@ const useSyncSafeMessageSigner = (
     try {
       // When collecting the first signature
       if (!message) {
-        await dispatchSafeMsgProposal({ provider: wallet.provider, safe, message: decodedMessage, safeAppId })
+        await dispatchSafeMsgProposal({ provider: wallet.provider, safe, message: decodedMessage, origin })
 
         // Fetch updated message
         const updatedMsg = await fetchSafeMessage(safeMessageHash, safe.chainId)
@@ -86,7 +86,7 @@ const useSyncSafeMessageSigner = (
     } catch (e) {
       setSubmitError(asError(e))
     }
-  }, [wallet, safe, message, decodedMessage, safeAppId, safeMessageHash, onClose, requestId])
+  }, [wallet, safe, message, decodedMessage, origin, safeMessageHash, onClose, requestId])
 
   return { submitError, onSign }
 }

src/hooks/safe-apps/useCustomAppCommunicator.tsx

@@ -92,7 +92,7 @@ export const useCustomAppCommunicator = (
             logoUri={appData?.iconUrl || ''}
             name={appData?.name || ''}
             message={message}
-            safeAppId={appData?.id}
+            origin={appData?.url}
             requestId={requestId}
           />,
           onTxFlowClose,

src/services/safe-messages/__tests__/safeMsgSender.test.ts

@@ -43,14 +43,14 @@ describe('safeMsgSender', () => {
         },
       } as unknown as gateway.SafeInfo
       const message = 'Hello world'
-      const safeAppId = 1
+      const origin = 'http://example.com'
 
-      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, safeAppId })
+      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, origin })
 
       expect(proposeSafeMessageSpy).toHaveBeenCalledWith('5', zeroPadValue('0x0789', 20), {
         message,
         signature: mockValidSignature,
-        safeAppId,
+        origin,
       })
 
       expect(safeMsgDispatchSpy).toHaveBeenCalledWith(events.SafeMsgEvent.PROPOSE, {
@@ -88,9 +88,9 @@ describe('safeMsgSender', () => {
           test: 'Hello World!',
         },
       }
-      const safeAppId = 1
+      const origin = 'http://example.com'
 
-      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, safeAppId })
+      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, origin })
 
       // Normalize message manually
       message.types['EIP712Domain'] = [
@@ -103,7 +103,7 @@ describe('safeMsgSender', () => {
       expect(proposeSafeMessageSpy).toHaveBeenCalledWith('5', zeroPadValue('0x0789', 20), {
         message,
         signature: mockValidSignature,
-        safeAppId,
+        origin,
       })
     })
 
@@ -125,15 +125,15 @@ describe('safeMsgSender', () => {
         },
       } as unknown as gateway.SafeInfo
       const message = 'Hello world'
-      const safeAppId = 1
+      const origin = 'http://example.com'
 
-      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, safeAppId })
+      await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, origin })
 
       expect(proposeSafeMessageSpy).toHaveBeenCalledWith('5', zeroPadValue('0x0789', 20), {
         message,
         // Even though the mock returns the signature with invalid V, the valid signature should get dispatched as we adjust invalid Vs
         signature: mockValidSignature,
-        safeAppId,
+        origin,
       })
 
       expect(safeMsgDispatchSpy).toHaveBeenCalledWith(events.SafeMsgEvent.PROPOSE, {
@@ -155,17 +155,17 @@ describe('safeMsgSender', () => {
         },
       } as unknown as gateway.SafeInfo
       const message = 'Hello world'
-      const safeAppId = 1
+      const origin = 'http://example.com'
 
       try {
-        await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, safeAppId })
+        await dispatchSafeMsgProposal({ provider: MockEip1193Provider, safe, message, origin })
       } catch (e) {
         expect((e as Error).message).toBe('Example error')
 
         expect(proposeSafeMessageSpy).toHaveBeenCalledWith('5', zeroPadValue('0x0789', 20), {
           message,
           signature: mockValidSignature,
-          safeAppId,
+          origin,
         })
 
         expect(safeMsgDispatchSpy).toHaveBeenCalledWith(events.SafeMsgEvent.PROPOSE_FAILED, {

src/services/safe-messages/safeMsgSender.ts

@@ -12,12 +12,12 @@ export const dispatchSafeMsgProposal = async ({
   provider,
   safe,
   message,
-  safeAppId,
+  origin = '',
 }: {
   provider: Eip1193Provider
   safe: SafeInfo
   message: SafeMessage['message']
-  safeAppId?: number
+  origin: string | undefined
 }): Promise<void> => {
   const messageHash = generateSafeMessageHash(safe, message)
 
@@ -33,7 +33,7 @@ export const dispatchSafeMsgProposal = async ({
     await proposeSafeMessage(safe.chainId, safe.address.value, {
       message: normalizedMessage,
       signature,
-      safeAppId,
+      origin,
     })
   } catch (error) {
     safeMsgDispatch(SafeMsgEvent.PROPOSE_FAILED, {

src/services/safe-wallet-provider/useSafeWalletProvider.tsx

@@ -90,9 +90,9 @@ export const useTxFlowApi = (chainId: string, safeAddress: string): WalletSDK |
             <SignMessageFlow
               logoUri={appInfo.iconUrl}
               name={appInfo.name}
+              origin={appInfo.url}
               message={message}
               requestId={id}
-              safeAppId={appInfo.id}
             />,
             onClose,
           )

src/tests/mocks/chains.ts

@@ -13,7 +13,7 @@ const contractAddresses = {
   simulateTxAccessorAddress: null,
 }
 
-const CONFIG_SERVICE_CHAINS: ChainInfo[] = [
+const CONFIG_SERVICE_CHAINS = [
   {
     transactionService: 'https://safe-transaction.mainnet.gnosis.io',
     contractAddresses,
@@ -648,6 +648,6 @@ const CONFIG_SERVICE_CHAINS: ChainInfo[] = [
       enabled: false,
     },
   },
-]
+] as unknown as ChainInfo[]
 
 export { CONFIG_SERVICE_CHAINS }

yarn.lock

@@ -4598,10 +4598,10 @@
   dependencies:
     semver "^7.6.2"
 
-"@safe-global/[email protected].4":
-  version "3.22.4"
-  resolved "https://registry.yarnpkg.com/@safe-global/safe-gateway-typescript-sdk/-/safe-gateway-typescript-sdk-3.22.4.tgz#9109a538df40f778666a3e6776e7a08c757e893d"
-  integrity sha512-Z7Z8w3GEJdJ/paF+NK23VN4AwqWPadq0AeRYjYLjIBiPWpRB2UO/FKq7ONABEq0YFgNPklazIV4IExQU1gavXA==
+"@safe-global/[email protected].6-beta.0":
+  version "3.22.6-beta.0"
+  resolved "https://registry.yarnpkg.com/@safe-global/safe-gateway-typescript-sdk/-/safe-gateway-typescript-sdk-3.22.6-beta.0.tgz#a71085f4084201bd0782f2e35f1222d9458b7dcc"
+  integrity sha512-Uix0cLfPahy1nGlfda5yA4vC/XS1yeKyQJQF9W2KE4kuCzSegLtdYWkBqCPQtRQj2snSlWk511paRzfa7QtGvA==
 
 "@safe-global/safe-gateway-typescript-sdk@^3.5.3":
   version "3.21.2"