diff options
author | Noah Loomans <noahloomans@gmail.com> | 2018-01-24 15:44:31 +0100 |
---|---|---|
committer | Noah Loomans <noahloomans@gmail.com> | 2018-01-24 15:44:31 +0100 |
commit | 0bddf7661d7ece709a18f2d167b928749638f318 (patch) | |
tree | 05aeedc6e1e5e665272188bfaf9801bc795668c7 /src/client/react/components/container/HelpBox.js | |
parent | 257cb6b81d49f5a4a0b514eb095c6ad0f4a9f5cc (diff) |
Add animation to results
Diffstat (limited to 'src/client/react/components/container/HelpBox.js')
-rw-r--r-- | src/client/react/components/container/HelpBox.js | 11 |
1 files changed, 8 insertions, 3 deletions
diff --git a/src/client/react/components/container/HelpBox.js b/src/client/react/components/container/HelpBox.js index b4556a5..a74b43c 100644 --- a/src/client/react/components/container/HelpBox.js +++ b/src/client/react/components/container/HelpBox.js @@ -2,24 +2,29 @@ import React from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; -const HelpBox = ({ results }) => { - if (results.length > 0) { +const HelpBox = ({ results, searchText }) => { + if (results.length > 0 || searchText !== '') { return <div />; } return ( <div className="help-box"> - Voer hier een docentafkorting, klas, leerlingnummer of lokaalnummer in. + <div className="arrow" /> + <div className="bubble"> + Voer hier een docentafkorting, klas, leerlingnummer of lokaalnummer in. + </div> </div> ); }; HelpBox.propTypes = { results: PropTypes.arrayOf(PropTypes.string).isRequired, + searchText: PropTypes.string.isRequired, }; const mapStateToProps = state => ({ results: state.search.results, + searchText: state.search.searchText, }); export default connect(mapStateToProps)(HelpBox); |