Eliminate duplicate fetches, functional component listens to props

includes patternfly/patternfly-react#2639
AllenBW · Aug 6, 2019 · 903063a · 903063a
1 parent 2c2fdfd
commit 903063a
Show file tree

Hide file tree

Showing 3 changed files with 121 additions and 74 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,9 +11,9 @@
   "dependencies": {
     "@babel/runtime": "7.5.5",
     "@patternfly/react-charts": "4.7.1",
-    "@patternfly/react-core": "3.75.2",
+    "@patternfly/react-core": "3.82.2",
     "@patternfly/react-icons": "3.10.14",
-    "@patternfly/react-table": "2.14.23",
+    "@patternfly/react-table": "2.16.6",
     "@patternfly/react-tokens": "2.6.13",
     "@redhat-cloud-services/frontend-components": "0.0.9",
     "@redhat-cloud-services/frontend-components-inventory-insights": "0.1.10",
@@ -68,7 +68,7 @@
     "babel-plugin-lodash": "3.3.4",
     "enzyme": "3.10.0",
     "enzyme-adapter-react-16": "1.14.0",
-    "enzyme-to-json": "3.3.5",
+    "enzyme-to-json": "3.4.0",
     "eslint": "6.1.0",
     "eslint-config-prettier": "6.0.0",
     "eslint-plugin-react": "7.14.3",
@@ -82,8 +82,8 @@
     "seamless-immutable": "7.1.4",
     "stylelint": "10.1.0",
     "stylelint-config-recommended-scss": "3.3.0",
-    "stylelint-scss": "3.9.2",
-    "webpack": "4.39.0",
+    "stylelint-scss": "3.9.3",
+    "webpack": "4.39.1",
     "webpack-bundle-analyzer": "3.4.1",
     "webpack-cli": "3.3.6",
     "webpack-dev-server": "3.7.2"

diff --git a/src/PresentationalComponents/RulesTable/RulesTable.js b/src/PresentationalComponents/RulesTable/RulesTable.js
@@ -52,19 +52,10 @@ const RulesTable = (props) => {
             5: 'playbook_count'
         };
         const orderParam = `${direction === 'asc' ? '' : '-'}${attrIndex[index]}`;
-
         setSortBy({ index, direction });
         setSort(orderParam);
         setOffset(0);
-
-        fetchRules({
-            ...filters,
-            offset: 0,
-            limit,
-            impacting,
-            sort: orderParam
-        });
-    }, [fetchRules, filters, impacting, limit]);
+    }, [setSort, setSortBy, setOffset]);
 
     const onSetPage = (_event, pageNumber) => {
         const newOffset = pageNumber * limit - limit;
@@ -73,19 +64,12 @@ const RulesTable = (props) => {
 
     const onPerPageSelect = (_event, limit) => {
         setLimit(limit);
-        fetchRules({ ...filters, offset, limit, impacting, sort });
     };
 
     const toggleRulesWithHits = (impacting) => {
         setFilters({ ...filters, impacting });
         setImpacting(impacting);
         setOffset(0);
-        fetchRules({
-            ...filters,
-            offset: 0,
-            limit,
-            impacting
-        });
     };
 
     const handleOnCollapse = (event, rowId, isOpen) => {
@@ -137,13 +121,11 @@ const RulesTable = (props) => {
             }];
     };
 
-    const fetchAction = useCallback((filters) => {
+    const fetchAction = useCallback(() => {
         setOffset(0);
-        fetchRules({ ...filters, limit, offset: 0, impacting, sort });
-    }, [fetchRules, impacting, limit, sort]);
+    }, []);
 
     useEffect(() => {
-        setOffset(0);
         fetchRules({
             ...filters,
             offset,
@@ -157,7 +139,7 @@ const RulesTable = (props) => {
         if (!rows.length) {
             onSort(null, 2, 'desc');
         }
-    }, [onSort, rows]);
+    }, [onSort, rows.length]);
 
     useEffect(() => {
         if (rules.data) {
@@ -170,7 +152,7 @@ const RulesTable = (props) => {
                                     ${ filters.reports_shown ? 'enabled rules.' : 'any known rules.'}`}>
                                 {filters.reports_shown && <Button variant="link" style={{ paddingTop: 24 }} onClick={() => {
                                     setFilters({ ...filters, reports_shown: undefined });
-                                    fetchAction({ ...filters, reports_shown: undefined });
+                                    fetchAction();
                                 }}>
                                     Include disabled rules
                                 </Button>}