restrictions in the accessibility of URLs

src/components/Navbar.js

@@ -101,16 +101,21 @@ class Navbar extends Component {
           </div>
           <List>
             {[{ text: 'Tutorials', icon: faChalkboardTeacher, link: "/tutorial" },
-              { text: 'Tutorial-Builder', icon: faTools, link: "/tutorial/builder" },
+              { text: 'Tutorial-Builder', icon: faTools, link: "/tutorial/builder", restriction: this.props.user && this.props.user.blocklyRole !== 'user' && this.props.isAuthenticated},
               { text: 'Galerie', icon: faLightbulb, link: "/gallery" },
-              { text: 'Projekte', icon: faLayerGroup, link: "/project" }].map((item, index) => (
-              <Link to={item.link} key={index} style={{ textDecoration: 'none', color: 'inherit' }}>
-                <ListItem button onClick={this.toggleDrawer}>
-                  <ListItemIcon><FontAwesomeIcon icon={item.icon} /></ListItemIcon>
-                  <ListItemText primary={item.text} />
-                </ListItem>
-              </Link>
-            ))}
+              { text: 'Projekte', icon: faLayerGroup, link: "/project", restriction: this.props.isAuthenticated }].map((item, index) => {
+                if(item.restriction || Object.keys(item).filter(attribute => attribute === 'restriction').length === 0){
+                  return(
+                    <Link to={item.link} key={index} style={{ textDecoration: 'none', color: 'inherit' }}>
+                      <ListItem button onClick={this.toggleDrawer}>
+                        <ListItemIcon><FontAwesomeIcon icon={item.icon} /></ListItemIcon>
+                        <ListItemText primary={item.text} />
+                      </ListItem>
+                    </Link>
+                  );
+                }
+              }
+            )}
           </List>
           <Divider classes={{ root: this.props.classes.appBarColor }} style={{ marginTop: 'auto' }} />
           <List>
@@ -144,13 +149,15 @@ class Navbar extends Component {
 Navbar.propTypes = {
   tutorialIsLoading: PropTypes.bool.isRequired,
   projectIsLoading: PropTypes.bool.isRequired,
-  isAuthenticated: PropTypes.bool.isRequired
+  isAuthenticated: PropTypes.bool.isRequired,
+  user: PropTypes.object
 };
 
 const mapStateToProps = state => ({
   tutorialIsLoading: state.tutorial.progress,
   projectIsLoading: state.project.progress,
-  isAuthenticated: state.auth.isAuthenticated
+  isAuthenticated: state.auth.isAuthenticated,
+  userRole: state.auth.user
 });
 
 export default connect(mapStateToProps, { logout })(withStyles(styles, { withTheme: true })(withRouter(Navbar)));

src/components/Route/IsLoggedRoute.js

@@ -0,0 +1,39 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+
+import { Route, Redirect } from 'react-router-dom';
+
+
+class IsLoggedRoute extends Component {
+
+  render() {
+    return (
+      <Route
+        {...this.props.exact}
+        render={({ location }) =>
+          !this.props.isAuthenticated ? (
+            this.props.children
+          ) : (
+            <Redirect
+              to={{
+                pathname: "/",
+                state: { from: location }
+              }}
+            />
+          )
+        }
+      />
+    );
+  }
+}
+
+IsLoggedRoute.propTypes = {
+  isAuthenticated: PropTypes.bool.isRequired
+};
+
+const mapStateToProps = state => ({
+  isAuthenticated: state.auth.isAuthenticated,
+});
+
+export default connect(mapStateToProps, null)(IsLoggedRoute);

src/components/Route/PrivateRoute.js

@@ -31,7 +31,7 @@ class PrivateRoute extends Component {
 }
 
 PrivateRoute.propTypes = {
-  isAuthenticated: PropTypes.bool
+  isAuthenticated: PropTypes.bool.isRequired
 };
 
 const mapStateToProps = state => ({

src/components/Route/PrivateRouteCreator.js

@@ -0,0 +1,45 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+
+import { Route, Redirect, withRouter } from 'react-router-dom';
+
+
+class PrivateRoute extends Component {
+
+  render() {
+    return (
+      <Route
+        {...this.props.exact}
+        render={({ location }) =>
+          this.props.isAuthenticated &&
+          this.props.user &&
+          this.props.user.blocklyRole !== 'user' ? (
+            this.props.children
+          ) : (()=>{
+            return (
+              <Redirect
+                to={{
+                  pathname: "/",
+                  state: { from: location }
+                }}
+              />
+            )
+          })()
+        }
+      />
+    );
+  }
+}
+
+PrivateRoute.propTypes = {
+  isAuthenticated: PropTypes.bool.isRequired,
+  user: PropTypes.object
+};
+
+const mapStateToProps = state => ({
+  isAuthenticated: state.auth.isAuthenticated,
+  userRole: state.auth.user
+});
+
+export default connect(mapStateToProps, null)(withRouter(PrivateRoute));

src/components/Route/Routes.js

@@ -6,6 +6,9 @@ import { visitPage } from '../../actions/generalActions';
 import { Route, Switch, withRouter } from 'react-router-dom';
 
 import PrivateRoute from './PrivateRoute';
+import PrivateRouteCreator from './PrivateRouteCreator';
+import IsLoggedRoute from './IsLoggedRoute';
+
 import Home from '../Home';
 import Tutorial from '../Tutorial/Tutorial';
 import TutorialHome from '../Tutorial/TutorialHome';
@@ -32,9 +35,9 @@ class Routes extends Component {
           <Route path="/" exact component={Home} />
           // Tutorials
           <Route path="/tutorial" exact component={TutorialHome} />
-          <PrivateRoute path="/tutorial/builder" exact>
+          <PrivateRouteCreator path="/tutorial/builder" exact>
             <Builder/>
-          </PrivateRoute>
+          </PrivateRouteCreator>
           <Route path="/tutorial/:tutorialId" exact component={Tutorial} />
           // Sharing
           <Route path="/share/:shareId" exact component={Project} />
@@ -49,7 +52,9 @@ class Routes extends Component {
             <Project/>
           </PrivateRoute>
           // User
-          <Route path="/user/login" exact component={Login} />
+          <IsLoggedRoute path="/user/login" exact>
+            <Login />
+          </IsLoggedRoute>
           // settings
           <Route path="/settings" exact component={Settings} />
           // privacy