mirror of
https://github.com/ascribe/onion.git
synced 2024-12-23 01:39:36 +01:00
integrate acl into navrouteslist + little refactor on those components
This commit is contained in:
parent
9409af4e1e
commit
cb6c4aaf0e
@ -110,7 +110,7 @@ let Header = React.createClass({
|
|||||||
<MenuItemLink eventKey="3" to="logout">{getLangText('Log out')}</MenuItemLink>
|
<MenuItemLink eventKey="3" to="logout">{getLangText('Log out')}</MenuItemLink>
|
||||||
</DropdownButton>
|
</DropdownButton>
|
||||||
);
|
);
|
||||||
navRoutesLinks = <NavRoutesLinks routes={this.props.routes} navbar right/>;
|
navRoutesLinks = <NavRoutesLinks routes={this.props.routes} userAcl={this.state.currentUser.acl} navbar right/>;
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
account = <NavItemLink to="login">{getLangText('LOGIN')}</NavItemLink>;
|
account = <NavItemLink to="login">{getLangText('LOGIN')}</NavItemLink>;
|
||||||
|
@ -3,53 +3,63 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import Nav from 'react-bootstrap/lib/Nav';
|
import Nav from 'react-bootstrap/lib/Nav';
|
||||||
import DropdownButton from 'react-bootstrap/lib/DropdownButton';
|
|
||||||
import MenuItemLink from 'react-router-bootstrap/lib/MenuItemLink';
|
import NavRoutesLinksLink from './nav_routes_links_link';
|
||||||
import NavItemLink from 'react-router-bootstrap/lib/NavItemLink';
|
|
||||||
|
import AclProxy from './acl_proxy';
|
||||||
|
|
||||||
import { sanitizeList } from '../utils/general_utils';
|
import { sanitizeList } from '../utils/general_utils';
|
||||||
|
|
||||||
|
|
||||||
let NavRoutesLinks = React.createClass({
|
let NavRoutesLinks = React.createClass({
|
||||||
propTypes: {
|
propTypes: {
|
||||||
routes: React.PropTypes.element
|
routes: React.PropTypes.element,
|
||||||
|
userAcl: React.PropTypes.object
|
||||||
},
|
},
|
||||||
|
|
||||||
extractLinksFromRoutes(node, i) {
|
extractLinksFromRoutes(node, userAcl, i) {
|
||||||
if(!node) {
|
if(!node) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
node = node.props;
|
let links = node.props.children.map((child, j) => {
|
||||||
|
|
||||||
let links = node.children.map((child, j) => {
|
let childrenFn = null;
|
||||||
|
|
||||||
// check if this a candidate for a link generation
|
|
||||||
if(child.props.headerTitle && typeof child.props.headerTitle === 'string') {
|
|
||||||
|
|
||||||
// also check if it is a candidate for generating a dropdown menu
|
|
||||||
if(child.props.children && child.props.children.length > 0) {
|
if(child.props.children && child.props.children.length > 0) {
|
||||||
|
childrenFn = this.extractLinksFromRoutes(child, userAcl, i++);
|
||||||
|
}
|
||||||
|
|
||||||
|
let { aclName, headerTitle, name, children } = child.props;
|
||||||
|
if(headerTitle && typeof headerTitle === 'string') {
|
||||||
|
|
||||||
|
if(aclName && typeof aclName !== 'undefined') {
|
||||||
return (
|
return (
|
||||||
<DropdownButton title={child.props.headerTitle} key={j}>
|
<AclProxy
|
||||||
{this.extractLinksFromRoutes(child, i++)}
|
aclName={aclName}
|
||||||
</DropdownButton>
|
aclObject={this.props.userAcl}>
|
||||||
);
|
<NavRoutesLinksLink
|
||||||
} else if(i === 1) {
|
key={j}
|
||||||
// if the node's child is actually a node of level one (a child of a node), we're
|
headerTitle={headerTitle}
|
||||||
// returning a DropdownButton matching MenuItemLink
|
routeName={name}
|
||||||
return (
|
depth={i}
|
||||||
<MenuItemLink to={child.props.name} key={j}>{child.props.headerTitle}</MenuItemLink>
|
children={childrenFn}/>
|
||||||
);
|
</AclProxy>
|
||||||
} else if(i === 0) {
|
|
||||||
return (
|
|
||||||
<NavItemLink to={child.props.name} key={j}>{child.props.headerTitle}</NavItemLink>
|
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return null;
|
return (
|
||||||
|
<NavRoutesLinksLink
|
||||||
|
key={j}
|
||||||
|
headerTitle={headerTitle}
|
||||||
|
routeName={name}
|
||||||
|
depth={i}
|
||||||
|
children={childrenFn}/>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// remove all nulls from the list of generated links
|
// remove all nulls from the list of generated links
|
||||||
@ -57,9 +67,11 @@ let NavRoutesLinks = React.createClass({
|
|||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
let {routes, userAcl} = this.props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Nav {...this.props}>
|
<Nav {...this.props}>
|
||||||
{this.extractLinksFromRoutes(this.props.routes, 0)}
|
{this.extractLinksFromRoutes(routes, userAcl, 0)}
|
||||||
</Nav>
|
</Nav>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
49
js/components/nav_routes_links_link.js
Normal file
49
js/components/nav_routes_links_link.js
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import DropdownButton from 'react-bootstrap/lib/DropdownButton';
|
||||||
|
import MenuItemLink from 'react-router-bootstrap/lib/MenuItemLink';
|
||||||
|
import NavItemLink from 'react-router-bootstrap/lib/NavItemLink';
|
||||||
|
|
||||||
|
let NavRoutesLinksLink = React.createClass({
|
||||||
|
propTypes: {
|
||||||
|
headerTitle: React.PropTypes.string,
|
||||||
|
routeName: React.PropTypes.string,
|
||||||
|
|
||||||
|
children: React.PropTypes.oneOfType([
|
||||||
|
React.PropTypes.arrayOf(React.PropTypes.element),
|
||||||
|
React.PropTypes.element
|
||||||
|
]),
|
||||||
|
|
||||||
|
depth: React.PropTypes.number
|
||||||
|
},
|
||||||
|
|
||||||
|
render() {
|
||||||
|
let { children, headerTitle, depth, routeName } = this.props;
|
||||||
|
|
||||||
|
if(children) {
|
||||||
|
return (
|
||||||
|
<DropdownButton title={headerTitle}>
|
||||||
|
{children}
|
||||||
|
</DropdownButton>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
if(depth === 1) {
|
||||||
|
// if the node's child is actually a node of level one (a child of a node), we're
|
||||||
|
// returning a DropdownButton matching MenuItemLink
|
||||||
|
return (
|
||||||
|
<MenuItemLink to={routeName}>{headerTitle}</MenuItemLink>
|
||||||
|
);
|
||||||
|
} else if(depth === 0) {
|
||||||
|
return (
|
||||||
|
<NavItemLink to={routeName}>{headerTitle}</NavItemLink>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export default NavRoutesLinksLink;
|
@ -71,7 +71,7 @@ let ROUTES = {
|
|||||||
<Route name="logout" path="logout" handler={LogoutContainer} />
|
<Route name="logout" path="logout" handler={LogoutContainer} />
|
||||||
<Route name="signup" path="signup" handler={SignupContainer} />
|
<Route name="signup" path="signup" handler={SignupContainer} />
|
||||||
<Route name="password_reset" path="password_reset" handler={PasswordResetContainer} />
|
<Route name="password_reset" path="password_reset" handler={PasswordResetContainer} />
|
||||||
<Route name="request_loan" path="request_loan" handler={IkonotvRequestLoan} headerTitle="SEND NEW CONTRACT" />
|
<Route name="request_loan" path="request_loan" handler={IkonotvRequestLoan} headerTitle="SEND NEW CONTRACT" aclName="acl_create_contract" />
|
||||||
<Route name="register_piece" path="register_piece" handler={RegisterPiece} headerTitle="+ NEW WORK"/>
|
<Route name="register_piece" path="register_piece" handler={RegisterPiece} headerTitle="+ NEW WORK"/>
|
||||||
<Route name="pieces" path="collection" handler={IkonotvPieceList} headerTitle="COLLECTION"/>
|
<Route name="pieces" path="collection" handler={IkonotvPieceList} headerTitle="COLLECTION"/>
|
||||||
<Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />
|
<Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />
|
||||||
|
Loading…
Reference in New Issue
Block a user