diff options
Diffstat (limited to 'ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js')
-rw-r--r-- | ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js | 75 |
1 files changed, 75 insertions, 0 deletions
diff --git a/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js b/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js index e69de29bb..337228122 100644 --- a/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js +++ b/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js @@ -0,0 +1,75 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import AccountListItem from '../../../account-list-item/account-list-item.container' + +export default class FromDropdown extends Component { + + static propTypes = { + accounts: PropTypes.array, + closeDropdown: PropTypes.func, + dropdownOpen: PropTypes.bool, + onSelect: PropTypes.func, + openDropdown: PropTypes.func, + selectedAccount: PropTypes.object, + }; + + renderListItemIcon (icon, color) { + return <i className={`fa ${icon} fa-lg`} style={ { color } }/> + } + + getListItemIcon (currentAccount, selectedAccount) { + return currentAccount.address === selectedAccount.address + ? this.renderListItemIcon('fa-check', '#02c9b1') + : null + } + + renderDropdown () { + const { + accounts, + closeDropdown, + onSelect, + selectedAccount, + } = this.props + + return (<div> + <div + className="send-v2__from-dropdown__close-area" + onClick={() => closeDropdown} + /> + <div className="send-v2__from-dropdown__list"> + {accounts.map((account, index) => <AccountListItem + account={account} + className="account-list-item__dropdown" + handleClick={() => { + onSelect(account) + closeDropdown() + }} + icon={this.getListItemIcon(account, selectedAccount.address)} + key={`from-dropdown-account-#${index}`} + />)} + </div> + </div>) + } + + render () { + const { + dropdownOpen, + openDropdown, + selectedAccount, + } = this.props + + return <div className="send-v2__from-dropdown"> + <AccountListItem + account={selectedAccount} + handleClick={openDropdown} + icon={this.renderListItemIcon('fa-caret-down', '#dedede')} + /> + {dropdownOpen && this.renderDropdown()}, + </div> + } + +} + +FromDropdown.contextTypes = { + t: PropTypes.func, +} |