Pass searchTerm in state via history.push

Macxim · Aug 8, 2017 · 2821a3d · 2821a3d
1 parent a610b12
commit 2821a3d
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 10 deletions.
diff --git a/src/App.js b/src/App.js
@@ -24,7 +24,7 @@ class App extends Component {
                 <Route exact path="/" render={()=><Main title="Popular" section={PATH_POPULAR} />}/>
                 <Route exact path="/top-rated" render={()=><Main title="Top Rated" section={PATH_TOP_RATED} />}/>
                 <Route exact path="/coming-soon" render={()=><Main title="Coming Soon" section={PATH_UPCOMING} />}/>
-                <Route path="/search" component={SearchResults}/>
+                <Route path="/search?query=:searchTerm" component={SearchResults}/>
               </div>
           </div>
         </div>

diff --git a/src/components/SearchBar/index.js b/src/components/SearchBar/index.js
@@ -20,9 +20,10 @@ class SearchBar extends Component {
     fetch(`${PATH_BASE}${PATH_SEARCH}${PATH_MOVIE}?api_key=${API_KEY}&query=${searchTerm}`)
     .then(response => response.json())
     .then(result =>
-      this.props.history.push(
-        `/search?query=${searchTerm}`,
-        result
+      this.props.history.push({
+        pathname: `/search?query=${searchTerm}`,
+        state: { result, searchTerm }
+        }
       )
     );
   }

diff --git a/src/components/SearchResults/index.js b/src/components/SearchResults/index.js
@@ -3,12 +3,7 @@ import List from '../../components/List';
 
 const SearchResults = ({ location }) => {
 
-  const result = location.state;
-
-  // Get `query` object
-  // https://github.com/ReactTraining/react-router/issues/4410#issuecomment-316239553
-  const query = new URLSearchParams(location.search)
-  const searchTerm = query.get('query')
+  const { result, searchTerm} = location.state;
 
   return (
     <div>