useCallback in Extrinsic & Proposal components (#2501)

This commit is contained in:
Jaco Greeff 2020-04-01 16:23:00 +02:00 committed by GitHub
parent e3e68342ed
commit 82d53d1af3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 35 deletions

View File

@ -7,7 +7,7 @@ import { BareProps } from '@polkadot/react-components/types';
import { RawParam } from '@polkadot/react-params/types';
import { TypeDef } from '@polkadot/types/types';
import React, { useEffect, useState } from 'react';
import React, { useCallback, useEffect, useState } from 'react';
import { GenericCall, getTypeDef } from '@polkadot/types';
import { InputExtrinsic } from '@polkadot/react-components';
import Params from '@polkadot/react-params';
@ -63,7 +63,10 @@ function ExtrinsicDisplay ({ defaultValue, isDisabled, isError, isPrivate, label
onChange(method);
}, [extrinsic, onChange, values]);
const _onChangeMethod = (fn: SubmittableExtrinsicFunction<'promise'>): void => setCall({ fn, params: getParams(fn) });
const _onChangeMethod = useCallback(
(fn: SubmittableExtrinsicFunction<'promise'>): void => setCall({ fn, params: getParams(fn) }),
[]
);
const { fn: { meta, method, section }, params } = extrinsic;

View File

@ -6,7 +6,7 @@ import { SubmittableExtrinsic, SubmittableExtrinsicFunction } from '@polkadot/ap
import { RawParamOnChange, RawParamOnEnter, RawParamOnEscape } from '@polkadot/react-params/types';
import { BareProps } from '../types';
import React from 'react';
import React, { useCallback } from 'react';
import BaseExtrinsic from '../Extrinsic';
@ -22,17 +22,15 @@ interface Props extends BareProps {
withLabel?: boolean;
}
function onChange ({ onChange }: Props): (method?: SubmittableExtrinsic<'promise'>) => void {
return (method?: SubmittableExtrinsic<'promise'>): void => {
onChange && onChange({
isValid: !!method,
value: method
});
};
}
function ExtrinsicDisplay (props: Props): React.ReactElement<Props> {
const { className, defaultValue, isDisabled, isError, isPrivate, label, onEnter, onEscape, style, withLabel } = props;
function ExtrinsicDisplay ({ className, defaultValue, isDisabled, isError, isPrivate, label, onChange, onEnter, onEscape, style, withLabel }: Props): React.ReactElement<Props> {
const _onChange = useCallback(
(method?: SubmittableExtrinsic<'promise'>): void =>
onChange && onChange({
isValid: !!method,
value: method
}),
[onChange]
);
return (
<BaseExtrinsic
@ -42,7 +40,7 @@ function ExtrinsicDisplay (props: Props): React.ReactElement<Props> {
isError={isError}
isPrivate={isPrivate}
label={label}
onChange={onChange(props)}
onChange={_onChange}
onEnter={onEnter}
onEscape={onEscape}
style={style}

View File

@ -4,31 +4,29 @@
import { Props, RawParam } from '@polkadot/react-params/types';
import React from 'react';
import { createType } from '@polkadot/types';
import React, { useCallback } from 'react';
import { registry } from '@polkadot/react-api';
import { useApi } from '@polkadot/react-hooks';
import ExtrinsicDisplay from './Extrinsic';
function onChange ({ onChange }: Props): (_: RawParam) => void {
return function ({ isValid, value }: RawParam): void {
let proposal = null;
if (isValid && value) {
proposal = createType(registry, 'Proposal', value);
}
onChange && onChange({
isValid,
value: proposal
});
};
}
function ProposalDisplay (props: Props): React.ReactElement<Props> {
function ProposalDisplay ({ className, isDisabled, isError, label, onChange, onEnter, onEscape, style, withLabel }: Props): React.ReactElement<Props> {
const { apiDefaultTxSudo } = useApi();
const { className, isDisabled, isError, label, onEnter, onEscape, style, withLabel } = props;
const _onChange = useCallback(
({ isValid, value }: RawParam): void => {
let proposal = null;
if (isValid && value) {
proposal = registry.createType('Proposal', value);
}
onChange && onChange({
isValid,
value: proposal
});
},
[onChange]
);
return (
<ExtrinsicDisplay
@ -38,7 +36,7 @@ function ProposalDisplay (props: Props): React.ReactElement<Props> {
isError={isError}
isPrivate
label={label}
onChange={onChange(props)}
onChange={_onChange}
onEnter={onEnter}
onEscape={onEscape}
style={style}