From f00f7adb339f0587c8cf4a82ac2dadebe6a25bfd Mon Sep 17 00:00:00 2001 From: Noah Loomans Date: Wed, 31 Jan 2018 16:13:02 +0100 Subject: Add click functionality to result --- src/client/react/components/container/Results.js | 37 +++++++++++++++++++++--- src/client/react/components/container/Search.js | 2 +- 2 files changed, 34 insertions(+), 5 deletions(-) (limited to 'src/client/react/components/container') diff --git a/src/client/react/components/container/Results.js b/src/client/react/components/container/Results.js index 1fb5f44..c329c3c 100644 --- a/src/client/react/components/container/Results.js +++ b/src/client/react/components/container/Results.js @@ -2,9 +2,18 @@ import React from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import classnames from 'classnames'; +import { withRouter } from 'react-router-dom'; import Result from '../presentational/Result'; +import { setUser } from '../../actions/search'; -const Results = (({ results, isExactMatch, selectedResult }) => ( +const Results = ({ + results, + isExactMatch, + urlUser, + selectedResult, + history, + dispatch, +}) => (
0, @@ -14,18 +23,38 @@ const Results = (({ results, isExactMatch, selectedResult }) => ( }} > {!isExactMatch && results.map(userId => ( - + { + if (userId === urlUser) { + // 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(setUser(urlUser)); + } else { + history.push(`/${userId}`); + } + }} + /> ))}
-)); +); Results.propTypes = { results: PropTypes.arrayOf(PropTypes.string).isRequired, isExactMatch: PropTypes.bool.isRequired, + urlUser: PropTypes.string, selectedResult: PropTypes.string, + history: PropTypes.shape({ + push: PropTypes.func.isRequired, + }).isRequired, + dispatch: PropTypes.func.isRequired, }; Results.defaultProps = { + urlUser: null, selectedResult: null, }; @@ -35,4 +64,4 @@ const mapStateToProps = state => ({ selectedResult: state.search.selectedResult, }); -export default connect(mapStateToProps)(Results); +export default withRouter(connect(mapStateToProps)(Results)); diff --git a/src/client/react/components/container/Search.js b/src/client/react/components/container/Search.js index 8adbecf..a92e647 100644 --- a/src/client/react/components/container/Search.js +++ b/src/client/react/components/container/Search.js @@ -109,7 +109,7 @@ class Search extends React.Component { autoComplete="off" /> - + ); -- cgit v1.1