Impossible to send empty strings in parameters on Blockscout UI (#2666)

* Impossible to send empty strings in parameters on Blockscout UI

Fixes #2647

* fix test

ui/address/contract/methods/form/ContractMethodFieldLabel.tsx

@@ -3,6 +3,8 @@ import React from 'react';
 
 import type { ContractAbiItemInput } from '../types';
 
+import Hint from 'ui/shared/Hint';
+
 import { getFieldLabel } from './utils';
 
 interface Props {
@@ -20,8 +22,10 @@ const ContractMethodFieldLabel = ({ data, isOptional, level }: Props) => {
       flexShrink={ 0 }
       fontWeight={ 500 }
       color={ level > 1 ? { _light: 'blackAlpha.600', _dark: 'whiteAlpha.600' } : undefined }
+      wordBreak="break-all"
     >
       { getFieldLabel(data, !isOptional) }
+      { data.type === 'string' && <Hint label={ `The "" string will be treated as an empty string` } ml={ 2 }/> }
     </Box>
   );
 };

ui/address/contract/methods/form/utils.test.ts

@@ -97,4 +97,32 @@ describe('transformFormDataToMethodArgs', () => {
       [],
     ]);
   });
+
+  it('should cast empty strings', () => {
+    const formData = {
+      '0': '""',
+      '1': '0x1D415D28380ff51A507F7B176ca5F27833F7FffD',
+      '2': '3160',
+      '3': true,
+      // nested elements
+      '4:0:0:0': undefined,
+      '4:0:1:0': '', // <<< not real case, the form will not allow to submit this value
+      '4:0:1:1': '""',
+      '4:0:1:2': '0',
+      '4:0:1:3': false,
+    };
+    const result = transformFormDataToMethodArgs(formData);
+    expect(result).toEqual([
+      '',
+      '0x1D415D28380ff51A507F7B176ca5F27833F7FffD',
+      '3160',
+      true,
+      [
+        [
+          [],
+          [ '', '', '0', false ],
+        ],
+      ],
+    ]);
+  });
 });

ui/address/contract/methods/form/utils.ts

@@ -78,7 +78,8 @@ export function transformFormDataToMethodArgs(formData: ContractMethodFormFields
 
   for (const field in formData) {
     const value = formData[field];
-    set(result, field.replaceAll(':', '.'), value);
+    const castedValue = castValue(value);
+    set(result, field.replaceAll(':', '.'), castedValue);
   }
 
   const filteredResult = filterOutEmptyItems(result);
@@ -86,6 +87,18 @@ export function transformFormDataToMethodArgs(formData: ContractMethodFormFields
   return mappedResult;
 }
 
+function castValue(value: unknown): unknown {
+  if (typeof value === 'string') {
+    return value === '""' ? '' : value;
+  }
+
+  if (Array.isArray(value)) {
+    return value.map(castValue);
+  }
+
+  return value;
+}
+
 function filterOutEmptyItems(array: Array<unknown>): Array<unknown> {
   // The undefined value may occur in two cases:
   //    1. When an optional form field is left blank by the user.