add clear movies button

src/actions/index.js

@@ -8,3 +8,9 @@ export const fetchMovies = (term) => {
     payload: request
   }
 }
+
+export const clearMovies = () => {
+  return {
+    type: 'CLEAR_MOVIES'
+  }
+}

src/components/App.jsx

@@ -17,6 +17,12 @@ class App extends Component {
       <div className="container">
         <h1>OMDB Movie Search</h1>
         <SearchBar searchMovie={this.props.fetchMovies.bind(this)} />
+        <button
+          className="btn btn-primary clear"
+          onClick={this.props.clearMovies}
+          >
+          Clear Movies
+        </button>
         <MovieList movies={this.props.movies} />
       </div>
     )

src/reducers/movie.reducer.js

@@ -1,11 +1,11 @@
 const movieReducer = (state = [], action) => {
-  console.log(action);
-  switch (action.type) {
-    case 'FETCH_MOVIES':
-      return action.payload.data.Search;
-    default:
-      return state;
+  if (action.type === 'FETCH_MOVIES') {
+    return action.payload.data.Search;
+  } else if (action.type === 'CLEAR_MOVIES') {
+    return [];
   }
+
+  return state;
 }
 
 export default movieReducer;

src/stylesheets/index.css

@@ -1,3 +1,7 @@
 #root {
   text-align: center
 }
+
+.clear {
+  margin-bottom: 20px;
+}