☂️ eslint-plugin-react

[camc314]

[!WARNING] This comment is maintained by CI. Do not edit this comment directly. To update comment template, see https://github.com/oxc-project/oxc/tree/main/tasks/lint_rules

This is tracking issue for eslint-plugin-react, eslint-plugin-react-hooks.

There are 103(+ 2 deprecated) rules.

• 6/23 recommended rules are remaining as TODO
• 67/80 not recommended rules are remaining as TODO

To get started, run the following command:

just new-react-rule <RULE_NAME>

Then register the rule in crates/oxc_linter/src/rules.rs and also declare_all_lint_rules at the bottom.

Recommended rules

✨: 17, 🚫: 0 / total: 23

Status	Name	Docs
	react/display-name	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/display-name.md
✨	react/jsx-key	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-key.md
✨	react/jsx-no-comment-textnodes	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-comment-textnodes.md
✨	react/jsx-no-duplicate-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-duplicate-props.md
✨	react/jsx-no-target-blank	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-target-blank.md
✨	react/jsx-no-undef	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-undef.md
	react/jsx-uses-react	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-uses-react.md
	react/jsx-uses-vars	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-uses-vars.md
✨	react/no-children-prop	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-children-prop.md
✨	react/no-danger-with-children	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-danger-with-children.md
	react/no-deprecated	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-deprecated.md
✨	react/no-direct-mutation-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-direct-mutation-state.md
✨	react/no-find-dom-node	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-find-dom-node.md
✨	react/no-is-mounted	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-is-mounted.md
✨	react/no-string-refs	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-string-refs.md
✨	react/no-render-return-value	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-render-return-value.md
✨	react/no-unescaped-entities	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unescaped-entities.md
✨	react/no-unknown-property	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unknown-property.md
	react/prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/prop-types.md
✨	react/react-in-jsx-scope	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/react-in-jsx-scope.md
✨	react/require-render-return	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/require-render-return.md
✨	react/rules-of-hooks	https://reactjs.org/docs/hooks-rules.html
	react/exhaustive-deps	https://github.com/facebook/react/issues/14920

✨ = Implemented, 🚫 = No need to implement

Not recommended rules

✨: 13, 🚫: 0 / total: 80

Status	Name	Docs
	react/boolean-prop-naming	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/boolean-prop-naming.md
✨	react/button-has-type	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/button-has-type.md
✨	react/checked-requires-onchange-or-readonly	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/checked-requires-onchange-or-readonly.md
	react/default-props-match-prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/default-props-match-prop-types.md
	react/destructuring-assignment	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/destructuring-assignment.md
	react/forbid-component-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forbid-component-props.md
	react/forbid-dom-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forbid-dom-props.md
	react/forbid-elements	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forbid-elements.md
	react/forbid-foreign-prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forbid-foreign-prop-types.md
	react/forbid-prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forbid-prop-types.md
	react/forward-ref-uses-ref	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/forward-ref-uses-ref.md
	react/function-component-definition	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/function-component-definition.md
	react/hook-use-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/hook-use-state.md
✨	react/iframe-missing-sandbox	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/iframe-missing-sandbox.md
✨	react/jsx-boolean-value	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-boolean-value.md
	react/jsx-child-element-spacing	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-child-element-spacing.md
	react/jsx-closing-bracket-location	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-closing-bracket-location.md
	react/jsx-closing-tag-location	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-closing-tag-location.md
	react/jsx-curly-spacing	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-curly-spacing.md
	react/jsx-curly-newline	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-curly-newline.md
	react/jsx-equals-spacing	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-equals-spacing.md
	react/jsx-filename-extension	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-filename-extension.md
	react/jsx-first-prop-new-line	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-first-prop-new-line.md
	react/jsx-handler-names	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-handler-names.md
	react/jsx-indent	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-indent.md
	react/jsx-indent-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-indent-props.md
	react/jsx-max-depth	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-max-depth.md
	react/jsx-max-props-per-line	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-max-props-per-line.md
	react/jsx-newline	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-newline.md
	react/jsx-no-bind	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-bind.md
	react/jsx-no-constructed-context-values	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-constructed-context-values.md
	react/jsx-no-leaked-render	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-leaked-render.md
	react/jsx-no-literals	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-literals.md
	react/jsx-no-script-url	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-script-url.md
✨	react/jsx-no-useless-fragment	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-useless-fragment.md
	react/jsx-one-expression-per-line	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-one-expression-per-line.md
✨	react/jsx-curly-brace-presence	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-curly-brace-presence.md
	react/jsx-pascal-case	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-pascal-case.md
	react/jsx-fragments	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-fragments.md
	react/jsx-props-no-multi-spaces	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-props-no-multi-spaces.md
	react/jsx-props-no-spreading	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-props-no-spreading.md
✨	react/jsx-props-no-spread-multi	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-props-no-spread-multi.md
	react/jsx-sort-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-sort-props.md
	react/jsx-tag-spacing	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-tag-spacing.md
	react/jsx-wrap-multilines	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-wrap-multilines.md
	react/no-invalid-html-attribute	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-invalid-html-attribute.md
	react/no-access-state-in-setstate	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-access-state-in-setstate.md
	react/no-adjacent-inline-elements	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-adjacent-inline-elements.md
	react/no-array-index-key	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-array-index-key.md
	react/no-arrow-function-lifecycle	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-arrow-function-lifecycle.md
✨	react/no-danger	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-danger.md
	react/no-did-mount-set-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-did-mount-set-state.md
	react/no-did-update-set-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-did-update-set-state.md
	react/no-multi-comp	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-multi-comp.md
	react/no-namespace	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-namespace.md
✨	react/no-set-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-set-state.md
	react/no-redundant-should-component-update	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-redundant-should-component-update.md
	react/no-this-in-sfc	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-this-in-sfc.md
	react/no-typos	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-typos.md
	react/no-unsafe	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unsafe.md
	react/no-unstable-nested-components	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unstable-nested-components.md
	react/no-unused-class-component-methods	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unused-class-component-methods.md
	react/no-unused-prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unused-prop-types.md
	react/no-unused-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-unused-state.md
	react/no-object-type-as-default-prop	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-object-type-as-default-prop.md
	react/no-will-update-set-state	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/no-will-update-set-state.md
✨	react/prefer-es6-class	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/prefer-es6-class.md
	react/prefer-exact-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/prefer-exact-props.md
	react/prefer-read-only-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/prefer-read-only-props.md
	react/prefer-stateless-function	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/prefer-stateless-function.md
	react/require-default-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/require-default-props.md
	react/require-optimization	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/require-optimization.md
✨	react/self-closing-comp	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/self-closing-comp.md
	react/sort-comp	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/sort-comp.md
	react/sort-default-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/sort-default-props.md
	react/sort-prop-types	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/sort-prop-types.md
	react/state-in-constructor	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/state-in-constructor.md
	react/static-property-placement	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/static-property-placement.md
✨	react/style-prop-object	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/style-prop-object.md
✨	react/void-dom-elements-no-children	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/void-dom-elements-no-children.md

✨ = Implemented, 🚫 = No need to implement

Deprecated rules

✨: 0, 🚫: 0 / total: 2

Status	Name	Docs
	react/jsx-sort-default-props	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-sort-default-props.md
	react/jsx-space-before-closing	https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-space-before-closing.md

✨ = Implemented, 🚫 = No need to implement

[XantreDev]

Pls, update checkboxes :)

[IWANABETHATGUY]

Pls, update checkboxes :)

Done

[XantreDev]

jsx-no-undef done too

[XantreDev]

Are the way of getting react version from some plugin? I think it's necessary for no-deprecated

https://github.com/jsx-eslint/eslint-plugin-react/blob/ca162fdc5dc37f9f3447640a5a14a91daf73ea47/lib/util/version.js#L74C1-L100C2

const defaultVersion = '999.999.999';

function getReactVersionFromContext(context) {
  let confVer = defaultVersion;
  // .eslintrc shared settings (https://eslint.org/docs/user-guide/configuring#adding-shared-settings)
  if (context.settings && context.settings.react && context.settings.react.version) {
    let settingsVersion = context.settings.react.version;
    if (settingsVersion === 'detect') {
      settingsVersion = detectReactVersion(context);
    }
    if (typeof settingsVersion !== 'string') {
      error('Warning: React version specified in eslint-plugin-react-settings must be a string; '
        + `got “${typeof settingsVersion}”`);
    }
    confVer = String(settingsVersion);
  } else if (!warnedForMissingVersion) {
    error('Warning: React version not specified in eslint-plugin-react settings. '
      + 'See https://github.com/jsx-eslint/eslint-plugin-react#configuration .');
    warnedForMissingVersion = true;
  }
  confVer = /^[0-9]+\.[0-9]+$/.test(confVer) ? `${confVer}.0` : confVer;
  const result = semver.coerce(confVer.split('.').map((part) => Number(part)).join('.'));
  if (!result) {
    error(`Warning: React version specified in eslint-plugin-react-settings must be a valid semver version, or "detect"; got “${confVer}”`);
  }
  return result ? result.version : defaultVersion;
}

[keita-hino]

I'm going to begin tackling the react/void-dom-elements-no-children.

[keita-hino]

I will start working on the task of react/checked-requires-onchange-or-readonly.

[keita-hino]

I will start working on the react/jsx-props-no-spread-multi task.