Authenticated Route

Author: maxwellgordon

src/components/App.js

@@ -7,6 +7,7 @@ import SignInPage from './SignInPage';
 import HomePage from './HomePage';
 import NavBar from './NavBar';
 import { User, Session } from '../requests'
+import AuthRoute from './AuthRoute';
 
 class App extends Component {
   constructor(props) {
@@ -44,9 +45,24 @@ class App extends Component {
             <Route path="/session/new" exact render={
               (routeProps) => <SignInPage {...routeProps} onSignIn={this.getUser} />}
             />
-            <Route path="/products/new" component={NewProductPage} />
-            <Route path="/products/:id" component={ProductShowPage} />
-            <Route path="/products" exact component={ProductIndexPage} />
+            <AuthRoute
+              isAuth={currentUser}
+              path="/products/new"
+              exact
+              component={NewProductPage}
+            />
+            <AuthRoute
+              isAuth={currentUser}
+              path="/products/:id"
+              exact
+              component={ProductShowPage}
+            />
+            <AuthRoute
+              isAuth={currentUser}
+              path="/products"
+              exact
+              component={ProductIndexPage}
+            />
             <Route path="/" exact component={HomePage} />
           </Switch>
         </div>

src/components/AuthRoute.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { Route, Redirect } from 'react-router-dom';
+
+const AuthRoute = props => {
+  const { isAuth, component, ...restProps } = props;
+  const Component = component;
+   return (
+    <Route
+      render={routeProps => {
+        if (isAuth) {
+          // return React.createElement(component, routeProps);
+          return <Component {...routeProps} />;
+        } else {
+          return <Redirect to='/session/new' />;
+        }
+      }}
+      {...restProps}
+    />
+  );
+};
+ export default AuthRoute;