diff options
author | Noah Loomans <noahloomans@gmail.com> | 2018-02-09 17:04:12 +0100 |
---|---|---|
committer | Noah Loomans <noahloomans@gmail.com> | 2018-02-09 17:04:12 +0100 |
commit | 6926de1108b1a084e133d5f8363f080d7c20a99f (patch) | |
tree | ce27ac5a024e6a0e342037d3ea03ddf7ca6c3c82 /src/client/react/components/container/HelpBox.js | |
parent | 8d5bccc8984618c9282e9592882835819306fa07 (diff) |
Use classes instead of stateless functions for Components
Diffstat (limited to 'src/client/react/components/container/HelpBox.js')
-rw-r--r-- | src/client/react/components/container/HelpBox.js | 33 |
1 files changed, 22 insertions, 11 deletions
diff --git a/src/client/react/components/container/HelpBox.js b/src/client/react/components/container/HelpBox.js index a74b43c..effe4f5 100644 --- a/src/client/react/components/container/HelpBox.js +++ b/src/client/react/components/container/HelpBox.js @@ -2,26 +2,37 @@ import React from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; -const HelpBox = ({ results, searchText }) => { - if (results.length > 0 || searchText !== '') { - return <div />; +class HelpBox extends React.Component { + static propTypes = { + // redux + results: PropTypes.arrayOf(PropTypes.string).isRequired, + searchText: PropTypes.string.isRequired, } - return ( - <div className="help-box"> - <div className="arrow" /> - <div className="bubble"> - Voer hier een docentafkorting, klas, leerlingnummer of lokaalnummer in. + render() { + if (this.props.results.length > 0 || this.props.searchText !== '') { + return <div />; + } + + return ( + <div className="help-box"> + <div className="arrow" /> + <div className="bubble"> + Voer hier een docentafkorting, klas, leerlingnummer of lokaalnummer in. + </div> </div> - </div> - ); -}; + ); + } +} HelpBox.propTypes = { + // redux results: PropTypes.arrayOf(PropTypes.string).isRequired, searchText: PropTypes.string.isRequired, }; +HelpBox.propTypes + const mapStateToProps = state => ({ results: state.search.results, searchText: state.search.searchText, |