From 13cac5dcd54bf87767396763226fd33719964d22 Mon Sep 17 00:00:00 2001
From: Noah Loomans <noahloomans@gmail.com>
Date: Sat, 6 Jan 2018 13:00:08 +0100
Subject: Go to user url on enter
---
src/client/react/LandingPage.js | 9 +++++++--
src/client/react/components/container/Search.js | 13 +++++++++++--
2 files changed, 18 insertions(+), 4 deletions(-)
diff --git a/src/client/react/LandingPage.js b/src/client/react/LandingPage.js
index d79826e..24e0078 100644
--- a/src/client/react/LandingPage.js
+++ b/src/client/react/LandingPage.js
@@ -1,10 +1,15 @@
import React from 'react';
+import PropTypes from 'prop-types';
import Search from './components/container/Search';
-const App = () => (
+const App = ({ location }) => (
<div>
- <Search />
+ <Search location={location} />
</div>
);
+App.propTypes = {
+ location: PropTypes.object.isRequired,
+};
+
export default App;
diff --git a/src/client/react/components/container/Search.js b/src/client/react/components/container/Search.js
index e49e6a7..957f76e 100644
--- a/src/client/react/components/container/Search.js
+++ b/src/client/react/components/container/Search.js
@@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import classnames from 'classnames';
+import { withRouter } from 'react-router-dom';
import SearchIcon from 'react-icons/lib/md/search';
@@ -37,7 +38,7 @@ class Search extends React.Component {
}
onKeyDown(event) {
- if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
+ if (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'Enter') {
event.preventDefault();
switch (event.key) {
case 'ArrowUp':
@@ -46,6 +47,11 @@ class Search extends React.Component {
case 'ArrowDown':
this.props.dispatch(changeSelectedResult(+1));
break;
+ case 'Enter':
+ if (this.props.selectedResult) {
+ this.props.history.push(`/${this.props.selectedResult}`);
+ }
+ break;
default:
throw new Error('This should never happen... pls?');
}
@@ -91,6 +97,9 @@ Search.propTypes = {
selectedResult: PropTypes.string,
isExactMatch: PropTypes.bool.isRequired,
dispatch: PropTypes.func.isRequired,
+ history: PropTypes.shape({
+ push: PropTypes.func.isRequired,
+ }).isRequired,
};
Search.defaultProps = {
@@ -103,4 +112,4 @@ const mapStateToProps = state => ({
isExactMatch: state.search.isExactMatch,
});
-export default connect(mapStateToProps)(Search);
+export default connect(mapStateToProps)(withRouter(Search));
--
cgit v1.1