Fix context usage in ModeRoute

platform/core/src/displaySetManager.js

@@ -7,6 +7,8 @@ class DisplaySetManager {
     this.extensionManager = extensionManager;
     this.SOPClassHandlerIds = SOPClassHandlerIds;
 
+    debugger;
+
     const {
       displaySetInstanceUids,
       setDisplaySetInstanceUids,
@@ -20,7 +22,6 @@ class DisplaySetManager {
   }
 
   _addDisplaySets(displaySets) {
-    debugger;
     //const displayInstanceUids = [...this.displaySetInstanceUids];
 
     const addedDisplaySetUids = [];
@@ -47,8 +48,6 @@ class DisplaySetManager {
 
     const instance = instances[0];
 
-    debugger;
-
     const existingDisplaySets =
       this.getDisplaySetsForSeries(instance.SeriesInstanceUID) || [];
 
@@ -76,9 +75,7 @@ class DisplaySetManager {
           addedDisplaySetUids = this._addDisplaySets(displaySets);
         }
 
-        debugger;
-
-        setDisplaySetInstanceUids([
+        this.setDisplaySetInstanceUids([
           ...addedDisplaySetUids,
           ...this.displaySetInstanceUids,
         ]);

platform/viewer/src/routes/ModeRoute.js

@@ -1,4 +1,4 @@
-import React, { useContext } from 'react';
+import React, { useContext, useEffect, useCallback } from 'react';
 import { displaySetManager } from '@ohif/core';
 import ViewModelContext from './ViewModelContext';
 import Compose from './Compose';
@@ -16,41 +16,40 @@ export default function ModeRoute({
 
   const dataSource = dataSources[0];
 
-  const viewModelContext = useContext(ViewModelContext);
+  const { displaySetInstanceUids, setDisplaySetInstanceUids } = useContext(
+    ViewModelContext
+  );
 
-  console.log(viewModelContext);
+  const createDisplaySets = useCallback(() => {
+    // Add SOPClassHandlers to a new SOPClassManager.
+    displaySetManager.init(extensionManager, sopClassHandlers, {
+      displaySetInstanceUids,
+      setDisplaySetInstanceUids,
+    });
+
+    const queryParams = location.search;
+
+    // Call the data source to start building the view model?
+    dataSource.retrieve.series.metadata(
+      queryParams,
+      displaySetManager.makeDisplaySets
+    );
+  }, [displaySetInstanceUids, location]);
+
+  useEffect(() => {
+    createDisplaySets();
+  }, [mode, dataSourceName, location]);
 
-  const { displaySetInstanceUids } = viewModelContext;
   // Deal with toolbar.
 
   // Only handling one route per mode for now
   // You can test via http://localhost:3000/example-mode/dicomweb
   const layoutTemplateData = routes[0].layoutTemplate({ location });
-
   const layoutTemplateModuleEntry = extensionManager.getModuleEntry(
     layoutTemplateData.id
   );
-
   const LayoutComponent = layoutTemplateModuleEntry.component;
 
-  // Add SOPClassHandlers to a new SOPClassManager.
-
-  debugger;
-
-  displaySetManager.init(extensionManager, sopClassHandlers, viewModelContext);
-
-  // setInterval(() => {
-  //   setDisplaySetInstanceUids(manager.displaySets);
-  // }, 5000);
-
-  const queryParams = location.search;
-
-  // Call the data source to start building the view model?
-  dataSource.retrieve.series.metadata(
-    queryParams,
-    displaySetManager.makeDisplaySets
-  );
-
   // For each extension, look up their context modules
   // TODO: move to extension manager.
   let contextModules = [];