parse nested arrays from user input

ui/address/contract/ContractMethodCallable.tsx

@@ -20,7 +20,7 @@ interface ResultComponentProps<T extends SmartContractMethod> {
 
 interface Props<T extends SmartContractMethod> {
   data: T;
-  onSubmit: (data: T, args: Array<string | Array<string>>) => Promise<ContractMethodCallResult<T>>;
+  onSubmit: (data: T, args: Array<string | Array<unknown>>) => Promise<ContractMethodCallResult<T>>;
   ResultComponent: (props: ResultComponentProps<T>) => JSX.Element | null;
   isWrite?: boolean;
 }
@@ -44,13 +44,23 @@ const sortFields = (data: Array<SmartContractMethodInput>) => ([ a ]: [string, s
 };
 
 const castFieldValue = (data: Array<SmartContractMethodInput>) => ([ key, value ]: [ string, string ], index: number) => {
-  if (data[index].type.includes('[]')) {
+  if (data[index].type.includes('[')) {
     return [ key, parseArrayValue(value) ];
   }
   return [ key, value ];
 };
 
-const parseArrayValue = (value: string) => value.replace(/(\[|\])|\s/g, '').split(',');
+const parseArrayValue = (value: string) => {
+  try {
+    const parsedResult = JSON.parse(value);
+    if (Array.isArray(parsedResult)) {
+      return parsedResult;
+    }
+    throw new Error('Not an array');
+  } catch (error) {
+    return '';
+  }
+};
 
 const ContractMethodCallable = <T extends SmartContractMethod>({ data, onSubmit, ResultComponent, isWrite }: Props<T>) => {
 

ui/address/contract/ContractRead.tsx

@@ -38,7 +38,7 @@ const ContractRead = ({ addressHash, isProxy, isCustomAbi }: Props) => {
     },
   });
 
-  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractReadMethod, args: Array<string | Array<string>>) => {
+  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractReadMethod, args: Array<string | Array<unknown>>) => {
     return apiFetch<'contract_method_query', SmartContractQueryMethodRead>('contract_method_query', {
       pathParams: { hash: addressHash },
       queryParams: {

ui/address/contract/ContractWrite.tsx

@@ -51,7 +51,7 @@ const ContractWrite = ({ addressHash, isProxy, isCustomAbi }: Props) => {
     return contract;
   })();
 
-  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractWriteMethod, args: Array<string | Array<string>>) => {
+  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractWriteMethod, args: Array<string | Array<unknown>>) => {
     if (!isConnected) {
       throw new Error('Wallet is not connected');
     }

ui/address/contract/utils.ts

@@ -2,13 +2,18 @@ import BigNumber from 'bignumber.js';
 
 import config from 'configs/app/config';
 
-export const getNativeCoinValue = (value: string | Array<string>) => {
+export const getNativeCoinValue = (value: string | Array<unknown>) => {
   const _value = Array.isArray(value) ? value[0] : value;
+
+  if (typeof _value !== 'string') {
+    return '0';
+  }
+
   return BigNumber(_value).times(10 ** config.network.currency.decimals).toString();
 };
 
 export const addZeroesAllowed = (valueType: string) => {
-  if (valueType.includes('[]')) {
+  if (valueType.includes('[')) {
     return false;
   }