<commit_before>import React from 'react';
import Menu, {SubMenu, MenuItem, ItemGroup} from 'rc-menu';
import { SPECS } from '../../constants';
import 'rc-menu/assets/index.css';
import './index.css';

var req = require.context('../../../spec', true, /^(.*\.(json$))[^.]*$/igm);
req.keys().forEach(req);

const formatExampleName = (name) => {
  return name.split('_').map(i => i[0].toUpperCase() + i.substring(1)).join(' ');
}

export default class Header extends React.Component {
  // static propTypes = {
  //   updateVegaSpec: React.PropTypes.function
  // }

  onSelectVega (name) {
    const spec = require(`../../../spec/vega/${name}.vg.json`);
    this.props.updateVegaSpec(JSON.stringify(spec, null, 2));
  }

  onSelectVegaLite (name) {
    const spec = require(`../../../spec/vega-lite/${name}.vl.json`);
    this.props.updateVegaLiteSpec(JSON.stringify(spec, null, 2));
  }

  onSelect (selection) {
    const key = selection.key;
    if (key.startsWith('vega-lite-')) {
      this.onSelectVegaLite(key.substr(10));
    } else if (key.startsWith('vega-')) {
      this.onSelectVega(key.substr(5));
    } else if (key === 'custom-vega') {
      this.props.updateVegaSpec('{}');
    } else if (key === 'custom-vega-lite') {
      this.props.updateVegaSpec('{}');
    }
  }

  render () {
    return (
      <div className='header'>
        <img height={57} alt="IDL Logo" src="https://vega.github.io/images/idl-logo.png" />
        <Menu onSelect={this.onSelect.bind(this)} mode="horizontal" defaultActiveFirst={true}>
          <SubMenu title="Vega Examples">
            {
              Object.keys(SPECS.Vega).map((specType) => {
                const specs = SPECS.Vega[specType];
                return (
                  <ItemGroup key={`vega-${specType}`} title={specType}>
                    {
                      specs.map((spec) => {
                        return (
                          <MenuItem key={`vega-${spec.name}`}>{formatExampleName(spec.name)}</MenuItem>
                        )<commit_msg>Treat vl as vl. cc @kanitw<commit_after>import React from 'react';
import Menu, {SubMenu, MenuItem, ItemGroup} from 'rc-menu';
import { SPECS } from '../../constants';
import 'rc-menu/assets/index.css';
import './index.css';

var req = require.context('../../../spec', true, /^(.*\.(json$))[^.]*$/igm);
req.keys().forEach(req);

const formatExampleName = (name) => {
  return name.split('_').map(i => i[0].toUpperCase() + i.substring(1)).join(' ');
}

export default class Header extends React.Component {
  // static propTypes = {
  //   updateVegaSpec: React.PropTypes.function
  // }

  onSelectVega (name) {
    const spec = require(`../../../spec/vega/${name}.vg.json`);
    this.props.updateVegaSpec(JSON.stringify(spec, null, 2));
  }

  onSelectVegaLite (name) {
    const spec = require(`../../../spec/vega-lite/${name}.vl.json`);
    this.props.updateVegaLiteSpec(JSON.stringify(spec, null, 2));
  }

  onSelect (selection) {
    const key = selection.key;
    if (key.startsWith('vega-lite-')) {
      this.onSelectVegaLite(key.substr(10));
    } else if (key.startsWith('vega-')) {
      this.onSelectVega(key.substr(5));
    } else if (key === 'custom-vega') {
      this.props.updateVegaSpec('{}');
    } else if (key === 'custom-vega-lite') {
      this.props.updateVegaLiteSpec('{}');
    }
  }

  render () {
    return (
      <div className='header'>
        <img height={57} alt="IDL Logo" src="https://vega.github.io/images/idl-logo.png" />
        <Menu onSelect={this.onSelect.bind(this)} mode="horizontal" defaultActiveFirst={true}>
          <SubMenu title="Vega Examples">
            {
              Object.keys(SPECS.Vega).map((specType) => {
                const specs = SPECS.Vega[specType];
                return (
                  <ItemGroup key={`vega-${specType}`} title={specType}>
                    {
                      specs.map((spec) => {
                        return (
                          <MenuItem key={`vega-${spec.name}`}>{formatExampleName(spec.name)}</MenuItem>
                        )
{'fraction_non_alphanumeric': 0.19367492032360872, 'fraction_numerical': 0.004412846285854376, 'mean_word_length': 2.3971690258118237, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 25, 'https://': 2, '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': '4208051', 'n_tokens_mistral': 1346, 'n_tokens_neox': 1322, 'n_words': 221}