public/js/views/user.js in conjur-asset-ui-1.3.1 vs public/js/views/user.js in conjur-asset-ui-1.3.2

- old
+ new

@@ -1,191 +1,68 @@ /** @jsx React.DOM */ -/* global conjur, _, React, ReactBootstrap */ -(function(conjur, _, React, ReactBootstrap) { - 'use strict'; +//var ReactBootstrap=root.ReactBootstrap; +var TabbedArea = ReactBootstrap.TabbedArea; +var TabPane = ReactBootstrap.TabPane; - var TabbedArea = ReactBootstrap.TabbedArea, - TabPane = ReactBootstrap.TabPane, - Tab = conjur.views.mixins.Tab, - AuditBox = window.AuditBox, - RoleLink = conjur.views.RoleLink; +var User = React.createClass({ + mixins: [conjur.views.mixins.Tab], + render: function(){ + var user = this.props.data.user; - var PubkeyItem = React.createClass({ - render: function() { - return ( - <div className="b-pubkey"> - <div className="b-pubkey__logo"> - <span className="badge">{this.props.pubkey[0]}</span> - </div> - <ul className="b-pubkey__list list-unstyled"> - <li className="b-pubkey__name"> - {this.props.pubkey[2]} - </li> - <li className="b-pubkey__fingerprint"> - {/* TODO: key fingerprint */} - </li> - <li className="b-pubkey__info"> - {/* TODO: When added, when last time used */} - </li> - </ul> - <div className="b-pubkeys__actions"> - {/* TODO: Action buttons */} - </div> - </div> - ); - } - }); - - var PubkeysList = React.createClass({ - render: function() { - var login = this.props.login; - - var pubkeysList = this.props.pubkeys.map(function(k, idx, coll) { - var tokens = k.split(' '); - - console.log(arguments); - - var className = 'b-pubkeys__item list-group-item list-group-item-noborder'; - - if (idx + 1 !== coll.length) { - className = className + ' b-pubkeys__item--headline'; - } - - return ( - <li className={className}> - <PubkeyItem pubkey={tokens} /> - </li> - ); - }); - - return ( - <div className="b-pubkeys"> - <PubkeysHelp> - This is list of SSH public keys associated with user {login}. - </PubkeysHelp> - <ul className="b-pubkeys__list"> - {pubkeysList} - </ul> - </div> - ); - } - }); - - var PubkeysHelp = React.createClass({ - render: function() { - var ret; - - if (React.Children.count(this.props.children) > 0) { - ret = ( - <p className="b-pubkeys__help"> - {this.props.children} - </p> - ); - } else { - var login = this.props.login; - - ret = ( - <p className="b-pubkeys__help"> - User {login} have not any pubkey. Use follow command to create one: - <pre>$ conjur pubkeys add {login} @id_{login}.pub</pre> - </p> - ); - } - - return ret; - } - }); - - var PubkeysTabContent = React.createClass({ - render: function() { - var body; - - if (this.props.pubkeys.length > 0) { - body = ( - <PubkeysList login={this.props.login} pubkeys={this.props.pubkeys} /> - ); - } else { - body = ( - <div className="b-pubkeys"> - <PubkeysHelp login={this.props.login} /> - </div> - ); - } - - return body; - } - }); - - this.User = React.createClass({ - mixins: [Tab], - - render: function() { - var user = this.props.data.user; - - // TODO: refactor - // TODO: show public keys - // TODO: actions menu (e.g. 'upload public key', 'add annotation') - // TODO: memberships panel - var overviewTab = ( - <TabPane key="overview" tab="Overview"> + // TODO: refactor + // TODO: show public keys + // TODO: actions menu (e.g. 'upload public key', 'add annotation') + // TODO: memberships panel + var overview_tab = + <TabPane key="overview" tab="Overview"> <dl className="dl-horizontal"> <dt>Created by</dt> <dd><RoleLink id={user.userid}/></dd> <dt>Owner</dt> <dd><RoleLink id={user.ownerid}/></dd> <dt>Uidnumber</dt> <dd>{user.uidnumber}</dd> </dl> - </TabPane> - ); + </TabPane>; - var auditTab = ( - <TabPane key="audit" tab="Recent Activity"> + var audit_tab= + <TabPane key="audit" tab="Recent Activity"> <div className="audit auditUser"> - <AuditBox roles={[user.roleid]} - resources={[user.resource_identifier]} - tabview={true} /> + <AuditBox roles={[user.roleid]} resources={[user.resource_identifier]} tabview={true}/> </div> - </TabPane> - ); + </TabPane>; - var pubkeysTab = ( - <TabPane key="pubkeys" - tab={conjur.utils.getTabname('Public Keys', this.props.data.pubkeys)}> - <PubkeysTabContent login={user.login} pubkeys={this.props.data.pubkeys} /> - </TabPane> - ); + var pubkeys_list = this.props.data.pubkeys.map(function(k) { + var tokens = k.split(" "); + return <li className="list-group-item list-group-item-noborder"> + <span className="badge">{tokens[0]}</span> + {tokens[tokens.length-1]} + </li> + }); + var pubkeys_tab = <TabPane key="pubkeys" tab={get_tabname("Public Keys", this.props.data.pubkeys)}> + <div className="pubkeys pubkeysUser"> + <ul className="list-group"> + {pubkeys_list} + </ul> + </div> + </TabPane>; - var permissionsTab = this.permissionsTab(user.roleid); - var membershipsTab = this.membershipsTab(user.roleid); - var annotationsTab = this.annotationsTab(); - var ownedTab = this.ownedTab(); + var permissions_tab = this.permissions_tab(user.roleid); + var memberships_tab = this.memberships_tab(user.roleid); + var annotations_tab = this.annotations_tab(); + var owned_tab = this.owned_tab(); - var tabs = _.compact([ - overviewTab, - ownedTab, - membershipsTab, - permissionsTab, - annotationsTab, - pubkeysTab, - auditTab - ]); + var tabs=_.compact([overview_tab, owned_tab, memberships_tab, + permissions_tab, annotations_tab, pubkeys_tab, audit_tab]); - return ( - <div className="user"> - <h2>User {user.login}</h2> - <TabbedArea defaultActiveKey="overview"> - {tabs} - </TabbedArea> - </div> - ); - } - }); -}).bind(conjur.views) -( - conjur, - _, - React, - ReactBootstrap -); + return ( + <div className="user"> + <h2> User {user.login} </h2> + <TabbedArea defaultActiveKey="overview"> + {tabs} + </TabbedArea> + </div> + ); + } +});