diff options
Diffstat (limited to 'src/client/react/components/container')
-rw-r--r-- | src/client/react/components/container/Results.js | 90 | ||||
-rw-r--r-- | src/client/react/components/container/Results.scss | 5 |
2 files changed, 13 insertions, 82 deletions
diff --git a/src/client/react/components/container/Results.js b/src/client/react/components/container/Results.js index c20fdc4..0d761d1 100644 --- a/src/client/react/components/container/Results.js +++ b/src/client/react/components/container/Results.js @@ -18,92 +18,28 @@ * */ -import React from 'react'; -import PropTypes from 'prop-types'; -import classnames from 'classnames'; import { connect } from 'react-redux'; import { withRouter } from 'react-router-dom'; import users from '../../users'; -import { makeSetUser, userFromMatch } from '../../lib/url'; -import Result from '../presentational/Result'; +import { userFromMatch } from '../../lib/url'; +import { setUser } from '../../store/actions'; -import './Results.scss'; +import Results from '../presentational/Results'; -class Results extends React.Component { - static propTypes = { - results: PropTypes.arrayOf(PropTypes.string).isRequired, - searchText: PropTypes.string.isRequired, - selectedResult: PropTypes.string, +const mapStateToProps = (state, { match }) => { + const user = userFromMatch(match); + const searchText = state.search.text; - // react-router - user: PropTypes.string, - setUser: PropTypes.func.isRequired, - - // redux - dispatch: PropTypes.func.isRequired, - }; - - static defaultProps = { - selectedResult: null, - user: null, + return { + isExactMatch: user != null && searchText === users.byId[user].value, + results: state.search.results, + selectedResult: state.search.selected, }; +}; - render() { - const { - searchText, - results, - selectedResult, - user, - setUser, - dispatch, - } = this.props; - - const isExactMatch = ( - user != null && searchText === users.byId[user].value - ); - - return ( - <div - className={classnames('Results', { - hasResults: !isExactMatch && results.length > 0, - })} - style={{ - minHeight: isExactMatch ? 0 : results.length * 54, - }} - > - {!isExactMatch && results.map(resultUser => ( - <Result - key={resultUser} - userId={resultUser} - isSelected={resultUser === selectedResult} - onClick={() => { - if (resultUser === user) { - // EDGE CASE: The user is set if the user changes, but it doesn't - // change if the result is already the one we are viewing. - // Therefor, we need to dispatch the SET_USER command manually. - dispatch({ type: 'SEARCH/SET_USER', user }); - } else { - setUser(resultUser); - } - }} - /> - ))} - </div> - ); - } -} - -const mapStateToProps = (state, { match }) => ({ - user: userFromMatch(match), - results: state.search.results, - searchText: state.search.text, - selectedResult: state.search.result, -}); - -const mapDispatchToProps = (dispatch, { history }) => ({ - setUser: makeSetUser(history), - dispatch, +const mapDispatchToProps = dispatch => ({ + setUser: user => dispatch(setUser(user)), }); export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Results)); diff --git a/src/client/react/components/container/Results.scss b/src/client/react/components/container/Results.scss deleted file mode 100644 index 60379cf..0000000 --- a/src/client/react/components/container/Results.scss +++ /dev/null @@ -1,5 +0,0 @@ -.Results { - &.hasResults { - border-top: 1px #BDBDBD solid; - } -} |