aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorGravatar Vitaly Takmazov2018-07-18 13:24:00 +0300
committerGravatar Vitaly Takmazov2023-01-13 10:37:53 +0300
commitab09cb3b3aed7105570c387d9c4ff18e7f5c544c (patch)
tree016781d623804e04ba79a1ba21ffe0d8c596fee3
parentd0053977cd080814747a221a5531fe6a726c2834 (diff)
SearchBox now works
-rw-r--r--vnext/src/App.js13
-rw-r--r--vnext/src/components/SearchBox.js12
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);