diff --git a/packages/app-accounts/src/Editor.tsx b/packages/app-accounts/src/Editor.tsx index 4a7b107980..0cacb20629 100644 --- a/packages/app-accounts/src/Editor.tsx +++ b/packages/app-accounts/src/Editor.tsx @@ -12,17 +12,19 @@ import Input from '@polkadot/ui-app/Input'; import InputAddress from '@polkadot/ui-app/InputAddress'; import classes from '@polkadot/ui-app/util/classes'; import keyring from '@polkadot/ui-keyring/index'; +import accountObservable from '@polkadot/ui-keyring/observable/accounts'; +import withObservableBase from '@polkadot/ui-react-rx/with/observableBase'; import AddressSummary from '@polkadot/ui-app/AddressSummary'; import translate from './translate'; type Props = I18nProps & { + accountAll?: Array, onBack: () => void }; type State = { - currentPair: KeyringPair | null, - defaultValue?: string, + current: KeyringPair | null, editedName: string, isEdited: boolean }; @@ -33,13 +35,7 @@ class Editor extends React.PureComponent { constructor (props: Props) { super(props); - const pairs = keyring.getPairs(); - const currentPair = pairs[pairs.length - 1] || null; - - this.state = this.createState(currentPair); - this.state.defaultValue = currentPair - ? currentPair.address() - : void 0; + this.state = this.createState(null); } render () { @@ -58,9 +54,9 @@ class Editor extends React.PureComponent { renderButtons () { const { t } = this.props; - const { currentPair, isEdited } = this.state; + const { current, isEdited } = this.state; - if (!currentPair) { + if (!current) { return null; } @@ -94,28 +90,29 @@ class Editor extends React.PureComponent { } renderData () { - const { t } = this.props; - const { currentPair, defaultValue, editedName } = this.state; + const { accountAll, t } = this.props; + const { current, editedName } = this.state; - if (!currentPair) { + if (!accountAll || !Object.keys(accountAll).length) { return t('editor.none', { defaultValue: 'There are no saved accounts. Add some first.' }); } - const address = currentPair.address(); + const address = current + ? current.address() + : undefined; return (
{ ); } - createState (currentPair: KeyringPair | null): State { + createState (current: KeyringPair | null): State { return { - currentPair, - editedName: currentPair - ? currentPair.getMeta().name || '' + current, + editedName: current + ? current.getMeta().name || '' : '', isEdited: false }; @@ -155,14 +152,14 @@ class Editor extends React.PureComponent { nextState (newState: State = {} as State): void { this.setState( (prevState: State): State => { - let { currentPair = prevState.currentPair, editedName = prevState.editedName } = newState; - const previous = prevState.currentPair || { address: () => null }; + let { current = prevState.current, editedName = prevState.editedName } = newState; + const previous = prevState.current || { address: () => undefined }; let isEdited = false; - if (currentPair) { - if (currentPair.address() !== previous.address()) { - editedName = currentPair.getMeta().name || ''; - } else if (editedName !== currentPair.getMeta().name) { + if (current) { + if (current.address() !== previous.address()) { + editedName = current.getMeta().name || ''; + } else if (editedName !== current.getMeta().name) { isEdited = true; } } else { @@ -170,7 +167,7 @@ class Editor extends React.PureComponent { } return { - currentPair, + current, editedName, isEdited }; @@ -179,10 +176,12 @@ class Editor extends React.PureComponent { } onChangeAccount = (publicKey: Uint8Array): void => { - const currentPair = keyring.getPair(publicKey); + const current = publicKey && publicKey.length === 32 + ? keyring.getPair(publicKey) + : null; this.nextState({ - currentPair + current } as State); } @@ -191,13 +190,13 @@ class Editor extends React.PureComponent { } onCommit = (): void => { - const { currentPair, editedName } = this.state; + const { current, editedName } = this.state; - if (!currentPair) { + if (!current) { return; } - keyring.saveAccountMeta(currentPair, { + keyring.saveAccountMeta(current, { name: editedName, whenEdited: Date.now() }); @@ -206,40 +205,35 @@ class Editor extends React.PureComponent { } onDiscard = (): void => { - const { currentPair } = this.state; + const { current } = this.state; - if (!currentPair) { + if (!current) { return; } this.nextState({ - editedName: currentPair.getMeta().name + editedName: current.getMeta().name } as State); } onForget = (): void => { - const { currentPair } = this.state; + const { current } = this.state; - if (!currentPair) { + if (!current) { return; } - const address = currentPair.address(); - const pairs = keyring.getPairs().filter((item) => - item.address() !== address + this.setState( + this.createState(null), + () => { + keyring.forgetAccount( + current.address() + ); + } ); - const nextPair = pairs[pairs.length - 1] || null; - const defaultValue = nextPair - ? nextPair.address() - : void 0; - - keyring.forgetAccount(address); - - this.nextState({ - currentPair: nextPair, - defaultValue - } as State); } } -export default translate(Editor); +export default withObservableBase( + accountObservable.subject, { propName: 'accountAll' } +)(translate(Editor)); diff --git a/packages/app-addresses/src/Editor.tsx b/packages/app-addresses/src/Editor.tsx index 73254eac52..a28e056571 100644 --- a/packages/app-addresses/src/Editor.tsx +++ b/packages/app-addresses/src/Editor.tsx @@ -9,20 +9,22 @@ import React from 'react'; import Button from '@polkadot/ui-app/Button'; import Input from '@polkadot/ui-app/Input'; +import AddressSummary from '@polkadot/ui-app/AddressSummary'; import InputAddress from '@polkadot/ui-app/InputAddress'; import classes from '@polkadot/ui-app/util/classes'; import keyring from '@polkadot/ui-keyring/index'; +import addressObservable from '@polkadot/ui-keyring/observable/addresses'; +import withObservableBase from '@polkadot/ui-react-rx/with/observableBase'; -import AddressSummary from '@polkadot/ui-app/AddressSummary'; import translate from './translate'; type Props = I18nProps & { + addressAll?: Array, onBack: () => void }; type State = { - currentAddress: KeyringAddress | null, - defaultValue?: string, + current: KeyringAddress | null, editedName: string, isEdited: boolean }; @@ -33,13 +35,7 @@ class Editor extends React.PureComponent { constructor (props: Props) { super(props); - const addresses = keyring.getAddresses(); - const currentAddress = addresses[addresses.length - 1] || null; - - this.state = this.createState(currentAddress); - this.state.defaultValue = currentAddress - ? currentAddress.address() - : void 0; + this.state = this.createState(null); } render () { @@ -58,9 +54,9 @@ class Editor extends React.PureComponent { renderButtons () { const { t } = this.props; - const { currentAddress, isEdited } = this.state; + const { current, isEdited } = this.state; - if (!currentAddress) { + if (!current) { return null; } @@ -94,28 +90,29 @@ class Editor extends React.PureComponent { } renderData () { - const { t } = this.props; - const { currentAddress, defaultValue, editedName } = this.state; + const { addressAll, t } = this.props; + const { current, editedName } = this.state; - if (!currentAddress) { + if (!addressAll || !Object.keys(addressAll).length) { return t('editor.none', { defaultValue: 'There are no saved addresses. Add some first.' }); } - const address = currentAddress.address(); + const address = current + ? current.address() + : undefined; return (
{ ); } - createState (currentAddress: KeyringAddress | null): State { - const { name = '' } = currentAddress - ? currentAddress.getMeta() + createState (current: KeyringAddress | null): State { + const { name = '' } = current + ? current.getMeta() : {}; return { - currentAddress, + current, editedName: name, isEdited: false }; @@ -156,14 +153,14 @@ class Editor extends React.PureComponent { nextState (newState: State = {} as State): void { this.setState( (prevState: State): State => { - let { currentAddress = prevState.currentAddress, editedName = prevState.editedName } = newState; - const previous = prevState.currentAddress || { address: () => null }; + let { current = prevState.current, editedName = prevState.editedName } = newState; + const previous = prevState.current || { address: () => null }; let isEdited = false; - if (currentAddress && currentAddress.isValid()) { - if (currentAddress.address() !== previous.address()) { - editedName = currentAddress.getMeta().name || ''; - } else if (editedName !== currentAddress.getMeta().name) { + if (current && current.isValid()) { + if (current.address() !== previous.address()) { + editedName = current.getMeta().name || ''; + } else if (editedName !== current.getMeta().name) { isEdited = true; } } else { @@ -171,7 +168,7 @@ class Editor extends React.PureComponent { } return { - currentAddress, + current, editedName, isEdited }; @@ -180,9 +177,11 @@ class Editor extends React.PureComponent { } onChangeAddress = (publicKey: Uint8Array): void => { - const currentAddress = keyring.getAddress(publicKey) || null; + const current = publicKey && publicKey.length === 32 + ? (keyring.getAddress(publicKey) || null) + : null; - this.nextState({ currentAddress } as State); + this.nextState({ current } as State); } onChangeName = (editedName: string): void => { @@ -190,55 +189,48 @@ class Editor extends React.PureComponent { } onCommit = (): void => { - const { currentAddress, editedName } = this.state; + const { current, editedName } = this.state; - if (!currentAddress) { + if (!current) { return; } - keyring.saveAddress(currentAddress.address(), { + keyring.saveAddress(current.address(), { name: editedName, whenEdited: Date.now() }); - - this.nextState({} as State); } onDiscard = (): void => { - const { currentAddress } = this.state; + const { current } = this.state; - if (!currentAddress) { + if (!current) { return; } this.nextState({ - editedName: currentAddress.getMeta().name + editedName: current.getMeta().name } as State); } onForget = (): void => { - const { currentAddress } = this.state; + const { current } = this.state; - if (!currentAddress) { + if (!current) { return; } - const address = currentAddress.address(); - const addresses = keyring.getAddresses().filter((item) => - item.address() !== address + this.setState( + this.createState(null), + () => { + keyring.forgetAddress( + current.address() + ); + } ); - const nextAddress = addresses[0] || null; - const defaultValue = nextAddress - ? nextAddress.address() - : void 0; - - keyring.forgetAddress(address); - - this.nextState({ - currentAddress: nextAddress, - defaultValue - } as State); } } -export default translate(Editor); +export default withObservableBase( + addressObservable.subject, { propName: 'addressAll' } +)(translate(Editor)); diff --git a/packages/apps/src/NodeInfo.tsx b/packages/apps/src/NodeInfo.tsx index 9be681cec4..c8a0d4aa14 100644 --- a/packages/apps/src/NodeInfo.tsx +++ b/packages/apps/src/NodeInfo.tsx @@ -20,7 +20,7 @@ type Props = I18nProps & {}; const pkgJson = require('../package.json'); function updateTestInfo (chain?: string) { - keyring.setTestMode(isTestChain(chain)); + keyring.setDevMode(isTestChain(chain)); } class NodeInfo extends React.PureComponent { diff --git a/packages/ui-app/src/Dropdown.tsx b/packages/ui-app/src/Dropdown.tsx index 0f382c37db..f956575f2b 100644 --- a/packages/ui-app/src/Dropdown.tsx +++ b/packages/ui-app/src/Dropdown.tsx @@ -31,13 +31,22 @@ type SUIEvent = { export default class Dropdown