aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/send/to-autocomplete.component.js
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components/send/to-autocomplete.component.js')
-rw-r--r--ui/app/components/send/to-autocomplete.component.js141
1 files changed, 0 insertions, 141 deletions
diff --git a/ui/app/components/send/to-autocomplete.component.js b/ui/app/components/send/to-autocomplete.component.js
deleted file mode 100644
index 9e270db75..000000000
--- a/ui/app/components/send/to-autocomplete.component.js
+++ /dev/null
@@ -1,141 +0,0 @@
-import React, {Component} from 'react'
-import PropTypes from 'prop-types'
-import classnames from 'classnames'
-import AccountListItem from '../send/account-list-item/account-list-item.component'
-
-
-export default class ToAutoComplete extends Component {
-
- static propTypes = {
- dropdownOpen: PropTypes.bool,
- openDropdown: PropTypes.func,
- closeDropdown: PropTypes.func,
- onChange: PropTypes.func,
- to: PropTypes.string,
- accounts: PropTypes.array,
- inError: PropTypes.bool,
- }
-
- static contextTypes = {
- t: PropTypes.func,
- }
-
- state = {
- accountsToRender: [],
- }
-
- getListItemIcon (listItemAddress, toAddress) {
- return toAddress && listItemAddress === toAddress
- ? <i className={'fa fa-check fa-lg'}
- style={{
- color: '#02c9b1',
- }}
- />
- : null
- }
-
- renderDropdown () {
- const {
- closeDropdown,
- onChange,
- to,
- } = this.props
- const {accountsToRender} = this.state
-
- if (!accountsToRender.length) {
- return null
- }
-
- return (
- <div>
- <div className={'send-v2__from-dropdown__close-area'} onClick={closeDropdown} />
- <div className={'send-v2__from-dropdown__list'}>
- {accountsToRender.map((account, i) => (
- <AccountListItem
- key={i}
- account={account}
- className={'account-list-item__dropdown'}
- handleClick={() => {
- onChange(account.address)
- closeDropdown()
- }}
- icon={this.getListItemIcon(account.address, to)}
- displayBalance={false}
- displayAddress={true}
- />
- ))}
- </div>
- </div>
- )
- }
-
- handleInputEvent (event = {}, cb) {
- const {
- to,
- accounts,
- closeDropdown,
- openDropdown,
- } = this.props
-
- const matchingAccounts = accounts.filter(({address}) => address.match(to || ''))
- const matches = matchingAccounts.length
-
- if (!matches || matchingAccounts[0].address === to) {
- this.setState({accountsToRender: []})
- event.target && event.target.select()
- closeDropdown()
- } else {
- this.setState({accountsToRender: matchingAccounts})
- openDropdown()
- }
- cb && cb(event.target.value)
- }
-
- componentDidUpdate (nextProps) {
- if (this.props.to !== nextProps.to) {
- this.handleInputEvent()
- }
- }
-
- render () {
- const {
- to,
- dropdownOpen,
- onChange,
- inError,
- } = this.props
-
- return (
- <div className={'send-v2__to-autocomplete'}>
- <input
- className={classnames('send-v2__to-autocomplete__input', {
- 'send-v2__error-border': inError,
- })}
- placeholder={this.context.t('recipientAddress')}
- value={to}
- onChange={event => onChange(event.target.value)}
- onFocus={event => this.handleInputEvent(event)}
- style={{
- borderColor: inError ? 'red' : null,
- }}
- />
- {
- to
- ? null
- : <i className={'fa fa-caret-down fa-lg send-v2__to-autocomplete__down-caret'}
- onClick={() => this.handleInputEvent()}
- style={{
- style: {color: '#dedede'},
- }}
- />
- }
- {
- dropdownOpen
- ? this.renderDropdown()
- : null
- }
- </div>
- )
- }
-
-}