<commit_before>import React from "react/addons";
import {Link} from "react-router";

import classNames from "classnames";

import PopoverComponent from "./PopoverComponent";

import OnClickOutsideMixin from "react-onclickoutside";

var HelpMenu = React.createClass({

  contextTypes: {
    router: React.PropTypes.func
  },

  mixins: [OnClickOutsideMixin],

  getInitialState: function () {
    return {
      helpMenuVisible: false
    };
  },

  handleClickOutside: function () {
    this.setState({
      helpMenuVisible: false
    });
  },

  toggleHelpMenu: function () {
    this.setState({
      helpMenuVisible: !this.state.helpMenuVisible
    });
  },

  render: function () {
    var router = this.context.router;
    var helpMenuClassName = classNames("help-menu icon help", {
      "active": this.state.helpMenuVisible
    });

    return (
        <div className={helpMenuClassName}
             onClick={this.toggleHelpMenu}>
          <span className="caret"></span>

        <PopoverComponent visible={this.state.helpMenuVisible}
            className="help-menu-dropdown">
          <ul className="dropdown-menu">
            <li>
              <Link to={router.getCurrentPathname()}
                  query={{modal: "about"}}>
                About
              </Link>
            </li>
            <li>
              <a href="../help" target="_blank">
                API Reference
              </a>
            </li>
            <li>
              <a href="https://mesosphere.github.io/marathon/docs/"
                  target="_blank">
                Documentation
              </a>
            </li>
          </ul>
        </PopoverComponent>
      </div>
    );
  }
});

export default HelpMenu;
<commit_msg>Fix HelpMenu spacing<commit_after>import React from "react/addons";
import {Link} from "react-router";

import classNames from "classnames";

import PopoverComponent from "./PopoverComponent";

import OnClickOutsideMixin from "react-onclickoutside";

var HelpMenu = React.createClass({

  contextTypes: {
    router: React.PropTypes.func
  },

  mixins: [OnClickOutsideMixin],

  getInitialState: function () {
    return {
      helpMenuVisible: false
    };
  },

  handleClickOutside: function () {
    this.setState({
      helpMenuVisible: false
    });
  },

  toggleHelpMenu: function () {
    this.setState({
      helpMenuVisible: !this.state.helpMenuVisible
    });
  },

  render: function () {
    var router = this.context.router;
    var helpMenuClassName = classNames("help-menu icon help", {
      "active": this.state.helpMenuVisible
    });

    return (
      <div className={helpMenuClassName}
          onClick={this.toggleHelpMenu}>
        <span className="caret"></span>
        <PopoverComponent visible={this.state.helpMenuVisible}
            className="help-menu-dropdown">
          <ul className="dropdown-menu">
            <li>
              <Link to={router.getCurrentPathname()}
                  query={{modal: "about"}}>
                About
              </Link>
            </li>
            <li>
              <a href="../help" target="_blank">
                API Reference
              </a>
            </li>
            <li>
              <a href="https://mesosphere.github.io/marathon/docs/"
                  target="_blank">
                Documentation
              </a>
            </li>
          </ul>
        </PopoverComponent>
      </div>
    );
  }
});

export default HelpMenu;

{'fraction_non_alphanumeric': 0.12719424460431655, 'fraction_numerical': 0.0, 'mean_word_length': 1.9234650967199327, 'pattern_counts': {'":': 2, '<': 43, '<?xml version=': 0, '>': 43, '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': '6320387', 'n_tokens_mistral': 976, 'n_tokens_neox': 951, 'n_words': 192}