[eslint-plugin-react-hooks] useWithoutEffectSuffix fix (#18902) (#18907)

* [eslint-plugin-react-hooks] reproduce bug with a test and fix it (#18902)

Since we only reserve `-Effect` suffix, react-hooks/exhaustive-deps is
expected to succeed without warning on a custom hook which contains -Effect- in
the middle of it's name (but does NOT contain it as a suffix).

* [eslint-plugin-react-hooks] reproduced bug with a test and fix it

Since we only reserve `-Effect` suffix, react-hooks/exhaustive-deps is expected
to succeed without warning on a render helper which contains -use- in the middle
of it's name (but does NOT contain it as a prefix, since that would violate hook
naming convetion).

Co-authored-by: Boris Sergeyev <boris.sergeyev@quolab.com>

Author: surgeboris

packages/eslint-plugin-react-hooks/__tests__/ESLintRuleExhaustiveDeps-test.js

@@ -405,6 +405,24 @@ const tests = {
         }
       `,
     },
+    {
+      code: normalizeIndent`
+        function MyComponent(props) {
+          useWithoutEffectSuffix(() => {
+            console.log(props.foo);
+          }, []);
+        }
+      `,
+    },
+    {
+      code: normalizeIndent`
+        function MyComponent(props) {
+          return renderHelperConfusedWithEffect(() => {
+            console.log(props.foo);
+          }, []);
+        }
+      `,
+    },
     {
       // Valid because we don't care about hooks outside of components.
       code: normalizeIndent`

packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js

@@ -1510,7 +1510,7 @@ function getReactiveHookCallbackIndex(calleeNode, options) {
       // useImperativeHandle(ref, fn)
       return 1;
     default:
-      if (node === calleeNode && node.name.match(/use.+Effect/)) {
+      if (node === calleeNode && node.name.match(/^use.+Effect$/)) {
         return 0;
       } else if (node === calleeNode && options && options.additionalHooks) {
         // Allow the user to provide a regular expression which enables the lint to