WIP DisplaySetService

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

@@ -11,6 +11,7 @@ export default function DisplaySetCreator({
   mode,
   dataSourceName,
   extensionManager,
+  DisplaySetService,
 }) {
   console.warn('DisplaySetCreator rerendering');
   const { routes, sopClassHandlers } = mode;

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

@@ -1,27 +1,30 @@
-import React from 'react';
+import React, { useEffect, useCallback } from 'react';
 import PropTypes from 'prop-types';
 //
-import { ToolbarLayoutProvider } from '@ohif/core';
+import { ToolBarManager } from '@ohif/core';
 import { DragAndDropProvider } from '@ohif/ui';
 //
 import ViewportGrid from '@components/ViewportGrid';
 import Compose from './Compose';
-import DisplaySetCreator from './DisplaySetCreator';
+//import DisplaySetCreator from './DisplaySetCreator';
 
 export default function ModeRoute({
   location,
   mode,
   dataSourceName,
   extensionManager,
+  servicesManager,
 }) {
   console.warn('ModeRoute rerendering');
-  const { routes, extensions } = mode;
+  const { routes, extensions, sopClassHandlers } = mode;
   const dataSources = extensionManager.getDataSources(dataSourceName);
   // TODO: For now assume one unique datasource.
 
   const dataSource = dataSources[0];
   const route = routes[0];
 
+  const { DisplaySetService } = servicesManager.services;
+
   // Only handling one route per mode for now
   // You can test via http://localhost:3000/example-mode/dicomweb
   const layoutTemplateData = route.layoutTemplate({ location });
@@ -51,32 +54,59 @@ export default function ModeRoute({
   const CombinedContextProvider = ({ children }) =>
     Compose({ components: contextModuleProviders, children });
 
+  debugger;
+
   function ViewportGridWithDataSource(props) {
+    debugger;
     return ViewportGrid({ ...props, dataSource });
   }
 
+  useEffect(() => {
+    // TODO -> Make this into a service
+    let toolBarManager = new ToolBarManager(extensionManager); //, setToolBarLayout);
+    route.init({ toolBarManager });
+  }, [mode, dataSourceName, location]);
+
+  const createDisplaySets = useCallback(() => {
+    // Add SOPClassHandlers to a new SOPClassManager.
+    DisplaySetService.init(extensionManager, sopClassHandlers);
+
+    const queryParams = location.search;
+
+    // Call the data source to start building the view model?
+    dataSource.retrieve.series.metadata(
+      queryParams,
+      DisplaySetService.makeDisplaySets
+    );
+  }, [location]);
+
+  useEffect(() => {
+    createDisplaySets();
+  }, [mode, dataSourceName, location]);
+
   return (
     <React.Fragment>
-      <ToolbarLayoutProvider>
-        <DisplaySetCreator
-          location={location}
-          mode={mode}
-          dataSourceName={dataSourceName}
-          extensionManager={extensionManager}
-        />
-        <CombinedContextProvider>
-          {/* TODO: extensionManager is already provided to the extension module.
-           *  Use it from there instead of passing as a prop here.
-           */}
-          <DragAndDropProvider>
-            <LayoutComponent
-              extensionManager={extensionManager}
-              ViewportGrid={ViewportGridWithDataSource}
-              {...layoutTemplateData.props}
-            />
-          </DragAndDropProvider>
-        </CombinedContextProvider>
-      </ToolbarLayoutProvider>
+      {/*<ToolbarLayoutProvider>*/}
+      {/*
+          <DisplaySetCreator
+            location={location}
+            mode={mode}
+            dataSourceName={dataSourceName}
+            extensionManager={extensionManager}
+            DisplaySetService={DisplaySetService}
+          />
+        */}
+      <CombinedContextProvider>
+        {/* TODO: extensionManager is already provided to the extension module.
+         *  Use it from there instead of passing as a prop here.
+         */}
+        <DragAndDropProvider>
+          <LayoutComponent {...layoutTemplateData.props}>
+            <ViewportGridWithDataSource />
+          </LayoutComponent>
+        </DragAndDropProvider>
+      </CombinedContextProvider>
+      {/*</ToolbarLayoutProvider>*/}
     </React.Fragment>
   );
 }
@@ -88,7 +118,7 @@ ModeRoute.propTypes = {
     pathname: PropTypes.string.isRequired,
     search: PropTypes.string.isRequired,
     hash: PropTypes.string.isRequired,
-    state: PropTypes.object.isRequired,
+    //state: PropTypes.object.isRequired,
   }),
   mode: PropTypes.object.isRequired,
   dataSourceName: PropTypes.string,

platform/viewer/src/routes/buildModeRoutes.js

@@ -22,7 +22,15 @@ import { ViewModelProvider } from '@ohif/core';
 
   /:modeId/:modeRoute/?queryParameters=example
  */
-export default function buildModeRoutes(modes, dataSources, extensionManager) {
+export default function buildModeRoutes(
+  modes,
+
+  dataSources,
+
+  extensionManager,
+
+  servicesManager
+) {
   const routes = [];
 
   // const dataSources = Object.keys(extensionManager.dataSourceMap).map(a =>
@@ -52,6 +60,7 @@ export default function buildModeRoutes(modes, dataSources, extensionManager) {
             mode={mode}
             dataSourceName={dataSourceName}
             extensionManager={extensionManager}
+            servicesManager={servicesManager}
           />
         </ViewModelProvider>
       );

platform/viewer/src/routes/index.js

@@ -20,12 +20,26 @@ const bakedInRoutes = [
   { component: NotFound },
 ];
 
-const createRoutes = (modes, dataSources, extensionManager) => {
-  const routes = buildModeRoutes(modes, dataSources, extensionManager) || [];
+const createRoutes = (
+  modes,
+  dataSources,
+  extensionManager,
+  servicesManager
+) => {
+  const routes =
+    buildModeRoutes(modes, dataSources, extensionManager, servicesManager) ||
+    [];
   // TODO: Shouldn't need to guard input routes with an empty array?
   const allRoutes = [...(routes || []), ...bakedInRoutes];
 
-  console.log('Creating Routes: ', modes, dataSources, routes, bakedInRoutes, allRoutes);
+  console.log(
+    'Creating Routes: ',
+    modes,
+    dataSources,
+    routes,
+    bakedInRoutes,
+    allRoutes
+  );
 
   return (
     <Switch>