diff --git a/src/components/app/PairsFilterBox.js b/src/components/app/PairsFilterBox.js new file mode 100644 index 0000000..1a23ce7 --- /dev/null +++ b/src/components/app/PairsFilterBox.js @@ -0,0 +1,58 @@ +import React, { Component } from 'react'; + +class PairsFilterBox extends Component { + constructor(props) { + super(props); + this.state = {filterText: ''}; + this.onStateChange = this.onStateChange.bind(this); + this.onFilterChange = (e) => {this.onStateChange('filterText', e.target.value)}; + this.renderChildren = this.renderChildren.bind(this); + this.getFilteredPairs = this.getFilteredPairs.bind(this); + } + + onStateChange(key, value) { + this.setState({[key]: value}); + } + + getFilteredPairs(pairs) { + const ret = {}; + const filterText = this.state.filterText.toLowerCase(); + + if(filterText.length === 0) return pairs; + + const pairKeys = Object.keys(pairs); + pairKeys.forEach((key) => { + const pair = pairs[key]; + + if(pair.addr.toLowerCase().includes(filterText) || pair.name.toLowerCase().includes(filterText)) { + ret[key] = pair; + } + }); + + return ret; + } + + renderChildren() { + const filteredPairs = this.getFilteredPairs(this.props.pairs); + + return React.Children.map(this.props.children, child => { + return React.cloneElement(child, { + pairs: filteredPairs + }); + }); + } + + render() { + return ( +