mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
finish warning modal UI
This commit is contained in:
parent
9b81180ab1
commit
b9c2994d24
@ -733,6 +733,15 @@
|
||||
"revert": {
|
||||
"message": "Revert"
|
||||
},
|
||||
"remove": {
|
||||
"message": "remove"
|
||||
},
|
||||
"removeAccount": {
|
||||
"message": "Remove account?"
|
||||
},
|
||||
"removeAccountDescription": {
|
||||
"message": "This account will be removed from your wallet. Please make sure you have the original seed phrase or private key for this imported account before continuing. You can import or create accounts again from the account drop-down. "
|
||||
},
|
||||
"rinkeby": {
|
||||
"message": "Rinkeby Test Network"
|
||||
},
|
||||
|
@ -68,6 +68,9 @@ function mapDispatchToProps (dispatch) {
|
||||
dispatch(actions.hideSidebar())
|
||||
dispatch(actions.toggleAccountMenu())
|
||||
},
|
||||
showForgetAccountConfirmationModal: (address) => {
|
||||
return dispatch(actions.showModal({ name: 'CONFIRM_FORGET_ACCOUNT', address }))
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
@ -204,7 +207,9 @@ AccountMenu.prototype.renderForgetAccount = function (keyring, address) {
|
||||
AccountMenu.prototype.forgetAccount = function (e, address) {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
const { showForgetAccountConfirmationModal } = this.props
|
||||
console.log('should forget address: ', address)
|
||||
showForgetAccountConfirmationModal(address)
|
||||
}
|
||||
|
||||
AccountMenu.prototype.renderKeyringType = function (keyring) {
|
||||
|
@ -0,0 +1,60 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import Button from '../../button'
|
||||
import { addressSummary } from '../../../util'
|
||||
|
||||
class ConfirmRemoveAccount extends Component {
|
||||
static propTypes = {
|
||||
hideModal: PropTypes.func.isRequired,
|
||||
removeAccount: PropTypes.func.isRequired,
|
||||
address: PropTypes.string.isRequired,
|
||||
}
|
||||
|
||||
static contextTypes = {
|
||||
t: PropTypes.func,
|
||||
}
|
||||
|
||||
handleRemove () {
|
||||
this.props.removeAccount(this.props.address)
|
||||
.then(() => this.props.hideModal())
|
||||
}
|
||||
|
||||
render () {
|
||||
const { t } = this.context
|
||||
|
||||
return (
|
||||
<div className="modal-container">
|
||||
<div className="modal-container__content">
|
||||
<div className="modal-container__title">
|
||||
{ `${t('removeAccount')}` }
|
||||
</div>
|
||||
<div className="modal-container__address">
|
||||
{addressSummary(this.props.address)}
|
||||
</div>
|
||||
<div className="modal-container__description">
|
||||
{ t('removeAccountDescription') }
|
||||
<a className="modal-container__link" rel="noopener noreferrer" target="_blank" href="https://consensys.zendesk.com/hc/en-us/articles/360004180111-What-are-imported-accounts-New-UI-">{ t('learnMore') }</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="modal-container__footer">
|
||||
<Button
|
||||
type="default"
|
||||
className="modal-container__footer-button"
|
||||
onClick={() => this.props.hideModal()}
|
||||
>
|
||||
{ t('nevermind') }
|
||||
</Button>
|
||||
<Button
|
||||
type="secondary"
|
||||
className="modal-container__footer-button"
|
||||
onClick={() => this.handleRemove()}
|
||||
>
|
||||
{ t('remove') }
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default ConfirmRemoveAccount
|
@ -0,0 +1,13 @@
|
||||
import { connect } from 'react-redux'
|
||||
import ConfirmRemoveAccount from './confirm-remove-account.component'
|
||||
|
||||
const { hideModal, removeAccount } = require('../../../actions')
|
||||
|
||||
const mapDispatchToProps = dispatch => {
|
||||
return {
|
||||
hideModal: () => dispatch(hideModal()),
|
||||
removeAccount: (address) => dispatch(removeAccount(address)),
|
||||
}
|
||||
}
|
||||
|
||||
export default connect(null, mapDispatchToProps)(ConfirmRemoveAccount)
|
2
ui/app/components/modals/confirm-remove-account/index.js
Normal file
2
ui/app/components/modals/confirm-remove-account/index.js
Normal file
@ -0,0 +1,2 @@
|
||||
import ConfirmRemoveAccount from './confirm-remove-account.container'
|
||||
module.exports = ConfirmRemoveAccount
|
@ -17,6 +17,17 @@
|
||||
text-align: center;
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
&__address {
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
&__link {
|
||||
color: #2f9ae0;
|
||||
}
|
||||
|
||||
&__content {
|
||||
overflow-y: auto;
|
||||
|
@ -1,4 +1,5 @@
|
||||
const Component = require('react').Component
|
||||
const React = require('react')
|
||||
const Component = React.Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const connect = require('react-redux').connect
|
||||
@ -20,6 +21,7 @@ const HideTokenConfirmationModal = require('./hide-token-confirmation-modal')
|
||||
const CustomizeGasModal = require('../customize-gas-modal')
|
||||
const NotifcationModal = require('./notification-modal')
|
||||
const ConfirmResetAccount = require('./confirm-reset-account')
|
||||
const ConfirmRemoveAccount = require('./confirm-remove-account')
|
||||
const TransactionConfirmed = require('./transaction-confirmed')
|
||||
const WelcomeBeta = require('./welcome-beta')
|
||||
const Notification = require('./notification')
|
||||
@ -241,6 +243,19 @@ const MODALS = {
|
||||
},
|
||||
},
|
||||
|
||||
CONFIRM_FORGET_ACCOUNT: {
|
||||
contents: h(ConfirmRemoveAccount),
|
||||
mobileModalStyle: {
|
||||
...modalContainerMobileStyle,
|
||||
},
|
||||
laptopModalStyle: {
|
||||
...modalContainerLaptopStyle,
|
||||
},
|
||||
contentStyle: {
|
||||
borderRadius: '8px',
|
||||
},
|
||||
},
|
||||
|
||||
NEW_ACCOUNT: {
|
||||
contents: [
|
||||
h(NewAccountModal, {}, []),
|
||||
@ -370,7 +385,7 @@ Modal.prototype.render = function () {
|
||||
backdropStyle: BACKDROPSTYLE,
|
||||
closeOnClick: !disableBackdropClick,
|
||||
},
|
||||
children,
|
||||
React.cloneElement(children, {...this.props.modalState.props}, null),
|
||||
)
|
||||
}
|
||||
|
||||
|
@ -88,7 +88,8 @@
|
||||
|
||||
.forget-account-icon {
|
||||
width: 25px;
|
||||
margin-left: 10px;
|
||||
padding-left: 10px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
@ -156,6 +156,7 @@
|
||||
.hw-connect {
|
||||
&__title {
|
||||
padding-top: 10px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&__msg {
|
||||
|
Loading…
Reference in New Issue
Block a user