square / eslint-plugin-square

An ESLint plugin containing custom JavaScript, Ember, React, TypeScript rules and configurations tailored to Square's needs.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[react] Extend eslint-plugin-react-hooks and eslint-plugin-jsx-a11y

atdrago opened this issue · comments

The Square React ESLint configs should be aware of the Rules of Hooks and common accessibility rules when building React apps. Common issues with React hooks are missing dependencies in hooks, and conditionally calling hooks. Common accessibility issues in React are missing alt attributes on images, and missing labels on input fields.

We can use two ESLint plugins to help with these:

This change can be made to the base react config here: https://github.com/square/eslint-plugin-square/blob/master/lib/config/react.js#L6

I'm happy to make a PR for this change if others feel these rules are useful.

These are two of the most popular ESLint plugins, so I think it's a good idea to consider them for the react config. Will wait for some feedback from our other React devs, but PR is welcome.