diff --git a/packages/react-components/src/InputExtrinsic/index.tsx b/packages/react-components/src/InputExtrinsic/index.tsx index eb7272d51a..b6b52035bb 100644 --- a/packages/react-components/src/InputExtrinsic/index.tsx +++ b/packages/react-components/src/InputExtrinsic/index.tsx @@ -31,6 +31,7 @@ function InputExtrinsic ({ className = '', defaultValue, help, isDisabled, label const [optionsMethod, setOptionsMethod] = useState(() => methodOptions(api, defaultValue.section)); const [optionsSection] = useState(() => sectionOptions(api)); const [value, setValue] = useState>((): SubmittableExtrinsicFunction<'promise'> => defaultValue); + const [{ defaultMethod, defaultSection }] = useState(() => ({ defaultMethod: defaultValue.method, defaultSection: defaultValue.section })); const _onKeyChange = useCallback( (newValue: SubmittableExtrinsicFunction<'promise'>): void => { @@ -64,7 +65,7 @@ function InputExtrinsic ({ className = '', defaultValue, help, isDisabled, label > { +function Call ({ className = '', defaultValue, isDisabled, isError, label, onChange, onEnter, onEscape, withLabel }: Props): React.ReactElement { const { api, apiDefaultTx } = useApi(); - const defaultValue = ((): SubmittableExtrinsicFunction<'promise'> => { - try { - return api.tx.balances.transfer; - } catch (error) { - return apiDefaultTx; + const [initialValue] = useState( + (): SubmittableExtrinsicFunction<'promise'> => { + try { + return defaultValue && defaultValue.value + ? defaultValue.value as SubmittableExtrinsicFunction<'promise'> + : api.tx.balances.transfer; + } catch (error) { + return apiDefaultTx; + } } - })(); + ); return ( { + const [defaultArgs] = useState( + () => defaultValue && defaultValue.args && defaultValue.args.map((value): RawParam => ({ + isValid: true, + value + })) + ); + const _onChange = useCallback( (method?: SubmittableExtrinsic<'promise'>): void => onChange && onChange({ @@ -34,6 +41,7 @@ function ExtrinsicDisplay ({ className = '', defaultValue, isDisabled, isError, return ( { const { t } = useTranslation(); const [defaultValue] = useState( - value - ? isDisabled && isU8a(value) && isAscii(value) - ? u8aToString(value) - : isHex(value) - ? value - : u8aToHex(value as Uint8Array) - : undefined + (): string | undefined => { + if (value) { + const u8a = u8aToU8a(value as Uint8Array); + + return isAscii(u8a) + ? u8aToString(u8a) + : u8aToHex(u8a); + } + + return undefined; + } ); const [{ isAddress, isValid, lastValue }, setValidity] = useState(() => ({ isAddress: false, - isValid: isHex(defaultValue) + isValid: isHex(defaultValue) || isAscii(defaultValue) })); const _onChange = useCallback(