Make thumbnails display

extensions/cornerstone/babel.config.js

@@ -1 +1 @@
-module.exports = require("../../babel.config.js");
+module.exports = require('../../babel.config.js');

extensions/cornerstone/src/utils/setCornerstoneLayout.js

@@ -17,6 +17,6 @@ const setCornerstoneLayout = () => {
   const action = setLayout(layout);
 
   window.store.dispatch(action);
-}
+};
 
 export default setCornerstoneLayout;

extensions/default/src/DicomWebDataSource/index.js

@@ -125,8 +125,8 @@ function createDicomWebApi(dicomWebConfig) {
         },
       },
     },
-    getImageIdsForDisplaySet(displaySetInstanceUID) {
+    getImageIdsForDisplaySet(displaySetInstanceUID, DisplaySetService) {
-      const displaySet = displaySetManager.getDisplaySetByUID(
+      const displaySet = DisplaySetService.getDisplaySetByUID(
         displaySetInstanceUID
       );
 

extensions/default/src/Panels/PanelStudyBrowser.jsx

@@ -1,10 +1,10 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { StudyBrowser } from '@ohif/ui';
-import { dicomMetadataStore, useViewModel } from '@ohif/core';
+import { dicomMetadataStore } from '@ohif/core';
 //
 
-function PanelStudyBrowser({ getImageSrc, getStudiesByPatientId, dataSource }) {
+function PanelStudyBrowser({ servicesManager, getImageSrc, getStudiesByPatientId, dataSource }) {
   console.warn('StudyBrowserPanel rerender');
   const [activeTabName, setActiveTabName] = useState('primary');
   const [studyData, setStudyData] = useState([]);
@@ -13,34 +13,30 @@ function PanelStudyBrowser({ getImageSrc, getStudiesByPatientId, dataSource }) {
     setThumbnailImageSrcMap(thumbnailImageSrcMap.set(k, v));
   };
 
-  const isSubscribed = true;
+  const { DisplaySetService } = servicesManager.services;
-  const viewModel = useViewModel();
+  const handleDisplaySetSubscription = useCallback(displaySets => {
-  const viewportData = []; //useViewportGrid();
+    if (!displaySets) {
-  const seriesTracking = {}; //useSeriesTracking();
-
-  // This effect
-  useEffect(() => {
-    if (!viewModel.displaySetInstanceUIDs.length) {
       return;
     }
 
     if (getImageSrc) {
-      viewModel.displaySetInstanceUIDs.forEach(async uid => {
+      Object.keys(displaySets).forEach(StudyInstanceUid => {
-        const imageIds = dataSource.getImageIdsForDisplaySet(uid);
+        const dSets = displaySets[StudyInstanceUid];
-        const imageId = imageIds[Math.floor(imageIds.length / 2)];
+        dSets.forEach(async (dset) => {
-        const imageSrc = await getImageSrc(imageId);
+          const uid = dset.displaySetInstanceUID;
+          const imageIds = dataSource.getImageIdsForDisplaySet(uid, DisplaySetService);
+          const imageId = imageIds[Math.floor(imageIds.length / 2)];
+          const imageSrc = await getImageSrc(imageId);
 
-        updateThumbnailMap(uid, imageSrc);
+          updateThumbnailMap(uid, imageSrc);
-      });
+        });
+      })
     }
 
-    const displaySets = viewModel.displaySetInstanceUIDs.map(
+    // TODO: This isn't really the 'first'
-      displaySetManager.getDisplaySetByUID
+    const firstStudyInstanceUID = Object.keys(displaySets)[0];
-    );
-
-    const aDisplaySet = displaySets[0];
     const firstStudy = dicomMetadataStore.getStudy(
-      aDisplaySet.StudyInstanceUID
+      firstStudyInstanceUID
     );
     const firstInstance = firstStudy.series[0].instances[0];
     const PatientID = firstInstance.PatientID;
@@ -62,9 +58,19 @@ function PanelStudyBrowser({ getImageSrc, getStudiesByPatientId, dataSource }) {
     }
 
     getData();
+  });
 
-    return () => (isSubscribed = false);
+  useEffect(() => {
-  }, [viewModel.displaySetInstanceUIDs]);
+    const { unsubscribe } = DisplaySetService.subscribe(
+      DisplaySetService.EVENTS.DISPLAY_SET_ADDED,
+      handleDisplaySetSubscription
+    );
+
+    return unsubscribe;
+  }, []);
+
+  const viewportData = []; //useViewportGrid();
+  const seriesTracking = {}; //useSeriesTracking();
 
   studyData.forEach(study => {
     study.displaySets.forEach(ds => {
@@ -112,7 +118,7 @@ function PanelStudyBrowser({ getImageSrc, getStudiesByPatientId, dataSource }) {
 
     dataSource.retrieve.series.metadata(
       queryParams,
-      displaySetManager.makeDisplaySets
+      DisplaySetService.makeDisplaySets
     );
   }
 
@@ -169,34 +175,39 @@ function _mapDataSourceStudies(studies) {
  * Iterates over displaysets and creates mapped studies from
  * instance metadata.
  *
- * @param {*} displaySets
+ * @param {*} displaySetsPerStudy
  */
-function _getMappedStudiesFromDisplaySets(displaySets) {
+function _getMappedStudiesFromDisplaySets(displaySetsPerStudy) {
   const studiesFromInstanceData = {};
 
-  displaySets.forEach(ds => {
+  Object.keys(displaySetsPerStudy).forEach(StudyInstanceUID => {
-    const displaySet = {
+    const displaySets = displaySetsPerStudy[StudyInstanceUID];
-      displaySetInstanceUID: ds.displaySetInstanceUID,
-      description: ds.SeriesDescription,
-      seriesNumber: ds.SeriesNumber,
-      modality: ds.Modality,
-      date: ds.SeriesDate,
-      numInstances: ds.numImageFrames,
-    };
 
-    studiesFromInstanceData[ds.StudyInstanceUID] =
+    displaySets.forEach(ds => {
-      studiesFromInstanceData[ds.StudyInstanceUID] ||
+      const displaySet = {
-      _mapStudyFromInstance(ds.StudyInstanceUID);
+        displaySetInstanceUID: ds.displaySetInstanceUID,
+        description: ds.SeriesDescription,
+        seriesNumber: ds.SeriesNumber,
+        modality: ds.Modality,
+        date: ds.SeriesDate,
+        numInstances: ds.numImageFrames,
+        componentType: 'thumbnailTracked' // TODO: PUT THIS SOMEWHERE ELSE
+      };
 
-    const mappedStudy = studiesFromInstanceData[ds.StudyInstanceUID];
+      studiesFromInstanceData[ds.StudyInstanceUID] =
+        studiesFromInstanceData[ds.StudyInstanceUID] ||
+        _mapStudyFromInstance(ds.StudyInstanceUID);
 
-    mappedStudy.displaySets.push(displaySet);
+      const mappedStudy = studiesFromInstanceData[ds.StudyInstanceUID];
-    mappedStudy.numInstances += displaySet.numInstances;
-    mappedStudy.modalitiesSet.add(displaySet.modality);
 
-    const modalitiesSet = mappedStudy.modalitiesSet;
+      mappedStudy.displaySets.push(displaySet);
-    mappedStudy.modalities = Array.from(modalitiesSet).join(', ');
+      mappedStudy.numInstances += displaySet.numInstances;
-  });
+      mappedStudy.modalitiesSet.add(displaySet.modality);
+
+      const modalitiesSet = mappedStudy.modalitiesSet;
+      mappedStudy.modalities = Array.from(modalitiesSet).join(', ');
+    });
+  })
 
   return studiesFromInstanceData;
 }
@@ -223,6 +234,7 @@ function _mergeDataSourceAndInstanceStudies(mappedQidoStudies, mappedInstanceStu
       description: qidoStudy.StudyDescription || studyFromInstances.description,
       modalities: studyFromInstances.modalities || qidoStudy.ModalitiesInStudy,
       numInstances: qidoStudy.NumInstances || studyFromInstances.numInstances,
+      seriesNumber: studyFromInstances.seriesNumber,
       displaySets: studyFromInstances.displaySets,
     };
   });

extensions/default/src/Panels/WrappedPanelStudyBrowser.jsx

@@ -11,18 +11,18 @@ import getImageSrcFromImageId from './getImageSrcFromImageId';
  * @param {object} commandsManager
  * @param {object} extensionManager
  */
-function WrappedPanelStudyBrowser({ commandsManager, extensionManager }) {
+function WrappedPanelStudyBrowser({ commandsManager, extensionManager, servicesManager }) {
   // Note: this feels odd
   const dataSource = extensionManager.getDataSources('dicomweb')[0];
   const getStudiesByPatientId = patientId =>
     dataSource.query.studies.search(patientId);
   const _getImageSrcFromImageId = _createGetImageSrcFromImageIdFn(
-    commandsManager.getCommand
+    commandsManager.getCommand.bind(commandsManager),
   );
 
-
   return (
     <PanelStudyBrowser
+      servicesManager={servicesManager}
       dataSource={dataSource}
       getImageSrc={_getImageSrcFromImageId}
       getStudiesByPatientId={getStudiesByPatientId}
@@ -47,7 +47,7 @@ function _createGetImageSrcFromImageIdFn(getCommand) {
 
     return getImageSrcFromImageId.bind(null, cornerstone);
   } catch (ex) {
-    // throw new Error('Required command not found');
+    throw new Error('Required command not found');
   }
 }
 

extensions/default/src/getPanelModule.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WrappedPanelStudyBrowser } from './Panels'
+import { WrappedPanelStudyBrowser } from './Panels';
 
 import MeasurementTable from './MeasurementTable.js';
 
@@ -31,6 +31,7 @@ function getPanelModule({
       component: WrappedPanelStudyBrowser.bind(null, {
         commandsManager,
         extensionManager,
+        servicesManager,
       }),
     },
     {
@@ -45,35 +46,34 @@ function getPanelModule({
 
 export default getPanelModule;
 
+// // TODO -> Need some way of selecting which displaySets hit the viewports.
+// const { DisplaySetService } = servicesManager.services;
 
-  // // TODO -> Need some way of selecting which displaySets hit the viewports.
+// // TODO -> Make a HangingProtocolService
-  // const { DisplaySetService } = servicesManager.services;
+// const HangingProtocolService = displaySets => {
+//   const displaySetInstanceUid = displaySets[Object.keys(displaySets)[0]][0].displaySetInstanceUid;
 
-  // // TODO -> Make a HangingProtocolService
+//   return {
-  // const HangingProtocolService = displaySets => {
+//     numRows: 1,
-  //   const displaySetInstanceUid = displaySets[Object.keys(displaySets)[0]][0].displaySetInstanceUid;
+//     numCols: 1,
+//     activeViewportIndex: 0,
+//     viewports: [
+//       {
+//         displaySetInstanceUid,
+//       },
+//     ],
+//   };
+// };
 
-  //   return {
+// const handleDisplaySetSubscription = useCallback(displaySets => {
-  //     numRows: 1,
+//   setViewportGrid(HangingProtocolService(displaySets));
-  //     numCols: 1,
+// });
-  //     activeViewportIndex: 0,
-  //     viewports: [
-  //       {
-  //         displaySetInstanceUid,
-  //       },
-  //     ],
-  //   };
-  // };
 
-  // const handleDisplaySetSubscription = useCallback(displaySets => {
+// useEffect(() => {
-  //   setViewportGrid(HangingProtocolService(displaySets));
+//   const { unsubscribe } = DisplaySetService.subscribe(
-  // });
+//     DisplaySetService.EVENTS.DISPLAY_SET_ADDED,
+//     handleDisplaySetSubscription
+//   );
 
-  // useEffect(() => {
+//   return unsubscribe;
-  //   const { unsubscribe } = DisplaySetService.subscribe(
+// }, []);
-  //     DisplaySetService.EVENTS.DISPLAY_SET_ADDED,
-  //     handleDisplaySetSubscription
-  //   );
-
-  //   return unsubscribe;
-  // }, []);

extensions/lesion-tracker/src/components/MeasurementComparisonTable.js

@@ -76,13 +76,13 @@ const additionalFindings = [
 
 const currentCollections = [
   {
-    selectorAction: () => { },
+    selectorAction: () => {},
     maxMeasurements: 3,
     groupName: 'Measurements',
     measurements: measurements,
   },
   {
-    selectorAction: () => { },
+    selectorAction: () => {},
     groupName: 'Additional Findings',
     measurements: additionalFindings,
   },
@@ -90,13 +90,13 @@ const currentCollections = [
 
 const comparisonColletions = [
   {
-    selectorAction: () => { },
+    selectorAction: () => {},
     maxMeasurements: 3,
     groupName: 'Measurements',
     measurements: measurements,
   },
   {
-    selectorAction: () => { },
+    selectorAction: () => {},
     groupName: 'Additional Findings',
     measurements: additionalFindings,
   },
@@ -128,7 +128,7 @@ const comparisonTimepoints = [
   {
     key: 'Comparison',
     date: '15-Jun-18',
-  }
+  },
 ];
 
 const MeasurementComparisonTable = () => {
@@ -138,8 +138,8 @@ const MeasurementComparisonTable = () => {
         timepoints={comparisonTimepoints}
         overallWarnings={overallWarnings}
         measurementCollection={comparisonCollections}
-        onRelabelClick={() => { }}
+        onRelabelClick={() => {}}
-        onEditDescriptionClick={() => { }}
+        onEditDescriptionClick={() => {}}
       />
       <div className="generate-report">
         <button className="btn btn-primary">Generate Report</button>

extensions/lesion-tracker/src/index.js

@@ -26,7 +26,7 @@ export default {
           component: MeasurementComparisonTable,
         },
       ],
-      defaultContext: ['VIEWER']
+      defaultContext: ['VIEWER'],
     };
   },
 

modes/example/babel.config.js

@@ -1 +1 @@
-module.exports = require("../../babel.config.js");
+module.exports = require('../../babel.config.js');

platform/core/src/classes/CommandsManager.js

@@ -115,7 +115,7 @@ export class CommandsManager {
    * @param {String} commandName - Command to find
    * @param {String} [contextName] - Specific command to look in. Defaults to current activeContexts
    */
-  getCommand(commandName, contextName) {
+  getCommand = (commandName, contextName) => {
     let contexts = [];
 
     if (contextName) {
@@ -145,7 +145,7 @@ export class CommandsManager {
     });
 
     return foundCommand;
-  }
+  };
 
   /**
    *

platform/core/src/services/DisplaySetService/DisplaySetService.js

@@ -131,8 +131,9 @@ export default class DisplaySetService {
   };
 
   getDisplaySetByUID = displaySetInstanceUid => {
-    return this.displaySets.find(
+    // TODO: Why is this searching active, not just displaySets?
-      displaySet => displaySet.displaySetInstanceUid === displaySetInstanceUid
+    return displaySetCache.find(
+      displaySet => displaySet.displaySetInstanceUID === displaySetInstanceUid
     );
   };