feat(Header.js): Add About modal to header

src/components/Header/Header.js

@@ -7,7 +7,7 @@ import React, { Component } from 'react';
 import { Dropdown } from 'react-viewerbase';
 import OHIFLogo from '../OHIFLogo/OHIFLogo.js';
 import PropTypes from 'prop-types';
-// import { UserPreferencesModal } from 'react-viewerbase';
+import { AboutModal } from 'react-viewerbase';
 import { hotkeysManager } from './../../App.js';
 import { withTranslation } from 'react-i18next';
 
@@ -40,9 +40,7 @@ class Header extends Component {
 
   constructor(props) {
     super(props);
-    this.state = { isUserPreferencesOpen: false };
+    this.state = { isUserPreferencesOpen: false, isOpen: false };
-
-    // const onClick = this.toggleUserPreferences.bind(this);
 
     this.loadOptions();
   }
@@ -50,31 +48,20 @@ class Header extends Component {
   loadOptions() {
     const { t } = this.props;
     this.options = [
-      // {
-      //   title: t('Preferences'),
-      //   icon: { name: 'user' },
-      //   onClick: onClick,
-      // },
       {
         title: t('About'),
-        icon: {
+        icon: { name: 'info' },
-          name: 'info',
+        onClick: () => {
+          this.setState({
+            isOpen: true,
+          });
         },
-        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);
@@ -114,7 +101,14 @@ 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 /> */}
+          <AboutModal
+            {...this.state}
+            onCancel={() =>
+              this.setState({
+                isOpen: false,
+              })
+            }
+          />
         </div>
       </div>
     );