fix thumbnail persistence

extensions/default/src/Panels/PanelStudyBrowser.jsx

@@ -48,11 +48,28 @@ function PanelStudyBrowser({
     StudyInstanceUIDs.forEach(sid => fetchStudiesForPatient(sid));
   }, [StudyInstanceUIDs, getStudiesForPatientByStudyInstanceUID]);
 
+  // ~~ Initial Thumbnails
+  useEffect(() => {
+    const currentDisplaySets = DisplaySetService.activeDisplaySets || [];
+    currentDisplaySets.forEach(async dSet => {
+      const newImageSrcEntry = {};
+      const displaySet = DisplaySetService.getDisplaySetByUID(
+        dSet.displaySetInstanceUID
+      );
+      const imageIds = dataSource.getImageIdsForDisplaySet(displaySet);
+      const imageId = imageIds[Math.floor(imageIds.length / 2)];
+
+      // When the image arrives, render it and store the result in the thumbnailImgSrcMap
+      newImageSrcEntry[dSet.displaySetInstanceUID] = await getImageSrc(imageId);
+      setThumbnailImageSrcMap(prevState => {
+        return { ...prevState, ...newImageSrcEntry };
+      });
+    });
+  }, []);
+
   // ~~ displaySets
   useEffect(() => {
-    // TODO: Deep copy? Or By IDs?
+    // TODO: Are we sure `activeDisplaySets` will always be accurate?
-    // TODO: May need to be mapped to a different shape?
-    // TODO: Iterate over `studyDisplayList` and map these for all studies in list?
     const currentDisplaySets = DisplaySetService.activeDisplaySets || [];
     const mappedDisplaySets = _mapDisplaySets(
       currentDisplaySets,
@@ -62,48 +79,48 @@ function PanelStudyBrowser({
     setDisplaySets(mappedDisplaySets);
   }, [thumbnailImageSrcMap]);
 
-  async function handleDisplaySetsAdded(newDisplaySets) {
+  // ~~ subscriptions --> displaySets
-    console.warn('~~ handleDisplaySetsAdded');
-    // First, launch requests for a thumbnail for the new display sets
-    newDisplaySets.forEach(async dset => {
-      const newImageSrcEntry = {};
-      const imageIds = dataSource.getImageIdsForDisplaySet(dset);
-      const imageId = imageIds[Math.floor(imageIds.length / 2)];
-
-      // When the image arrives, render it and store the result in the thumbnailImgSrcMap
-      newImageSrcEntry[dset.displaySetInstanceUID] = await getImageSrc(imageId);
-      console.log(`setting thumbnail for ${imageId}`);
-
-      setThumbnailImageSrcMap(prevState => {
-        return {...prevState, ...newImageSrcEntry}
-      });
-    });
-  }
-
   useEffect(() => {
-    const subscriptions = [
+    // DISPLAY_SETS_ADDED returns an array of DisplaySets that were added
-      DisplaySetService.subscribe(
+    const SubscriptionDisplaySetsAdded = DisplaySetService.subscribe(
-        DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
+      DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
-        handleDisplaySetsAdded
+      newDisplaySets => {
-      ),
+        newDisplaySets.forEach(async dSet => {
-      // TODO: Should this event indicate batch/series/study?
+          const newImageSrcEntry = {};
-      // Naming feels odd, and result is non-obvious
+          const displaySet = DisplaySetService.getDisplaySetByUID(
-      // Will this always contain _all_ displaySets we care about?
+            dSet.displaySetInstanceUID
-      DisplaySetService.subscribe(
-        DisplaySetService.EVENTS.DISPLAY_SETS_CHANGED,
-        changedDisplaySets => {
-          const mappedDisplaySets = _mapDisplaySets(
-            changedDisplaySets,
-            thumbnailImageSrcMap
           );
+          const imageIds = dataSource.getImageIdsForDisplaySet(displaySet);
+          const imageId = imageIds[Math.floor(imageIds.length / 2)];
 
-          setDisplaySets(mappedDisplaySets);
+          // When the image arrives, render it and store the result in the thumbnailImgSrcMap
-        }
+          newImageSrcEntry[dSet.displaySetInstanceUID] = await getImageSrc(
-      ),
+            imageId
-    ];
+          );
+          setThumbnailImageSrcMap(prevState => {
+            return { ...prevState, ...newImageSrcEntry };
+          });
+        });
+      }
+    );
+
+    // TODO: Will this always hold _all_ the displaySets we care about?
+    // DISPLAY_SETS_CHANGED returns `DisplaySerService.activeDisplaySets`
+    const SubscriptionDisplaySetsChanged = DisplaySetService.subscribe(
+      DisplaySetService.EVENTS.DISPLAY_SETS_CHANGED,
+      changedDisplaySets => {
+        const mappedDisplaySets = _mapDisplaySets(
+          changedDisplaySets,
+          thumbnailImageSrcMap
+        );
+
+        setDisplaySets(mappedDisplaySets);
+      }
+    );
 
     return () => {
-      subscriptions.forEach(sub => sub.unsubscribe);
+      SubscriptionDisplaySetsAdded.unsubscribe();
+      SubscriptionDisplaySetsChanged.unsubscribe();
     };
   }, []);
 
@@ -132,6 +149,7 @@ function PanelStudyBrowser({
 PanelStudyBrowser.propTypes = {
   DisplaySetService: PropTypes.shape({
     EVENTS: PropTypes.object.isRequired,
+    getDisplaySetByUID: PropTypes.func.isRequired,
     hasDisplaySetsForStudy: PropTypes.func.isRequired,
     subscribe: PropTypes.func.isRequired,
   }).isRequired,
@@ -189,6 +207,7 @@ function _mapDisplaySets(displaySets, thumbnailImageSrcMap) {
   });
 }
 
+
 /**
  *
  * @param {string[]} primaryStudyInstanceUIDs

extensions/default/src/Panels/requestDisplaySetCreationForStudy.js

@@ -9,14 +9,6 @@ function requestDisplaySetCreationForStudy(
   }
 
   dataSource.retrieveSeriesMetadata({ StudyInstanceUID });
-
-  // 1. Update DICOMStore
-  // 2. DICOMStore shoots out events
-  // 3. IFF instance is in study/series that is "active" (being viewed?), displaySet is created?
-  // 4. IFF not, just store is updated
-  // 5. IFF active studies change, splitting logic is refired?
-
-  // DisplaySetService.makeDisplaySets
 }
 
 export default requestDisplaySetCreationForStudy;

platform/viewer/src/routes/Mode/Mode.jsx

@@ -87,23 +87,11 @@ export default function ModeRoute({
     // Add SOPClassHandlers to a new SOPClassManager.
     DisplaySetService.init(extensionManager, sopClassHandlers);
 
-    const queryParams = location.search;
-    console.log('queryParams: ', queryParams);
-
-    // Call the data source to start building the view model?
-    // TODO: This should be called on subscription to DicomMetadataStore?
-    // dataSource.retrieve.series.metadata(
-    //   queryParams,
-    //   DisplaySetService.makeDisplaySets
-    // );
-
     // TODO: This should be baked into core, not manuel?
     // DisplaySetService would wire this up?
     DicomMetadataStore.subscribe(
       DicomMetadataStore.EVENTS.INSTANCES_ADDED,
       ({ StudyInstanceUID, SeriesInstanceUID }) => {
-        console.warn(`INSTANCES_ADDED::\nStudy:${StudyInstanceUID}\nSeries:${SeriesInstanceUID}`);
-
         const seriesMetadata = DicomMetadataStore.getSeries(
           StudyInstanceUID,
           SeriesInstanceUID