Merge pull request #5297 from mabashian/eslint-plugin-react-hooks

Adds eslint-plugin-react-hooks as a dev dep Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
ansible · Nov 11, 2019 · b0cb3ca · b0cb3ca
2 parents 84b5fb8 + 68a6315
commit b0cb3ca
Show file tree

Hide file tree

Showing 8 changed files with 18 additions and 6 deletions.
diff --git a/awx/ui_next/.eslintrc b/awx/ui_next/.eslintrc
@@ -8,6 +8,9 @@
       "modules": true
     }
   },
+  "plugins": [
+    "react-hooks"
+  ],
   "extends": ["airbnb", "prettier", "prettier/react"],
   "settings": {
     "import/resolver": {
@@ -56,6 +59,8 @@
     "react/prop-types": "off",
     "react/sort-comp": ["error", {}],
     "jsx-a11y/label-has-for": "off",
-    "jsx-a11y/label-has-associated-control": "off"
+    "jsx-a11y/label-has-associated-control": "off",
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn"
   }
 }
diff --git a/awx/ui_next/package-lock.json b/awx/ui_next/package-lock.json
diff --git a/awx/ui_next/package.json b/awx/ui_next/package.json
@@ -43,6 +43,7 @@
     "eslint-plugin-import": "^2.14.0",
     "eslint-plugin-jsx-a11y": "^6.1.1",
     "eslint-plugin-react": "^7.11.1",
+    "eslint-plugin-react-hooks": "^2.2.0",
     "file-loader": "^2.0.0",
     "history": "^4.9.0",
     "jest": "^24.7.1",

diff --git a/awx/ui_next/src/components/CollapsibleSection/ExpandingContainer.jsx b/awx/ui_next/src/components/CollapsibleSection/ExpandingContainer.jsx
@@ -19,7 +19,7 @@ function ExpandingContainer({ isExpanded, children }) {
   });
   useEffect(() => {
     setContentHeight(ref.current.scrollHeight);
-  });
+  }, [setContentHeight]);
   const height = isExpanded ? contentHeight : '0';
   return (
     <Container

diff --git a/awx/ui_next/src/screens/Job/JobOutput/HostEventModal.jsx b/awx/ui_next/src/screens/Job/JobOutput/HostEventModal.jsx
@@ -120,7 +120,7 @@ function HostEventModal({ onClose, hostEvent = {}, isOpen = false, i18n }) {
 
   useEffect(() => {
     setHostStatus(processEventStatus(hostEvent));
-  }, []);
+  }, [setHostStatus, hostEvent]);
 
   const handleTabClick = (event, tabIndex) => {
     setActiveTabKey(tabIndex);

diff --git a/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx b/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx
@@ -108,7 +108,7 @@ function ProjectForm({ project, ...props }) {
     }
 
     fetchData();
-  }, []);
+  }, [summary_fields.credential]);
 
   const scmFormFields = {
     scm_url: '',

diff --git a/awx/ui_next/src/screens/Template/shared/LabelSelect.jsx b/awx/ui_next/src/screens/Template/shared/LabelSelect.jsx
@@ -33,7 +33,7 @@ function LabelSelect({ value, onChange, onError }) {
   const [options, setOptions] = useState([]);
   useEffect(() => {
     loadLabelOptions(setOptions, onError);
-  }, []);
+  }, [onError]);
 
   return (
     <MultiSelect

diff --git a/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx b/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx
@@ -39,7 +39,7 @@ function PlaybookSelect({
         onError(contentError);
       }
     })();
-  }, [projectId]);
+  }, [projectId, i18n, onError]);
 
   return (
     <AnsibleSelect