132 lines
3.3 KiB
TypeScript
132 lines
3.3 KiB
TypeScript
// Copyright 2017-2019 @polkadot/app-storage 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 { TypeDef, getTypeDef } from '@polkadot/types';
|
|
import { StorageFunction } from '@polkadot/types/primitive/StorageKey';
|
|
import { I18nProps } from '@polkadot/ui-app/types';
|
|
import { RawParams } from '@polkadot/ui-params/types';
|
|
import { ApiProps } from '@polkadot/ui-api/types';
|
|
import { ComponentProps } from '../types';
|
|
|
|
import React from 'react';
|
|
import { Button, InputStorage } from '@polkadot/ui-app';
|
|
import Params from '@polkadot/ui-params';
|
|
import { withApi, withMulti } from '@polkadot/ui-api';
|
|
import { isUndefined } from '@polkadot/util';
|
|
|
|
import translate from '../translate';
|
|
|
|
type Props = ComponentProps & ApiProps & I18nProps;
|
|
|
|
type State = {
|
|
isValid: boolean,
|
|
key: StorageFunction,
|
|
values: RawParams,
|
|
params: Array<{ type: TypeDef }>
|
|
};
|
|
|
|
class Modules extends React.PureComponent<Props, State> {
|
|
private defaultValue: any;
|
|
state: State;
|
|
|
|
constructor (props: Props) {
|
|
super(props);
|
|
|
|
const { api } = this.props;
|
|
|
|
this.defaultValue = api.query.timestamp.now;
|
|
this.state = {
|
|
isValid: true,
|
|
key: this.defaultValue,
|
|
values: [],
|
|
params: []
|
|
};
|
|
}
|
|
|
|
render () {
|
|
const { t } = this.props;
|
|
const { isValid, key: { method, section }, params } = this.state;
|
|
|
|
return (
|
|
<section className='storage--actionrow'>
|
|
<div className='storage--actionrow-value'>
|
|
<InputStorage
|
|
defaultValue={this.defaultValue}
|
|
label={t('selected state query')}
|
|
onChange={this.onChangeKey}
|
|
/>
|
|
<Params
|
|
key={`${section}.${method}:params` /* force re-render on change */}
|
|
onChange={this.onChangeParams}
|
|
params={params}
|
|
/>
|
|
</div>
|
|
<div className='storage--actionrow-buttons'>
|
|
<Button
|
|
icon='plus'
|
|
isDisabled={!isValid}
|
|
isPrimary
|
|
onClick={this.onAdd}
|
|
/>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|
|
|
|
private nextState (newState: State): void {
|
|
this.setState(
|
|
(prevState: State) => {
|
|
const { key = prevState.key, values = prevState.values } = newState;
|
|
const hasParam = key.meta.type.isMap;
|
|
const isValid = values.length === (hasParam ? 1 : 0) &&
|
|
values.reduce((isValid, value) =>
|
|
isValid &&
|
|
!isUndefined(value) &&
|
|
!isUndefined(value.value) &&
|
|
value.isValid,
|
|
true
|
|
);
|
|
|
|
return {
|
|
isValid,
|
|
key,
|
|
values,
|
|
params: hasParam
|
|
? [{ type: getTypeDef(key.meta.type.asMap.key.toString()) }]
|
|
: []
|
|
};
|
|
}
|
|
);
|
|
}
|
|
|
|
private onAdd = (): void => {
|
|
const { onAdd } = this.props;
|
|
const { key, values } = this.state;
|
|
|
|
onAdd({
|
|
key,
|
|
params: values
|
|
});
|
|
}
|
|
|
|
private onChangeKey = (key: StorageFunction): void => {
|
|
this.nextState({
|
|
isValid: false,
|
|
key,
|
|
values: [],
|
|
params: []
|
|
});
|
|
}
|
|
|
|
private onChangeParams = (values: RawParams = []): void => {
|
|
this.nextState({ values } as State);
|
|
}
|
|
}
|
|
|
|
export default withMulti(
|
|
Modules,
|
|
translate,
|
|
withApi
|
|
);
|