<commit_before>import React, { PropTypes } from 'react';

import { FormattedMessage } from 'react-intl';

import AppBar from 'material-ui/AppBar';
import Toolbar from 'material-ui/Toolbar';
import Text from 'material-ui/Text';
import IconButton from 'material-ui/IconButton';
import MenuIcon from 'material-ui/svg-icons/menu';

import Drawer from 'material-ui/Drawer';

import Divider from 'material-ui/Divider';
import MenuItem from 'material-ui-old/MenuItem';

import isArray from 'lodash/isArray';

import {
  createAction,
  createReducer,
} from 'redux-act';

import jwtDecode from 'jwt-decode';

import { connect } from 'react-redux';
import { withRouter } from 'react-router';

import routes from '../utils/routes';
import theme from '../utils/theme';

const NavigationDrawer = ({ closeDrawer, changeView, drawerOpened, path, user }) => (
  <Drawer
    open={drawerOpened}
    onRequestClose={() => closeDrawer()}
  >

    <AppBar
      style={{ position: 'relative' }}
    >
      <Toolbar>
        <IconButton
          contrast
          onTouchTap={() => closeDrawer()}
        >
          <MenuIcon />
        </IconButton>
        <Text
          style={{ flex: 1 }}
          type="title"
          colorInherit
        >
          <FormattedMessage id="navigation" />
        </Text>
      </Toolbar>
    </AppBar>

    {
      routes.map((route) => {
        let active = (path === route.path);
        if (route.path === routes[0].path && path === '/') {
          active = true;
        }

        const scope = user ? user.scope : null;

        if (isArray(route.hideWhenScope) && route.hideWhenScope.includes(scope)) {
          return null;
        }

        return (
          <div key={route.path}>
            {route.separator ? <Divider /> : null}
            <MenuItem
              leftIcon={React.createElement(route.icon)}
              style={{ color: active ? theme.legacyPalette.primary1Color : null }}
              onTouchTap={() => { changeView(route.path); }}
            >

              <FormattedMessage id={route.name} />
            </MenuItem>
          </div>
        );
      })
    }
  </Drawer>
);

NavigationDrawer.propTypes = {
  closeDrawer: PropTypes.func.isRequired,
  changeView: PropTypes.func.isRequired,
  drawerOpened: PropTypes.bool.isRequired,
  path: PropTypes.string.isRequired,
  user: PropTypes.shape({
    scope: PropTypes.string.isRequired,
  }),
};

// Action creators
export const closeDrawer = createAction('Close menu drawer');
export const openDrawer = createAction('Open menu drawer');
export const toggleDrawer = createAction('Toggle menu drawer');

// Initial state<commit_msg>NavigationDrawer: use active color from mui@next palette<commit_after>import React, { PropTypes } from 'react';

import { FormattedMessage } from 'react-intl';

import AppBar from 'material-ui/AppBar';
import Toolbar from 'material-ui/Toolbar';
import Text from 'material-ui/Text';
import IconButton from 'material-ui/IconButton';
import MenuIcon from 'material-ui/svg-icons/menu';

import Drawer from 'material-ui/Drawer';

import Divider from 'material-ui/Divider';
import MenuItem from 'material-ui-old/MenuItem';

import isArray from 'lodash/isArray';

import {
  createAction,
  createReducer,
} from 'redux-act';

import jwtDecode from 'jwt-decode';

import { connect } from 'react-redux';
import { withRouter } from 'react-router';

import routes from '../utils/routes';
import theme from '../utils/theme';

const NavigationDrawer = ({ closeDrawer, changeView, drawerOpened, path, user }) => (
  <Drawer
    open={drawerOpened}
    onRequestClose={() => closeDrawer()}
  >

    <AppBar
      style={{ position: 'relative' }}
    >
      <Toolbar>
        <IconButton
          contrast
          onTouchTap={() => closeDrawer()}
        >
          <MenuIcon />
        </IconButton>
        <Text
          style={{ flex: 1 }}
          type="title"
          colorInherit
        >
          <FormattedMessage id="navigation" />
        </Text>
      </Toolbar>
    </AppBar>

    {
      routes.map((route) => {
        let active = (path === route.path);
        if (route.path === routes[0].path && path === '/') {
          active = true;
        }

        const scope = user ? user.scope : null;

        if (isArray(route.hideWhenScope) && route.hideWhenScope.includes(scope)) {
          return null;
        }

        return (
          <div key={route.path}>
            {route.separator ? <Divider /> : null}
            <MenuItem
              leftIcon={React.createElement(route.icon)}
              style={{ color: active ? theme.palette.primary[500] : null }}
              onTouchTap={() => { changeView(route.path); }}
            >

              <FormattedMessage id={route.name} />
            </MenuItem>
          </div>
        );
      })
    }
  </Drawer>
);

NavigationDrawer.propTypes = {
  closeDrawer: PropTypes.func.isRequired,
  changeView: PropTypes.func.isRequired,
  drawerOpened: PropTypes.bool.isRequired,
  path: PropTypes.string.isRequired,
  user: PropTypes.shape({
    scope: PropTypes.string.isRequired,
  }),
};

// Action creators
export const closeDrawer = createAction('Close menu drawer');
export const openDrawer = createAction('Open menu drawer');
export const toggleDrawer = createAction('Toggle menu drawer');

// Initial state
{'fraction_non_alphanumeric': 0.13600599475458974, 'fraction_numerical': 0.0014986886474334957, 'mean_word_length': 2.5334215751158173, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 49, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1058031', 'n_tokens_mistral': 1555, 'n_tokens_neox': 1575, 'n_words': 363}