From abc2a18bfe968c4dc155941918472c22fed85d8b Mon Sep 17 00:00:00 2001
From: Nicholas Lee <niconal902@gmail.com>
Date: Fri, 10 Nov 2023 17:41:26 -0500
Subject: [PATCH] feat: added initial dropdown to select reference dataset

---
 .../SelectAnalysesMultiGroupComponent.tsx     | 39 ++++++++++++++++++-
 1 file changed, 37 insertions(+), 2 deletions(-)

diff --git a/compose/neurosynth-frontend/src/components/Dialogs/CreateMetaAnalysisSpecificationDialog/CreateMetaAnalysisSpecificationSelectionStep/SelectAnalysesComponent/SelectAnalysesMultiGroupComponent.tsx b/compose/neurosynth-frontend/src/components/Dialogs/CreateMetaAnalysisSpecificationDialog/CreateMetaAnalysisSpecificationSelectionStep/SelectAnalysesComponent/SelectAnalysesMultiGroupComponent.tsx
index 450c3883b..392678e67 100644
--- a/compose/neurosynth-frontend/src/components/Dialogs/CreateMetaAnalysisSpecificationDialog/CreateMetaAnalysisSpecificationSelectionStep/SelectAnalysesComponent/SelectAnalysesMultiGroupComponent.tsx
+++ b/compose/neurosynth-frontend/src/components/Dialogs/CreateMetaAnalysisSpecificationDialog/CreateMetaAnalysisSpecificationSelectionStep/SelectAnalysesComponent/SelectAnalysesMultiGroupComponent.tsx
@@ -1,16 +1,51 @@
-import { Box, Typography } from '@mui/material';
+import { Box, ListItem, ListItemText, Typography } from '@mui/material';
 import { IAlgorithmSelection } from '../../CreateMetaAnalysisSpecificationDialogBase.types';
+import NeurosynthAutocomplete from 'components/NeurosynthAutocomplete/NeurosynthAutocomplete';
+import NeurosynthTableStyles from 'components/Tables/NeurosynthTable/NeurosynthTable.styles';
+import { EPropertyType } from 'components/EditMetadata';
 
 const SelectAnalysesMultiGroupComponent: React.FC<{ algorithm: IAlgorithmSelection }> = (props) => {
     return (
         <Box sx={{ margin: '2rem 0' }}>
-            <Typography>
+            <Typography sx={{ marginBottom: '1rem' }}>
                 You selected <b>{props.algorithm?.estimator?.label || ''}</b> in the previous step,
                 which is an estimator that requires a second dataset to use as a comparison. Select
                 a dataset using the dropdown below. You can either select our default reference
                 datasets (i.e. neurostore, neuroquery, etc) or choose another value from the
                 inclusion column you set above to use as your own dataset.
             </Typography>
+            <Box
+                sx={{
+                    padding: '2rem 0 2rem 3rem',
+                    borderLeft: '6px solid',
+                    borderColor: 'secondary.main',
+                }}
+            >
+                <NeurosynthAutocomplete
+                    label="Select value to filter on"
+                    shouldDisable={false}
+                    isOptionEqualToValue={(option, value) => option === value}
+                    value={undefined}
+                    size="medium"
+                    inputPropsSx={{
+                        color: NeurosynthTableStyles[EPropertyType.NONE],
+                    }}
+                    required={false}
+                    renderOption={(params, option) => (
+                        <ListItem {...params} key={option}>
+                            <ListItemText
+                                sx={{
+                                    color: NeurosynthTableStyles[EPropertyType.STRING],
+                                }}
+                                primary={option || ''}
+                            />
+                        </ListItem>
+                    )}
+                    getOptionLabel={(option) => `${option}`}
+                    onChange={(_event, newVal, _reason) => {}}
+                    options={[]}
+                />
+            </Box>
         </Box>
     );
 };