Commit ab29c37b authored by Matija Obreza's avatar Matija Obreza
Browse files

Introducing `<Authorize` component

```
<Authorize role="ROLE_ADMINISTRATOR">
  Render when user is Admin!
</Authorize>
```
parent f1e68942
Pipeline #4099 failed with stages
in 1 minute and 26 seconds
import * as React from 'react';
import {connect} from 'react-redux';
interface IAuthorizeProps extends React.ClassAttributes<any> {
roles?: string[];
role?: string;
children: any;
login: any;
}
class Authorize extends React.Component<IAuthorizeProps, any> {
public constructor(props: any) {
super(props);
this.state = {
show: false,
};
}
public componentWillMount() {
/*console.log('AuthorizedRoute.componentWillMoint', this.props);*/
this.checkAuth(this.props);
}
public componentWillReceiveProps(nextProps) {
/*console.log('AuthorizedRoute.componentWillReceiveProps', nextProps);*/
this.checkAuth(nextProps);
}
private checkAuth(props) {
const { role, login: { authorities: userRoles } } = props;
let { roles } = props;
if (typeof role === 'string') {
roles = role.split(/\s*,\s*/gi);
}
const show = userRoles.map((e) => roles.indexOf(e) > -1).reduce((p, c) => p || c);
if (show) {
this.setState({show: true});
}
}
public render() {
const {children, ...rest} = this.props;
return this.state.show ? React.cloneElement(children, rest) : null;
}
}
const mapStateToProps = (state) => ({
login: state.login,
});
export default connect(mapStateToProps)(Authorize);
......@@ -57,6 +57,9 @@ class LeftMenu extends React.Component<ILeftMenuProps, any> {
<ListItem button>
<Link to="/datasets" >Datasets</Link>
</ListItem>
<ListItem button>
<Link to="/crops" >Crops</Link>
</ListItem>
<ListItem button>
<Link to="/vocabulary" >Controlled vocabularies</Link>
</ListItem>
......
......@@ -7,6 +7,7 @@ import Grid from 'material-ui/Grid';
import { listCrops, createCrop } from 'actions/crop';
import { Crop } from 'model/crop.model';
import Authorize from 'ui/common/authorized/Authorize';
import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import CropCard from './c/CropCard';
import Button from 'material-ui/Button';
......@@ -18,14 +19,13 @@ const styles = (theme) => ({
});
interface IBrowsePageProps extends React.ClassAttributes<any> {
router: any;
classes: any;
crops?: Crop[];
listCrops: any;
createCrop: any;
}
class BrowsePage extends React.Component<IBrowsePageProps, any> {
class BrowsePage extends React.Component<IBrowsePageProps & any, any> {
protected static needs = [
() => listCrops(),
......@@ -40,7 +40,9 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
return (
<div>
<ContentHeaderWithButton title="What do you want to do?" buttons={ <Button raised onClick={ createCrop }>Add crop</Button> } />
<Authorize role="ROLE_ADMINISTRATOR">
<ContentHeaderWithButton title="What do you want to do?" buttons={ <Button raised onClick={ createCrop }>Add crop</Button> } />
</Authorize>
<Grid container>
{ crops && crops.map((crop: Crop) => (
<Grid key={ `${crop.code}` } item xs={ 12 } md={ 2 }>
......
......@@ -9,6 +9,7 @@ import { listVocabularies, createVocabulary } from 'actions/vocabulary';
import { Vocabulary, IVocabularyFilter } from 'model/vocabulary.model';
import { Page, Pagination } from 'model/common.model';
import Authorize from 'ui/common/authorized/Authorize';
import PaginationComponent from 'ui/common/pagination';
import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import VocabularyCard from './c/VocabularyCard';
......@@ -72,8 +73,10 @@ class BrowsePage extends React.Component<IBrowsePageProps & any, any> {
return paged && paged.content && (
<div className={ classes.root }>
<ContentHeaderWithButton title="What do you want to do?" buttons={ <Button raised onClick={ createVocabulary }>Create vocabulary</Button> } />
<Grid container>
<Authorize role="ROLE_ADMINISTRATOR">
<ContentHeaderWithButton title="What do you want to do?" buttons={ <Button raised onClick={ createVocabulary }>Create vocabulary</Button> } />
</Authorize>
<Grid container spacing={ 0 }>
<Grid item xs={ 12 }>
<PaginationComponent pageObj={ paged }
onChange={ this.onPaginationChange }
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment