From cce5b217ed14e6feeb78712d30e78f5430314113 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Tue, 22 Nov 2016 16:19:36 +0100 Subject: [PATCH] Delete account dialog --- js/src/modals/DeleteAccount/deleteAccount.css | 54 ++++++++ js/src/modals/DeleteAccount/deleteAccount.js | 127 ++++++++++++++++++ js/src/modals/DeleteAccount/index.js | 17 +++ js/src/modals/index.js | 2 + js/src/views/Account/account.js | 38 +++++- 5 files changed, 234 insertions(+), 4 deletions(-) create mode 100644 js/src/modals/DeleteAccount/deleteAccount.css create mode 100644 js/src/modals/DeleteAccount/deleteAccount.js create mode 100644 js/src/modals/DeleteAccount/index.js diff --git a/js/src/modals/DeleteAccount/deleteAccount.css b/js/src/modals/DeleteAccount/deleteAccount.css new file mode 100644 index 000000000..9cd72c6ab --- /dev/null +++ b/js/src/modals/DeleteAccount/deleteAccount.css @@ -0,0 +1,54 @@ +/* Copyright 2015, 2016 Ethcore (UK) Ltd. +/* This file is part of Parity. +/* +/* Parity is free software: you can redistribute it and/or modify +/* it under the terms of the GNU General Public License as published by +/* the Free Software Foundation, either version 3 of the License, or +/* (at your option) any later version. +/* +/* Parity is distributed in the hope that it will be useful, +/* but WITHOUT ANY WARRANTY; without even the implied warranty of +/* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +/* GNU General Public License for more details. +/* +/* You should have received a copy of the GNU General Public License +/* along with Parity. If not, see . +*/ + +.body { + .hero { + padding-bottom: 1em; + } + + .info { + display: inline-block; + } + + .icon { + display: inline-block; + } + + .nameinfo { + display: inline-block; + text-align: left; + } + + .header { + text-transform: uppercase; + font-size: 1.25em; + padding-bottom: 0.25em; + } + + .address { + } + + .description { + padding-top: 1em; + font-size: 0.75em; + color: #aaa; + } + + .password { + padding: 1em 5em; + } +} diff --git a/js/src/modals/DeleteAccount/deleteAccount.js b/js/src/modals/DeleteAccount/deleteAccount.js new file mode 100644 index 000000000..1c6f48df5 --- /dev/null +++ b/js/src/modals/DeleteAccount/deleteAccount.js @@ -0,0 +1,127 @@ +// Copyright 2015, 2016 Ethcore (UK) Ltd. +// This file is part of Parity. + +// Parity is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. + +// Parity is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. + +// You should have received a copy of the GNU General Public License +// along with Parity. If not, see . + +import React, { Component, PropTypes } from 'react'; +import { connect } from 'react-redux'; +import { bindActionCreators } from 'redux'; + +import { ConfirmDialog, IdentityIcon, IdentityName, Input } from '../../ui'; +import { newError } from '../../redux/actions'; + +import styles from './deleteAccount.css'; + +class DeleteAccount extends Component { + static contextTypes = { + api: PropTypes.object.isRequired, + router: PropTypes.object + } + + static propTypes = { + account: PropTypes.object.isRequired, + onClose: PropTypes.func, + newError: PropTypes.func + } + + state = { + password: '' + } + + render () { + const { account } = this.props; + const { password } = this.state; + + return ( + +
+ Are you sure you want to remove permanently delete the following account? +
+
+ +
+
+ +
+
+ { account.address } +
+
+
+
+ { account.meta.description } +
+
+ +
+ + ); + } + + onChangePassword = (event, password) => { + this.setState({ password }); + } + + onDeleteConfirmed = () => { + const { api, router } = this.context; + const { account, newError } = this.props; + const { password } = this.state; + + api.parity + .killAccount(account.address, password) + .then((result) => { + if (result === true) { + router.push('/accounts'); + } else { + newError(new Error('Deletion failed.')); + } + + this.closeDeleteDialog(); + }) + .catch((error) => { + console.error('onDeleteConfirmed', error); + newError(new Error(`Deletion failed: ${error.message}`)); + this.closeDeleteDialog(); + }); + } + + closeDeleteDialog = () => { + this.props.onClose(); + } +} + +function mapStateToProps (state) { + return {}; +} + +function mapDispatchToProps (dispatch) { + return bindActionCreators({ newError }, dispatch); +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(DeleteAccount); diff --git a/js/src/modals/DeleteAccount/index.js b/js/src/modals/DeleteAccount/index.js new file mode 100644 index 000000000..5738c2704 --- /dev/null +++ b/js/src/modals/DeleteAccount/index.js @@ -0,0 +1,17 @@ +// Copyright 2015, 2016 Ethcore (UK) Ltd. +// This file is part of Parity. + +// Parity is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. + +// Parity is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. + +// You should have received a copy of the GNU General Public License +// along with Parity. If not, see . + +export default from './deleteAccount'; diff --git a/js/src/modals/index.js b/js/src/modals/index.js index d0f8f7afe..06114159b 100644 --- a/js/src/modals/index.js +++ b/js/src/modals/index.js @@ -17,6 +17,7 @@ import AddAddress from './AddAddress'; import AddContract from './AddContract'; import CreateAccount from './CreateAccount'; +import DeleteAccount from './DeleteAccount'; import DeployContract from './DeployContract'; import EditMeta from './EditMeta'; import ExecuteContract from './ExecuteContract'; @@ -32,6 +33,7 @@ export { AddAddress, AddContract, CreateAccount, + DeleteAccount, DeployContract, EditMeta, ExecuteContract, diff --git a/js/src/views/Account/account.js b/js/src/views/Account/account.js index 86a76073e..b36f58618 100644 --- a/js/src/views/Account/account.js +++ b/js/src/views/Account/account.js @@ -17,12 +17,13 @@ import React, { Component, PropTypes } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; +import ActionDelete from 'material-ui/svg-icons/action/delete'; import ContentCreate from 'material-ui/svg-icons/content/create'; import ContentSend from 'material-ui/svg-icons/content/send'; import LockIcon from 'material-ui/svg-icons/action/lock'; import VerifyIcon from 'material-ui/svg-icons/action/verified-user'; -import { EditMeta, Shapeshift, SMSVerification, Transfer, PasswordManager } from '../../modals'; +import { EditMeta, DeleteAccount, Shapeshift, SMSVerification, Transfer, PasswordManager } from '../../modals'; import { Actionbar, Button, Page } from '../../ui'; import shapeshiftBtn from '../../../assets/images/shapeshift-btn.png'; @@ -50,6 +51,7 @@ class Account extends Component { propName = null state = { + showDeleteDialog: false, showEditDialog: false, showFundDialog: false, showVerificationDialog: false, @@ -62,8 +64,8 @@ class Account extends Component { const { api } = this.context; const { address } = this.props.params; - const store = new VerificationStore(api, address); - this.setState({ verificationStore: store }); + const verificationStore = new VerificationStore(api, address); + this.setState({ verificationStore }); } render () { @@ -79,6 +81,7 @@ class Account extends Component { return (
+ { this.renderDeleteDialog(account) } { this.renderEditDialog(account) } { this.renderFundDialog() } { this.renderVerificationDialog() } @@ -131,7 +134,12 @@ class Account extends Component { key='passwordManager' icon={ } label='password' - onClick={ this.onPasswordClick } /> + onClick={ this.onPasswordClick } />, +