You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by he...@apache.org on 2016/01/27 21:23:01 UTC
[47/50] allura git commit: [#8035] Add jsx/react rules for eslint
[#8035] Add jsx/react rules for eslint
Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/53baa3ab
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/53baa3ab
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/53baa3ab
Branch: refs/heads/hs/8035
Commit: 53baa3ab7c0e2dd39b1cdb5720e21bd4a1244ce6
Parents: 03f02e7
Author: Heith Seewald <he...@gmail.com>
Authored: Tue Jan 26 15:13:28 2016 -0500
Committer: Heith Seewald <he...@gmail.com>
Committed: Wed Jan 27 15:21:33 2016 -0500
----------------------------------------------------------------------
.eslintrc-es6 | 9 +-
Allura/allura/public/nf/js/navbar.es6.js | 183 +++++++++++++++-----------
package.json | 5 +-
3 files changed, 113 insertions(+), 84 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/allura/blob/53baa3ab/.eslintrc-es6
----------------------------------------------------------------------
diff --git a/.eslintrc-es6 b/.eslintrc-es6
index 4427a53..9079414 100644
--- a/.eslintrc-es6
+++ b/.eslintrc-es6
@@ -17,11 +17,16 @@
"args": "none"
}],
"no-inline-comments": 0,
- "comma-dangle": 0
+ "comma-dangle": 0,
+ "vars-on-top": 2,
+ "react/jsx-indent-props": 0,
+ "react/jsx-curly-spacing": [2, "never"],
+ "react/jsx-closing-bracket-location": 0
},
"globals": {
"ReactDOM": true,
"React": true,
+ "ToolTip": true,
"$": true,
"window": true,
"_": true,
@@ -33,7 +38,7 @@
"browser": true,
"node": false
},
- "extends": "xo/browser",
+ "extends": ["xo/browser", "xo-react"],
"ecmaFeatures": {
"jsx": true,
"modules": false,
http://git-wip-us.apache.org/repos/asf/allura/blob/53baa3ab/Allura/allura/public/nf/js/navbar.es6.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/navbar.es6.js b/Allura/allura/public/nf/js/navbar.es6.js
index d52ccec..5c76e19 100644
--- a/Allura/allura/public/nf/js/navbar.es6.js
+++ b/Allura/allura/public/nf/js/navbar.es6.js
@@ -17,6 +17,7 @@
under the License.
*/
/* eslint camelcase: 0 */
+/* globals ContextMenu ToolTip */
'use strict';
/**
@@ -30,7 +31,7 @@ var _getProjectUrl = function(rest = true) {
var nbhd_proj;
var identClasses = document.getElementById('page-body').className.split(' ');
var basePath = rest ? '/rest/' : '/';
- for (var cls of identClasses) {
+ for (let cls of identClasses) {
if (cls.indexOf('project-') === 0) {
proj = cls.slice('project-'.length);
}
@@ -65,45 +66,48 @@ var NavBarItem = React.createClass({
name: React.PropTypes.string.isRequired,
url: React.PropTypes.string.isRequired,
currentOptionMenu: React.PropTypes.object,
+ isGrouper: React.PropTypes.bool,
+ mount_point: React.PropTypes.string,
onOptionClick: React.PropTypes.func.isRequired,
options: React.PropTypes.array,
+ handleType: React.PropTypes.string,
is_anchored: React.PropTypes.bool
},
render: function() {
var divClasses = "tb-item tb-item-edit";
+ var spanClasses = this.props.handleType + " ordinal-item";
+
if (this.props.is_anchored) {
divClasses += " anchored";
}
- var spanClasses = this.props.handleType + " ordinal-item";
if (this.props.isGrouper) {
spanClasses += " toolbar-grouper";
}
return (
- <div className={ divClasses }>
- <ToolTip targetSelector=".anchored .draggable-handle" position="top"
- theme="tooltipster-default" delay={250}/>
- <ToolTip targetSelector=".anchored .draggable-handle-sub" position="right"
- theme="tooltipster-default" delay={250}/>
+ <div className={divClasses}>
+ <ToolTip targetSelector=".anchored .draggable-handle"
+ position="top"
+ theme="tooltipster-default"
+ delay={250}/>
+ <ToolTip targetSelector=".anchored .draggable-handle-sub"
+ position="right"
+ theme="tooltipster-default"
+ delay={250}/>
<a>
- {!_.isEmpty(this.props.options) && <i className='config-tool fa fa-cog'
- onClick={this.handleOptionClick}> </i>}
+ {!_.isEmpty(this.props.options) &&
+ <i className='config-tool fa fa-cog' onClick={this.handleOptionClick}> </i>}
<span
className={spanClasses}
data-mount-point={this.props.mount_point}
- title={this.props.is_anchored ? 'This item cannot be moved.' : ''}
- >
+ title={this.props.is_anchored ? 'This item cannot be moved.' : ''}>
{this.props.name}
</span>
</a>
{this.props.currentOptionMenu.tool &&
this.props.currentOptionMenu.tool === this.props.mount_point &&
- <ContextMenu
- {...this.props}
- items={this.props.options}
- onOptionClick={this.props.onOptionClick}
- /> }
+ <ContextMenu {...this.props} items={this.props.options} onOptionClick={this.props.onOptionClick}/>}
</div>
);
},
@@ -120,7 +124,9 @@ var NavBarItem = React.createClass({
*/
var GroupingThreshold = React.createClass({
propTypes: {
- initialValue: React.PropTypes.number.isRequired
+ initialValue: React.PropTypes.number.isRequired,
+ isHidden: React.PropTypes.bool,
+ onUpdateThreshold: React.PropTypes.func
},
getInitialState: function() {
return {
@@ -138,22 +144,21 @@ var GroupingThreshold = React.createClass({
render: function() {
return (
<div>
- { !Boolean(!this.props.isHidden) &&
+ {!Boolean(!this.props.isHidden) &&
<div id='threshold-config'>
<span>
<label htmlFor='threshold-input'>Grouping Threshold</label>
- <ToolTip targetSelector="#threshold-input" position="top" contentAsHTML={true}/>
+ <ToolTip targetSelector="#threshold-input" position="top" contentAsHTML/>
<input type='number' name='threshold-input' id="threshold-input"
-
title='When you have multiple tools of the same type,\
<u>this number</u> determines if they will fit in the navigation \
bar or be grouped into a dropdown.'
-
- value={ this.state.value }
- onChange={ this.handleChange }
- min='1' max='50'/>
+ value={this.state.value}
+ onChange={this.handleChange}
+ min='1' max='50'
+ />
</span>
- </div> }
+ </div>}
</div>
);
}
@@ -168,14 +173,15 @@ var NormalNavItem = React.createClass({
propTypes: {
name: React.PropTypes.string.isRequired,
url: React.PropTypes.string.isRequired,
+ children: React.PropTypes.object,
classes: React.PropTypes.string
},
mixins: [React.addons.PureRenderMixin],
render: function() {
return (
<li key={`tb-norm-${_.uniqueId()}`}>
- <a href={ this.props.url } className={ this.props.classes }>
- { this.props.name }
+ <a href={this.props.url} className={this.props.classes}>
+ {this.props.name}
</a>
{this.props.children}
</li>
@@ -211,15 +217,16 @@ var ToggleAddNewTool = React.createClass({
render: function() {
return (
<div>
- <a onClick={ this.handleToggle } className="add-tool-toggle">
+ <a onClick={this.handleToggle} className="add-tool-toggle">
Add New...
</a>
{this.state.visible &&
- <ContextMenu
- {...this.props}
- classes={['admin_modal']}
- onOptionClick={this.handleToggle}
- items={this.props.installableTools} />
+ <ContextMenu
+ {...this.props}
+ classes={['admin_modal']}
+ onOptionClick={this.handleToggle}
+ items={this.props.installableTools}
+ />
}
</div>
);
@@ -265,7 +272,7 @@ var NormalNavBar = React.createClass({
<ul
id="normal-nav-bar"
className="dropdown">
- { listItems }
+ {listItems}
<li id="add-tool-container">
<ToggleAddNewTool installableTools={this.props.installableTools}/>
</li>
@@ -282,6 +289,13 @@ var AdminNav = React.createClass({
propTypes: {
tools: React.PropTypes.arrayOf(ToolsPropType),
currentOptionMenu: React.PropTypes.object,
+ installableTools: React.PropTypes.arrayOf(
+ React.PropTypes.shape({
+ text: React.PropTypes.string.isRequired,
+ href: React.PropTypes.string,
+ tooltip: React.PropTypes.string
+ })
+ ),
onOptionClick: React.PropTypes.func.isRequired
},
@@ -291,6 +305,8 @@ var AdminNav = React.createClass({
var subMenu;
var childOptionsOpen;
var _handle;
+ var toolList;
+ var isAnchored;
for (let item of items) {
if (item.children) {
subMenu = this.buildMenu(item.children, true);
@@ -299,8 +315,6 @@ var AdminNav = React.createClass({
}
_handle = isSubMenu ? "draggable-handle-sub" : 'draggable-handle';
- var toolList;
- var isAnchored;
if (item.mount_point === 'admin') {
// force admin to end, just like 'Project.sitemap()' does
toolList = endTools;
@@ -312,17 +326,17 @@ var AdminNav = React.createClass({
toolList = tools;
isAnchored = false;
}
- var coreItem = <NavBarItem
+ let coreItem = (<NavBarItem
{..._this.props}
- mount_point={ item.mount_point }
- name={ item.name }
+ mount_point={item.mount_point}
+ name={item.name}
handleType={_handle}
isGrouper={item.children && item.children.length > 0}
- url={ item.url }
- key={ 'tb-item-' + _.uniqueId() }
- is_anchored={ isAnchored }
- options={ item.admin_options }
- />;
+ url={item.url}
+ key={'tb-item-' + _.uniqueId()}
+ is_anchored={isAnchored}
+ options={item.admin_options}
+ />);
if (subMenu) {
childOptionsOpen = _.contains(_.pluck(item.children, 'mount_point'),
this.props.currentOptionMenu.tool);
@@ -340,17 +354,17 @@ var AdminNav = React.createClass({
return (
<div className='react-drag'>
- { anchoredTools }
+ {anchoredTools}
<ReactReorderable
- key={ 'reorder-' + _.uniqueId() }
+ key={'reorder-' + _.uniqueId()}
handle={"." + _handle}
- mode={ isSubMenu ? 'list' : 'grid' }
- onDragStart={ _this.props.onToolDragStart }
- onDrop={ _this.props.onToolReorder }>
- { tools }
+ mode={isSubMenu ? 'list' : 'grid'}
+ onDragStart={_this.props.onToolDragStart}
+ onDrop={_this.props.onToolReorder}>
+ {tools}
</ReactReorderable>
- { endTools }
- { !isSubMenu && <div id="add-tool-container" className="unlocked-container">
+ {endTools}
+ {!isSubMenu && <div id="add-tool-container" className="unlocked-container">
<ToggleAddNewTool installableTools={this.props.installableTools}/>
</div>}
</div>
@@ -364,10 +378,15 @@ var AdminNav = React.createClass({
});
var NavBarItemWithSubMenu = React.createClass({
+ propTypes: {
+ subMenu: React.PropTypes.arrayOf(ToolsPropType),
+ childOptionsOpen: React.PropTypes.string,
+ tool: React.PropTypes.objectOf(ToolsPropType)
+ },
render: function() {
return (
<div className={"tb-item-container" + (this.props.childOptionsOpen ? " child-options-open" : "")}>
- { this.props.tool }
+ {this.props.tool}
{this.props.subMenu &&
<AdminItemGroup key={_.uniqueId()}>
{this.props.subMenu}
@@ -383,6 +402,9 @@ var NavBarItemWithSubMenu = React.createClass({
* @constructor
*/
var AdminItemGroup = React.createClass({
+ propTypes: {
+ children: React.PropTypes.object
+ },
render: function() {
return (
<div className="tb-item-grouper">
@@ -399,13 +421,14 @@ var AdminItemGroup = React.createClass({
*/
var ToggleAdminButton = React.createClass({
propTypes: {
+ handleButtonPush: React.PropTypes.func,
visible: React.PropTypes.bool
},
render: function() {
var classes = this.props.visible ? 'fa fa-unlock' : 'fa fa-lock';
return (
- <button id='toggle-admin-btn' onClick={ this.props.handleButtonPush } className='admin-toolbar-right'>
- <i className={ classes }> </i>
+ <button id='toggle-admin-btn' onClick={this.props.handleButtonPush} className='admin-toolbar-right'>
+ <i className={classes}> </i>
</button>
);
}
@@ -488,14 +511,14 @@ var Main = React.createClass({
onToolReorder: function() {
$('.react-drag.dragging').removeClass('dragging');
- var params = {_session_id: $.cookie('_session_id')};
- var toolNodes = $(ReactDOM.findDOMNode(this)).find('span.ordinal-item').not(".toolbar-grouper");
- for (var i = 0; i < toolNodes.length; i++) {
+ let params = {_session_id: $.cookie('_session_id')};
+ let toolNodes = $(ReactDOM.findDOMNode(this)).find('span.ordinal-item').not(".toolbar-grouper");
+ for (let i = 0; i < toolNodes.length; i++) {
params[i] = toolNodes[i].dataset.mountPoint;
}
- var _this = this;
- var url = _getProjectUrl() + '/admin/mount_order';
+ let _this = this;
+ let url = _getProjectUrl() + '/admin/mount_order';
$.ajax({
type: 'POST',
url: url,
@@ -532,24 +555,24 @@ var Main = React.createClass({
var navBarSwitch = showAdmin => {
var navbar;
if (showAdmin) {
- navbar = <AdminNav
- tools={ _this.state.data.menu }
- installableTools={ _this.state.data.installable_tools }
- data={ _this.state.data }
- onToolReorder={ _this.onToolReorder }
- onToolDragStart={ _this.onToolDragStart }
- editMode={ _this.state.visible }
- currentOptionMenu={ _this.state.currentOptionMenu }
- onOptionClick={ _this.handleShowOptionMenu }
+ navbar = (<AdminNav
+ tools={_this.state.data.menu}
+ installableTools={_this.state.data.installable_tools}
+ data={_this.state.data}
+ onToolReorder={_this.onToolReorder}
+ onToolDragStart={_this.onToolDragStart}
+ editMode={_this.state.visible}
+ currentOptionMenu={_this.state.currentOptionMenu}
+ onOptionClick={_this.handleShowOptionMenu}
currentToolOptions={this.state.currentToolOptions}
- />;
+ />);
} else {
- navbar = <div>
+ navbar = (<div>
<NormalNavBar
- items={ _this.state.data.menu }
- installableTools={ _this.state.data.installable_tools }
+ items={_this.state.data.menu}
+ installableTools={_this.state.data.installable_tools}
/>
- </div>;
+ </div>);
}
return navbar;
};
@@ -568,17 +591,17 @@ var Main = React.createClass({
return (
<div>
- { navBar }
+ {navBar}
<div id='bar-config'>
{show_grouping_threshold &&
<GroupingThreshold
- onUpdateThreshold={ this.onUpdateThreshold }
- isHidden={ this.state.visible }
- initialValue={ parseInt(this.state.data.grouping_threshold, 10) }/> }
+ onUpdateThreshold={this.onUpdateThreshold}
+ isHidden={this.state.visible}
+ initialValue={parseInt(this.state.data.grouping_threshold, 10)}/>}
</div>
<ToggleAdminButton
- handleButtonPush={ this.handleToggleAdmin }
- visible={ this.state.visible }/>
+ handleButtonPush={this.handleToggleAdmin}
+ visible={this.state.visible}/>
</div>
);
}
http://git-wip-us.apache.org/repos/asf/allura/blob/53baa3ab/package.json
----------------------------------------------------------------------
diff --git a/package.json b/package.json
index 8b238b0..a0e9ec3 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
"eslint": "eslint",
"lint-es5": "eslint -c .eslintrc-es5 --ignore-path .eslintignore-es5 Allura/allura/public/**/*.js || true",
"lint-es6": "eslint -c .eslintrc-es6 --ignore-path .eslintignore-es6 Allura/allura/public/**/*.es6.js || true",
- "lint": "npm run lint-es5 && npm run lint-es6"
+ "lint": "npm run lint5 && npm run lint6"
},
"repository": {
"type": "git",
@@ -32,8 +32,9 @@
"broccoli-uglify-js": "^0.1.3",
"eslint": "^1.10.3",
"eslint-config-xo": "^0.9.2",
+ "eslint-config-xo-react": "^0.3.0",
"eslint-plugin-html": "^1.2.0",
- "eslint-plugin-react": "^3.15.0",
+ "eslint-plugin-react": "^3.16.1",
"esprima-fb": "^15001.1001.0-dev-harmony-fb"
}
}