full circle ModalitiesInStudy filtering

platform/ui/src/components/InputMultiSelect/InputMultiSelect.jsx

@@ -61,24 +61,15 @@ InputMultiSelect.propTypes = {
   onLabelClick: PropTypes.func.isRequired,
   onChange: PropTypes.func.isRequired,
   placeholder: PropTypes.string,
+  /** Array of options to list as options */
   options: PropTypes.arrayOf(
     PropTypes.shape({
       value: PropTypes.string,
       label: PropTypes.string,
     })
   ),
-  value: PropTypes.oneOfType([
-    PropTypes.arrayOf(
-      PropTypes.shape({
-        value: PropTypes.string,
-        label: PropTypes.string,
-      })
-    ),
-    PropTypes.shape({
-      value: PropTypes.string,
-      label: PropTypes.string,
-    }),
-  ]),
+  /** Array of string values that exist in our list of options */
+  value: PropTypes.arrayOf(PropTypes.string),
 };
 
 export default InputMultiSelect;

platform/ui/src/components/StudyListFilter/StudyListFilter.jsx

@@ -104,13 +104,18 @@ const StudyListFilter = ({
 StudyListFilter.propTypes = {
   filtersMeta: PropTypes.arrayOf(
     PropTypes.shape({
+      /** Identifier used to map a field to it's value in `filterValues` */
       name: PropTypes.string.isRequired,
+      /** Friendly label for filter field */
       displayName: PropTypes.string.isRequired,
+      /** One of the supported filter field input types */
       inputType: PropTypes.oneOf(['Text', 'MultiSelect', 'DateRange', 'None'])
         .isRequired,
       isSortable: PropTypes.bool.isRequired,
+      /** Size of filter field in a 12-grid system */
       gridCol: PropTypes.oneOf([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12])
         .isRequired,
+      /** Options for a "MultiSelect" inputType */
       option: PropTypes.arrayOf(
         PropTypes.shape({
           value: PropTypes.string,

platform/viewer/src/routes/DataSourceWrapper.jsx

@@ -91,17 +91,22 @@ function _getQueryFilterValues(query) {
   query = new URLSearchParams(query);
 
   const queryFilterValues = {
+    // DCM
     patientName: query.get('patientName'),
     // mrn: query.get('mrn'), patientId?
+    studyDescription: query.get('description'),
+    modalitiesInStudy: query.get('modalities')
+      ? query.get('modalities').split(',')
+      : [],
+    accessionNumber: query.get('accession'),
+    //
     startDate: query.get('startDate'),
     endDate: query.get('endDate'),
-    studyDescription: query.get('description'),
-    //modalitiesInStudy: _tryParseJson(query.get('modality'), undefined),
-    accessionNumber: query.get('accession'),
-    sortBy: query.get('soryBy'),
-    sortDirection: query.get('sortDirection'),
     page: _tryParseInt(query.get('page'), undefined),
     resultsPerPage: _tryParseInt(query.get('resultsPerPage'), undefined),
+    // Rarely supported server-side
+    sortBy: query.get('sortBy'),
+    sortDirection: query.get('sortDirection'),
   };
 
   // patientName: good

platform/viewer/src/routes/StudyListContainer/StudyListContainer.jsx

@@ -54,7 +54,6 @@ function StudyListContainer({ history, data: studies }) {
       const currValue = debouncedFilterValues[key];
 
       // TODO: nesting/recursion?
-      // TODO: modalities array
       if (key === 'studyDate') {
         if (
           currValue.startDate &&
@@ -65,6 +64,8 @@ function StudyListContainer({ history, data: studies }) {
         if (currValue.endDate && defaultValue.endDate !== currValue.endDate) {
           queryString.endDate = currValue.endDate;
         }
+      } else if (key === 'modalities' && currValue.length) {
+        queryString.modalities = currValue.join(',');
       } else if (currValue !== defaultValue) {
         queryString[key] = currValue;
       }
@@ -110,7 +111,7 @@ function StudyListContainer({ history, data: studies }) {
       gridCol: 4,
     },
     {
-      name: 'modality',
+      name: 'modalities',
       displayName: 'Modality',
       inputType: 'MultiSelect',
       inputProps: {
@@ -383,7 +384,7 @@ const defaultFilterValues = {
     endDate: undefined,
   },
   description: '',
-  modality: [],
+  modalities: [],
   accession: '',
   sortBy: '',
   sortDirection: 'none',
@@ -400,7 +401,9 @@ function _getQueryFilterValues(query) {
       endDate: query.get('endDate'),
     },
     description: query.get('description'),
-    // modality: _tryParseJson(query.get('modality'), undefined),
+    modalities: query.get('modalities')
+      ? query.get('modalities').split(',')
+      : [],
     accession: query.get('accession'),
     sortBy: query.get('soryBy'),
     sortDirection: query.get('sortDirection'),