fix: Don't break array elements in tx details into multiple lines if …

…empty (#4571)
safe-global · Nov 28, 2024 · 047f45d · 047f45d
1 parent 9f5ab1e
commit 047f45d
Showing 1 changed file with 19 additions and 17 deletions.
diff --git a/src/components/transactions/TxDetails/TxData/DecodedData/ValueArray/index.tsx b/src/components/transactions/TxDetails/TxData/DecodedData/ValueArray/index.tsx
@@ -35,24 +35,26 @@ export const Value = ({ type, value, ...props }: ValueArrayProps): ReactElement
     return (
       <Typography component="div" variant="body2">
         [
-        <div className={css.nestedWrapper}>
-          {parsedValue.map((address, index) => {
-            const key = `${props.key || props.method}-${index}`
-            if (Array.isArray(address)) {
-              const newProps = {
-                type,
-                ...props,
-                value: address,
+        {parsedValue.length > 0 && (
+          <div className={css.nestedWrapper}>
+            {parsedValue.map((address, index) => {
+              const key = `${props.key || props.method}-${index}`
+              if (Array.isArray(address)) {
+                const newProps = {
+                  type,
+                  ...props,
+                  value: address,
+                }
+                return <Value key={key} {...newProps} />
               }
-              return <Value key={key} {...newProps} />
-            }
-            return (
-              <div key={`${address}_${key}`}>
-                <EthHashInfo address={address} showAvatar={false} shortAddress={false} showCopyButton hasExplorer />
-              </div>
-            )
-          })}
-        </div>
+              return (
+                <div key={`${address}_${key}`}>
+                  <EthHashInfo address={address} showAvatar={false} shortAddress={false} showCopyButton hasExplorer />
+                </div>
+              )
+            })}
+          </div>
+        )}
         ]
       </Typography>
     )