Permalink
Browse files

added toggle search function

  • Loading branch information...
Colton committed Jan 13, 2020
1 parent c08b5d6 commit 61a62906bee414dafa1777c4e3a46ad258b91ed2
Showing with 21 additions and 6 deletions.
  1. +17 −6 src/Components/Home.jsx
  2. +4 −0 src/Components/Results.jsx
@@ -17,19 +17,30 @@ export default class Home extends Component {
onSearch = () => {
queryTVMazeAPI(this.state.query).then(res => {
this.setState({ movies: res.data });
this.toggleHasSearched();
});
};
toggleHasSearched = () => {
this.setState({ hasSearched: !this.state.hasSearched });
};

render() {
return (
<div>
<h1>TVMaze</h1>
<Search
query={this.state.query}
onQueryChange={this.onQueryChange}
onSearch={this.onSearch}
/>
<Results movies={this.state.movies} />
{this.state.hasSearched === true ? (
<Results
movies={this.state.movies}
toggleHasSearched={this.toggleHasSearched}
/>
) : (
<Search
query={this.state.query}
onQueryChange={this.onQueryChange}
onSearch={this.onSearch}
toggleHasSearched={this.toggleHasSearched}
/>
)}
</div>
);
}
@@ -5,9 +5,13 @@ export default class Results extends Component {
render() {
return (
<div className="result-container">
<div style={{ width: "100%" }}>
<button onClick={this.props.toggleHasSearched}>Search Again</button>
</div>
{this.props.movies.map(movie => {
return (
<SingleResult
key={movie.show.id}
id={movie.show.id}
name={movie.show.name}
image={movie.show.image}

0 comments on commit 61a6290

Please sign in to comment.