update branch

src/components/Header/Header.js

@@ -1,17 +1,20 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+import './Header.css';
+
 import { Link, withRouter } from 'react-router-dom';
+import React, { Component } from 'react';
+
 import { Dropdown } from 'react-viewerbase';
 import { withTranslation } from 'react-i18next';
 import './Header.css';
 import OHIFLogo from '../OHIFLogo/OHIFLogo.js';
-import ConnectedUserPreferencesModal from '../../connectedComponents/ConnectedUserPreferencesModal.js';
+import PropTypes from 'prop-types';
+// import { UserPreferencesModal } from 'react-viewerbase';
+import { hotkeysManager } from './../../App.js';
 
 class Header extends Component {
   static propTypes = {
     home: PropTypes.bool.isRequired,
     location: PropTypes.object.isRequired,
-    openUserPreferencesModal: PropTypes.func,
     children: PropTypes.node,
     t: PropTypes.func.isRequired,
   };
@@ -21,12 +24,25 @@ class Header extends Component {
     children: OHIFLogo(),
   };
 
+  // onSave: data => {
+  //   const contextName = window.store.getState().commandContext.context;
+  //   const preferences = cloneDeep(window.store.getState().preferences);
+  //   preferences[contextName] = data;
+  //   dispatch(setUserPreferences(preferences));
+  //   dispatch(setUserPreferencesModalOpen(false));
+  //   OHIF.hotkeysUtil.setHotkeys(data.hotKeysData);
+  // },
+  // onResetToDefaults: () => {
+  //   dispatch(setUserPreferences());
+  //   dispatch(setUserPreferencesModalOpen(false));
+  //   OHIF.hotkeysUtil.setHotkeys();
+  // },
+
   constructor(props) {
     super(props);
+    this.state = { isUserPreferencesOpen: false };
 
-    this.state = {
-      userPreferencesOpen: false,
-    };
+    // const onClick = this.toggleUserPreferences.bind(this);
 
     this.loadOptions();
   }
@@ -34,11 +50,11 @@ class Header extends Component {
   loadOptions() {
     const { t } = this.props;
     this.options = [
-      {
-        title: t('Preferences'),
-        icon: { name: 'user' },
-        onClick: this.props.openUserPreferencesModal,
-      },
+      // {
+      //   title: t('Preferences'),
+      //   icon: { name: 'user' },
+      //   onClick: onClick,
+      // },
       {
         title: t('About'),
         icon: {
@@ -47,6 +63,23 @@ class Header extends Component {
         link: 'http://ohif.org',
       },
     ];
+
+    this.hotKeysData = hotkeysManager.hotkeyDefinitions;
+  }
+
+  toggleUserPreferences() {
+    const isOpen = this.state.isUserPreferencesOpen;
+
+    this.setState({
+      isUserPreferencesOpen: !isOpen,
+    });
+  }
+
+  onUserPreferencesSave({ windowLevelData, hotKeysData }) {
+    // console.log(windowLevelData);
+    // console.log(hotKeysData);
+    // TODO: Update hotkeysManager
+    // TODO: reset `this.hotKeysData`
   }
 
   render() {
@@ -81,7 +114,7 @@ class Header extends Component {
         <div className="header-menu">
           <span className="research-use">{t('INVESTIGATIONAL USE ONLY')}</span>
           <Dropdown title={t('Options')} list={this.options} align="right" />
-          <ConnectedUserPreferencesModal />
+          {/* <ConnectedUserPreferencesModal /> */}
         </div>
       </div>
     );