Very basic search test based on query param

platform/viewer/src/routes/DataSourceWrapper.jsx

@@ -4,6 +4,7 @@ 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,6 +16,9 @@ import { appConfig, extensionManager } from '../App.js';
  */
 function DataSourceWrapper(props) {
   const { children: LayoutTemplate, ...rest } = props;
+  const query = useQuery();
+  const queryFilterValues = _getQueryFilterValues(query);
+
   // TODO: Fetch by type, name, etc?
   const dataSourceModules = extensionManager.modules[MODULE_TYPES.DATA_SOURCE];
   // TODO: Good usecase for flatmap?
@@ -44,16 +48,28 @@ function DataSourceWrapper(props) {
   // studies.processResults --> <LayoutTemplate studies={} />
   // But only for LayoutTemplate type of 'list'?
   // Or no data fetching here, and just hand down my source
-
-  debugger;
   const [data, setData] = useState();
   useEffect(() => {
+
+    // 204: no content
     async function getData() {
-      const searchResult = await dataSource.query.studies.search();
+      const searchResult = await dataSource.query.studies.search({
+        patientName: queryFilterValues.patientName,
+      });
       setData(searchResult);
     }
-    getData();
-  }, [dataSource.query.studies]);
+
+    try {
+      getData();
+    } catch (ex) {
+      console.warn(ex);
+
+    }
+    console.log('DataSourceWrapper: useEffect');
+  }, []);
+  // queryFilterValues
+
+  console.log(rest);
 
   return (
     <React.Fragment>
@@ -68,3 +84,62 @@ DataSourceWrapper.propTypes = {
 };
 
 export default DataSourceWrapper;
+
+/**
+ * Duplicated in `studyListContainer`
+ * Need generic that can be shared? Isn't this what qs is for?
+ * @param {*} query
+ */
+function _getQueryFilterValues(query) {
+  const queryFilterValues = {
+    patientName: query.get('patientName'),
+    // mrn: query.get('mrn'), patientId?
+    studyDate: _tryParseDates(query.get('studyDate'), undefined),
+    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),
+  };
+
+  // Delete null/undefined keys
+  Object.keys(queryFilterValues).forEach(
+    key => queryFilterValues[key] == null && delete queryFilterValues[key]
+  );
+
+  return queryFilterValues;
+
+  function _tryParseInt(str, defaultValue) {
+    var retValue = defaultValue;
+    if (str !== null) {
+      if (str.length > 0) {
+        if (!isNaN(str)) {
+          retValue = parseInt(str);
+        }
+      }
+    }
+    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;
+  }
+}