diff --git a/client/routes.jsx b/client/routes.jsx
index 987dddb..16f5a1c 100644
--- a/client/routes.jsx
+++ b/client/routes.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
+import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Login from '../imports/ui/components/login.jsx';
import Landing from '../imports/ui/components/landing.jsx';
import Navbar from '../imports/ui/components/navbar.jsx';
@@ -8,48 +8,28 @@ import Woohoo from '../imports/ui/components/woohoo.jsx';
import Apply from '../imports/ui/components/apply.jsx';
import ForgotPassword from '../imports/ui/components/forgot_password.jsx';
import SetPassword from '../imports/ui/components/set_password.jsx';
-import Profile from '../imports/ui/components/dashboard/profile.jsx';
import Moderator from '../imports/ui/components/moderator.jsx';
-import withUser from '../imports/ui/components/hoc/with-user.jsx';
+import Profile from '../imports/ui/components/dashboard/profile';
+import AuthenticatedRoute from '../imports/ui/components/hoc/AuthenticatedRoute';
+import { AuthProvider } from '../imports/ui/components/hoc/AuthProvider';
export const renderRoutes = () => (
-
+
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-
+
);
-
-// All routes where user supposed to be logged in
-// If user is not logged in, redirect them to login page
-const RouteWithUser = withUser(({ user, component: Component, ...rest }) => {
- const { pathname } = window.location;
-
- if (user) {
- return } />;
- } else if (pathname !== '/login' && pathname === rest.path) {
- return ;
- }
- return null;
-});
-
-const RouteWithOutUser = withUser(({ user, component: Component, ...rest }) => {
- const { pathname } = window.location;
- if (!user) {
- return } />;
- } else if (pathname !== '/dashboard' && pathname === rest.path) {
- return ;
- }
- return null;
-});
diff --git a/imports/ui/components/forgot_password.jsx b/imports/ui/components/forgot_password.jsx
index 83e4f45..945388b 100644
--- a/imports/ui/components/forgot_password.jsx
+++ b/imports/ui/components/forgot_password.jsx
@@ -3,6 +3,8 @@ import { Link } from 'react-router-dom';
import { Alert, Container, Button, Form, Row, Col } from 'react-bootstrap';
import { Accounts } from 'meteor/accounts-base';
import { EMAIL_REGEX } from '/imports/constants/regex';
+import { AuthContext } from './hoc/AuthProvider';
+import { Redirect } from 'react-router-dom';
class ForgotPassword extends React.Component {
constructor(props) {
@@ -36,8 +38,11 @@ class ForgotPassword extends React.Component {
render() {
const { validated, error, success, processing } = this.state;
+ const { user } = this.context;
- return (
+ return user ? (
+
+ ) : (
@@ -76,5 +81,5 @@ class ForgotPassword extends React.Component {
);
}
}
-
+ForgotPassword.contextType = AuthContext;
export default ForgotPassword;
diff --git a/imports/ui/components/hoc/AuthProvider.jsx b/imports/ui/components/hoc/AuthProvider.jsx
new file mode 100644
index 0000000..33ca9db
--- /dev/null
+++ b/imports/ui/components/hoc/AuthProvider.jsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { Meteor } from 'meteor/meteor';
+import { Accounts } from 'meteor/accounts-base';
+const AuthContext = React.createContext();
+
+class AuthProvider extends React.Component {
+ constructor() {
+ super();
+ }
+ state = {
+ user: null,
+ };
+
+ componentDidMount() {
+ Accounts.onLogout(() => this.setState({ user: null }));
+ Accounts.onLogin(() => this.setState({ user: Meteor.user() }));
+ }
+
+ render() {
+ return {this.props.children} ;
+ }
+}
+
+const AuthConsumer = AuthContext.Consumer;
+export { AuthProvider, AuthConsumer, AuthContext };
diff --git a/imports/ui/components/hoc/AuthenticatedRoute.jsx b/imports/ui/components/hoc/AuthenticatedRoute.jsx
new file mode 100644
index 0000000..a2a3d35
--- /dev/null
+++ b/imports/ui/components/hoc/AuthenticatedRoute.jsx
@@ -0,0 +1,11 @@
+import React from 'react';
+import { Route, Redirect } from 'react-router-dom';
+import { AuthConsumer } from './AuthProvider';
+
+const AuthenticatedRoute = ({ component: Component, ...rest }) => (
+
+ {({ user }) => (user ? : )} {...rest} />}
+
+);
+
+export default AuthenticatedRoute;
diff --git a/imports/ui/components/landing.jsx b/imports/ui/components/landing.jsx
index fd56260..acf1d92 100644
--- a/imports/ui/components/landing.jsx
+++ b/imports/ui/components/landing.jsx
@@ -1,7 +1,8 @@
import React from 'react';
-import { Link } from 'react-router-dom';
+import { Link, Redirect } from 'react-router-dom';
import { Container, Row, Col } from 'react-bootstrap';
import BoardContainer from '/imports/ui/containers/board.jsx';
+import { AuthContext } from './hoc/AuthProvider';
class Landing extends React.Component {
constructor(props) {
@@ -9,7 +10,11 @@ class Landing extends React.Component {
}
render() {
- return (
+ const { user } = this.context;
+
+ return user ? (
+
+ ) : (
@@ -65,5 +70,5 @@ class Landing extends React.Component {
);
}
}
-
+Landing.contextType = AuthContext;
export default Landing;
diff --git a/imports/ui/components/login.jsx b/imports/ui/components/login.jsx
index 143b54c..e3c998a 100644
--- a/imports/ui/components/login.jsx
+++ b/imports/ui/components/login.jsx
@@ -1,9 +1,9 @@
import React from 'react';
-import { Link } from 'react-router-dom';
+import { Link, Redirect } from 'react-router-dom';
import { Alert, Container, Button, Form, Row, Col } from 'react-bootstrap';
import { Meteor } from 'meteor/meteor';
import { EMAIL_REGEX } from '/imports/constants/regex';
-
+import { AuthContext } from './hoc/AuthProvider';
class Login extends React.Component {
constructor(props) {
super(props);
@@ -33,8 +33,11 @@ class Login extends React.Component {
render() {
const { validated, error } = this.state;
+ const { user } = this.context;
- return (
+ return user ? (
+
+ ) : (
@@ -77,5 +80,5 @@ class Login extends React.Component {
);
}
}
-
+Login.contextType = AuthContext;
export default Login;
diff --git a/imports/ui/components/moderator.jsx b/imports/ui/components/moderator.jsx
index 2e7b954..8e92078 100644
--- a/imports/ui/components/moderator.jsx
+++ b/imports/ui/components/moderator.jsx
@@ -1,22 +1,31 @@
import React from 'react';
import { Container, Row, Col } from 'react-bootstrap';
+import { AuthContext } from './hoc/AuthProvider';
import BoardContainer from '/imports/ui/containers/board.jsx';
-const Moderator = props => {
- const { user } = props;
- const { name } = (user && user.profile) || {};
- return (
-
-
-
-
- Hello {name}! You are logged in!
-
-
-
-
-
- );
-};
+class Moderator extends React.Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const { user } = this.context;
+ const { name } = (user && user.profile) || {};
+
+ return (
+
+
+
+
+ Hello {name}! You are logged in!
+
+
+
+
+
+ );
+ }
+}
+
+Moderator.contextType = AuthContext;
export default Moderator;
diff --git a/imports/ui/components/navbar.jsx b/imports/ui/components/navbar.jsx
index ad40af6..c00c3c8 100644
--- a/imports/ui/components/navbar.jsx
+++ b/imports/ui/components/navbar.jsx
@@ -2,9 +2,9 @@ import React from 'react';
import { Link } from 'react-router-dom';
import { Navbar, Nav, Button, Container } from 'react-bootstrap';
import { Meteor } from 'meteor/meteor';
-import withUser from '/imports/ui/components/hoc/with-user.jsx';
+import { AuthContext } from './hoc/AuthProvider';
-class NavbarWrapper extends React.Component {
+class NavigationBar extends React.Component {
constructor(props) {
super(props);
}
@@ -14,7 +14,7 @@ class NavbarWrapper extends React.Component {
}
render() {
- const { user } = this.props;
+ const { user } = this.context;
return (
@@ -61,4 +61,5 @@ class NavbarWrapper extends React.Component {
}
}
-export default withUser(NavbarWrapper);
+NavigationBar.contextType = AuthContext;
+export default NavigationBar;