diff --git a/packages/extension-ui/src/Popup/Accounts/Account.tsx b/packages/extension-ui/src/Popup/Accounts/Account.tsx
index c7d4c0da..308ac8dc 100644
--- a/packages/extension-ui/src/Popup/Accounts/Account.tsx
+++ b/packages/extension-ui/src/Popup/Accounts/Account.tsx
@@ -6,55 +6,61 @@ import React, { useState } from 'react';
import { Link } from 'react-router-dom';
import { ActionBar, Address } from '../../components';
+import { ActionContext } from '../../components/contexts';
import { editAccount } from '../../messaging';
import { Name } from '../../partials';
type Props = {
className?: string,
- address: string,
- name?: string | null,
- onAction: () => void
+ address: string
};
-export default function Account ({ address, className, name, onAction }: Props) {
+export default function Account ({ address, className }: Props) {
const [isEditing, setEditing] = useState(false);
- const [editedname, setName] = useState(name);
+ const [editedname, setName] = useState(null as string | null);
- const _toggleEdit = (): void => {
+ const toggleEdit = (): void => {
setEditing(!isEditing);
};
- const _saveChanges = (): void => {
- if (editedname && editedname !== name) {
- editAccount(address, editedname)
- .then(onAction)
- .catch(console.error);
- }
-
- _toggleEdit();
- };
return (
-
- )
- : name
- }
- >
-
- Edit
- Forget
-
-
+
+ {(onAction) => {
+ const saveChanges = (): void => {
+ if (editedname && editedname !== name) {
+ editAccount(address, editedname)
+ .then(() => onAction())
+ .catch(console.error);
+ }
+
+ toggleEdit();
+ };
+
+ return (
+
+ )
+ : undefined
+ }
+ >
+
+ Edit
+ Forget
+
+
+ );
+ }}
+
);
}
diff --git a/packages/extension-ui/src/Popup/Accounts/index.tsx b/packages/extension-ui/src/Popup/Accounts/index.tsx
index 9efb277b..9787e0dc 100644
--- a/packages/extension-ui/src/Popup/Accounts/index.tsx
+++ b/packages/extension-ui/src/Popup/Accounts/index.tsx
@@ -2,44 +2,40 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
-import { KeyringJson } from '@polkadot/ui-keyring/types';
-
import React from 'react';
import { Button, Header, Tip } from '../../components';
+import { AccountContext } from '../../components/contexts';
import Account from './Account';
-type Props = {
- accounts: Array,
- onAction: () => void
-};
+type Props = {};
-export default function Accounts ({ accounts, onAction }: Props) {
+export default function Accounts (props: Props) {
return (
-
-
- {
- (accounts.length === 0)
- ? You currently don't have any accounts. Either create a new account or if you have an existing account you wish to use, import it with the seed phrase
- : accounts.map(({ address, meta: { name } }) => (
-
- ))
- }
-
-
-
+
+ {(accounts) => (
+
+
+ {
+ (accounts.length === 0)
+ ? You currently don't have any accounts. Either create a new account or if you have an existing account you wish to use, import it with the seed phrase
+ : accounts.map(({ address }) => (
+
+ ))
+ }
+
+
+
+ )}
+
);
}
diff --git a/packages/extension-ui/src/Popup/Create.tsx b/packages/extension-ui/src/Popup/Create.tsx
index 6b1968df..b63935d1 100644
--- a/packages/extension-ui/src/Popup/Create.tsx
+++ b/packages/extension-ui/src/Popup/Create.tsx
@@ -5,14 +5,13 @@
import React, { useState, useEffect } from 'react';
import { Address, Button, Header, Loading, TextArea } from '../components';
+import { ActionContext } from '../components/contexts';
import { createAccount, createSeed } from '../messaging';
import { Back, Name, Password } from '../partials';
-type Props = {
- onAction: () => void
-};
+type Props = {};
-export default function Create ({ onAction }: Props) {
+export default function Create (props: Props) {
const [account, setAccount] = useState(null as null | { address: string, seed: string });
const [name, setName] = useState(null as string | null);
const [password, setPassword] = useState(null as string | null);
@@ -23,50 +22,52 @@ export default function Create ({ onAction }: Props) {
.catch(console.error);
}, []);
- // FIXME Duplicated between here and Import.tsx
- const _onCreate = (): void => {
- // this should always be the case
- if (name && password && account) {
- createAccount(name, password, account.seed)
- .then(() => {
- onAction();
- window.location.hash = '/';
- })
- .catch(console.error);
- }
- };
-
return (
-
+ );
+ }}
+
);
}
diff --git a/packages/extension-ui/src/Popup/Forget.tsx b/packages/extension-ui/src/Popup/Forget.tsx
index b1beda38..0469f0ea 100644
--- a/packages/extension-ui/src/Popup/Forget.tsx
+++ b/packages/extension-ui/src/Popup/Forget.tsx
@@ -2,48 +2,42 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
-import { KeyringJson } from '@polkadot/ui-keyring/types';
-
import React from 'react';
import { RouteComponentProps, withRouter } from 'react-router';
import { Address, Button, Header, Tip } from '../components';
import { forgetAccount } from '../messaging';
import { Back } from '../partials';
+import { ActionContext } from '../components/contexts';
-type Props = RouteComponentProps<{ address: string }> & {
- accounts: Array,
- onAction: () => void
-};
+type Props = RouteComponentProps<{ address: string }> & {};
function Forget (props: Props) {
- const { accounts, match: { params: { address } }, onAction } = props;
- const account = accounts.find((account) => address === account.address);
-
- const _onClick = (): void => {
- forgetAccount(address)
- .then(() => {
- onAction();
- window.location.hash = '/';
- })
- .catch(console.error);
- };
+ const { match: { params: { address } } } = props;
return (
-
-
-
- You are about to remove the account. This means that you will not be able to access it via this extension anymore. If you wish to recover it, you would need to use the seed.
-
-
-
+
+
+ You are about to remove the account. This means that you will not be able to access it via this extension anymore. If you wish to recover it, you would need to use the seed.
+
+
+