Eslint (shakacode#320)

* Clean up js code linting rules These rules can be safely removed: - no-undef - space-before-function-paren - indent - id-length - jsx-quotes - react/display-name - react/jsx-boolean-value - react/jsx-curly-spacing - react/jsx-no-duplicate-props - react/jsx-no-undef - react/jsx-sort-prop-types - react/jsx-sort-props - react/jsx-uses-react - react/jsx-uses-vars - react/no-danger - react/no-did-mount-set-state - react/no-did-update-set-state - react/no-multi-comp - react/no-unknown-property - react/prop-types - react/react-in-jsx-scope - react/self-closing-comp - react/jsx-wrap-multilines - react/sort-comp [rules/react.yml#L5](https://github.com/shakacode/style-guide-javascript/blob/master/packages/eslint-config-shakacode/rules/react.yml#L5) - no-unused-vars [rules/javascript.yml#L14](https://github.com/shakacode/style-guide-javascript/blob/66a6c7100c4/packages/eslint-config-shakacode/rules/javascript.yml#L14) * no-unused-vars rule * no-underscore-dangle

Author: AlexKVal

client/.eslintrc.yml

@@ -16,16 +16,6 @@ env:
  mocha: true
 
 rules:
- ### Variables
- no-undef: 2
- no-unused-vars: [2, { vars: all, args: none }]
-
- ### Stylistic issues
- indent: [1, 2, { SwitchCase: 1, VariableDeclarator: 2 }]
- id-length: [1, { min: 2, exceptions: [_, e, i, k, v] }]
- space-before-function-paren: [1, "never"]
- no-underscore-dangle: 0
-
  ### Imports
  # Can't do next one because of alias in webpack
  import/no-unresolved: 0
@@ -36,25 +26,3 @@ rules:
 
  # https://github.com/eslint/eslint/issues/6876 SFC's marked as invalid
  new-cap: 0
-
- ### React
- jsx-quotes: [1, prefer-double]
- react/display-name: 0
- react/jsx-boolean-value: [1, always]
- react/jsx-curly-spacing: [1, never]
- react/jsx-no-duplicate-props: [2, { ignoreCase: true }]
- react/jsx-no-undef: 2
- react/jsx-sort-prop-types: 0
- react/jsx-sort-props: 0
- react/jsx-uses-react: 2
- react/jsx-uses-vars: 2
- react/no-danger: 0
- react/no-did-mount-set-state: 1
- react/no-did-update-set-state: 0
- react/no-multi-comp: 2
- react/no-unknown-property: 2
- react/prop-types: 1
- react/react-in-jsx-scope: 2
- react/self-closing-comp: 2
- react/sort-comp: 0 # Should be 1. `statics` should be on top.
- react/jsx-wrap-multilines: 2

client/app/bundles/comments/components/CommentBox/CommentForm/CommentForm.jsx

@@ -29,18 +29,18 @@ export default class CommentForm extends BaseComponent {
  };
 
  _.bindAll(this, [
- '_handleSelect',
- '_handleChange',
- '_handleSubmit',
- '_resetAndFocus',
+ 'handleSelect',
+ 'handleChange',
+ 'handleSubmit',
+ 'resetAndFocus',
  ]);
  }
 
- _handleSelect(selectedKey) {
+ handleSelect(selectedKey) {
  this.setState({ formMode: selectedKey });
  }
 
- _handleChange() {
+ handleChange() {
  let comment;
 
  switch (this.state.formMode) {
@@ -71,15 +71,15 @@ export default class CommentForm extends BaseComponent {
  this.setState({ comment });
  }
 
- _handleSubmit(e) {
+ handleSubmit(e) {
  e.preventDefault();
  const { actions } = this.props;
  actions
  .submitComment(this.state.comment)
- .then(this._resetAndFocus);
+ .then(this.resetAndFocus);
  }
 
- _resetAndFocus() {
+ resetAndFocus() {
  // Don't reset a form that didn't submit, this results in data loss
  if (this.props.error) return;
 
@@ -104,11 +104,11 @@ export default class CommentForm extends BaseComponent {
  ref.focus();
  }
 
- _formHorizontal() {
+ formHorizontal() {
  return (
  <div>
  <hr />
- <form className="commentForm form-horizontal" onSubmit={this._handleSubmit}>
+ <form className="commentForm form-horizontal" onSubmit={this.handleSubmit}>
  <Input
  type="text"
  label="Name"
@@ -117,7 +117,7 @@ export default class CommentForm extends BaseComponent {
  wrapperClassName="col-sm-10"
  ref={node => { this.horizontalAuthorNode = node; }}
  value={this.state.comment.author}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  <Input
@@ -128,7 +128,7 @@ export default class CommentForm extends BaseComponent {
  wrapperClassName="col-sm-10"
  ref={node => { this.horizontalTextNode = node; }}
  value={this.state.comment.text}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  <div className="form-group">
@@ -146,18 +146,18 @@ export default class CommentForm extends BaseComponent {
  );
  }
 
- _formStacked() {
+ formStacked() {
  return (
  <div>
  <hr />
- <form className="commentForm form" onSubmit={this._handleSubmit}>
+ <form className="commentForm form" onSubmit={this.handleSubmit}>
  <Input
  type="text"
  label="Name"
  placeholder="Your Name"
  ref={node => { this.stackedAuthorNode = node; }}
  value={this.state.comment.author}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  <Input
@@ -166,7 +166,7 @@ export default class CommentForm extends BaseComponent {
  placeholder={textPlaceholder}
  ref={node => { this.stackedTextNode = node; }}
  value={this.state.comment.text}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  <input
@@ -180,11 +180,11 @@ export default class CommentForm extends BaseComponent {
  );
  }
 
- _formInline() {
+ formInline() {
  return (
  <div>
  <hr />
- <form className="commentForm form" onSubmit={this._handleSubmit}>
+ <form className="commentForm form" onSubmit={this.handleSubmit}>
  <Input label="Inline Form" wrapperClassName="wrapper">
  <Row>
  <Col xs={3}>
@@ -194,7 +194,7 @@ export default class CommentForm extends BaseComponent {
  placeholder="Your Name"
  ref={node => { this.inlineAuthorNode = node; }}
  value={this.state.comment.author}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  </Col>
@@ -205,7 +205,7 @@ export default class CommentForm extends BaseComponent {
  placeholder={textPlaceholder}
  ref={node => { this.inlineTextNode = node; }}
  value={this.state.comment.text}
- onChange={this._handleChange}
+ onChange={this.handleChange}
  disabled={this.props.isSaving}
  />
  </Col>
@@ -224,7 +224,7 @@ export default class CommentForm extends BaseComponent {
  );
  }
 
- _errorWarning() {
+ errorWarning() {
  // If there is no error, there is nothing to add to the DOM
  if (!this.props.error) return null;
  return (
@@ -239,13 +239,13 @@ export default class CommentForm extends BaseComponent {
  let inputForm;
  switch (this.state.formMode) {
  case 0:
- inputForm = this._formHorizontal();
+ inputForm = this.formHorizontal();
  break;
  case 1:
- inputForm = this._formStacked();
+ inputForm = this.formStacked();
  break;
  case 2:
- inputForm = this._formInline();
+ inputForm = this.formInline();
  break;
  default:
  throw new Error(`Unknown form mode: ${this.state.formMode}.`);
@@ -260,10 +260,10 @@ export default class CommentForm extends BaseComponent {
  transitionEnterTimeout={300}
  transitionLeaveTimeout={300}
  >
- {this._errorWarning()}
+ {this.errorWarning()}
  </ReactCSSTransitionGroup>
 
- <Nav bsStyle="pills" activeKey={this.state.formMode} onSelect={this._handleSelect}>
+ <Nav bsStyle="pills" activeKey={this.state.formMode} onSelect={this.handleSelect}>
  <NavItem eventKey={0}>Horizontal Form</NavItem>
  <NavItem eventKey={1}>Stacked Form</NavItem>
  <NavItem eventKey={2}>Inline Form</NavItem>

client/app/bundles/comments/components/CommentBox/CommentList/CommentList.jsx

@@ -17,10 +17,10 @@ export default class CommentList extends BaseComponent {
  constructor(props, context) {
  super(props, context);
  this.state = {};
- _.bindAll(this, '_errorWarning');
+ _.bindAll(this, 'errorWarning');
  }
 
- _errorWarning() {
+ errorWarning() {
  // If there is no error, there is nothing to add to the DOM
  if (!this.props.error) return null;
  return (
@@ -52,7 +52,7 @@ export default class CommentList extends BaseComponent {
  transitionEnterTimeout={500}
  transitionLeaveTimeout={500}
  >
- {this._errorWarning()}
+ {this.errorWarning()}
  </ReactCSSTransitionGroup>
 
  <ReactCSSTransitionGroup

client/app/bundles/comments/components/CommentScreen/CommentScreen.jsx

@@ -13,7 +13,7 @@ export default class CommentScreen extends BaseComponent {
  locationState: PropTypes.object,
  };
 
- _renderNotification() {
+ renderNotification() {
  const { locationState } = this.props;
 
  if (!locationState || !locationState.redirectFrom) return null;
@@ -30,7 +30,7 @@ export default class CommentScreen extends BaseComponent {
 
  return (
  <div>
- {this._renderNotification()}
+ {this.renderNotification()}
  <div>
  <CommentBox
  pollInterval={60000}

client/app/bundles/comments/components/SimpleCommentScreen/SimpleCommentScreen.jsx

@@ -20,14 +20,14 @@ export default class SimpleCommentScreen extends BaseComponent {
  submitCommentError: null,
  };
 
- _.bindAll(this, '_fetchComments', '_handleCommentSubmit');
+ _.bindAll(this, 'fetchComments', 'handleCommentSubmit');
  }
 
  componentDidMount() {
- this._fetchComments();
+ this.fetchComments();
  }
 
- _fetchComments() {
+ fetchComments() {
  return (
  request
  .get('comments.json', { responseType: 'json' })
@@ -36,7 +36,7 @@ export default class SimpleCommentScreen extends BaseComponent {
  );
  }
 
- _handleCommentSubmit(comment) {
+ handleCommentSubmit(comment) {
  this.setState({ isSaving: true });
 
  const requestConfig = {
@@ -84,7 +84,7 @@ export default class SimpleCommentScreen extends BaseComponent {
  </p>
  <CommentForm
  isSaving={this.state.isSaving}
- actions={{ submitComment: this._handleCommentSubmit }}
+ actions={{ submitComment: this.handleCommentSubmit }}
  error={this.state.submitCommentError}
  cssTransitionGroupClassNames={cssTransitionGroupClassNames}
  />

client/app/bundles/comments/reducers/railsContextReducer.js

@@ -1,5 +1,5 @@
 export const initialState = {};
 
-export default function railsContextReducer(state = initialState, action = null) {
+export default function railsContextReducer(state = initialState) {
  return state;
 }