All files / src/components/App index.jsx

0% Statements 0/104
0% Branches 0/56
0% Functions 0/25
0% Lines 0/4
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109                                                                                                                                                                                                                         
import styles from './style.postcss';
 
import React, { PureComponent } from 'react';
import Header from 'containers/Header';
import Sidebar from 'containers/Sidebar';
import Footer from 'components/Footer';
import classnames from 'classnames';
import testClass from 'domain/testClass';
import Breadcrumbs from 'components/Breadcrumbs';
import HistoryLink from 'components/HistoryLink';
import connect from 'domain/connect';
import PerformanceProfiler from 'components/PerformanceProfiler';
import Config from 'domain/Config';
import BreadcrumbsBuilder from 'domain/BreadcrumbsBuilder';
import PropTypes from 'prop-types';
import Zendesk from 'components/Zendesk';
 
class App extends PureComponent {
  constructor(props) {
    super(props);
    this.state = { sidebarExpanded: false };
  }
 
  componentDidMount() {
    this._setPageTitle(this.props);
  }
 
  componentWillUpdate(props) {
    this._setPageTitle(props);
  }
 
  _collapseSidebar(evt) {
    evt.preventDefault();
    evt.stopPropagation();
    this.setState({ sidebarExpanded: false });
  }
 
  _expandSidebar(evt) {
    evt.preventDefault();
    evt.stopPropagation();
    this.setState({ sidebarExpanded: true });
  }
 
  _onHamburgerClick(evt) {
    evt.preventDefault();
    evt.stopPropagation();
    this.setState(({ sidebarExpanded }) => ({ sidebarExpanded: ! sidebarExpanded }));
  }
 
  _setPageTitle(props) {
    this._breadcrumbs = BreadcrumbsBuilder.buildWithProps(props);
    const visibleBreadcrumbCount =
        this._breadcrumbs && this._breadcrumbs.filter((bc) => ! bc.hidden).length;
    if (! this._breadcrumbs || visibleBreadcrumbCount <= 0) {
      document.title = Config.get('displayTitle');
    } else {
      document.title = this._breadcrumbs.filter((bc) => ! bc.hidden)
      .reduce((result, item, index) =>
          `${result}${index !== 0 ? ' / ' : ''}${item.label}`, `${Config.get('displayTitle')} - `);
    }
  }
 
  render() {
    const { user } = this.props;
    if (! user || user.expired) return null;
 
    return <div className={classnames(styles.App, testClass('app'))}>
      {
        ! PRODUCTION && Config.get('performanceProfiler') === true &&
        <PerformanceProfiler />
      }
      <Header {...this.props} onHamburgerClick={(e) => this._onHamburgerClick(e)} />
      <div className={styles.App_wrap}>
        <Sidebar {...this.props}
            expanded={this.state.sidebarExpanded}
            onExpand={(e) => this._expandSidebar(e)}
            onCollapse={(e) => this._collapseSidebar(e)} />
        <div className={styles.App_content}>
          <div className={styles.App_content_auxiliary}>
            {
              this._breadcrumbs &&
              <Breadcrumbs className={styles.App_content_auxiliary_breadcrumbs}
                  items={this._breadcrumbs}
                  singleLineMode />
            }
            <HistoryLink className={styles.App_content_auxiliary_historyLink} {...this.props} />
          </div>
          <div className={styles.App_content_wrap}>{this.props.children}</div>
        </div>
      </div>
      <Footer />
      {PRODUCTION && <Zendesk />}
    </div>;
  }
}
 
App.propTypes = {
  user: PropTypes.shape({
    expired: PropTypes.bool,
  }),
  children: PropTypes.node,
};
 
export function mapStateToProps(state) {
  return { user: state.get('singleSignOn').get('user') };
}
 
export default connect(mapStateToProps)(App);