restrictions in the accessibility of URLs
This commit is contained in:
		
							parent
							
								
									31dbda57df
								
							
						
					
					
						commit
						6a8036e075
					
				| @ -101,16 +101,21 @@ class Navbar extends Component { | |||||||
|           </div> |           </div> | ||||||
|           <List> |           <List> | ||||||
|             {[{ text: 'Tutorials', icon: faChalkboardTeacher, link: "/tutorial" }, |             {[{ 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: '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) => { | ||||||
|               <Link to={item.link} key={index} style={{ textDecoration: 'none', color: 'inherit' }}> |                 if(item.restriction || Object.keys(item).filter(attribute => attribute === 'restriction').length === 0){ | ||||||
|                 <ListItem button onClick={this.toggleDrawer}> |                   return( | ||||||
|                   <ListItemIcon><FontAwesomeIcon icon={item.icon} /></ListItemIcon> |                     <Link to={item.link} key={index} style={{ textDecoration: 'none', color: 'inherit' }}> | ||||||
|                   <ListItemText primary={item.text} /> |                       <ListItem button onClick={this.toggleDrawer}> | ||||||
|                 </ListItem> |                         <ListItemIcon><FontAwesomeIcon icon={item.icon} /></ListItemIcon> | ||||||
|               </Link> |                         <ListItemText primary={item.text} /> | ||||||
|             ))} |                       </ListItem> | ||||||
|  |                     </Link> | ||||||
|  |                   ); | ||||||
|  |                 } | ||||||
|  |               } | ||||||
|  |             )} | ||||||
|           </List> |           </List> | ||||||
|           <Divider classes={{ root: this.props.classes.appBarColor }} style={{ marginTop: 'auto' }} /> |           <Divider classes={{ root: this.props.classes.appBarColor }} style={{ marginTop: 'auto' }} /> | ||||||
|           <List> |           <List> | ||||||
| @ -144,13 +149,15 @@ class Navbar extends Component { | |||||||
| Navbar.propTypes = { | Navbar.propTypes = { | ||||||
|   tutorialIsLoading: PropTypes.bool.isRequired, |   tutorialIsLoading: PropTypes.bool.isRequired, | ||||||
|   projectIsLoading: PropTypes.bool.isRequired, |   projectIsLoading: PropTypes.bool.isRequired, | ||||||
|   isAuthenticated: PropTypes.bool.isRequired |   isAuthenticated: PropTypes.bool.isRequired, | ||||||
|  |   user: PropTypes.object | ||||||
| }; | }; | ||||||
| 
 | 
 | ||||||
| const mapStateToProps = state => ({ | const mapStateToProps = state => ({ | ||||||
|   tutorialIsLoading: state.tutorial.progress, |   tutorialIsLoading: state.tutorial.progress, | ||||||
|   projectIsLoading: state.project.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))); | export default connect(mapStateToProps, { logout })(withStyles(styles, { withTheme: true })(withRouter(Navbar))); | ||||||
|  | |||||||
							
								
								
									
										39
									
								
								src/components/Route/IsLoggedRoute.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										39
									
								
								src/components/Route/IsLoggedRoute.js
									
									
									
									
									
										Normal file
									
								
							| @ -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); | ||||||
| @ -31,7 +31,7 @@ class PrivateRoute extends Component { | |||||||
| } | } | ||||||
| 
 | 
 | ||||||
| PrivateRoute.propTypes = { | PrivateRoute.propTypes = { | ||||||
|   isAuthenticated: PropTypes.bool |   isAuthenticated: PropTypes.bool.isRequired | ||||||
| }; | }; | ||||||
| 
 | 
 | ||||||
| const mapStateToProps = state => ({ | const mapStateToProps = state => ({ | ||||||
|  | |||||||
							
								
								
									
										45
									
								
								src/components/Route/PrivateRouteCreator.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										45
									
								
								src/components/Route/PrivateRouteCreator.js
									
									
									
									
									
										Normal file
									
								
							| @ -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)); | ||||||
| @ -6,6 +6,9 @@ import { visitPage } from '../../actions/generalActions'; | |||||||
| import { Route, Switch, withRouter } from 'react-router-dom'; | import { Route, Switch, withRouter } from 'react-router-dom'; | ||||||
| 
 | 
 | ||||||
| import PrivateRoute from './PrivateRoute'; | import PrivateRoute from './PrivateRoute'; | ||||||
|  | import PrivateRouteCreator from './PrivateRouteCreator'; | ||||||
|  | import IsLoggedRoute from './IsLoggedRoute'; | ||||||
|  | 
 | ||||||
| import Home from '../Home'; | import Home from '../Home'; | ||||||
| import Tutorial from '../Tutorial/Tutorial'; | import Tutorial from '../Tutorial/Tutorial'; | ||||||
| import TutorialHome from '../Tutorial/TutorialHome'; | import TutorialHome from '../Tutorial/TutorialHome'; | ||||||
| @ -32,9 +35,9 @@ class Routes extends Component { | |||||||
|           <Route path="/" exact component={Home} /> |           <Route path="/" exact component={Home} /> | ||||||
|           // Tutorials
 |           // Tutorials
 | ||||||
|           <Route path="/tutorial" exact component={TutorialHome} /> |           <Route path="/tutorial" exact component={TutorialHome} /> | ||||||
|           <PrivateRoute path="/tutorial/builder" exact> |           <PrivateRouteCreator path="/tutorial/builder" exact> | ||||||
|             <Builder/> |             <Builder/> | ||||||
|           </PrivateRoute> |           </PrivateRouteCreator> | ||||||
|           <Route path="/tutorial/:tutorialId" exact component={Tutorial} /> |           <Route path="/tutorial/:tutorialId" exact component={Tutorial} /> | ||||||
|           // Sharing
 |           // Sharing
 | ||||||
|           <Route path="/share/:shareId" exact component={Project} /> |           <Route path="/share/:shareId" exact component={Project} /> | ||||||
| @ -49,7 +52,9 @@ class Routes extends Component { | |||||||
|             <Project/> |             <Project/> | ||||||
|           </PrivateRoute> |           </PrivateRoute> | ||||||
|           // User
 |           // User
 | ||||||
|           <Route path="/user/login" exact component={Login} /> |           <IsLoggedRoute path="/user/login" exact> | ||||||
|  |             <Login /> | ||||||
|  |           </IsLoggedRoute> | ||||||
|           // settings
 |           // settings
 | ||||||
|           <Route path="/settings" exact component={Settings} /> |           <Route path="/settings" exact component={Settings} /> | ||||||
|           // privacy
 |           // privacy
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user