remove duplicate code and add comment to wrapper component (#3076)

* remove duplicate code and add comment to wrapper component:

* use react hooks recommended settings

.eslintrc.js

@@ -176,6 +176,7 @@ module.exports = {
     "eslint:recommended",
     "plugin:jsdoc/recommended",
     "plugin:prettier/recommended",
+    "plugin:react-hooks/recommended",
   ],
   parserOptions: {
     ecmaVersion: 2018,
@@ -237,7 +238,5 @@ module.exports = {
     "sort-imports": "off",
     "use-isnan": "error",
     "valid-typeof": "off",
-    "react-hooks/rules-of-hooks": "warn",
-    "react-hooks/exhaustive-deps": "warn",
   },
 };

src/core/client/stream/tabs/Comments/Stream/AllCommentsTab/SpinnerWhileRendering/SpinnerWhileRendering.tsx

@@ -44,10 +44,6 @@ const SpinnerWhileRendering: FunctionComponent<Props> = (props) => {
     // Ensure window has bee
     return callWhenReallyIdle(() => setHidden(false));
   }, [setHidden]);
-  // In our tests, we don't actually "render", so just skip this.
-  if (process.env.NODE_ENV === "test") {
-    return <>{props.children}</>;
-  }
   return (
     <>
       {hidden && (

src/core/client/stream/tabs/Comments/Stream/AllCommentsTab/SpinnerWhileRendering/SpinnerWhileRenderingWrapper.tsx

@@ -7,6 +7,7 @@ interface Props {
 }
 
 const SpinnerWhileRenderingWrapper: FunctionComponent<Props> = (props) => {
+  // In our tests, we don't actually "render", so just skip this.
   if (process.env.NODE_ENV === "test") {
     return <>{props.children}</>;
   }