diff --git a/packages/app-123code/src/AccountSelector.tsx b/packages/app-123code/src/AccountSelector.tsx index d8af701408..289b60b869 100644 --- a/packages/app-123code/src/AccountSelector.tsx +++ b/packages/app-123code/src/AccountSelector.tsx @@ -9,11 +9,11 @@ import { AccountIndex, Balance, Nonce } from '@polkadot/react-query'; interface Props { className?: string; - onChange: (accountId?: string) => void; + onChange: (accountId: string | null) => void; } function AccountSelector ({ className, onChange }: Props): React.ReactElement { - const [accountId, setAccountId] = useState(); + const [accountId, setAccountId] = useState(null); useEffect((): void => onChange(accountId), [accountId]); diff --git a/packages/app-123code/src/Transfer.tsx b/packages/app-123code/src/Transfer.tsx index cebe842755..44b818c9e6 100644 --- a/packages/app-123code/src/Transfer.tsx +++ b/packages/app-123code/src/Transfer.tsx @@ -9,11 +9,11 @@ import { Button, InputAddress, InputBalance, TxButton, TxComponent } from '@polk import Summary from './Summary'; interface Props { - accountId?: string; + accountId?: string | null; } interface State { amount?: BN; - recipientId?: string; + recipientId?: string | null; } export default class Transfer extends TxComponent { @@ -31,7 +31,6 @@ export default class Transfer extends TxComponent { { this.setState({ amount }); } - private onChangeRecipient = (recipientId?: string): void => { + private onChangeRecipient = (recipientId?: string | null): void => { this.setState({ recipientId }); } } diff --git a/packages/app-123code/src/index.tsx b/packages/app-123code/src/index.tsx index 199a95be3d..de0de71b2c 100644 --- a/packages/app-123code/src/index.tsx +++ b/packages/app-123code/src/index.tsx @@ -22,7 +22,7 @@ import translate from './translate'; interface Props extends AppProps, I18nProps {} function App ({ className }: Props): React.ReactElement { - const [accountId, setAccountId] = useState(); + const [accountId, setAccountId] = useState(null); return ( // in all apps, the main wrapper is setup to allow the padding diff --git a/packages/app-accounts/src/modals/Create.tsx b/packages/app-accounts/src/modals/Create.tsx index b453073488..4e6bd4c350 100644 --- a/packages/app-accounts/src/modals/Create.tsx +++ b/packages/app-accounts/src/modals/Create.tsx @@ -13,8 +13,7 @@ import React from 'react'; import styled from 'styled-components'; import { DEV_PHRASE } from '@polkadot/keyring/defaults'; import { withApi, withMulti } from '@polkadot/react-api'; -import { AddressRow, Button, Dropdown, Input, Labelled, Modal, Password } from '@polkadot/react-components'; -import { InputAddress } from '@polkadot/react-components/InputAddress'; +import { AddressRow, Button, Dropdown, Input, InputAddress, Labelled, Modal, Password } from '@polkadot/react-components'; import keyring from '@polkadot/ui-keyring'; import uiSettings from '@polkadot/ui-settings'; import { isHex, u8aToHex } from '@polkadot/util'; diff --git a/packages/app-accounts/src/modals/Import.tsx b/packages/app-accounts/src/modals/Import.tsx index a9d0305dcc..f24f93f7d6 100644 --- a/packages/app-accounts/src/modals/Import.tsx +++ b/packages/app-accounts/src/modals/Import.tsx @@ -8,8 +8,7 @@ import { ActionStatus } from '@polkadot/react-components/Status/types'; import { ModalProps } from '../types'; import React from 'react'; -import { AddressRow, Button, InputFile, Modal, Password, TxComponent } from '@polkadot/react-components'; -import { InputAddress } from '@polkadot/react-components/InputAddress'; +import { AddressRow, Button, InputAddress, InputFile, Modal, Password, TxComponent } from '@polkadot/react-components'; import { isHex, isObject, u8aToString } from '@polkadot/util'; import keyring from '@polkadot/ui-keyring'; diff --git a/packages/app-accounts/src/modals/Qr.tsx b/packages/app-accounts/src/modals/Qr.tsx index 8e812c5f62..2446cb9edc 100644 --- a/packages/app-accounts/src/modals/Qr.tsx +++ b/packages/app-accounts/src/modals/Qr.tsx @@ -7,8 +7,7 @@ import { ModalProps } from '../types'; import React, { useState } from 'react'; import styled from 'styled-components'; -import { AddressRow, Button, Input, Modal } from '@polkadot/react-components'; -import { InputAddress } from '@polkadot/react-components/InputAddress'; +import { AddressRow, Button, Input, InputAddress, Modal } from '@polkadot/react-components'; import { QrScanAddress } from '@polkadot/react-qr'; import keyring from '@polkadot/ui-keyring'; diff --git a/packages/app-accounts/src/modals/Transfer.tsx b/packages/app-accounts/src/modals/Transfer.tsx index cbb66b135f..459874d473 100644 --- a/packages/app-accounts/src/modals/Transfer.tsx +++ b/packages/app-accounts/src/modals/Transfer.tsx @@ -166,11 +166,11 @@ class Transfer extends React.PureComponent { this.nextState({ amount }); } - private onChangeFrom = (senderId: string): void => { + private onChangeFrom = (senderId: string | null): void => { this.nextState({ senderId }); } - private onChangeTo = (recipientId: string): void => { + private onChangeTo = (recipientId: string | null): void => { this.nextState({ recipientId }); } diff --git a/packages/app-address-book/src/modals/Create.tsx b/packages/app-address-book/src/modals/Create.tsx index ba12739bf7..439de94590 100644 --- a/packages/app-address-book/src/modals/Create.tsx +++ b/packages/app-address-book/src/modals/Create.tsx @@ -8,8 +8,7 @@ import { ModalProps } from '../types'; import React from 'react'; -import { AddressRow, Button, Input, Modal } from '@polkadot/react-components'; -import { InputAddress } from '@polkadot/react-components/InputAddress'; +import { AddressRow, Button, Input, InputAddress, Modal } from '@polkadot/react-components'; import keyring from '@polkadot/ui-keyring'; import translate from '../translate'; diff --git a/packages/app-contracts/src/Contracts/Call.tsx b/packages/app-contracts/src/Contracts/Call.tsx index ca83264470..9304fd18d2 100644 --- a/packages/app-contracts/src/Contracts/Call.tsx +++ b/packages/app-contracts/src/Contracts/Call.tsx @@ -256,7 +256,7 @@ class Call extends TxComponent { this.setState({ accountId }); } - private onChangeAddress = (address: string): void => { + private onChangeAddress = (address: string | null): void => { const contractAbi = getContractAbi(address); this.setState({ address, contractAbi, isAddressValid: !!contractAbi }); diff --git a/packages/app-democracy/src/Propose.tsx b/packages/app-democracy/src/Propose.tsx index 1d7470be07..e523501ce1 100644 --- a/packages/app-democracy/src/Propose.tsx +++ b/packages/app-democracy/src/Propose.tsx @@ -21,7 +21,7 @@ interface Props extends I18nProps, ApiProps, RouteComponentProps { } interface State { - accountId?: string; + accountId?: string | null; method: Call | null; value: BN; isValid: boolean; @@ -97,7 +97,7 @@ class Propose extends TxComponent { ); } - private onChangeAccount = (accountId: string): void => { + private onChangeAccount = (accountId: string | null): void => { this.nextState({ accountId }); } diff --git a/packages/app-extrinsics/src/Selection.tsx b/packages/app-extrinsics/src/Selection.tsx index 88872b3e5e..ccf216493b 100644 --- a/packages/app-extrinsics/src/Selection.tsx +++ b/packages/app-extrinsics/src/Selection.tsx @@ -26,7 +26,7 @@ interface State { isValidUnsigned: boolean; method: Call | null; accountNonce?: BN; - accountId?: string; + accountId?: string | null; } class Selection extends TxComponent { @@ -126,7 +126,7 @@ class Selection extends TxComponent { this.nextState({ accountNonce }); } - private onChangeSender = (accountId: string): void => { + private onChangeSender = (accountId: string | null): void => { this.nextState({ accountId, accountNonce: new BN(0) }); } diff --git a/packages/app-generic-asset/src/Transfer.tsx b/packages/app-generic-asset/src/Transfer.tsx index 986ccc0b04..5dd791f6eb 100644 --- a/packages/app-generic-asset/src/Transfer.tsx +++ b/packages/app-generic-asset/src/Transfer.tsx @@ -152,11 +152,11 @@ class Transfer extends React.PureComponent { this.nextState({ amount }); } - private onChangeFrom = (senderId: string): void => { + private onChangeFrom = (senderId: string | null): void => { this.nextState({ senderId }); } - private onChangeTo = (recipientId: string): void => { + private onChangeTo = (recipientId: string | null): void => { this.nextState({ recipientId }); } diff --git a/packages/app-staking/src/Actions/Account/SetControllerAccount.tsx b/packages/app-staking/src/Actions/Account/SetControllerAccount.tsx index cc89eac5a4..1468364507 100644 --- a/packages/app-staking/src/Actions/Account/SetControllerAccount.tsx +++ b/packages/app-staking/src/Actions/Account/SetControllerAccount.tsx @@ -110,7 +110,7 @@ class SetControllerAccount extends TxComponent { ); } - private onChangeController = (controllerId: string): void => { + private onChangeController = (controllerId: string | null): void => { this.setState({ controllerId }); } diff --git a/packages/app-staking/src/Actions/Accounts.tsx b/packages/app-staking/src/Actions/Accounts.tsx index 88967165b1..2efcc14009 100644 --- a/packages/app-staking/src/Actions/Accounts.tsx +++ b/packages/app-staking/src/Actions/Accounts.tsx @@ -11,7 +11,7 @@ import { withCalls, withMulti } from '@polkadot/react-api/with'; import React, { useState } from 'react'; import styled from 'styled-components'; -import { Button, CardGrid, InputAddress } from '@polkadot/react-components'; +import { Button, CardGrid } from '@polkadot/react-components'; import createOption from '@polkadot/ui-keyring/options/item'; import { getAddressName } from '@polkadot/react-components/util'; @@ -43,8 +43,7 @@ function Accounts ({ allAccounts, allStashes, className, myControllers, recently const [isNewStakeOpen, setIsNewStateOpen] = useState(false); const myStashes = getMyStashes(myControllers, allAccounts); const stashOptions = allStashes.map((stashId): KeyringSectionOption => - // FIXME The static setting here just does screwy - (InputAddress as any).createOption(createOption(stashId, getAddressName(stashId, 'account'))) + createOption(stashId, getAddressName(stashId, 'account')) ); const isEmpty = !isNewStakeOpen && (!myStashes || myStashes.length === 0); diff --git a/packages/app-staking/src/Actions/NewStake.tsx b/packages/app-staking/src/Actions/NewStake.tsx index fdfe215849..bc3389c68f 100644 --- a/packages/app-staking/src/Actions/NewStake.tsx +++ b/packages/app-staking/src/Actions/NewStake.tsx @@ -153,7 +153,7 @@ class NewStake extends TxComponent { }); } - private onChangeController = (controllerId: string): void => { + private onChangeController = (controllerId: string | null): void => { this.nextState({ controllerId }); } @@ -161,7 +161,7 @@ class NewStake extends TxComponent { this.nextState({ destination }); } - private onChangeStash = (stashId: string): void => { + private onChangeStash = (stashId: string | null): void => { this.nextState({ stashId }); } diff --git a/packages/app-sudo/src/SetKey.tsx b/packages/app-sudo/src/SetKey.tsx index c2bfa8d8a0..f25b68cf02 100644 --- a/packages/app-sudo/src/SetKey.tsx +++ b/packages/app-sudo/src/SetKey.tsx @@ -14,7 +14,7 @@ import translate from './translate'; interface Props extends I18nProps, ComponentProps {} function SetKey ({ allAccounts, className, isMine, sudoKey, t }: Props): React.ReactElement { - const [selected, setSelected] = useState(); + const [selected, setSelected] = useState(null); useEffect((): void => { if (sudoKey && !selected) { diff --git a/packages/app-toolbox/src/Rpc/Account.tsx b/packages/app-toolbox/src/Rpc/Account.tsx index 2e7e0479a8..140dfc214b 100644 --- a/packages/app-toolbox/src/Rpc/Account.tsx +++ b/packages/app-toolbox/src/Rpc/Account.tsx @@ -22,7 +22,7 @@ function Account ({ className, defaultValue, isError, onChange, t }: Props): Rea const [accountId, setAccountId] = useState(defaultValue); const [accountNonce, setAccountNonce] = useState(new BN(0)); - const _onChangeAccountId = (accountId: string): void => { + const _onChangeAccountId = (accountId: string | null): void => { setAccountId(accountId); onChange(accountId, accountNonce); }; diff --git a/packages/app-toolbox/src/Sign.tsx b/packages/app-toolbox/src/Sign.tsx index 34a45fe2b2..19fd729a0b 100644 --- a/packages/app-toolbox/src/Sign.tsx +++ b/packages/app-toolbox/src/Sign.tsx @@ -213,8 +213,8 @@ class Sign extends React.PureComponent { }); } - private onChangeAccount = (accountId: string): void => { - const currentPair = keyring.getPair(accountId); + private onChangeAccount = (accountId: string | null): void => { + const currentPair = keyring.getPair(accountId || ''); this.nextState({ currentPair }); } diff --git a/packages/app-toolbox/src/Verify.tsx b/packages/app-toolbox/src/Verify.tsx index aeaf7434fd..d938e0410f 100644 --- a/packages/app-toolbox/src/Verify.tsx +++ b/packages/app-toolbox/src/Verify.tsx @@ -209,11 +209,11 @@ class Verify extends React.PureComponent { this.nextState({ signature, isValidSignature }); } - private onChangeAddress = (accountId: string): void => { + private onChangeAddress = (accountId: string | null): void => { let currentPublicKey; try { - currentPublicKey = keyring.decodeAddress(accountId); + currentPublicKey = keyring.decodeAddress(accountId || ''); } catch (err) { console.error(err); } diff --git a/packages/app-treasury/src/Overview/Propose.tsx b/packages/app-treasury/src/Overview/Propose.tsx index 9f1f0740a6..1c84327a9b 100644 --- a/packages/app-treasury/src/Overview/Propose.tsx +++ b/packages/app-treasury/src/Overview/Propose.tsx @@ -11,7 +11,7 @@ import TxModal, { TxModalState, TxModalProps as Props } from '@polkadot/react-co import translate from '../translate'; interface State extends TxModalState { - beneficiary?: string; + beneficiary?: string | null; value: BN; } @@ -25,12 +25,10 @@ class Propose extends TxModal { protected txMethod = (): string => 'treasury.proposeSpend'; - protected txParams = (): (string | BN | undefined)[] => { + protected txParams = (): [BN, string | null | undefined] => { const { beneficiary, value } = this.state; - return [ - value, beneficiary - ]; + return [value, beneficiary]; } protected isDisabled = (): boolean => { @@ -96,7 +94,7 @@ class Propose extends TxModal { ); } - private onChangeBeneficiary = (beneficiary: string): void => { + private onChangeBeneficiary = (beneficiary: string | null): void => { this.nextState({ beneficiary }); } diff --git a/packages/app-treasury/src/Overview/Summary.tsx b/packages/app-treasury/src/Overview/Summary.tsx index a5f46f53bc..c218993d44 100644 --- a/packages/app-treasury/src/Overview/Summary.tsx +++ b/packages/app-treasury/src/Overview/Summary.tsx @@ -20,7 +20,7 @@ interface Props extends I18nProps { } function Summary ({ treasury_proposalCount, treasury_approvals, treasury_pot, t }: Props): React.ReactElement { - const value = treasury_pot + const value = treasury_pot && treasury_pot.gtn(0) ? treasury_pot.toString() : null; @@ -35,13 +35,11 @@ function Summary ({ treasury_proposalCount, treasury_approvals, treasury_pot, t
- - { - value - ? `${formatBalance(value, false)}${treasury_pot && treasury_pot.gtn(0) ? formatBalance.calcSi(value).value : ''}` - : '-' - } - + {value && ( + + {formatBalance(value, false)}{formatBalance.calcSi(value).value} + + )}
); diff --git a/packages/app-treasury/src/Settings.tsx b/packages/app-treasury/src/Settings.tsx index 78f58c16df..49160794fd 100644 --- a/packages/app-treasury/src/Settings.tsx +++ b/packages/app-treasury/src/Settings.tsx @@ -25,7 +25,7 @@ interface Props extends I18nProps, ApiProps, RouteComponentProps { } interface State { - accountId?: string; + accountId?: string | null; proposalBond?: BN; proposalBondMinimum?: BN; spendPeriod?: BN; @@ -174,7 +174,7 @@ class Settings extends TxComponent { ); } - private onChangeAccount = (accountId: string): void => { + private onChangeAccount = (accountId: string | null): void => { this.nextState({ accountId }); } diff --git a/packages/react-api/src/with/multi.ts b/packages/react-api/src/with/multi.ts index 962b3a9bd1..fff444f0b8 100644 --- a/packages/react-api/src/with/multi.ts +++ b/packages/react-api/src/with/multi.ts @@ -11,7 +11,7 @@ export default function withMulti (Component: React.ComponentType, ...hocs // after something can use the value of the preceding version return hocs .reverse() - .reduce((Component, hoc): React.ComponentType => { - return hoc(Component); - }, Component); + .reduce((Component, hoc): React.ComponentType => + hoc(Component), Component + ); } diff --git a/packages/react-components/src/InputAddress/index.tsx b/packages/react-components/src/InputAddress/index.tsx index 5d6a02f15b..07f6a9e980 100644 --- a/packages/react-components/src/InputAddress/index.tsx +++ b/packages/react-components/src/InputAddress/index.tsx @@ -21,26 +21,31 @@ import createHeader from './createHeader'; import createItem from './createItem'; interface Props extends BareProps { - defaultValue?: string | null; + defaultValue?: Uint8Array | string | null; help?: React.ReactNode; hideAddress?: boolean; isDisabled?: boolean; isError?: boolean; isInput?: boolean; isMultiple?: boolean; - label?: string; + label?: React.ReactNode; labelExtra?: React.ReactNode; onChange?: (value: string | null) => void; onChangeMulti?: (value: string[]) => void; - options?: Option[]; + options?: KeyringSectionOption[]; optionsAll?: Record; placeholder?: string; type?: KeyringOption$Type; - value?: string | Uint8Array | string[]; + value?: string | Uint8Array | string[] | null; withEllipsis?: boolean; withLabel?: boolean; } +type ExportedType = React.ComponentType & { + createOption: (option: KeyringSectionOption, isUppercase?: boolean) => Option; + setLastValue: (type: KeyringOption$Type, value: string) => void; +}; + interface State { value?: string; } @@ -70,7 +75,7 @@ function transformToAccountId (value: string): string | null { : accountId; } -function createOption (address: string): KeyringSectionOption { +function createOption (address: string): Option { let isRecent: boolean | undefined; const pair = keyring.getAccount(address); let name: string | undefined; @@ -91,6 +96,23 @@ function createOption (address: string): KeyringSectionOption { return createItem(createKeyringItem(address, name), !isRecent); } +function readOptions (): Record { + return store.get(STORAGE_KEY) || { defaults: {} }; +} + +function getLastValue (type: KeyringOption$Type = DEFAULT_TYPE): any { + const options = readOptions(); + + return options.defaults[type]; +} + +function setLastValue (type: KeyringOption$Type = DEFAULT_TYPE, value: string): void { + const options = readOptions(); + + options.defaults[type] = value; + store.set(STORAGE_KEY, options); +} + class InputAddress extends React.PureComponent { public state: State = {}; @@ -107,23 +129,6 @@ class InputAddress extends React.PureComponent { } } - public static readOptions (): Record { - return store.get(STORAGE_KEY) || { defaults: {} }; - } - - public static getLastValue (type: KeyringOption$Type = DEFAULT_TYPE): any { - const options = InputAddress.readOptions(); - - return options.defaults[type]; - } - - public static setLastValue (type: KeyringOption$Type = DEFAULT_TYPE, value: string): void { - const options = InputAddress.readOptions(); - - options.defaults[type] = value; - store.set(STORAGE_KEY, options); - } - public render (): React.ReactNode { const { className, defaultValue, help, hideAddress = false, isDisabled = false, isError, isMultiple, label, labelExtra, options, optionsAll, placeholder, type = DEFAULT_TYPE, style, withEllipsis, withLabel } = this.props; const { value } = this.state; @@ -133,7 +138,7 @@ class InputAddress extends React.PureComponent { return null; } - const lastValue = InputAddress.getLastValue(type); + const lastValue = getLastValue(type); const lastOption = this.getLastOptionValue(); const actualValue = transformToAddress( isDisabled || (defaultValue && this.hasValue(defaultValue)) @@ -144,13 +149,15 @@ class InputAddress extends React.PureComponent { : (lastOption && lastOption.value) ) ); - const actualOptions = options || ( - isDisabled && actualValue - ? [createOption(actualValue)] - : optionsAll - ? optionsAll[type] - : [] - ); + const actualOptions: Option[] = options + ? options.map((o): Option => createItem(o)) + : ( + isDisabled && actualValue + ? [createOption(actualValue)] + : optionsAll + ? optionsAll[type] + : [] + ); const _defaultValue = (isMultiple || value !== undefined) ? undefined : actualValue; @@ -212,7 +219,7 @@ class InputAddress extends React.PureComponent { : undefined; } - private hasValue (test?: string): boolean { + private hasValue (test?: Uint8Array | string): boolean { const { optionsAll, type = DEFAULT_TYPE } = this.props; if (!optionsAll) { @@ -225,7 +232,7 @@ class InputAddress extends React.PureComponent { private onChange = (address: string): void => { const { onChange, type } = this.props; - InputAddress.setLastValue(type, address); + setLastValue(type, address); onChange && onChange(transformToAccountId(address)); } @@ -279,9 +286,10 @@ class InputAddress extends React.PureComponent { } } -export { InputAddress }; +(InputAddress as unknown as ExportedType).createOption = createItem; +(InputAddress as unknown as ExportedType).setLastValue = setLastValue; -const InputAddressExported = withMulti( +export default withMulti( styled(InputAddress)` .ui.dropdown .text { width: 100%; @@ -320,8 +328,4 @@ const InputAddressExported = withMulti( return result; }, {}) }) -); - -(InputAddressExported as any).createOption = createItem; - -export default InputAddressExported; +) as ExportedType; diff --git a/packages/react-components/src/util/getContractAbi.ts b/packages/react-components/src/util/getContractAbi.ts index 9e102a1082..ab1c687f0f 100644 --- a/packages/react-components/src/util/getContractAbi.ts +++ b/packages/react-components/src/util/getContractAbi.ts @@ -6,7 +6,11 @@ import { Abi } from '@polkadot/api-contract'; import getAddressMeta from './getAddressMeta'; -export default function getContractAbi (address: string): Abi | null { +export default function getContractAbi (address: string | null): Abi | null { + if (!address) { + return null; + } + let abi: Abi | undefined; const meta = getAddressMeta(address, 'contract'); diff --git a/packages/react-components/src/util/toAddress.ts b/packages/react-components/src/util/toAddress.ts index bfaf50fc8d..4de1b43c3a 100644 --- a/packages/react-components/src/util/toAddress.ts +++ b/packages/react-components/src/util/toAddress.ts @@ -5,7 +5,7 @@ import keyring from '@polkadot/ui-keyring'; import { hexToU8a, isHex } from '@polkadot/util'; -export default function toAddress (value?: string | Uint8Array): string | undefined { +export default function toAddress (value?: string | Uint8Array | null): string | undefined { if (!value) { return; } diff --git a/packages/react-params/src/Param/Account.tsx b/packages/react-params/src/Param/Account.tsx index 1f45484131..35f00581b6 100644 --- a/packages/react-params/src/Param/Account.tsx +++ b/packages/react-params/src/Param/Account.tsx @@ -10,8 +10,8 @@ import keyring from '@polkadot/ui-keyring'; import Bare from './Bare'; -function onChange ({ onChange }: Props): (_?: string) => void { - return function (value?: string): void { +function onChange ({ onChange }: Props): (_?: string | null) => void { + return (value?: string | null): void => { let isValid = false; if (value) { diff --git a/packages/react-query/src/AccountIndex.tsx b/packages/react-query/src/AccountIndex.tsx index c2fd7b6bcd..7243208d8f 100644 --- a/packages/react-query/src/AccountIndex.tsx +++ b/packages/react-query/src/AccountIndex.tsx @@ -12,12 +12,12 @@ import { withCalls } from '@polkadot/react-api'; interface Props extends BareProps, CallProps { children?: React.ReactNode; label?: React.ReactNode; - params?: string; + params?: string | null; accounts_idAndIndex?: [AccountId?, AccountIndex?]; } -export function AccountIndexDisplay ({ children, className, label = '', style, accounts_idAndIndex = [] }: Props): React.ReactElement { - const [, accountIndex] = accounts_idAndIndex; +export function AccountIndexDisplay ({ children, className, label = '', style, accounts_idAndIndex }: Props): React.ReactElement { + const [, accountIndex] = accounts_idAndIndex || []; return (
void; children?: React.ReactNode; label?: React.ReactNode; - params?: string; + params?: string | null; } export function Nonce ({ accountNonce, children, className, label = '' }: Props): React.ReactElement {