round trip query string parameters for startDate and endDate; drop JSON stringify

platform/viewer/src/routes/DataSourceWrapper.jsx

@@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
 import { MODULE_TYPES } from '@ohif/core';
 //
 import { appConfig, extensionManager } from '../App.js';
-import { useQuery } from './../hooks';
 
 /**
  * Uses route properties to determine the data source that should be passed
@@ -15,9 +14,8 @@ import { useQuery } from './../hooks';
  * @param {function} props.children - Layout Template React Component
  */
 function DataSourceWrapper(props) {
-  const { children: LayoutTemplate, ...rest } = props;
-  const query = useQuery();
-  const queryFilterValues = _getQueryFilterValues(query);
+  const { children: LayoutTemplate, history, ...rest } = props;
+  const queryFilterValues = _getQueryFilterValues(history.location.search);
 
   // TODO: Fetch by type, name, etc?
   const dataSourceModules = extensionManager.modules[MODULE_TYPES.DATA_SOURCE];
@@ -53,10 +51,10 @@ function DataSourceWrapper(props) {
 
     // 204: no content
     async function getData() {
-      const searchResult = await dataSource.query.studies.search({
-        patientName: queryFilterValues.patientName,
-      });
-      setData(searchResult);
+      const searchResults = await dataSource.query.studies.search(
+        queryFilterValues
+      );
+      setData(searchResults);
     }
 
     try {
@@ -66,14 +64,13 @@ function DataSourceWrapper(props) {
 
     }
     console.log('DataSourceWrapper: useEffect');
-  }, [rest.history.location.search]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [history.location.search]);
   // queryFilterValues
 
-  console.log(rest);
-
   return (
     <React.Fragment>
-      {data && <LayoutTemplate {...rest} data={data} />}
+      {data && <LayoutTemplate {...rest} history={history} data={data} />}
     </React.Fragment>
   );
 }
@@ -91,12 +88,17 @@ export default DataSourceWrapper;
  * @param {*} query
  */
 function _getQueryFilterValues(query) {
+  query = new URLSearchParams(query);
+
   const queryFilterValues = {
     patientName: query.get('patientName'),
     // mrn: query.get('mrn'), patientId?
-    studyDate: _tryParseDates(query.get('studyDate'), undefined),
+    studyDate: {
+      startDate: query.get('startDate'),
+      endDate: query.get('endDate'),
+    },
     studyDescription: query.get('description'),
-    modalitiesInStudy: _tryParseJson(query.get('modality'), undefined),
+    //modalitiesInStudy: _tryParseJson(query.get('modality'), undefined),
     accessionNumber: query.get('accession'),
     sortBy: query.get('soryBy'),
     sortDirection: query.get('sortDirection'),
@@ -104,6 +106,10 @@ function _getQueryFilterValues(query) {
     resultsPerPage: _tryParseInt(query.get('resultsPerPage'), undefined),
   };
 
+  // patientName: good
+  // studyDescription: good
+  // accessionNumber: good
+
   // Delete null/undefined keys
   Object.keys(queryFilterValues).forEach(
     key => queryFilterValues[key] == null && delete queryFilterValues[key]
@@ -122,24 +128,4 @@ function _getQueryFilterValues(query) {
     }
     return retValue;
   }
-
-  function _tryParseJson(str, defaultValue) {
-    return str ? JSON.parse(str) : defaultValue;
-  }
-
-  function _tryParseDates(str, defaultValue) {
-    const studyDateObject = _tryParseJson(str, defaultValue);
-
-    if (studyDateObject) {
-      studyDateObject.startDate = studyDateObject.startDate
-        ? moment(new Date(studyDateObject.startDate))
-        : undefined;
-
-      studyDateObject.endDate = studyDateObject.endDate
-        ? moment(new Date(studyDateObject.endDate))
-        : undefined;
-    }
-
-    return studyDateObject;
-  }
 }

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

@@ -53,16 +53,21 @@ function StudyListContainer({ history, data: studies }) {
       const defaultValue = defaultFilterValues[key];
       const currValue = debouncedFilterValues[key];
 
-      if (
-        typeof currValue === 'object' &&
-        currValue !== null &&
-        JSON.stringify(currValue) !== JSON.stringify(defaultValue)
-      ) {
-        queryString[key] = JSON.stringify(currValue);
+      // TODO: nesting/recursion?
+      // TODO: modalities array
+      if (key === 'studyDate') {
+        console.log(currValue)
+        if (defaultValue.startDate !== currValue.startDate) {
+          queryString.startDate = currValue.startDate;
+        }
+        if (defaultValue.endDate !== currValue.endDate) {
+          queryString.endDate = currValue.endDate;
+        }
       } else if (currValue !== defaultValue) {
         queryString[key] = currValue;
       }
     });
+
     history.push({
       pathname: '/',
       search: `?${qs.stringify(queryString, {
@@ -372,8 +377,8 @@ const defaultFilterValues = {
   patientName: '',
   mrn: '',
   studyDate: {
-    startDate: null,
-    endDate: null,
+    startDate: undefined,
+    endDate: undefined,
   },
   description: '',
   modality: [],
@@ -388,9 +393,12 @@ function _getQueryFilterValues(query) {
   const queryFilterValues = {
     patientName: query.get('patientName'),
     mrn: query.get('mrn'),
-    studyDate: _tryParseDates(query.get('studyDate'), undefined),
+    studyDate: {
+      startDate: query.get('startDate'),
+      endDate: query.get('endDate'),
+    },
     description: query.get('description'),
-    modality: _tryParseJson(query.get('modality'), undefined),
+    // modality: _tryParseJson(query.get('modality'), undefined),
     accession: query.get('accession'),
     sortBy: query.get('soryBy'),
     sortDirection: query.get('sortDirection'),
@@ -416,26 +424,6 @@ function _getQueryFilterValues(query) {
     }
     return retValue;
   }
-
-  function _tryParseJson(str, defaultValue) {
-    return str ? JSON.parse(str) : defaultValue;
-  }
-
-  function _tryParseDates(str, defaultValue) {
-    const studyDateObject = _tryParseJson(str, defaultValue);
-
-    if (studyDateObject) {
-      studyDateObject.startDate = studyDateObject.startDate
-        ? moment(new Date(studyDateObject.startDate))
-        : undefined;
-
-      studyDateObject.endDate = studyDateObject.endDate
-        ? moment(new Date(studyDateObject.endDate))
-        : undefined;
-    }
-
-    return studyDateObject;
-  }
 }
 
 export default StudyListContainer;