Add toolbar layout to context.

platform/core/src/ToolBarManager.js

@@ -1,8 +1,8 @@
 export default class toolBarManager {
-  constructor(extensionManager) {
-    this.toolBarLayout = [];
+  constructor(extensionManager, setToolBarLayout) {
     this.buttons = {};
     this.extensionManager = extensionManager;
+    this.setToolBarLayout = setToolBarLayout;
   }
 
   addButtons(buttons) {
@@ -48,8 +48,8 @@ export default class toolBarManager {
       toolBarLayout.push(toolBarDefinitions);
     });
 
-    this.toolBarLayout = toolBarLayout;
+    console.log(toolBarLayout);
 
-    console.log(this.toolBarLayout);
+    setToolBarLayout(toolBarLayout);
   }
 }

platform/viewer/src/routes/ModeRoute.js

@@ -12,22 +12,29 @@ export default function ModeRoute({
   const { routes, sopClassHandlers, extensions, init } = mode;
   const dataSources = extensionManager.getDataSources(dataSourceName);
 
-  const toolbarManager = new ToolBarManager(extensionManager);
+  // Add toolbar state to the view model context?
+  const {
+    toolBarLayout,
+    setToolBarLayout,
+    displaySetInstanceUids,
+    setDisplaySetInstanceUids,
+  } = useContext(ViewModelContext);
 
   // TODO: For now assume one unique datasource.
 
   const dataSource = dataSources[0];
   const route = routes[0];
 
-  route.init({ toolbarManager });
+  let toolBarManager;
+
+  useEffect(() => {
+    debugger;
+    toolBarManager = new ToolBarManager(extensionManager, setToolBarLayout);
+    route.init({ toolBarManager });
+  }, [mode, dataSourceName, location]);
 
   console.log(dataSource);
 
-  // Add toolbar state to the view model context?
-  const { displaySetInstanceUids, setDisplaySetInstanceUids } = useContext(
-    ViewModelContext
-  );
-
   const createDisplaySets = useCallback(() => {
     // Add SOPClassHandlers to a new SOPClassManager.
     displaySetManager.init(extensionManager, sopClassHandlers, {
@@ -82,6 +89,7 @@ export default function ModeRoute({
       <LayoutComponent
         extensionManager={extensionManager}
         displaySetInstanceUids={displaySetInstanceUids}
+        toolBarLayout={toolBarLayout}
         {...layoutTemplateData.props}
       />
     </CombinedContextProvider>

platform/viewer/src/routes/ViewModelContext.js

@@ -3,6 +3,8 @@ import React, { Component } from 'react';
 const ViewModelContext = React.createContext({
   displaySetInstanceUids: [],
   setDisplaySetInstanceUids: () => {},
+  toolBarLayout: [],
+  setToolBarLayout: () => {},
 });
 
 ViewModelContext.displayName = 'ViewModelContext';
@@ -17,11 +19,17 @@ class ViewModelProvider extends Component {
       this.setState({ displaySetInstanceUids });
     };
 
+    const setToolBarLayout = toolBarLayout => {
+      this.setState({ toolBarLayout });
+    };
+
     return (
       <ViewModelContext.Provider
         value={{
           displaySetInstanceUids: this.state.displaySetInstanceUids,
           setDisplaySetInstanceUids,
+          toolBarLayout: this.state.toolBarLayout,
+          setToolBarLayout,
         }}
       >
         {this.props.children}