(null);
- const [{ isDevelopment, isEditable, isExternal }, setFlags] = useState({ isDevelopment: false, isEditable: false, isExternal: false });
+ const { genesisHash, isDevelopment, isEditable, isExternal, name: accName, onSaveGenesisHash, tags } = useAccountInfo(address);
const [isVisible, setIsVisible] = useState(true);
- const [isEditingName, toggleEditName] = useToggle();
- const [isEditingTags, toggleEditTags] = useToggle();
const [isBackupOpen, toggleBackup] = useToggle();
const [isDeriveOpen, toggleDerive] = useToggle();
const [isForgetOpen, toggleForget] = useToggle();
@@ -69,40 +63,10 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
const [isSettingsOpen, toggleSettings] = useToggle();
const [isTransferOpen, toggleTransfer] = useToggle();
- const _setTags = useCallback(
- (tags: string[]): void => setTags(tags.sort()),
- []
- );
-
useEffect((): void => {
balancesAll && setBalance(address, balancesAll.freeBalance);
}, [address, balancesAll, setBalance]);
- useEffect((): void => {
- const { identity, nickname } = info || {};
-
- if (api.api.query.identity && api.api.query.identity.identityOf) {
- if (identity?.display) {
- setAccName(identity.display);
- }
- } else if (nickname) {
- setAccName(nickname);
- }
- }, [api, info]);
-
- useEffect((): void => {
- const account = keyring.getAccount(address);
-
- setGenesisHash(account?.meta.genesisHash || null);
- setFlags({
- isDevelopment: account?.meta.isTesting || false,
- isEditable: (account && !(account.meta.isInjected || account.meta.isHardware)) || false,
- isExternal: account?.meta.isExternal || false
- });
- _setTags(account?.meta.tags || []);
- setAccName(account?.meta.name || '');
- }, [address, _setTags]);
-
useEffect((): void => {
setIsVisible(
calcVisible(filter, accName, tags)
@@ -114,55 +78,6 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
[address, toggleFavorite]
);
- const _onGenesisChange = useCallback(
- (genesisHash: string | null): void => {
- const account = keyring.getPair(address);
-
- account && keyring.saveAccountMeta(account, { ...account.meta, genesisHash });
-
- setGenesisHash(genesisHash);
- },
- [address]
- );
-
- const _saveName = useCallback(
- (): void => {
- toggleEditName();
-
- const meta = { name: accName, whenEdited: Date.now() };
-
- if (address) {
- try {
- const currentKeyring = keyring.getPair(address);
-
- currentKeyring && keyring.saveAccountMeta(currentKeyring, meta);
- } catch (error) {
- keyring.saveAddress(address, meta);
- }
- }
- },
- [accName, address, toggleEditName]
- );
-
- const _saveTags = useCallback(
- (): void => {
- toggleEditTags();
-
- const meta = { tags, whenEdited: Date.now() };
-
- if (address) {
- try {
- const currentKeyring = keyring.getPair(address);
-
- currentKeyring && keyring.saveAccountMeta(currentKeyring, meta);
- } catch (error) {
- keyring.saveAddress(address, meta);
- }
- }
- },
- [address, tags, toggleEditTags]
- );
-
const _onForget = useCallback(
(): void => {
if (!address) {
@@ -240,26 +155,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
)}
|
-
- )
- : undefined
- }
- toggle={isEditingName}
- value={address}
- />
+
{isBackupOpen && (
|
- {isEditingTags
- ? (
-
- )
- : (
-
- {tags.length
- ? tags.map((tag): React.ReactNode => (
-
- ))
- :
- }
-
- )
- }
+
+ {tags.length
+ ? tags.map((tag): React.ReactNode => (
+
+ ))
+ :
+ }
+
|
{balancesAll && formatNumber(balancesAll.accountNonce)}
@@ -443,7 +320,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
diff --git a/packages/page-accounts/src/Contacts/Address.tsx b/packages/page-accounts/src/Contacts/Address.tsx
index 2a006b398b..011f68dbe3 100644
--- a/packages/page-accounts/src/Contacts/Address.tsx
+++ b/packages/page-accounts/src/Contacts/Address.tsx
@@ -8,12 +8,11 @@ import { ActionStatus } from '@polkadot/react-components/Status/types';
import React, { useCallback, useEffect, useState } from 'react';
import styled from 'styled-components';
-import { AddressSmall, AddressInfo, Button, ChainLock, Icon, InputTags, Input, LinkExternal, Forget, Menu, Popup, Tag } from '@polkadot/react-components';
-import { useApi, useCall, useToggle } from '@polkadot/react-hooks';
+import { AddressSmall, AddressInfo, Button, ChainLock, Icon, LinkExternal, Forget, Menu, Popup, Tag, Transfer } from '@polkadot/react-components';
+import { useApi, useCall } from '@polkadot/react-hooks';
import keyring from '@polkadot/ui-keyring';
import { formatNumber } from '@polkadot/util';
-import Transfer from '../Accounts/modals/Transfer';
import { useTranslation } from '../translate';
interface Props {
@@ -37,11 +36,9 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
const [accName, setAccName] = useState('');
const [current, setCurrent] = useState(null);
const [genesisHash, setGenesisHash] = useState(null);
- const [isEditingName, toggleEditName] = useToggle();
- const [isEditingTags, toggleEditTags] = useToggle();
- const [isForgetOpen, toggleForget] = useToggle();
- const [isSettingPopupOpen, toggleTransfer] = useToggle();
- const [isTransferOpen, toggleSettingPopup] = useToggle();
+ const [isForgetOpen, setIsForgetOpen] = useState(false);
+ const [isSettingPopupOpen, setIsSettingPopupOpen] = useState(false);
+ const [isTransferOpen, setIsTransferOpen] = useState(false);
const [isVisible, setIsVisible] = useState(true);
const _setTags = useCallback(
@@ -90,6 +87,39 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
}
}, [accName, filter, tags]);
+ const _onGenesisChange = useCallback(
+ (genesisHash: string | null): void => {
+ setGenesisHash(genesisHash);
+
+ const account = keyring.getAddress(address);
+
+ account && keyring.saveAddress(address, { ...account.meta, genesisHash });
+
+ setGenesisHash(genesisHash);
+ },
+ [address]
+ );
+
+ const _onFavorite = useCallback(
+ (): void => toggleFavorite(address),
+ [address, toggleFavorite]
+ );
+
+ const _toggleForget = useCallback(
+ (): void => setIsForgetOpen(!isForgetOpen),
+ [isForgetOpen]
+ );
+
+ const _toggleSettingPopup = useCallback(
+ (): void => setIsSettingPopupOpen(!isSettingPopupOpen),
+ [isSettingPopupOpen]
+ );
+
+ const _toggleTransfer = useCallback(
+ (): void => setIsTransferOpen(!isTransferOpen),
+ [isTransferOpen]
+ );
+
const _onForget = useCallback(
(): void => {
if (address) {
@@ -111,62 +141,6 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
[address, t]
);
- const _onGenesisChange = useCallback(
- (genesisHash: string | null): void => {
- setGenesisHash(genesisHash);
-
- const account = keyring.getAddress(address);
-
- account && keyring.saveAddress(address, { ...account.meta, genesisHash });
-
- setGenesisHash(genesisHash);
- },
- [address]
- );
-
- const _onFavorite = useCallback(
- (): void => toggleFavorite(address),
- [address, toggleFavorite]
- );
-
- const _saveName = useCallback(
- (): void => {
- toggleEditName();
-
- const meta = { name: accName, whenEdited: Date.now() };
-
- if (address) {
- try {
- const currentKeyring = keyring.getPair(address);
-
- currentKeyring && keyring.saveAccountMeta(currentKeyring, meta);
- } catch (error) {
- keyring.saveAddress(address, meta);
- }
- }
- },
- [accName, address, toggleEditName]
- );
-
- const _saveTags = useCallback(
- (): void => {
- toggleEditTags();
-
- const meta = { tags, whenEdited: Date.now() };
-
- if (address) {
- try {
- const currentKeyring = keyring.getPair(address);
-
- currentKeyring && keyring.saveAccountMeta(currentKeyring, meta);
- } catch (error) {
- keyring.saveAddress(address, meta);
- }
- }
- },
- [address, tags, toggleEditTags]
- );
-
if (!isVisible) {
return null;
}
@@ -181,26 +155,7 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
/>
|
-
- )
- : undefined
- }
- toggle={isEditingName}
- value={address}
- />
+
{address && current && (
<>
{isForgetOpen && (
@@ -208,14 +163,14 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
address={current.address}
key='modal-forget-account'
mode='address'
- onClose={toggleForget}
+ onClose={_toggleForget}
onForget={_onForget}
/>
)}
{isTransferOpen && (
)}
@@ -223,36 +178,17 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
)}
|
- {isEditingTags
- ? (
-
- )
- : (
-
- {tags.length
- ? tags.map((tag): React.ReactNode => (
-
- ))
- :
- }
-
- )
- }
+
+ {tags.length
+ ? tags.map((tag): React.ReactNode => (
+
+ ))
+ :
+ }
+
|
{balancesAll && formatNumber(balancesAll.accountNonce)}
@@ -270,30 +206,30 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
icon='paper plane'
key='deposit'
label={t('deposit')}
- onClick={toggleTransfer}
+ onClick={_toggleTransfer}
size='small'
tooltip={t('Send funds to this address')}
/>
}
>
|