diff --git a/packages/react-components/src/Extrinsic.tsx b/packages/react-components/src/Extrinsic.tsx index 020a501115..e7a65725db 100644 --- a/packages/react-components/src/Extrinsic.tsx +++ b/packages/react-components/src/Extrinsic.tsx @@ -8,10 +8,10 @@ import { TypeDef } from '@polkadot/types/types'; 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'; import { isUndefined } from '@polkadot/util'; +import InputExtrinsic from './InputExtrinsic'; import paramComponents from './Params'; interface Props { diff --git a/packages/react-components/src/Params/OpaqueCall.tsx b/packages/react-components/src/Params/OpaqueCall.tsx new file mode 100644 index 0000000000..16ef78a0d5 --- /dev/null +++ b/packages/react-components/src/Params/OpaqueCall.tsx @@ -0,0 +1,48 @@ +// Copyright 2017-2020 @polkadot/app-extrinsics authors & contributors +// This software may be modified and distributed under the terms +// of the Apache-2.0 license. See the LICENSE file for details. + +import { SubmittableExtrinsic } from '@polkadot/api/types'; +import { Props, RawParam } from '@polkadot/react-params/types'; + +import React, { useCallback } from 'react'; +import { useApi } from '@polkadot/react-hooks'; + +import ExtrinsicDisplay from './Extrinsic'; + +function OpaqueCall ({ className = '', isDisabled, isError, label, onChange, onEnter, onEscape, withLabel }: Props): React.ReactElement { + const { apiDefaultTxSudo } = useApi(); + + const _onChange = useCallback( + ({ isValid, value }: RawParam): void => { + let callData = null; + + if (isValid && value) { + callData = (value as SubmittableExtrinsic<'promise'>).method.toHex(); + } + + onChange && onChange({ + isValid, + value: callData + }); + }, + [onChange] + ); + + return ( + + ); +} + +export default React.memo(OpaqueCall); diff --git a/packages/react-components/src/Params/Proposal.tsx b/packages/react-components/src/Params/Proposal.tsx index f239ed4ad8..7d2eafa0ab 100644 --- a/packages/react-components/src/Params/Proposal.tsx +++ b/packages/react-components/src/Params/Proposal.tsx @@ -12,6 +12,7 @@ import ExtrinsicDisplay from './Extrinsic'; function ProposalDisplay ({ className = '', isDisabled, isError, label, onChange, onEnter, onEscape, withLabel }: Props): React.ReactElement { const { apiDefaultTxSudo } = useApi(); + const _onChange = useCallback( ({ isValid, value }: RawParam): void => { let proposal = null; diff --git a/packages/react-components/src/Params/index.ts b/packages/react-components/src/Params/index.ts index 91f065b9ea..13fd30e9f4 100644 --- a/packages/react-components/src/Params/index.ts +++ b/packages/react-components/src/Params/index.ts @@ -5,10 +5,12 @@ import { ComponentMap } from '@polkadot/react-params/types'; import Call from './Call'; +import OpaqueCall from './OpaqueCall'; import Proposal from './Proposal'; const components: ComponentMap = { Call, + OpaqueCall, Proposal }; diff --git a/packages/react-params/src/Param/OpaqueCall.tsx b/packages/react-params/src/Param/OpaqueCall.tsx new file mode 100644 index 0000000000..fe015fae7c --- /dev/null +++ b/packages/react-params/src/Param/OpaqueCall.tsx @@ -0,0 +1,31 @@ +// Copyright 2017-2020 @polkadot/react-components authors & contributors +// This software may be modified and distributed under the terms +// of the Apache-2.0 license. See the LICENSE file for details. + +import { Props } from '../types'; + +import React from 'react'; +import { registry } from '@polkadot/react-api'; +import { Bytes } from '@polkadot/types'; + +import CallDisplay from './Call'; +import Unknown from './Unknown'; + +function OpaqueCall (props: Props): React.ReactElement { + if (!props.isDisabled) { + return ( + + ); + } + + const value = registry.createType('Call', (props.defaultValue.value as Bytes).toHex()); + + return ( + + ); +} + +export default React.memo(OpaqueCall); diff --git a/packages/react-params/src/Param/findComponent.ts b/packages/react-params/src/Param/findComponent.ts index 888ef111a3..34e29b0dc4 100644 --- a/packages/react-params/src/Param/findComponent.ts +++ b/packages/react-params/src/Param/findComponent.ts @@ -24,6 +24,7 @@ import KeyValue from './KeyValue'; import KeyValueArray from './KeyValueArray'; import Moment from './Moment'; import Null from './Null'; +import OpaqueCall from './OpaqueCall'; import Option from './Option'; import Raw from './Raw'; import Struct from './Struct'; @@ -56,6 +57,7 @@ const componentDef: TypeToComponent[] = [ { c: KeyValueArray, t: ['Vec'] }, { c: Moment, t: ['Moment', 'MomentOf'] }, { c: Null, t: ['Null'] }, + { c: OpaqueCall, t: ['OpaqueCall'] }, { c: Option, t: ['Option'] }, { c: Text, t: ['String', 'Text'] }, { c: Struct, t: ['Struct'] },