feat: add configurable selector hook (#97)

Author: gtjamesa

docs/rules/useSelector-prefer-selectors.md

@@ -50,10 +50,24 @@ If provided, validates the name of the selector functions against the RegExp pat
 ```js
     // .eslintrc
     {
-        "react-redux/mapStateToProps-prefer-selectors": ["error", { matching: "^get.*FromState$"}]
+        "react-redux/useSelector-prefer-selectors": ["error", { matching: "^get.*FromState$"}]
     }
 
     // container.js
     const propertyA = useSelector(getAFromState) // success
     const propertyB = useSelector(getB) // failure
 ```
+
+### `hook`
+
+Sets the name of the `useSelector` function to target. The value can also be an array of strings. Defaults to `['useSelector', 'useAppSelector']`.
+
+```js
+    // .eslintrc
+{
+    "react-redux/useSelector-prefer-selectors": ["error", { hook: 'useAppSelector' }]
+}
+
+// container.js
+const property = useAppSelector(state => state.mydata) // failure
+```

lib/rules/useSelector-prefer-selectors.js

@@ -1,26 +1,33 @@
-function isUseSelector(node) {
-  return node.callee.name === 'useSelector';
+function isUseSelector(node, hookNames) {
+  return hookNames.includes(node.callee.name);
 }
 
 function reportWrongName(context, node, functionName, matching) {
   context.report({
-    message: `useSelector selector "${functionName}" does not match "${matching}".`,
+    message: `${node.callee.name} selector "${functionName}" does not match "${matching}".`,
     node,
   });
 }
 
 function reportNoSelector(context, node) {
   context.report({
-    message: 'useSelector should use a named selector function.',
+    message: `${node.callee.name} should use a named selector function.`,
     node,
   });
 }
 
 module.exports = function (context) {
   const config = context.options[0] || {};
+  let hookNames = ['useSelector', 'useAppSelector'];
+
+  // Ensure hookNames is an array
+  if (config.hook) {
+    hookNames = Array.isArray(config.hook) ? config.hook : [config.hook];
+  }
+
   return {
     CallExpression(node) {
-      if (!isUseSelector(node)) return;
+      if (!isUseSelector(node, hookNames)) return;
       const selector = node.arguments && node.arguments[0];
       if (selector && (
         selector.type === 'ArrowFunctionExpression' ||

tests/lib/rules/useSelector-prefer-selectors.js

@@ -31,6 +31,13 @@ ruleTester.run('useSelector-prefer-selectors', rule, {
         matching: '^selector$',
       }],
     },
+    {
+      code: 'const property = useAppSelector(selector)',
+      options: [{
+        matching: '^selector$',
+        hook: 'useAppSelector',
+      }],
+    },
   ],
   invalid: [{
     code: 'const property = useSelector((state) => state.x)',
@@ -68,5 +75,14 @@ ruleTester.run('useSelector-prefer-selectors', rule, {
     errors: [{
       message: 'useSelector selector "selectorr" does not match "^selector$".',
     }],
+  }, {
+    code: 'const property = useAppSelector(selectorr)',
+    options: [{
+      matching: '^selector$',
+      hook: ['useSelector', 'useAppSelector'],
+    }],
+    errors: [{
+      message: 'useAppSelector selector "selectorr" does not match "^selector$".',
+    }],
   }],
 });