integrate acl into navrouteslist + little refactor on those components

js/components/header.js

@@ -110,7 +110,7 @@ let Header = React.createClass({
                     <MenuItemLink eventKey="3" to="logout">{getLangText('Log out')}</MenuItemLink>
                 </DropdownButton>
             );
-            navRoutesLinks = <NavRoutesLinks routes={this.props.routes} navbar right/>;
+            navRoutesLinks = <NavRoutesLinks routes={this.props.routes} userAcl={this.state.currentUser.acl} navbar right/>;
         }
         else {
             account = <NavItemLink to="login">{getLangText('LOGIN')}</NavItemLink>;

js/components/nav_routes_links.js

@@ -3,53 +3,63 @@
 import React from 'react';
 
 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';
 
 
 let NavRoutesLinks = React.createClass({
     propTypes: {
-        routes: React.PropTypes.element
+        routes: React.PropTypes.element,
+        userAcl: React.PropTypes.object
     },
 
-    extractLinksFromRoutes(node, i) {
+    extractLinksFromRoutes(node, userAcl, i) {
         if(!node) {
             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.children && child.props.children.length > 0) {
-            if(child.props.headerTitle && typeof child.props.headerTitle === 'string') {
+                childrenFn = this.extractLinksFromRoutes(child, userAcl, i++);
+            }
 
-                // also check if it is a candidate for generating a dropdown menu
+            let { aclName, headerTitle, name, children } = child.props;
-                if(child.props.children && child.props.children.length > 0) {
+            if(headerTitle && typeof headerTitle === 'string') {
+
+                if(aclName && typeof aclName !== 'undefined') {
                     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 {
-                    return null;
+                    return (
+                        <NavRoutesLinksLink
+                            key={j}
+                            headerTitle={headerTitle}
+                            routeName={name}
+                            depth={i}
+                            children={childrenFn}/>
+                    );
                 }
             } else {
                 return null;
             }
+
         });
 
         // remove all nulls from the list of generated links
@@ -57,9 +67,11 @@ let NavRoutesLinks = React.createClass({
     },
 
     render() {
+        let {routes, userAcl} = this.props;
+
         return (
             <Nav {...this.props}>
-                {this.extractLinksFromRoutes(this.props.routes, 0)}
+                {this.extractLinksFromRoutes(routes, userAcl, 0)}
             </Nav>
         );
     }

js/components/nav_routes_links_link.js

@@ -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;

js/components/whitelabel/wallet/wallet_routes.js

@@ -71,7 +71,7 @@ let ROUTES = {
             <Route name="logout" path="logout" handler={LogoutContainer} />
             <Route name="signup" path="signup" handler={SignupContainer} />
             <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="pieces" path="collection" handler={IkonotvPieceList} headerTitle="COLLECTION"/>
             <Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />