diff options
author | Mark Stacey <markjstacey@gmail.com> | 2019-07-25 19:55:43 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2019-07-25 19:55:43 +0800 |
commit | adac1de822fb461ba792ae248fbda366c428fca7 (patch) | |
tree | 52792ab5d3a1dc81f9dba213a5eca3621025c165 /ui/app/components | |
parent | 74639ab3ae65fdaaabb8e340f27d581ab49227c7 (diff) | |
download | tangerine-wallet-browser-adac1de822fb461ba792ae248fbda366c428fca7.tar.gz tangerine-wallet-browser-adac1de822fb461ba792ae248fbda366c428fca7.tar.zst tangerine-wallet-browser-adac1de822fb461ba792ae248fbda366c428fca7.zip |
Remove `AccountDropdownMini` component (#6906)
The `AccountDropdownMini` component featured the ability to switch
accounts using a dropdown, but this functionality was disabled in #6024.
It has been acting as a restyled `AccountListItem` since then.
The component has been removed, and the style changes moved to the sole
parent component (`RequestSignature`).
Diffstat (limited to 'ui/app/components')
4 files changed, 9 insertions, 207 deletions
diff --git a/ui/app/components/app/signature-request.js b/ui/app/components/app/signature-request.js index fa237f1d1..5f0f16b37 100644 --- a/ui/app/components/app/signature-request.js +++ b/ui/app/components/app/signature-request.js @@ -12,7 +12,7 @@ const { compose } = require('recompose') const { withRouter } = require('react-router-dom') const { ObjectInspector } = require('react-inspector') -import AccountDropdownMini from '../ui/account-dropdown-mini' +import AccountListItem from '../../pages/send/account-list-item/account-list-item.component' const actions = require('../../store/actions') const { conversionUtil } = require('../../helpers/utils/conversion-util') @@ -21,7 +21,6 @@ const { getSelectedAccount, getCurrentAccountWithSendEtherInfo, getSelectedAddress, - accountsWithSendEtherInfoSelector, conversionRateSelector, } = require('../../selectors/selectors.js') @@ -37,7 +36,6 @@ function mapStateToProps (state) { selectedAddress: getSelectedAddress(state), requester: null, requesterAddress: null, - accounts: accountsWithSendEtherInfoSelector(state), conversionRate: conversionRateSelector(state), } } @@ -137,23 +135,19 @@ SignatureRequest.prototype.renderHeader = function () { ]) } -SignatureRequest.prototype.renderAccountDropdown = function () { +SignatureRequest.prototype.renderAccount = function () { const { selectedAccount } = this.state - const { - accounts, - } = this.props - return h('div.request-signature__account', [ h('div.request-signature__account-text', [this.context.t('account') + ':']), - h(AccountDropdownMini, { - selectedAccount, - accounts, - disabled: true, - }), - + h('div.request-signature__account-item', [ + h(AccountListItem, { + account: selectedAccount, + displayBalance: false, + }), + ]), ]) } @@ -180,7 +174,7 @@ SignatureRequest.prototype.renderBalance = function () { SignatureRequest.prototype.renderAccountInfo = function () { return h('div.request-signature__account-info', [ - this.renderAccountDropdown(), + this.renderAccount(), this.renderRequestIcon(), diff --git a/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js b/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js deleted file mode 100644 index d9627e31b..000000000 --- a/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js +++ /dev/null @@ -1,84 +0,0 @@ -import React, { PureComponent } from 'react' -import PropTypes from 'prop-types' -import AccountListItem from '../../../pages/send/account-list-item/account-list-item.component' - -export default class AccountDropdownMini extends PureComponent { - static propTypes = { - accounts: PropTypes.array.isRequired, - closeDropdown: PropTypes.func, - disabled: PropTypes.bool, - dropdownOpen: PropTypes.bool, - onSelect: PropTypes.func, - openDropdown: PropTypes.func, - selectedAccount: PropTypes.object.isRequired, - } - - static defaultProps = { - closeDropdown: () => {}, - disabled: false, - dropdownOpen: false, - onSelect: () => {}, - openDropdown: () => {}, - } - - getListItemIcon (currentAccount, selectedAccount) { - return currentAccount.address === selectedAccount.address && ( - <i - className="fa fa-check fa-lg" - style={{ color: '#02c9b1' }} - /> - ) - } - - renderDropdown () { - const { accounts, selectedAccount, closeDropdown, onSelect } = this.props - - return ( - <div> - <div - className="account-dropdown-mini__close-area" - onClick={closeDropdown} - /> - <div className="account-dropdown-mini__list"> - { - accounts.map(account => ( - <AccountListItem - key={account.address} - account={account} - displayBalance={false} - displayAddress={false} - handleClick={() => { - onSelect(account) - closeDropdown() - }} - icon={this.getListItemIcon(account, selectedAccount)} - /> - )) - } - </div> - </div> - ) - } - - render () { - const { disabled, selectedAccount, openDropdown, dropdownOpen } = this.props - - return ( - <div className="account-dropdown-mini"> - <AccountListItem - account={selectedAccount} - handleClick={() => !disabled && openDropdown()} - displayBalance={false} - displayAddress={false} - icon={ - !disabled && <i - className="fa fa-caret-down fa-lg" - style={{ color: '#dedede' }} - /> - } - /> - { !disabled && dropdownOpen && this.renderDropdown() } - </div> - ) - } -} diff --git a/ui/app/components/ui/account-dropdown-mini/index.js b/ui/app/components/ui/account-dropdown-mini/index.js deleted file mode 100644 index cb0839e72..000000000 --- a/ui/app/components/ui/account-dropdown-mini/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './account-dropdown-mini.component' diff --git a/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js b/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js deleted file mode 100644 index 9691f38aa..000000000 --- a/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js +++ /dev/null @@ -1,107 +0,0 @@ -import React from 'react' -import assert from 'assert' -import { shallow } from 'enzyme' -import AccountDropdownMini from '../account-dropdown-mini.component' -import AccountListItem from '../../../../pages/send/account-list-item/account-list-item.component' - -describe('AccountDropdownMini', () => { - it('should render an account with an icon', () => { - const accounts = [ - { - address: '0x1', - name: 'account1', - balance: '0x1', - }, - { - address: '0x2', - name: 'account2', - balance: '0x2', - }, - { - address: '0x3', - name: 'account3', - balance: '0x3', - }, - ] - - const wrapper = shallow( - <AccountDropdownMini - selectedAccount={{ address: '0x1', name: 'account1', balance: '0x1' }} - accounts={accounts} - /> - ) - - assert.ok(wrapper) - assert.equal(wrapper.find(AccountListItem).length, 1) - const accountListItemProps = wrapper.find(AccountListItem).at(0).props() - assert.equal(accountListItemProps.account.address, '0x1') - const iconProps = accountListItemProps.icon.props - assert.equal(iconProps.className, 'fa fa-caret-down fa-lg') - }) - - it('should render a list of accounts', () => { - const accounts = [ - { - address: '0x1', - name: 'account1', - balance: '0x1', - }, - { - address: '0x2', - name: 'account2', - balance: '0x2', - }, - { - address: '0x3', - name: 'account3', - balance: '0x3', - }, - ] - - const wrapper = shallow( - <AccountDropdownMini - selectedAccount={{ address: '0x1', name: 'account1', balance: '0x1' }} - accounts={accounts} - dropdownOpen={true} - /> - ) - - assert.ok(wrapper) - assert.equal(wrapper.find(AccountListItem).length, 4) - }) - - it('should render a single account when disabled', () => { - const accounts = [ - { - address: '0x1', - name: 'account1', - balance: '0x1', - }, - { - address: '0x2', - name: 'account2', - balance: '0x2', - }, - { - address: '0x3', - name: 'account3', - balance: '0x3', - }, - ] - - const wrapper = shallow( - <AccountDropdownMini - selectedAccount={{ address: '0x1', name: 'account1', balance: '0x1' }} - accounts={accounts} - dropdownOpen={false} - disabled={true} - /> - ) - - assert.ok(wrapper) - assert.equal(wrapper.find(AccountListItem).length, 1) - const accountListItemProps = wrapper.find(AccountListItem).at(0).props() - assert.equal(accountListItemProps.account.address, '0x1') - assert.equal(accountListItemProps.icon, false) - }) -}) |