[Docs] Add recommended or deprecated notices to rule docs

bmish · bmish · commit 569ead7cea79 · 2022-08-19T15:56:29.000-04:00
diff --git a/docs/rules/display-name.md b/docs/rules/display-name.md
@@ -1,5 +1,7 @@
 # Disallow missing displayName in a React component definition (react/display-name)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 DisplayName allows you to name your component. This name is used by React in debugging messages.
 
 ## Rule Details
diff --git a/docs/rules/jsx-key.md b/docs/rules/jsx-key.md
@@ -1,5 +1,7 @@
 # Disallow missing `key` props in iterators/collection literals (react/jsx-key)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Warn if an element that likely requires a `key` prop--namely, one present in an
 array literal or an arrow function expression.
 
diff --git a/docs/rules/jsx-no-comment-textnodes.md b/docs/rules/jsx-no-comment-textnodes.md
@@ -1,5 +1,7 @@
 # Disallow comments from being inserted as text nodes (react/jsx-no-comment-textnodes)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 This rule prevents comment strings (e.g. beginning with `//` or `/*`) from being accidentally
 injected as a text node in JSX statements.
 
diff --git a/docs/rules/jsx-no-duplicate-props.md b/docs/rules/jsx-no-duplicate-props.md
@@ -1,5 +1,7 @@
 # Disallow duplicate properties in JSX (react/jsx-no-duplicate-props)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Creating JSX elements with duplicate props can cause unexpected behavior in your application.
 
 ## Rule Details
diff --git a/docs/rules/jsx-no-target-blank.md b/docs/rules/jsx-no-target-blank.md
@@ -1,5 +1,7 @@
 # Disallow `target="_blank"` attribute without `rel="noreferrer"` (react/jsx-no-target-blank)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
 
 When creating a JSX element that has an `a` tag, it is often desired to have the link open in a new tab using the `target='_blank'` attribute. Using this attribute unaccompanied by `rel='noreferrer'`, however, is a severe security vulnerability (see [noreferrer docs](https://html.spec.whatwg.org/multipage/links.html#link-type-noreferrer) and [noopener docs](https://html.spec.whatwg.org/multipage/links.html#link-type-noopener) for more details)
diff --git a/docs/rules/jsx-no-undef.md b/docs/rules/jsx-no-undef.md
@@ -1,5 +1,7 @@
 # Disallow undeclared variables in JSX (react/jsx-no-undef)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 This rule helps locate potential ReferenceErrors resulting from misspellings or missing components.
 
 ## Rule Details
diff --git a/docs/rules/jsx-space-before-closing.md b/docs/rules/jsx-space-before-closing.md
@@ -1,8 +1,10 @@
 # Enforce spacing before closing bracket in JSX (react/jsx-space-before-closing)
 
+❌ This rule is deprecated.
+
 🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
 
-**Deprecation notice**: This rule is deprecated. Please use the `"beforeSelfClosing"` option of the [jsx-tag-spacing](https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-tag-spacing.md) rule instead.
+Please use the `"beforeSelfClosing"` option of the [jsx-tag-spacing](https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-tag-spacing.md) rule instead of this rule.
 
 Enforce or forbid spaces before the closing bracket of self-closing JSX elements.
 
diff --git a/docs/rules/jsx-uses-react.md b/docs/rules/jsx-uses-react.md
@@ -1,5 +1,7 @@
 # Disallow React to be incorrectly marked as unused (react/jsx-uses-react)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 JSX expands to a call to `React.createElement`, a file which includes `React`
 but only uses JSX should consider the `React` variable as used.
 
diff --git a/docs/rules/jsx-uses-vars.md b/docs/rules/jsx-uses-vars.md
@@ -1,5 +1,7 @@
 # Disallow variables used in JSX to be incorrectly marked as unused (react/jsx-uses-vars)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Since 0.17.0 the `eslint` `no-unused-vars` rule does not detect variables used in JSX ([see details](https://eslint.org/blog/2015/03/eslint-0.17.0-released#changes-to-jsxreact-handling)). This rule will find variables used in JSX and mark them as used.
 
 This rule only has an effect when the `no-unused-vars` rule is enabled.
diff --git a/docs/rules/no-children-prop.md b/docs/rules/no-children-prop.md
@@ -1,5 +1,7 @@
 # Disallow passing of children as props (react/no-children-prop)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Children should always be actual children, not passed in as a prop.
 
 When using JSX, the children should be nested between the opening and closing
diff --git a/docs/rules/no-danger-with-children.md b/docs/rules/no-danger-with-children.md
@@ -1,5 +1,7 @@
 # Disallow when a DOM element is using both children and dangerouslySetInnerHTML (react/no-danger-with-children)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 This rule helps prevent problems caused by using children and the dangerouslySetInnerHTML prop at the same time.
 React will throw a warning if this rule is ignored.
 
diff --git a/docs/rules/no-deprecated.md b/docs/rules/no-deprecated.md
@@ -1,5 +1,7 @@
 # Disallow usage of deprecated methods (react/no-deprecated)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Several methods are deprecated between React versions. This rule will warn you if you try to use a deprecated method. Use the [shared settings](/README.md#configuration) to specify the React version.
 
 ## Rule Details
diff --git a/docs/rules/no-direct-mutation-state.md b/docs/rules/no-direct-mutation-state.md
@@ -1,5 +1,7 @@
 # Disallow direct mutation of this.state (react/no-direct-mutation-state)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 NEVER mutate `this.state` directly, as calling `setState()` afterwards may replace
 the mutation you made. Treat `this.state` as if it were immutable.
 
diff --git a/docs/rules/no-find-dom-node.md b/docs/rules/no-find-dom-node.md
@@ -1,5 +1,7 @@
 # Disallow usage of findDOMNode (react/no-find-dom-node)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Facebook will eventually deprecate `findDOMNode` as it blocks certain improvements in React in the future.
 
 It is recommended to use callback refs instead. See [Dan Abramov comments and examples](https://github.com/jsx-eslint/eslint-plugin-react/issues/678#issue-165177220).
diff --git a/docs/rules/no-is-mounted.md b/docs/rules/no-is-mounted.md
@@ -1,5 +1,7 @@
 # Disallow usage of isMounted (react/no-is-mounted)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 [`isMounted` is an anti-pattern][anti-pattern], is not available when using ES6 classes, and it is on its way to being officially deprecated.
 
 [anti-pattern]: https://facebook.github.io/react/blog/2015/12/16/ismounted-antipattern.html
diff --git a/docs/rules/no-render-return-value.md b/docs/rules/no-render-return-value.md
@@ -1,5 +1,7 @@
 # Disallow usage of the return value of ReactDOM.render (react/no-render-return-value)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 > `ReactDOM.render()` currently returns a reference to the root `ReactComponent` instance. However, using this return value is legacy and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root `ReactComponent` instance, the preferred solution is to attach a [callback ref](https://reactjs.org/docs/refs-and-the-dom.html#callback-refs) to the root element.
 
 Source: [ReactDOM documentation](https://facebook.github.io/react/docs/react-dom.html#render)
diff --git a/docs/rules/no-string-refs.md b/docs/rules/no-string-refs.md
@@ -1,5 +1,7 @@
 # Disallow using string references (react/no-string-refs)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Currently, two ways are supported by React to refer to components. The first way, providing a string identifier, is now considered legacy in the official documentation. The documentation now prefers a second method -- referring to components by setting a property on the `this` object in the reference callback.
 
 ## Rule Details
diff --git a/docs/rules/no-unescaped-entities.md b/docs/rules/no-unescaped-entities.md
@@ -1,5 +1,7 @@
 # Disallow unescaped HTML entities from appearing in markup (react/no-unescaped-entities)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 This rule prevents characters that you may have meant as JSX escape characters
 from being accidentally injected as a text node in JSX statements.
 
diff --git a/docs/rules/no-unknown-property.md b/docs/rules/no-unknown-property.md
@@ -1,5 +1,7 @@
 # Disallow usage of unknown DOM property (react/no-unknown-property)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
 
 In JSX all DOM properties and attributes should be camelCased to be consistent with standard JavaScript style. This can be a possible source of error if you are used to writing plain HTML.
diff --git a/docs/rules/prop-types.md b/docs/rules/prop-types.md
@@ -1,5 +1,7 @@
 # Disallow missing props validation in a React component definition (react/prop-types)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 Defining types for component props improves reusability of your components by
 validating received data. It can warn other developers if they make a mistake while reusing the component with improper data type.
 
diff --git a/docs/rules/react-in-jsx-scope.md b/docs/rules/react-in-jsx-scope.md
@@ -1,5 +1,7 @@
 # Disallow missing React when using JSX (react/react-in-jsx-scope)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.
 
 If you are using the @jsx pragma this rule will check the designated variable and not the `React` one.
diff --git a/docs/rules/require-render-return.md b/docs/rules/require-render-return.md
@@ -1,5 +1,7 @@
 # Enforce ES5 or ES6 class for returning value in render function (react/require-render-return)
 
+✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.
+
 When writing the `render` method in a component it is easy to forget to return the JSX content. This rule will warn if the `return` statement is missing.
 
 ## Rule Details
diff --git a/tests/index.js b/tests/index.js
@@ -24,8 +24,10 @@ describe('all rule files should be exported by the plugin', () => {
 
 describe('rule documentation files have the correct content', () => {
   const MESSAGES = {
+    deprecated: '❌ This rule is deprecated.',
     fixable: '🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.',
     hasSuggestions: '💡 This rule provides editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).',
+    recommended: '✔️ This rule is part of the [recommended](https://github.com/jsx-eslint/eslint-plugin-react#recommended) config.',
   };
 
   ruleFiles.forEach((ruleName) => {
@@ -42,6 +44,16 @@ describe('rule documentation files have the correct content', () => {
       // Decide which notices should be shown at the top of the doc.
       const expectedNotices = [];
       const unexpectedNotices = [];
+      if (rule.meta.docs.recommended) {
+        expectedNotices.push('recommended');
+      } else {
+        unexpectedNotices.push('recommended');
+      }
+      if (rule.meta.deprecated) {
+        expectedNotices.push('deprecated');
+      } else {
+        unexpectedNotices.push('deprecated');
+      }
       if (rule.meta.fixable) {
         expectedNotices.push('fixable');
       } else {
