Close the navbar after a search
This commit is contained in:
parent
e3ccabdcb9
commit
956856e0e7
@ -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,
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user