Close the navbar after a search

This commit is contained in:
Grégoire Delattre 2019-07-22 21:02:35 +02:00
parent e3ccabdcb9
commit 956856e0e7

View File

@ -43,6 +43,7 @@ const AppNavBar = (props) => {
placeholder="Search movies"
path='/movies/search'
history={props.history}
setExpanded={setExpanded}
/>
}/>
<Route path="/shows" render={(props) =>
@ -50,6 +51,7 @@ const AppNavBar = (props) => {
placeholder="Search shows"
path='/shows/search'
history={props.history}
setExpanded={setExpanded}
/>
}/>
<UserDropdown
@ -70,12 +72,13 @@ AppNavBar.propTypes = {
export default connect(mapStateToProps)(AppNavBar);
const Search = (props) => {
const Search = ({ path, placeholder, setExpanded, history }) => {
const [search, setSearch] = useState("");
const handleSearch = (ev) => {
ev.preventDefault();
props.history.push(`${props.path}/${encodeURI(search)}`);
history.push(`${path}/${encodeURI(search)}`);
setExpanded(false);
}
return(
@ -83,7 +86,7 @@ const Search = (props) => {
<form className="input-group" onSubmit={(ev) => handleSearch(ev)}>
<input
className="form-control"
placeholder={props.placeholder}
placeholder={placeholder}
value={search}
onChange={(e) => setSearch(e.target.value)}
/>
@ -93,6 +96,7 @@ const Search = (props) => {
}
Search.propTypes = {
placeholder: PropTypes.string.isRequired,
setExpanded: PropTypes.func.isRequired,
path: PropTypes.string.isRequired,
history: PropTypes.object,
};