diff --git a/packages/app-123code/src/AccountSelector.tsx b/packages/app-123code/src/AccountSelector.tsx new file mode 100644 index 0000000000..5e6000891e --- /dev/null +++ b/packages/app-123code/src/AccountSelector.tsx @@ -0,0 +1,53 @@ +// Copyright 2017-2019 @polkadot/app-123code 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 React from 'react'; +import { Bubble, InputAddress } from '@polkadot/ui-app/index'; +import { AccountIndex, Balance, Nonce } from '@polkadot/ui-reactive/index'; + +type Props = { + onChange: (accountId?: string) => void +}; + +type State = { + accountId?: string +}; + +export default class AccountSelector extends React.PureComponent { + state: State = {}; + + render () { + const { accountId } = this.state; + + return ( +
+ +
+ + + + + + + + + +
+
+ ); + } + + private onChange = (accountId?: string): void => { + const { onChange } = this.props; + + this.setState({ accountId }, () => + onChange(accountId) + ); + } +} diff --git a/packages/app-123code/src/SummaryBar.tsx b/packages/app-123code/src/SummaryBar.tsx new file mode 100644 index 0000000000..a9ad76e58f --- /dev/null +++ b/packages/app-123code/src/SummaryBar.tsx @@ -0,0 +1,102 @@ +// Copyright 2017-2019 @polkadot/app-123code 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 { ApiProps } from '@polkadot/ui-api/types'; +import { BareProps, I18nProps } from '@polkadot/ui-app/types'; + +import BN from 'bn.js'; +import React from 'react'; +import { AccountId, RuntimeVersion } from '@polkadot/types'; +import { withCalls } from '@polkadot/ui-api/with'; +import { Bubble, IdentityIcon } from '@polkadot/ui-app/index'; +import { formatBalance, formatNumber } from '@polkadot/ui-app/util'; + +import translate from './translate'; + +type Props = ApiProps & BareProps & I18nProps & { + balances_totalIssuance?: BN, + chain_bestNumber?: BN, + chain_bestNumberLag?: BN, + chain_getRuntimeVersion?: RuntimeVersion, + session_validators?: Array, + staking_intentions?: Array, + system_chain?: string, + system_name?: string, + system_version?: string +}; +type State = { + nextUp: Array +}; + +class SummaryBar extends React.PureComponent { + state: State = { + nextUp: [] + }; + + static getDerivedStateFromProps ({ staking_intentions, session_validators }: Props): State | null { + if (!staking_intentions || !session_validators) { + return null; + } + + return { + nextUp: staking_intentions.filter((accountId) => + !session_validators.find((validatorId) => validatorId.eq(accountId)) + ) + }; + } + + render () { + const { balances_totalIssuance, chain_bestNumber, chain_bestNumberLag, chain_getRuntimeVersion, session_validators = [], system_chain, system_name, system_version } = this.props; + const { nextUp } = this.state; + + return ( + +
+ + {system_name} v{system_version} + + + {system_chain} + + { + chain_getRuntimeVersion + ? `${chain_getRuntimeVersion.implName} v${chain_getRuntimeVersion.implVersion}` + : undefined + } + + {formatNumber(chain_bestNumber)} ({formatNumber(chain_bestNumberLag)} lag) + + { + session_validators.map((accountId, index) => ( + + )) + } + { + nextUp.map((accountId, index) => ( + + )) + } + + {formatBalance(balances_totalIssuance)} + +
+ + ); + } +} + +// inject the actual API calls automatically into props +export default translate( + withCalls( + 'derive.chain.bestNumber', + 'derive.chain.bestNumberLag', + 'query.balances.totalIssuance', + 'query.session.validators', + 'query.staking.intentions', + 'rpc.chain.getRuntimeVersion', + 'rpc.system.chain', + 'rpc.system.name', + 'rpc.system.version' + )(SummaryBar) +); diff --git a/packages/app-123code/src/Transfer.tsx b/packages/app-123code/src/Transfer.tsx new file mode 100644 index 0000000000..001e3dff68 --- /dev/null +++ b/packages/app-123code/src/Transfer.tsx @@ -0,0 +1,62 @@ +// Copyright 2017-2019 @polkadot/app-123code 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 BN from 'bn.js'; +import React from 'react'; +import { Button, InputAddress, InputBalance } from '@polkadot/ui-app/index'; + +import TxButton from './TxButton'; + +type Props = { + accountId?: string +}; +type State = { + amount?: BN; + recipientId?: string; +}; + +export default class Transfer extends React.PureComponent { + state: State = {}; + + render () { + const { accountId } = this.props; + const { amount, recipientId } = this.state; + + return ( +
+

transfer

+
+
+ + + + + +
+
Make a transfer from any account you control to another account. Transfer fees and per-transaction feed apply.
+
+
+ ); + } + + private onChangeAmount = (amount?: BN): void => { + this.setState({ amount }); + } + + private onChangeRecipient = (recipientId?: string): void => { + this.setState({ recipientId }); + } +} diff --git a/packages/app-123code/src/TxButton.tsx b/packages/app-123code/src/TxButton.tsx new file mode 100644 index 0000000000..ee219618b0 --- /dev/null +++ b/packages/app-123code/src/TxButton.tsx @@ -0,0 +1,68 @@ +// Copyright 2017-2019 @polkadot/app-123code 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 { ApiProps } from '@polkadot/ui-api/types'; +import { QueueTx$ExtrinsicAdd } from '@polkadot/ui-app/Status/types'; + +import React from 'react'; +import { Button } from '@polkadot/ui-app/index'; +import { QueueConsumer } from '@polkadot/ui-app/Status/Context'; +import { withApi } from '@polkadot/ui-api/index'; +import { assert } from '@polkadot/util'; + +type InjectedProps = { + queueExtrinsic: QueueTx$ExtrinsicAdd; +}; + +type Props = ApiProps & { + accountId?: string, + isDisabled?: boolean, + label: React.ReactNode, + params: Array, + tx: string +}; + +class TxButtonInner extends React.PureComponent { + render () { + const { accountId, isDisabled, label } = this.props; + + return ( +