From ba54e721842f048839b086c9487699bbb28fa184 Mon Sep 17 00:00:00 2001
From: Florian Boulnois <fboulnoi@broadinstitute.org>
Date: Thu, 7 Nov 2024 16:37:42 -0500
Subject: [PATCH 1/3] feat: filter by data access committee

---
 .../data_search/DatasetFilterList.jsx         | 24 ++++++++++++++++++-
 .../data_search/DatasetSearchTable.jsx        | 12 ++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/components/data_search/DatasetFilterList.jsx b/src/components/data_search/DatasetFilterList.jsx
index f9f9392b8..d64d23643 100644
--- a/src/components/data_search/DatasetFilterList.jsx
+++ b/src/components/data_search/DatasetFilterList.jsx
@@ -8,13 +8,14 @@ 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';
+import { flatten, uniq, compact, capitalize, orderBy } from 'lodash';
 
 export const DatasetFilterList = (props) => {
   const { datasets, filters, filterHandler, isFiltered } = props;
 
   const accessManagementFilters = uniq(compact(datasets.map((dataset) => dataset.accessManagement)));
   const dataUseFilters = uniq(compact(flatten(datasets.map((dataset) => dataset.dataUse?.primary))).map((dataUse) => dataUse.code));
+  const dacFilters = orderBy(uniq(compact(datasets.map((dataset) => dataset?.dac?.dacName))), (dac) => dac.toLowerCase(), 'asc');
 
   return (
     <Box sx={{ bgcolor: 'background.paper' }}>
@@ -64,6 +65,27 @@ export const DatasetFilterList = (props) => {
           })
         }
       </List>
+      <Typography variant="h6" gutterBottom component="div" sx={{ fontFamily: 'Montserrat' }} marginTop="1em">
+        <span style={{ fontWeight: '600' }}>Data Access Committee</span> <span>(DACs)</span>
+      </Typography>
+      <List sx={{ margin: '-0.5em -0.5em'}}>
+        {
+          dacFilters.map((filter) => {
+            const filterName = filter;
+            const category = 'dac';
+            return (
+              <ListItem disablePadding key={filter}>
+                <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, category, filter)}>
+                  <ListItemIcon>
+                    <Checkbox checked={isFiltered(filter, category)} />
+                  </ListItemIcon>
+                  <ListItemText primary={filterName} sx={{ fontFamily: 'Montserrat', transform: 'scale(1.2)' }} />
+                </ListItemButton>
+              </ListItem>
+            );
+          })
+        }
+      </List>
     </Box>
   );
 };
diff --git a/src/components/data_search/DatasetSearchTable.jsx b/src/components/data_search/DatasetSearchTable.jsx
index 0cccff174..a67f29e57 100644
--- a/src/components/data_search/DatasetSearchTable.jsx
+++ b/src/components/data_search/DatasetSearchTable.jsx
@@ -35,6 +35,7 @@ const styles = {
 const defaultFilters = {
   accessManagement: [],
   dataUse: [],
+  dac: [],
   search: []
 };
 
@@ -131,6 +132,17 @@ export const DatasetSearchTable = (props) => {
         }
       });
 
+      filterTerms.push({
+        'bool': {
+          'should':
+              filters.dac.map(term => ({
+                'match_phrase': {
+                  'dac.dacName': term
+                }
+              }))
+            }
+      });
+
       if (filterTerms.length > 0) {
         filterQuery = [
           {

From d80ea5f12983989632fcdb6bc79de97401ee74d1 Mon Sep 17 00:00:00 2001
From: Florian Boulnois <fboulnoi@broadinstitute.org>
Date: Fri, 8 Nov 2024 10:08:38 -0500
Subject: [PATCH 2/3] fix: dataset is not null

---
 src/components/data_search/DatasetFilterList.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/data_search/DatasetFilterList.jsx b/src/components/data_search/DatasetFilterList.jsx
index d64d23643..7f9712f68 100644
--- a/src/components/data_search/DatasetFilterList.jsx
+++ b/src/components/data_search/DatasetFilterList.jsx
@@ -15,7 +15,7 @@ export const DatasetFilterList = (props) => {
 
   const accessManagementFilters = uniq(compact(datasets.map((dataset) => dataset.accessManagement)));
   const dataUseFilters = uniq(compact(flatten(datasets.map((dataset) => dataset.dataUse?.primary))).map((dataUse) => dataUse.code));
-  const dacFilters = orderBy(uniq(compact(datasets.map((dataset) => dataset?.dac?.dacName))), (dac) => dac.toLowerCase(), 'asc');
+  const dacFilters = orderBy(uniq(compact(datasets.map((dataset) => dataset.dac?.dacName))), (dac) => dac.toLowerCase(), 'asc');
 
   return (
     <Box sx={{ bgcolor: 'background.paper' }}>

From b5fe58f8108f50723c06e524de4807c801ec8140 Mon Sep 17 00:00:00 2001
From: Florian Boulnois <fboulnoi@broadinstitute.org>
Date: Fri, 8 Nov 2024 11:09:14 -0500
Subject: [PATCH 3/3] refactor: convert filter item header and list into
 components

---
 .../data_search/DatasetFilterList.jsx         | 124 +++++++++---------
 1 file changed, 61 insertions(+), 63 deletions(-)

diff --git a/src/components/data_search/DatasetFilterList.jsx b/src/components/data_search/DatasetFilterList.jsx
index 7f9712f68..530776bb6 100644
--- a/src/components/data_search/DatasetFilterList.jsx
+++ b/src/components/data_search/DatasetFilterList.jsx
@@ -10,6 +10,38 @@ import { Typography } from '@mui/material';
 import { Checkbox } from '@mui/material';
 import { flatten, uniq, compact, capitalize, orderBy } from 'lodash';
 
+export const FilterItemHeader = (props) => {
+  const { title, headerStyle = { fontFamily: 'Montserrat', fontWeight: '600', marginTop: '1em' } } = props;
+  return (
+    <Typography variant="h6" gutterBottom component="div" sx={headerStyle}>
+      {title}
+    </Typography>
+  );
+}
+
+export const FilterItemList = (props) => {
+  const { category, datasets, filter, filterHandler, isFiltered, filterNameFn } = props;
+  return (
+    <List sx={{ margin: '-0.5em -0.5em' }}>
+      {
+        filter.map((filter) => {
+          const filterName = filterNameFn(filter);
+          return (
+            <ListItem disablePadding key={filter}>
+              <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, category, filter)}>
+                <ListItemIcon>
+                  <Checkbox checked={isFiltered(filter, category)} />
+                </ListItemIcon>
+                <ListItemText primary={filterName} sx={{ fontFamily: 'Montserrat', transform: 'scale(1.2)' }} />
+              </ListItemButton>
+            </ListItem>
+          );
+        })
+      }
+    </List>
+  );
+};
+
 export const DatasetFilterList = (props) => {
   const { datasets, filters, filterHandler, isFiltered } = props;
 
@@ -23,69 +55,35 @@ export const DatasetFilterList = (props) => {
         Filters
       </Typography>
       <Divider />
-      <Typography variant="h6" gutterBottom component="div" sx={{ fontFamily: 'Montserrat', fontWeight: '600' }} marginTop="1em">
-        Access Type
-      </Typography>
-      <List sx={{ margin: '-0.5em -0.5em'}}>
-        {
-          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)}>
-                  <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, category, filter)}>
-                  <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' }} marginTop="1em">
-        <span style={{ fontWeight: '600' }}>Data Access Committee</span> <span>(DACs)</span>
-      </Typography>
-      <List sx={{ margin: '-0.5em -0.5em'}}>
-        {
-          dacFilters.map((filter) => {
-            const filterName = filter;
-            const category = 'dac';
-            return (
-              <ListItem disablePadding key={filter}>
-                <ListItemButton sx={{ padding: '0' }} onClick={(event) => filterHandler(event, datasets, category, filter)}>
-                  <ListItemIcon>
-                    <Checkbox checked={isFiltered(filter, category)} />
-                  </ListItemIcon>
-                  <ListItemText primary={filterName} sx={{ fontFamily: 'Montserrat', transform: 'scale(1.2)' }} />
-                </ListItemButton>
-              </ListItem>
-            );
-          })
-        }
-      </List>
+      <FilterItemHeader title="Access Type" />
+      <FilterItemList
+        category="accessManagement"
+        datasets={datasets}
+        filter={accessManagementFilters}
+        filterHandler={filterHandler}
+        isFiltered={isFiltered}
+        filterNameFn={capitalize} />
+      <FilterItemHeader title="Data Use" />
+      <FilterItemList
+        category="dataUse"
+        datasets={datasets}
+        filter={dataUseFilters}
+        filterHandler={filterHandler}
+        isFiltered={isFiltered}
+        filterNameFn={(filter) => filter.toUpperCase()}
+      />
+      <FilterItemHeader
+        title={<><span style={{ fontWeight: '600' }}>Data Access Committee</span> <span>(DACs)</span></>}
+        headerStyle={{ fontFamily: 'Montserrat', marginTop: '1em' }}
+      />
+      <FilterItemList
+        category="dac"
+        datasets={datasets}
+        filter={dacFilters}
+        filterHandler={filterHandler}
+        isFiltered={isFiltered}
+        filterNameFn={(filter) => filter}
+      />
     </Box>
   );
 };