diff --git a/src/App.js b/src/App.js
index 7c5a42e38..dfc7bdb6c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,16 +4,15 @@ import {
CommandsManager,
ExtensionManager,
HotkeysManager,
- redux,
utils,
} from 'ohif-core';
import React, { Component } from 'react';
import {
- getDefaultToolbarButtons,
getUserManagerForOpenIdConnectClient,
initWebWorkers,
} from './utils/index.js';
+import { I18nextProvider } from 'react-i18next';
// import ConnectedToolContextMenu from './connectedComponents/ConnectedToolContextMenu';
import OHIFCornerstoneExtension from '@ohif/extension-cornerstone';
// import OHIFDicomHtmlExtension from 'ohif-dicom-html-extension';
@@ -27,9 +26,8 @@ import { Provider } from 'react-redux';
import { BrowserRouter as Router } from 'react-router-dom';
import WhiteLabellingContext from './WhiteLabellingContext';
import appCommands from './appCommands';
-import setupTools from './setupTools';
import i18n from '@ohif/i18n';
-import { I18nextProvider } from 'react-i18next';
+import setupTools from './setupTools';
import store from './store';
// ~~~~ APP SETUP
diff --git a/src/connectedComponents/ToolbarRow.js b/src/connectedComponents/ToolbarRow.js
index a9b7b2f19..25d720bab 100644
--- a/src/connectedComponents/ToolbarRow.js
+++ b/src/connectedComponents/ToolbarRow.js
@@ -1,13 +1,13 @@
import './ToolbarRow.css';
import React, { Component } from 'react';
+import { RoundedButtonGroup, ToolbarButton } from 'react-viewerbase';
+import { commandsManager, extensionManager } from './../App.js';
import ConnectedLayoutButton from './ConnectedLayoutButton';
import ConnectedPluginSwitch from './ConnectedPluginSwitch.js';
import { MODULE_TYPES } from 'ohif-core';
import PropTypes from 'prop-types';
-import { RoundedButtonGroup } from 'react-viewerbase';
-import { extensionManager } from './../App.js';
class ToolbarRow extends Component {
static propTypes = {
@@ -23,6 +23,31 @@ class ToolbarRow extends Component {
rightSidebarOpen: false,
};
+ constructor(props) {
+ super(props);
+
+ const toolbarModules = extensionManager.modules[MODULE_TYPES.TOOLBAR];
+ const toolbarButtonDefinitions = toolbarModules[0].module.definitions;
+
+ // TODO:
+ // ToolbarSection for Each ToolbarButton
+ // Render buttons
+ // On click, depending on Type, pass props to registered command in commands manager?
+ // If it's a tool that can be active... Mark it as active?
+ // - Tools that are on/off?
+ // - Tools that can be bound to multiple buttons?
+
+ // Normal ToolbarButtons...
+ // Maybe filtered by the active context(s)?
+ // Buttons can handle their own clicks. No reason for the container to do it?
+ // Just how high do we need to hoist this state?
+ // Why ToolbarRow instead of just Toolbar? Do we have any others?
+ this.state = {
+ toolbarButtons: toolbarButtonDefinitions,
+ activeButtons: [],
+ };
+ }
+
onLeftSidebarValueChanged = value => {
this.props.setLeftSidebarOpen(!!value);
};
@@ -56,19 +81,13 @@ class ToolbarRow extends Component {
? rightSidebarToggle[0].value
: null;
- const availableToolbarModules =
- extensionManager.modules[MODULE_TYPES.TOOLBAR];
- const toolbarModuleDefinition = availableToolbarModules.find(
- moduleDefinition => moduleDefinition.extensionId === this.props.pluginId
+ //const getButtonComponents = _getButtonComponents.bind(this);
+ const buttonComponents = _getButtonComponents.call(
+ this,
+ this.state.toolbarButtons,
+ this.state.activeButtons
);
- let pluginComp;
- if (toolbarModuleDefinition) {
- const PluginComponent = toolbarModuleDefinition.module;
-
- pluginComp =