Merge pull request #86 from meriadec/master

Restore archived accounts

src/components/SettingsPage/Profile.js

@@ -15,6 +15,7 @@ import { unlock } from 'reducers/application'
 
 import Box, { Card } from 'components/base/Box'
 import Input from 'components/base/Input'
+import CheckBox from 'components/base/CheckBox'
 import Button from 'components/base/Button'
 import Label from 'components/base/Label'
 
@@ -80,17 +81,21 @@ class TabProfile extends PureComponent<Props, State> {
 
   render() {
     const { inputValue } = this.state
+
+    const isPasswordChecked = get(inputValue, 'password.state', false)
     return (
       <form onSubmit={this.handleSubmit}>
         <Card flow={3}>
           <label>
-            <Box horizontal align="center" flow={1} style={{ cursor: 'pointer' }}>
-              <input
-                type="checkbox"
-                checked={get(inputValue, 'password.state', false)}
-                onChange={e => this.handleChangeInput('password.state')(e.target.checked)}
-              />
-              <div>{' with password'}</div>
+            <Box
+              horizontal
+              align="center"
+              flow={1}
+              style={{ cursor: 'pointer' }}
+              onClick={() => this.handleChangeInput('password.state')(!isPasswordChecked)}
+            >
+              <CheckBox isChecked={isPasswordChecked} />
+              <div>{' Protect local data with a password'}</div>
             </Box>
           </label>
           {get(inputValue, 'password.state') === true && (

src/components/base/CheckBox/index.js

@@ -1,6 +1,7 @@
 // @flow
 
 import React from 'react'
+import noop from 'lodash/noop'
 import styled, { keyframes } from 'styled-components'
 
 import { Tabbable } from 'components/base/Box'
@@ -60,7 +61,7 @@ function CheckBox(props: Props) {
 }
 
 CheckBox.defaultProps = {
-  onChange: null,
+  onChange: noop,
 }
 
 export default CheckBox

src/components/modals/AddAccount/RestoreAccounts.js

@@ -0,0 +1,35 @@
+// @flow
+
+import React from 'react'
+
+import Box from 'components/base/Box'
+import Button from 'components/base/Button'
+import Text from 'components/base/Text'
+
+import type { Accounts } from 'types/common'
+
+type Props = {
+  archivedAccounts: Accounts,
+  updateAccount: Function,
+}
+
+function RestoreAccounts(props: Props) {
+  const { archivedAccounts, updateAccount } = props
+  return (
+    <Box borderWidth={1} borderColor="grenade">
+      <Text fontSize={3} fontWeight="bold">
+        {'Restore account'}
+      </Text>
+      {archivedAccounts.map(account => (
+        <Box key={account.id} horizontal flow={2} align="center">
+          <Text>{account.name}</Text>
+          <Button primary onClick={() => updateAccount({ ...account, archived: false })}>
+            {'restore'}
+          </Button>
+        </Box>
+      ))}
+    </Box>
+  )
+}
+
+export default RestoreAccounts

src/components/modals/AddAccount/index.js

@@ -13,11 +13,11 @@ import type { MapStateToProps } from 'react-redux'
 import type { Accounts, Device, T } from 'types/common'
 
 import { closeModal } from 'reducers/modals'
-import { canCreateAccount, getAccounts } from 'reducers/accounts'
+import { canCreateAccount, getAccounts, getArchivedAccounts } from 'reducers/accounts'
 import { getCurrentDevice } from 'reducers/devices'
 import { sendEvent } from 'renderer/events'
 
-import { addAccount } from 'actions/accounts'
+import { addAccount, updateAccount } from 'actions/accounts'
 
 import Box from 'components/base/Box'
 import Text from 'components/base/Text'
@@ -28,6 +28,7 @@ import Select from 'components/base/Select'
 
 import CreateAccount from './CreateAccount'
 import ImportAccounts from './ImportAccounts'
+import RestoreAccounts from './RestoreAccounts'
 
 const currencies = [
   {
@@ -75,7 +76,7 @@ const Steps = {
     </Box>
   ),
   listAccounts: (props: Object) => {
-    const { accounts } = props
+    const { accounts, archivedAccounts } = props
     const emptyAccounts = accounts.filter(account => account.transactions.length === 0)
     const existingAccounts = accounts.filter(account => account.transactions.length > 0)
     const canCreateAccount = props.canCreateAccount && emptyAccounts.length === 1
@@ -83,6 +84,7 @@ const Steps = {
     return (
       <Box flow={10}>
         <ImportAccounts {...props} accounts={existingAccounts} />
+        {!!archivedAccounts.length && <RestoreAccounts {...props} accounts={archivedAccounts} />}
         {canCreateAccount ? (
           <CreateAccount {...props} account={newAccount} />
         ) : (
@@ -102,7 +104,9 @@ type Step = 'chooseWallet' | 'connectDevice' | 'inProgress' | 'listAccounts'
 type Props = {
   t: T,
   accounts: Accounts,
+  archivedAccounts: Accounts,
   addAccount: Function,
+  updateAccount: Function,
   canCreateAccount: boolean,
   closeModal: Function,
   currentDevice: Device | null,
@@ -117,12 +121,14 @@ type State = {
 
 const mapStateToProps: MapStateToProps<*, *, *> = state => ({
   accounts: getAccounts(state),
+  archivedAccounts: getArchivedAccounts(state),
   canCreateAccount: canCreateAccount(state),
   currentDevice: getCurrentDevice(state),
 })
 
 const mapDispatchToProps = {
   addAccount,
+  updateAccount,
   closeModal,
 }
 
@@ -132,7 +138,7 @@ const defaultState = {
   },
   accounts: [],
   progress: null,
-  step: 'chooseWallet',
+  step: 'listAccounts',
 }
 
 class AddAccountModal extends PureComponent<Props, State> {
@@ -184,7 +190,7 @@ class AddAccountModal extends PureComponent<Props, State> {
   }
 
   getStepProps() {
-    const { currentDevice, canCreateAccount, t } = this.props
+    const { currentDevice, archivedAccounts, canCreateAccount, updateAccount, t } = this.props
     const { inputValue, step, progress, accounts } = this.state
 
     const props = (predicate, props) => (predicate ? props : {})
@@ -208,7 +214,9 @@ class AddAccountModal extends PureComponent<Props, State> {
       ...props(step === 'listAccounts', {
         t,
         accounts,
+        archivedAccounts,
         canCreateAccount,
+        updateAccount,
         onAddAccount: this.handleAddAccount,
         onImportAccounts: this.handleImportAccounts,
       }),

src/reducers/accounts.js

@@ -110,6 +110,10 @@ export function getAccounts(state: { accounts: AccountsState }): Array<Account>
   return state.accounts
 }
 
+export function getArchivedAccounts(state: { accounts: AccountsState }): Array<Account> {
+  return state.accounts.filter(acc => acc.archived === true)
+}
+
 export function getVisibleAccounts(state: { accounts: AccountsState }): Array<Account> {
   return getAccounts(state).filter(account => account.archived !== true)
 }