SCRUM-3644: Reorder logic for filters

alliance-genome · Jan 29, 2024 · c5a4159 · c5a4159
1 parent a4ca7d7
commit c5a4159
Showing 1 changed file with 26 additions and 23 deletions.
diff --git a/src/components/dataTable/DataTable.js b/src/components/dataTable/DataTable.js
@@ -21,10 +21,10 @@ import NoData from '../noData';
 import ColumnHeader from './columnHeader';
 import DropdownTextFilter from './dropdownTextFilter';
 import DropdownCheckboxFilter from './DropdownCheckboxFilter';
+import DropdownNoDataFilter from './DropdownNoDataFilter';
 import HorizontalScroll from '../horizontalScroll';
 import { buildTableQueryString } from '../../lib/utils';
 import LoadingSpinner from '../loadingSpinner';
-import DropdownNoDataFilter from './DropdownNoDataFilter';
 
 const DataTable = ({
   className,
@@ -96,7 +96,7 @@ const DataTable = ({
   }
 
   // the initial fetch is happening, show spinner, don't render the table yet
-  if (isLoading || isFetching) {
+  if (isLoading) {
     return <LoadingSpinner />;
   }
 
@@ -137,33 +137,36 @@ const DataTable = ({
 
     if (column.filterable) {
       column.filter = customFilter();
-
-      const distinctFieldValues = Array.isArray(column.filterable) ?
-        column.filterable :
-        getDistinctFieldValue(resolvedData, `filter.${filterField}`);
-
-      if (distinctFieldValues && distinctFieldValues.length > 0) {
-        column.filterRenderer = (onFilter, column) => (
-          <DropdownCheckboxFilter
-            formatter={column.filterFormatter}
-            onChange={onFilter}
-            options={distinctFieldValues}
-            value={columnFilter}
-          />
-        );
-        //if filter is a checkbox dropdown, but there is are no distinctFieldValues then show DropdownNoDataFilter instead
-      } else if(column.filterType === "checkbox") {
-        column.filterRenderer = () => (
-          <DropdownNoDataFilter />
-        );
-      } else{
+
+       // Text filters set column.filterable to true all over 
+      if (typeof column.filterable == "boolean") { 
         column.filterRenderer = (onFilter, column) => (
           <DropdownTextFilter
             column={column}
             defaultFilter={columnFilter}
             onFilter={onFilter}
           />
         );
+      } 
+      // Checkbox filters set column.filterable to an array of options
+      else { 
+        const distinctFieldValues = Array.isArray(column.filterable) ?
+          column.filterable :
+          getDistinctFieldValue(resolvedData, `filter.${filterField}`);
+
+        if (distinctFieldValues && distinctFieldValues.length === 0) {
+          column.filterRenderer = (onFilter, column) => <DropdownNoDataFilter/> ;
+        }  
+        else {
+          column.filterRenderer = (onFilter, column) => (
+            <DropdownCheckboxFilter
+              formatter={column.filterFormatter}
+              onChange={onFilter}
+              options={distinctFieldValues}
+              value={columnFilter}
+            />
+          );
+        }      
       }
     }
   });
@@ -251,4 +254,4 @@ DataTable.propTypes = {
   totalRows: PropTypes.number,
 };
 
-export default DataTable;
+export default DataTable;