diff --git a/src/components/Navbar.js b/src/components/Navbar.js index dfd5e6a..b7fa021 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -101,16 +101,21 @@ class Navbar extends Component { {[{ 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) => ( - - - - - - - ))} + { 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( + + + + + + + ); + } + } + )} @@ -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))); diff --git a/src/components/Route/IsLoggedRoute.js b/src/components/Route/IsLoggedRoute.js new file mode 100644 index 0000000..f071b2b --- /dev/null +++ b/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 ( + + !this.props.isAuthenticated ? ( + this.props.children + ) : ( + + ) + } + /> + ); + } +} + +IsLoggedRoute.propTypes = { + isAuthenticated: PropTypes.bool.isRequired +}; + +const mapStateToProps = state => ({ + isAuthenticated: state.auth.isAuthenticated, +}); + +export default connect(mapStateToProps, null)(IsLoggedRoute); diff --git a/src/components/Route/PrivateRoute.js b/src/components/Route/PrivateRoute.js index 4de5bc5..ffd321a 100644 --- a/src/components/Route/PrivateRoute.js +++ b/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 => ({ diff --git a/src/components/Route/PrivateRouteCreator.js b/src/components/Route/PrivateRouteCreator.js new file mode 100644 index 0000000..b4734da --- /dev/null +++ b/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 ( + + this.props.isAuthenticated && + this.props.user && + this.props.user.blocklyRole !== 'user' ? ( + this.props.children + ) : (()=>{ + return ( + + ) + })() + } + /> + ); + } +} + +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)); diff --git a/src/components/Route/Routes.js b/src/components/Route/Routes.js index 79d1e01..8304dc3 100644 --- a/src/components/Route/Routes.js +++ b/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 { // Tutorials - + - + // Sharing @@ -49,7 +52,9 @@ class Routes extends Component { // User - + + + // settings // privacy