fix: Show hexData if there are no parameters

safe-global · Dec 6, 2024 · 26dd98d · 26dd98d
1 parent c300545
commit 26dd98d
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 14 deletions.
diff --git a/src/components/transactions/TxDetails/TxData/DecodedData/MethodDetails/index.tsx b/src/components/transactions/TxDetails/TxData/DecodedData/MethodDetails/index.tsx
@@ -1,3 +1,4 @@
+import { HexEncodedData } from '@/components/transactions/HexEncodedData'
 import type { ReactElement } from 'react'
 import { generateDataRowValue, TxDataRow } from '@/components/transactions/TxDetails/Summary/TxDataRow'
 import { isAddress, isArrayParameter, isByte } from '@/utils/transaction-guards'
@@ -7,21 +8,25 @@ import { Value } from '@/components/transactions/TxDetails/TxData/DecodedData/Va
 
 type MethodDetailsProps = {
   data: DataDecoded
+  hexData?: string
   addressInfoIndex?: {
     [key: string]: AddressEx
   }
 }
 
-export const MethodDetails = ({ data, addressInfoIndex }: MethodDetailsProps): ReactElement => {
+export const MethodDetails = ({ data, hexData, addressInfoIndex }: MethodDetailsProps): ReactElement => {
   if (!data.parameters?.length) {
     return (
-      <Typography
-        sx={{
-          color: 'text.secondary',
-        }}
-      >
-        No parameters
-      </Typography>
+      <>
+        <Typography
+          sx={{
+            color: 'text.secondary',
+          }}
+        >
+          No parameters
+        </Typography>
+        {hexData && <HexEncodedData title="Data (hex-encoded)" hexData={hexData} />}
+      </>
     )
   }
 

diff --git a/src/components/transactions/TxDetails/TxData/DecodedData/index.test.tsx b/src/components/transactions/TxDetails/TxData/DecodedData/index.test.tsx
@@ -9,12 +9,12 @@ describe('DecodedData', () => {
   })
 
   it('shows an Interact with block if there is no txData but toInfo', () => {
-    const { getByText } = render(<DecodedData txData={undefined} toInfo={{ value: '0x123', name: 'Test' }} />)
+    const { getByText } = render(<DecodedData txData={undefined} toInfo={{ value: '0x123' }} />)
 
     expect(getByText('Interact with')).toBeInTheDocument()
   })
 
-  it('shows Hex encoded data if no method name exists or there are no parameters', () => {
+  it('shows Hex encoded data if there are no parameters', () => {
     const mockTxData = {
       to: {
         value: '0x874E2190e6B10f5173F00E27E6D5D9F90b7664C4',
@@ -30,8 +30,48 @@ describe('DecodedData', () => {
       trustedDelegateCallTarget: false,
     }
 
-    const { getByText } = render(<DecodedData txData={mockTxData} toInfo={{ value: '0x123', name: 'Test' }} />)
+    const { getByText } = render(<DecodedData txData={mockTxData} toInfo={{ value: '0x123' }} />)
 
+    expect(getByText('No parameters')).toBeInTheDocument()
+    expect(getByText('Data (hex-encoded)')).toBeInTheDocument()
+  })
+
+  it('does not show Hex encoded data if there is none', () => {
+    const mockTxData = {
+      to: {
+        value: '0x874E2190e6B10f5173F00E27E6D5D9F90b7664C4',
+      },
+      value: '0',
+      operation: 0,
+      dataDecoded: {
+        method: 'mint',
+        parameters: [],
+      },
+      hexData: '',
+      trustedDelegateCallTarget: false,
+    }
+
+    const { getByText, queryByText } = render(<DecodedData txData={mockTxData} toInfo={{ value: '0x123' }} />)
+
+    expect(getByText('No parameters')).toBeInTheDocument()
+    expect(queryByText('Data (hex-encoded)')).not.toBeInTheDocument()
+  })
+
+  it('only shows Hex encoded data if no decodedData exists', () => {
+    const mockTxData = {
+      to: {
+        value: '0x874E2190e6B10f5173F00E27E6D5D9F90b7664C4',
+      },
+      value: '0',
+      operation: 0,
+      hexData:
+        '0x895a74850000000000000000000000000000000000000000000004bb752b4d22ab390000000000000000000000000000000000000000000000000000000000000000000b00000000000000000000000000000001f76adba2311f154678f5e5605db5c9c2',
+      trustedDelegateCallTarget: false,
+    }
+
+    const { getByText, queryByText } = render(<DecodedData txData={mockTxData} toInfo={{ value: '0x123' }} />)
+
+    expect(queryByText('No parameters')).not.toBeInTheDocument()
     expect(getByText('Data (hex-encoded)')).toBeInTheDocument()
   })
 })
diff --git a/src/components/transactions/TxDetails/TxData/DecodedData/index.tsx b/src/components/transactions/TxDetails/TxData/DecodedData/index.tsx
@@ -47,11 +47,12 @@ export const DecodedData = ({ txData, toInfo }: Props): ReactElement | null => {
     ? 'this Safe Account'
     : addressInfo?.name || toInfo?.name || txData.to.name
   const avatar = addressInfo?.logoUri || toInfo?.logoUri || txData.to.logoUri
-  const isFallback = !method || txData?.dataDecoded?.parameters?.length === 0
 
   let decodedData = <></>
-  if (txData.dataDecoded && !isFallback) {
-    decodedData = <MethodDetails data={txData.dataDecoded} addressInfoIndex={txData.addressInfoIndex} />
+  if (txData.dataDecoded) {
+    decodedData = (
+      <MethodDetails data={txData.dataDecoded} hexData={txData.hexData} addressInfoIndex={txData.addressInfoIndex} />
+    )
   } else if (txData.hexData) {
     // When no decoded data, display raw hex data
     decodedData = <HexEncodedData title="Data (hex-encoded)" hexData={txData.hexData} />