SearchBox now works

2 files changed, 16 insertions, 9 deletions

diff --git a/vnext/src/App.js b/vnext/src/App.js
index aa159f14..81862d4f 100644
--- a/vnext/src/App.js
+++ b/vnext/src/App.js
@@ -96,8 +96,11 @@ export default class App extends React.Component {
       me().then(visitor => this.auth(visitor));
     }
   }
-  search = (searchString) => {
-    console.log(searchString);
+  search = (history, pathname, searchString) => {
+    let location = {};
+    location.pathname = pathname;
+    location.search = `?search=${searchString}`;
+    history.push(location);
   }
   render() {
     const user = this.state.visitor;
@@ -114,7 +117,7 @@ export default class App extends React.Component {
                 <div id="logo"><Link to="/">Juick</Link></div>
               }
               <div id="search">
-                <SearchBox onSearch={this.search} />
+                <SearchBox pathname="/" onSearch={this.search} {...this.props} />
               </div>
               <nav id="global">
                 <ul>
@@ -196,9 +199,7 @@ export default class App extends React.Component {
                     </li>
                   </ul>
                   <hr />
-                  <form>
-                    <p><input type="text" name="search" className="inp" placeholder="Search..." /></p>
-                  </form>
+                  <SearchBox pathname={`/${user.uname}/`} onSearch={this.search} {...this.props} />
                   <hr />
                   <div id="ustats">
                     <ul>
diff --git a/vnext/src/components/SearchBox.js b/vnext/src/components/SearchBox.js
index e64c8be4..314b89fb 100644
--- a/vnext/src/components/SearchBox.js
+++ b/vnext/src/components/SearchBox.js
@@ -1,7 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import ReactRouterPropTypes from 'react-router-prop-types';
+import { withRouter } from 'react-router-dom';
 
-export default class SearchBox extends React.Component {
+class SearchBox extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
@@ -14,8 +16,9 @@ export default class SearchBox extends React.Component {
         });
     }
     onSubmit = (event) => {
+        const { history, pathname } = this.props;
         event.preventDefault();
-        this.props.onSearch(this.state.search);
+        this.props.onSearch(history, pathname, this.state.search);
         this.setState({
             search: ''
         });
@@ -29,5 +32,8 @@ export default class SearchBox extends React.Component {
 }
 
 SearchBox.propTypes = {
-    onSearch: PropTypes.func.isRequired
+    pathname: PropTypes.string.isRequired,
+    onSearch: PropTypes.func.isRequired,
+    history: ReactRouterPropTypes.history.isRequired
 };
+export default withRouter(SearchBox);