From fe27a0819a60caaa69b059f0c86d95ab0c4084b7 Mon Sep 17 00:00:00 2001 From: Noah Loomans Date: Wed, 13 Dec 2017 12:26:36 +0100 Subject: Prepair changeSelectedResult --- src/client/react/actions/search.js | 12 ++++++++---- src/client/react/components/container/Search.jsx | 13 ++++++++----- src/client/react/reducers/search.js | 12 ++++++++---- 3 files changed, 24 insertions(+), 13 deletions(-) (limited to 'src') diff --git a/src/client/react/actions/search.js b/src/client/react/actions/search.js index 53993d3..1b6847d 100644 --- a/src/client/react/actions/search.js +++ b/src/client/react/actions/search.js @@ -1,10 +1,14 @@ -// eslint-disable-next-line import/prefer-default-export export const inputChange = typedValue => ({ type: 'SEARCH/INPUT_CHANGE', typedValue, }); -export const focusChange = hasFocus => ({ - type: 'SEARCH/FOCUS_CHANGE', - hasFocus, +/** + * Change the selected result. + * @param {+1/-1} relativeChange usually +1 or -1, the change relative to the + * current result. + */ +export const changeSelectedResult = relativeChange => ({ + type: 'SEARCH/CHANGE_SELECTED_RESULT', + relativeChange, }); diff --git a/src/client/react/components/container/Search.jsx b/src/client/react/components/container/Search.jsx index e974bd9..7e33e84 100644 --- a/src/client/react/components/container/Search.jsx +++ b/src/client/react/components/container/Search.jsx @@ -42,7 +42,8 @@ class Search extends React.Component { render() { const { value, - exactMatch, + selectedResult, + isExactMatch, dispatch, } = this.props; @@ -55,7 +56,7 @@ class Search extends React.Component {
} />
@@ -76,18 +77,20 @@ class Search extends React.Component { Search.propTypes = { value: PropTypes.string.isRequired, - exactMatch: PropTypes.shape(userShape), + selectedResult: PropTypes.shape(userShape), + isExactMatch: PropTypes.bool.isRequired, dispatch: PropTypes.func.isRequired, }; Search.defaultProps = { - exactMatch: null, + selectedResult: null, }; const mapStateToProps = state => ({ results: state.search.results, value: state.search.input, - exactMatch: state.search.exactMatch, + selectedResult: state.search.selectedResult, + isExactMatch: state.search.isExactMatch, }); export default connect(mapStateToProps)(Search); diff --git a/src/client/react/reducers/search.js b/src/client/react/reducers/search.js index d61689b..f566b49 100644 --- a/src/client/react/reducers/search.js +++ b/src/client/react/reducers/search.js @@ -6,7 +6,8 @@ const DEFAULT_STATE = { results: [ { type: 's', value: '18561' }, ], - exactMatch: null, + selectedResult: null, + isExactMatch: false, }; function getSearchResults(query) { @@ -28,12 +29,14 @@ const search = (state = DEFAULT_STATE, action) => { switch (action.type) { case 'SEARCH/INPUT_CHANGE': { let results = getSearchResults(action.typedValue); - let exactMatch = null; + let selectedResult = null; + let isExactMatch = false; // Is the typed value exactly the same as the first result? Then show the // appropiate icon instead of the generic search icon. if ((results.length > 0) && (action.typedValue === results[0].value)) { - [exactMatch] = results; + [selectedResult] = results; + isExactMatch = true; results = results.splice(1); } @@ -41,7 +44,8 @@ const search = (state = DEFAULT_STATE, action) => { ...state, input: action.typedValue, results, - exactMatch, + selectedResult, + isExactMatch, }; } default: -- cgit v1.1