Ensure Option params are correctly filled from decoded (#7585)

This commit is contained in:
Jaco 2022-05-16 07:07:46 +02:00 committed by GitHub
parent d174e47305
commit a1129933c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,10 +1,10 @@
// Copyright 2017-2022 @polkadot/react-params authors & contributors
// SPDX-License-Identifier: Apache-2.0
import type { TypeDef } from '@polkadot/types/types';
import type { Codec, TypeDef } from '@polkadot/types/types';
import type { Props } from '../types';
import React, { useEffect, useMemo, useState } from 'react';
import React, { useEffect, useState } from 'react';
import styled from 'styled-components';
import { Toggle } from '@polkadot/react-components';
@ -13,17 +13,19 @@ import { Option } from '@polkadot/types';
import { useTranslation } from '../translate';
import Param from './index';
const DEF_VALUE = { isValid: true, value: undefined };
function OptionDisplay ({ className = '', defaultValue: _defaultValue, isDisabled, name, onChange, onEnter, onEscape, registry, type: { sub, withOptionActive } }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [isActive, setIsActive] = useState(withOptionActive || false);
const defaultValue = useMemo(
() => isDisabled
? _defaultValue && _defaultValue.value instanceof Option && _defaultValue.value.isSome
? { isValid: _defaultValue.isValid, value: _defaultValue.value.unwrap() }
: { isValid: _defaultValue.isValid, value: undefined }
: _defaultValue,
[_defaultValue, isDisabled]
const [isActive, setIsActive] = useState(() => withOptionActive || !!(_defaultValue && _defaultValue.value instanceof Option && _defaultValue.value.isSome) || false);
const [defaultValue] = useState(
() => isActive || isDisabled
? _defaultValue && (
_defaultValue.value instanceof Option && _defaultValue.value.isSome
? { isValid: _defaultValue.isValid, value: (_defaultValue.value as Option<Codec>).unwrap() }
: DEF_VALUE
)
: DEF_VALUE
);
useEffect((): void => {
@ -36,7 +38,7 @@ function OptionDisplay ({ className = '', defaultValue: _defaultValue, isDisable
return (
<div className={className}>
<Param
defaultValue={defaultValue}
defaultValue={isActive ? defaultValue : DEF_VALUE}
isDisabled={isDisabled || !isActive}
isInOption
isOptional={!isActive && !isDisabled}