fix: Relates to #138. Prevents user from importing account that is already in account list

packages/fether-react/src/Accounts/CreateAccount/AccountImportOptions/AccountImportOptions.js

@@ -5,8 +5,13 @@
 
 import React, { Component } from 'react';
 import { Card, Form as FetherForm } from 'fether-ui';
+import { accountsInfo$, withoutLoading } from '@parity/light.js';
+import light from '@parity/light.js-react';
 import { inject, observer } from 'mobx-react';
 
+@light({
+  accountsInfo: () => accountsInfo$().pipe(withoutLoading())
+})
 @inject('createAccountStore')
 @observer
 class AccountImportOptions extends Component {
@@ -32,19 +37,29 @@ class AccountImportOptions extends Component {
   handleSubmitPhrase = async () => {
     const phrase = this.state.phrase.trim();
     const {
+      createAccountStore,
       createAccountStore: { setPhrase }
     } = this.props;
 
     this.setState({ isLoading: true, phrase });
+
     try {
       await setPhrase(phrase);
+
+      const addressForPhrase = createAccountStore.address.toLowerCase();
+
+      if (this.hasExistingAddressForImport(addressForPhrase)) {
+        return;
+      }
+
       this.handleNextStep();
-    } catch (e) {
+    } catch (error) {
       this.setState({
         isLoading: false,
         error:
           'The passphrase was not recognized. Please verify that you entered your passphrase correctly.'
       });
+      console.error(error);
     }
   };
 
@@ -54,7 +69,15 @@ class AccountImportOptions extends Component {
     } = this.props;
 
     this.setState({ isLoading: true });
+
     try {
+      const json = JSON.parse(jsonString);
+      const jsonAddress = `0x${json['address'].toLowerCase()}`;
+
+      if (this.hasExistingAddressForImport(jsonAddress)) {
+        return;
+      }
+
       await setJsonString(jsonString);
       this.handleNextStep();
     } catch (error) {
@@ -67,6 +90,22 @@ class AccountImportOptions extends Component {
     }
   };
 
+  hasExistingAddressForImport = addressForImport => {
+    const { accountsInfo } = this.props;
+    const isExistingAddress = Object.keys(accountsInfo)
+      .map(address => address && address.toLowerCase())
+      .includes(addressForImport);
+
+    if (isExistingAddress) {
+      this.setState({
+        isLoading: false,
+        error: `Account already loaded. Address ${addressForImport} is already in the account list`
+      });
+    }
+
+    return isExistingAddress;
+  };
+
   render () {
     const {
       history,