diff --git a/old-ui/app/account-detail.js b/old-ui/app/account-detail.js index 87625cdb6..99c05f7e0 100644 --- a/old-ui/app/account-detail.js +++ b/old-ui/app/account-detail.js @@ -269,6 +269,7 @@ AccountDetailScreen.prototype.tabSwitchView = function () { network, tokens, addToken: () => this.props.dispatch(actions.showAddTokenPage()), + removeToken: (token) => this.props.dispatch(actions.showRemoveTokenPage(token)), }) default: return this.transactionList() diff --git a/old-ui/app/app.js b/old-ui/app/app.js index 73d3c3e0e..0395aec22 100644 --- a/old-ui/app/app.js +++ b/old-ui/app/app.js @@ -22,6 +22,7 @@ const generateLostAccountsNotice = require('../lib/lost-accounts-notice') // other views const ConfigScreen = require('./config') const AddTokenScreen = require('./add-token') +const RemoveTokenScreen = require('./remove-token') const Import = require('./accounts/import') const InfoScreen = require('./info') const Loading = require('./components/loading') @@ -566,6 +567,10 @@ App.prototype.renderPrimary = function () { log.debug('rendering add-token screen from unlock screen.') return h(AddTokenScreen, {key: 'add-token'}) + case 'remove-token': + log.debug('rendering remove-token screen from unlock screen.') + return h(RemoveTokenScreen, {key: 'remove-token', ...props.currentView.context }) + case 'config': log.debug('rendering config screen') return h(ConfigScreen, {key: 'config'}) diff --git a/old-ui/app/components/token-cell.js b/old-ui/app/components/token-cell.js index 19d7139bb..13875fad0 100644 --- a/old-ui/app/components/token-cell.js +++ b/old-ui/app/components/token-cell.js @@ -31,6 +31,14 @@ TokenCell.prototype.render = function () { h('span', { style: { flex: '1 0 auto' } }), + h('span.fa.fa-trash', { + style: { cursor: 'pointer' }, + onClick: (event) => { + event.stopPropagation() + this.props.removeToken({ address, symbol, string, network, userAddress }) + }, + }, ''), + /* h('button', { onClick: this.send.bind(this, address), diff --git a/old-ui/app/components/token-list.js b/old-ui/app/components/token-list.js index e20594b61..d5b3759ae 100644 --- a/old-ui/app/components/token-list.js +++ b/old-ui/app/components/token-list.js @@ -51,7 +51,10 @@ TokenList.prototype.render = function () { const tokenViews = tokens.map((tokenData) => { tokenData.network = network tokenData.userAddress = userAddress - return h(TokenCell, tokenData) + return h(TokenCell, { + ...tokenData, + removeToken: this.props.removeToken, + }) }) return h('.full-flex-height', [ diff --git a/old-ui/app/remove-token.js b/old-ui/app/remove-token.js new file mode 100644 index 000000000..b8463a412 --- /dev/null +++ b/old-ui/app/remove-token.js @@ -0,0 +1,67 @@ +const inherits = require('util').inherits +const Component = require('react').Component +const h = require('react-hyperscript') +const connect = require('react-redux').connect +const actions = require('../../ui/app/actions') + +module.exports = connect(mapStateToProps)(RemoveTokenScreen) + +function mapStateToProps (state) { + return {} +} + +inherits(RemoveTokenScreen, Component) +function RemoveTokenScreen () { + this.state = {} + Component.call(this) +} + +RemoveTokenScreen.prototype.render = function () { + const props = this.props + + const warning = `Are you sure you want to remove token "${props.symbol}"?` + + return ( + h('.flex-column.flex-grow', [ + + // subtitle and nav + h('.section-title.flex-row.flex-center', [ + h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { + onClick: (event) => { + props.dispatch(actions.goHome()) + }, + }), + h('h2.page-subtitle', 'Remove Token'), + ]), + + h('div', { + style: { + display: 'inline-block', + textAlign: 'center', + }, + }, [ + h('p.error', warning), + ]), + + h('.flex-column.flex-justify-center.flex-grow.select-none', [ + h('.flex-space-around', { + style: { + padding: '20px', + }, + }, [ + h('button', { + style: { + alignSelf: 'center', + }, + onClick: (event) => { + this.props.dispatch(actions.removeToken(props.address)) + .then(() => { + this.props.dispatch(actions.goHome()) + }) + }, + }, 'Remove'), + ]), + ]), + ]) + ) +} diff --git a/ui/app/actions.js b/ui/app/actions.js index 6f6a4db84..6550f0ea8 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -209,7 +209,9 @@ var actions = { SET_PROVIDER_TYPE: 'SET_PROVIDER_TYPE', showConfigPage, SHOW_ADD_TOKEN_PAGE: 'SHOW_ADD_TOKEN_PAGE', + SHOW_REMOVE_TOKEN_PAGE: 'SHOW_REMOVE_TOKEN_PAGE', showAddTokenPage, + showRemoveTokenPage, addToken, addTokens, removeToken, @@ -1391,6 +1393,14 @@ function showAddTokenPage (transitionForward = true) { } } +function showRemoveTokenPage (token, transitionForward = true) { + return { + type: actions.SHOW_REMOVE_TOKEN_PAGE, + value: transitionForward, + token, + } +} + function addToken (address, symbol, decimals) { return (dispatch) => { dispatch(actions.showLoadingIndication()) diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index f453812b9..34d44e2ab 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -181,6 +181,15 @@ function reduceApp (state, action) { transForward: action.value, }) + case actions.SHOW_REMOVE_TOKEN_PAGE: + return extend(appState, { + currentView: { + name: 'remove-token', + context: action.token, + }, + transForward: action.value, + }) + case actions.SHOW_IMPORT_PAGE: return extend(appState, { currentView: {