Skip to content

Commit

Permalink
Add sort-default-props and deprecate jsx-sort-default-props
Browse files Browse the repository at this point in the history
Pt. 1 of #1834
  • Loading branch information
alexzherdev committed Jul 3, 2018
1 parent f27285f commit 8d775a6
Show file tree
Hide file tree
Showing 7 changed files with 975 additions and 0 deletions.
1 change: 1 addition & 0 deletions README.md
Expand Up @@ -130,6 +130,7 @@ Enable the rules that you would like to use.
* [react/require-render-return](docs/rules/require-render-return.md): Enforce ES5 or ES6 class for returning value in render function
* [react/self-closing-comp](docs/rules/self-closing-comp.md): Prevent extra closing tags for components without children (fixable)
* [react/sort-comp](docs/rules/sort-comp.md): Enforce component methods order (fixable)
* [react/sort-default-props](docs/rules/sort-default-props.md): Enforce default props alphabetical sorting
* [react/sort-prop-types](docs/rules/sort-prop-types.md): Enforce propTypes declarations alphabetical sorting
* [react/style-prop-object](docs/rules/style-prop-object.md): Enforce style prop value being an object
* [react/void-dom-elements-no-children](docs/rules/void-dom-elements-no-children.md): Prevent void DOM elements (e.g. `<img />`, `<br />`) from receiving children
Expand Down
2 changes: 2 additions & 0 deletions docs/rules/jsx-sort-default-props.md
@@ -1,5 +1,7 @@
# Enforce defaultProps declarations alphabetical sorting (react/jsx-sort-default-props)

**Deprecation notice**: This rule is deprecated. It has been renamed to [sort-default-props](https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/sort-default-props.md).

Some developers prefer to sort `defaultProps` declarations alphabetically to be able to find necessary declarations easier at a later time. Others feel that it adds complexity and becomes a burden to maintain.

## Rule Details
Expand Down
185 changes: 185 additions & 0 deletions docs/rules/sort-default-props.md
@@ -0,0 +1,185 @@
# Enforce defaultProps declarations alphabetical sorting (react/sort-default-props)

Some developers prefer to sort `defaultProps` declarations alphabetically to be able to find necessary declarations easier at a later time. Others feel that it adds complexity and becomes a burden to maintain.

## Rule Details

This rule checks all components and verifies that all `defaultProps` declarations are sorted alphabetically. A spread attribute resets the verification. The default configuration of the rule is case-sensitive.

The following patterns are considered warnings:

```jsx
var Component = createReactClass({
...
getDefaultProps: function() {
return {
z: "z",
a: "a",
b: "b"
};
},
...
});

class Component extends React.Component {
...
}
Component.defaultProps = {
z: "z",
a: "a",
b: "b"
};

class Component extends React.Component {
static defaultProps = {
z: "z",
y: "y",
a: "a"
}
render() {
return <div />;
}
}

const Component = (props) => (...);
Component.defaultProps = {
z: "z",
y: "y",
a: "a"
};

const defaults = {
b: "b"
};
const types = {
a: PropTypes.string,
b: PropTypes.string,
c: PropTypes.string'
};
function StatelessComponentWithSpreadInPropTypes({ a, b, c }) {
return <div>{a}{b}{c}</div>;
}
StatelessComponentWithSpreadInPropTypes.propTypes = types;
StatelessComponentWithSpreadInPropTypes.defaultProps = {
c: "c",
a: "a",
...defaults,
};
export default class ClassWithSpreadInPropTypes extends BaseClass {
static propTypes = {
a: PropTypes.string,
b: PropTypes.string,
c: PropTypes.string,
d: PropTypes.string,
e: PropTypes.string,
f: PropTypes.string
}
static defaultProps = {
b: "b",
a: "a",
...c.defaultProps,
f: "f",
e: "e",
...d.defaultProps
}
}
```
The following patterns are considered okay and do **not** cause warnings:
```jsx
var Component = createReactClass({
...
getDefaultProps: function() {
return {
a: "a",
b: "b",
c: "c"
};
},
...
});
class Component extends React.Component {
...
}
Component.defaultProps = {
a: "a",
b: "b",
c: "c"
};
class Component extends React.Component {
static defaultProps = {
a: PropTypes.any,
b: PropTypes.any,
c: PropTypes.any
}
render() {
return <div />;
}
}
const Component = (props) => (...);
Component.defaultProps = {
a: "a",
y: "y",
z: "z"
};
const defaults = {
b: "b"
};
const types = {
a: PropTypes.string,
b: PropTypes.string,
c: PropTypes.string'
};
function StatelessComponentWithSpreadInPropTypes({ a, b, c }) {
return <div>{a}{b}{c}</div>;
}
StatelessComponentWithSpreadInPropTypes.propTypes = types;
StatelessComponentWithSpreadInPropTypes.defaultProps = {
a: "a",
c: "c",
...defaults,
};

export default class ClassWithSpreadInPropTypes extends BaseClass {
static propTypes = {
a: PropTypes.string,
b: PropTypes.string,
c: PropTypes.string,
d: PropTypes.string,
e: PropTypes.string,
f: PropTypes.string
}
static defaultProps = {
a: "a",
b: "b",
...c.defaultProps,
e: "e",
f: "f",
...d.defaultProps
}
}
```

## Rule Options

```js
...
"react/sort-default-props": [<enabled>, {
"ignoreCase": <boolean>,
}]
...
```

### `ignoreCase`

When `true` the rule ignores the case-sensitivity of the declarations order.

## When not to use

This rule is a formatting preference and not following it won't negatively affect the quality of your code. If alphabetizing `defaultProps` declarations isn't a part of your coding standards, then you can leave this rule off.
1 change: 1 addition & 0 deletions index.js
Expand Up @@ -77,6 +77,7 @@ const allRules = {
'require-render-return': require('./lib/rules/require-render-return'),
'self-closing-comp': require('./lib/rules/self-closing-comp'),
'sort-comp': require('./lib/rules/sort-comp'),
'sort-default-props': require('./lib/rules/sort-default-props'),
'sort-prop-types': require('./lib/rules/sort-prop-types'),
'style-prop-object': require('./lib/rules/style-prop-object'),
'void-dom-elements-no-children': require('./lib/rules/void-dom-elements-no-children')
Expand Down
15 changes: 15 additions & 0 deletions lib/rules/jsx-sort-default-props.js
@@ -1,17 +1,22 @@
/**
* @fileoverview Enforce default props alphabetical sorting
* @author Vladimir Kattsov
* @deprecated
*/
'use strict';

const variableUtil = require('../util/variable');
const log = require('../util/log');

let isWarnedForDeprecation = false;

// ------------------------------------------------------------------------------
// Rule Definition
// ------------------------------------------------------------------------------

module.exports = {
meta: {
deprecated: true,
docs: {
description: 'Enforce default props alphabetical sorting',
category: 'Stylistic Issues',
Expand Down Expand Up @@ -160,6 +165,16 @@ module.exports = {
}

checkNode(node.parent.right);
},

Program: function() {
if (isWarnedForDeprecation) {
return;
}

log('The react/jsx-sort-default-props rule is deprecated. ' +
'It has been renamed to react/sort-default-props.');
isWarnedForDeprecation = true;
}
};
}
Expand Down

0 comments on commit 8d775a6

Please sign in to comment.