[DCJ-691] Add filter for primary data use (#2687)

DataBiosphere · Oct 15, 2024 · 8919802 · 8919802
1 parent 3e685cb
commit 8919802
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 19 deletions.
diff --git a/src/components/data_search/DatasetFilterList.jsx b/src/components/data_search/DatasetFilterList.jsx
@@ -8,13 +8,13 @@ import ListItemText from '@mui/material/ListItemText';
 import Divider from '@mui/material/Divider';
 import { Typography } from '@mui/material';
 import { Checkbox } from '@mui/material';
+import { flatten, uniq, compact, capitalize } from 'lodash';
 
 export const DatasetFilterList = (props) => {
-  const { datasets, filters, filterHandler, searchRef } = props;
+  const { datasets, filters, filterHandler, isFiltered, searchRef } = props;
 
-  const accessManagementFilters = ['Controlled', 'Open', 'External'];
-
-  const isFiltered = (filter) => filters.indexOf(filter) > -1;
+  const accessManagementFilters = uniq(compact(datasets.map((dataset) => dataset.accessManagement)));
+  const dataUseFilters = uniq(compact(flatten(datasets.map((dataset) => dataset.dataUse?.primary))).map((dataUse) => dataUse.code));
 
   return (
     <Box sx={{ bgcolor: 'background.paper' }}>
@@ -27,13 +27,35 @@ export const DatasetFilterList = (props) => {
       </Typography>
       <List sx={{ margin: '-0.5em -0.5em'}}>
         {
-          accessManagementFilters.map((filterName) => {
-            const filter = filterName.toLowerCase();
+          accessManagementFilters.map((filter) => {
+            const filterName = capitalize(filter);
+            const category = 'accessManagement';
+            return (
+              <ListItem disablePadding key={filter}>
+                <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, category, filter, searchRef.current.value)}>
+                  <ListItemIcon>
+                    <Checkbox checked={isFiltered(filter, category)} />
+                  </ListItemIcon>
+                  <ListItemText primary={filterName} sx={{ fontFamily: 'Montserrat', transform: 'scale(1.2)' }} />
+                </ListItemButton>
+              </ListItem>
+            );
+          })
+        }
+      </List>
+      <Typography variant="h6" gutterBottom component="div" sx={{ fontFamily: 'Montserrat', fontWeight: '600' }} marginTop="1em">
+        Primary Data Use
+      </Typography>
+      <List sx={{ margin: '-0.5em -0.5em'}}>
+        {
+          dataUseFilters.map((filter) => {
+            const filterName = filter.toUpperCase();
+            const category = 'dataUse';
             return (
               <ListItem disablePadding key={filter}>
-                <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, filter, searchRef.current.value)}>
+                <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, category, filter, searchRef.current.value)}>
                   <ListItemIcon>
-                    <Checkbox checked={isFiltered(filter)} />
+                    <Checkbox checked={isFiltered(filter, category)} />
                   </ListItemIcon>
                   <ListItemText primary={filterName} sx={{ fontFamily: 'Montserrat', transform: 'scale(1.2)' }} />
                 </ListItemButton>

diff --git a/src/components/data_search/DatasetSearchTable.jsx b/src/components/data_search/DatasetSearchTable.jsx
@@ -41,9 +41,14 @@ const datasetTableHeader = [
   'Export to Terra',
 ];
 
+const defaultFilters = {
+  accessManagement: [],
+  dataUse: [],
+}
+
 export const DatasetSearchTable = (props) => {
   const { datasets, history, icon, title } = props;
-  const [filters, setFilters] = useState([]);
+  const [filters, setFilters] = useState(defaultFilters);
   const [filtered, setFiltered] = useState([]);
   const [tableData, setTableData] = useState({});
   const [selected, setSelected] = useState([]);
@@ -52,7 +57,9 @@ export const DatasetSearchTable = (props) => {
   const [showTranslatedDULModal, setShowTranslatedDULModal] = useState(false);
   const [dataUse, setDataUse] = useState();
   const searchRef = useRef('');
-  const isFiltered = (filter) => filters.indexOf(filter) > -1;
+
+  const isFiltered = (filter, category) => (filters[category]).indexOf(filter) > -1;
+  const numSelectedFilters = (filters) => Object.values(filters).reduce((sum, array) => sum + array.length, 0);
 
   const assembleFullQuery = (searchTerm, filters) => {
     const queryChunks = [
@@ -96,17 +103,25 @@ export const DatasetSearchTable = (props) => {
     }
 
     var filterQuery = {};
-    if (filters.length > 0) {
+    if (numSelectedFilters(filters) > 0) {
       const shouldTerms = [];
 
-      filters.forEach(term => {
+      filters.accessManagement.forEach(term => {
         shouldTerms.push({
           'term': {
             'accessManagement': term
           }
         });
       });
 
+      filters.dataUse.forEach(term => {
+        shouldTerms.push({
+          'match': {
+            'dataUse.primary.code': term
+          }
+        });
+      });
+
       if (shouldTerms.length > 0) {
         filterQuery = [
           {
@@ -119,7 +134,7 @@ export const DatasetSearchTable = (props) => {
     }
 
     // do not add filter subquery if no filters are applied
-    if (filters.length > 0) {
+    if (numSelectedFilters(filters) > 0) {
       return {
         'from': 0,
         'size': 10000,
@@ -143,12 +158,12 @@ export const DatasetSearchTable = (props) => {
     }
   };
 
-  const filterHandler = (event, data, filter, searchTerm) => {
-    var newFilters = [];
-    if (!isFiltered(filter) && filter !== '') {
-      newFilters = filters.concat(filter);
+  const filterHandler = (event, data, category, filter, searchTerm) => {
+    var newFilters = defaultFilters;
+    if (!isFiltered(filter, category) && filter !== '') {
+      newFilters[category] = filters[category].concat(filter);
     } else {
-      newFilters = filters.filter((f) => f !== filter);
+      newFilters[category] = filters[category].filter((f) => f !== filter);
     }
     setFilters(newFilters);
 
@@ -419,7 +434,7 @@ export const DatasetSearchTable = (props) => {
         </Box>
         <Box sx={{display: 'flex', flexDirection: 'row', paddingTop: '2em'}}>
           <Box sx={{width: '14%', padding: '0 1em'}}>
-            <DatasetFilterList datasets={datasets} filters={filters} filterHandler={filterHandler} searchRef={searchRef}/>
+            <DatasetFilterList datasets={datasets} filters={filters} filterHandler={filterHandler} isFiltered={isFiltered} searchRef={searchRef}/>
           </Box>
           <Box sx={{width: '85%', padding: '0 1em'}}>
             {(() => {