import './skyquakeNav.scss';
import SelectOption from '../form_controls/selectOption.jsx';
import {FormSection} from '../form_controls/formControls.jsx';
+import SkyquakeRBAC from 'widgets/skyquake_rbac/skyquakeRBAC.jsx';
//Temporary, until api server is on same port as webserver
var rw = require('utils/rw.js');
}
}
+class SelectProject extends React.Component {
+ constructor(props) {
+ super(props);
+ }
+ selectProject(e) {
+ let value = JSON.parse(e.currentTarget.value);
+ console.log('selected project', value)
+ }
+ render() {
+ let props = this.props;
+ let currentValue = JSON.stringify(props.currentProject);
+ let projects = this.props.projects && this.props.projects.map((p,i) => {
+ return {
+ label: p.name,
+ value: p.name
+ }
+ });
+ let hasProjects = (this.props.projects && (this.props.projects.length > 0))
+ return (
+ <div className="userSection app">
+ {
+ hasProjects ? 'Project:' : 'No Projects Assigned'
+ }
+ {
+ hasProjects ?
+ <SelectOption
+ options={projects}
+ value={currentValue}
+ defaultValue={currentValue}
+ onChange={props.onSelectProject}
+ className="projectSelect" />
+ : null
+ }
+ </div>
+ )
+ }
+}
class UserNav extends React.Component {
constructor(props) {
super(props);
}
+ handleLogout() {
+ Utils.clearAuthentication();
+ }
selectProject(e) {
let value = JSON.parse(e.currentTarget.value)
console.log('selected project', value)
}
render() {
- let projects = this.props.projects.map((p,i) => {
- return {
- label: p.name,
- value: p
+ let props = this.props;
+ let userProfileLink = '';
+ this.props.nav['user_management'] && this.props.nav['user_management'].routes.map((r) => {
+ if(r.unique) {
+ userProfileLink = returnLinkItem(r, props.currentUser)
}
})
return (
- <div className="userSection">
- Project:
- <SelectOption options={projects} onChange={this.selectProject} className="projectSelect"/>
+ <div className="app">
+ <h2>
+ {userProfileLink}
+ <span className="oi" data-glyph="caret-bottom"></span>
+ </h2>
+ <ul className="menu">
+ <li>
+ <a onClick={this.handleLogout}>
+ Logout
+ </a>
+ </li>
+ </ul>
</div>
)
}
* @param {object} link Routing information from nav object.
* @return {object} component returns a react component that links to a new route.
*/
-export function returnLinkItem(link) {
+export function returnLinkItem(link, label) {
let ref;
let route = link.route;
if(link.isExternal) {
ref = (
- <a href={route}>{link.label}</a>
+ <a href={route}>{label || link.label}</a>
)
} else {
if(link.path && link.path.replace(' ', '') != '') {
}
}
ref = (
- <Link to={route}>
- {link.label}
+ <Link to={route}>
+ {label || link.label}
</Link>
)
}
let secondaryNavHTML = (
<div className="secondaryNav" key="secondaryNav">
{secondaryNav}
- <UserNav projects={props.projects}/>
- <LogoutAppMenuItem />
+ <SelectProject
+ onSelectProject={props.store.selectActiveProject}
+ projects={props.projects}
+ currentProject={props.currentProject} />
+ <UserNav
+ currentUser={props.currentUser}
+ nav={nav} />
</div>
)
for (let k in nav) {
navItem.priority = nav[k].priority;
navItem.order = nav[k].order;
navItem.html = (
- <div key={k} className={navClass}>
+ <SkyquakeRBAC allow={nav[k].allow || ['*']} key={k} className={navClass}>
<h2>{dashboardLink} {self.hasSubNav[k] ? <span className="oi" data-glyph="caret-bottom"></span> : ''}</h2>
<ul className="menu">
{
NavList
}
</ul>
- </div>
+ </SkyquakeRBAC>
);
navList.push(navItem)
}