<commit_before>import * as React from 'react';
import * as PropTypes from 'prop-types';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';

import actions from '../actions';
import { renderLog } from '../helpers/logger';

const Isvg = require('react-inlinesvg');

const NavComponent: any = ({app, actions}) => {
  renderLog('NAV');
  return (
    <nav className='nav main-nav'>
      <button onClick={ actions.addRepos } className={ 'button' + (app.addingRepos ? ' progressing' : '') } >
        { app.addingRepos
          ? <span className='icon icon-refresh'>
              <Isvg src='./svg/reload.svg'/>
            </span>
          : <i className='icon icon-add'>
              <Isvg src='./svg/add.svg'/>
            </i>
        }

        <span>Add Repo</span>
      </button>

      <button onClick={ actions.addGroup } className='button'>
        <i className='icon icon-add'>
          <Isvg src='./svg/folder.svg'/>
        </i>
        <span>Add Group</span>
      </button>

      <button onClick={ actions.reloadAllRepos } className={ 'button' + (app.reloadingAllRepos ? ' progressing' : '') } >
        <i className='icon icon-refresh'>
          <Isvg src='./svg/reload.svg'/>
        </i>
        <span>Reload all</span>
      </button>
    </nav>
  );
};

NavComponent.propTypes = {
  app: PropTypes.object.isRequired,
  actions: PropTypes.object.isRequired
};
<commit_msg>styled nav<commit_after>import * as React from 'react'; // tslint:disable-line
import * as PropTypes from 'prop-types';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
// import styled from 'emotion/react'
import styled from 'styled-components';


import { navHeight, g2 } from '../utils/styles';

// const StyledNav = styled('nav')`
const StyledNav = styled.nav`
  width: 100%;
  height: ${navHeight}px;
  background: ${g2};
  top: 0;
  left: 0;
  position: fixed;
  z-index: 10;
`;

import actions from '../actions';
import { renderLog } from '../helpers/logger';
import Button from './helpers/Button';
import Icon from './helpers/Icon';

const Isvg = require('react-inlinesvg');

const NavComponent: any = ({app, actions}) => {
  renderLog('NAV');
  return (
    // <StyledNav className='nav main-nav'>
    <StyledNav>
      <Button onClick={ actions.addRepos } className={app.addingRepos ? 'progressing' : ''} >
        { app.addingRepos
          ? <Icon>
              <Isvg src='./svg/reload.svg'/>
            </Icon>
          : <Icon>
              <Isvg src='./svg/add.svg'/>
            </Icon>
        }

        <span>Add Repo</span>
      </Button>

      <Button onClick={ actions.addGroup } className='button'>
        <Icon>
          <Isvg src='./svg/folder.svg'/>
        </Icon>
        <span>Add Group</span>
      </Button>

      <Button onClick={ actions.reloadAllRepos } className={ 'button' + (app.reloadingAllRepos ? ' progressing' : '') } >
        <Icon>
          <Isvg src='./svg/reload.svg'/>
        </Icon>
        <span>Reload all</span>
      </Button>
    </StyledNav>
  );
};

NavComponent.propTypes = {
  app: PropTypes.object.isRequired,
  actions: PropTypes.object.isRequired
};

{'fraction_non_alphanumeric': 0.16881483810122602, 'fraction_numerical': 0.0028292989625903803, 'mean_word_length': 2.470010905125409, 'pattern_counts': {'":': 0, '<': 56, '<?xml version=': 0, '>': 58, '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': '2845904', 'n_tokens_mistral': 1026, 'n_tokens_neox': 1001, 'n_words': 228}