<commit_before>import React from 'react';
import cx from 'classnames';

const DATABASE_SVG = (
  <svg xmlns="http://www.w3.org/2000/svg" width="16px" height="16px" viewBox="0 0 50 50">
    <path d="M24.985,0C37.556,0,46,4.576,46,8.849c0,4.274-8.444,8.85-21.015,8.85c-12.572,0-21.017-4.576-21.017-8.85 C3.968,4.576,12.413,0,24.985,0z M46,39.151C46,43.424,37.556,48,24.985,48c-12.572,0-21.017-4.576-21.017-8.849v-5.195 c3.676,3.753,11.597,6.302,21.017,6.302c9.418,0,17.34-2.549,21.015-6.302V39.151z M46,29.196c0,4.272-8.444,8.849-21.015,8.849 c-12.572,0-21.017-4.576-21.017-8.849v-5.286c3.676,3.752,11.597,6.301,21.017,6.301c9.418,0,17.34-2.549,21.015-6.301V29.196z M46,19.15C46,23.424,37.556,28,24.985,28c-12.572,0-21.017-4.576-21.017-8.85v-5.541c3.676,3.753,11.597,6.301,21.017,6.301 c9.418,0,17.34-2.547,21.015-6.301V19.15z"></path>
  </svg>
);


const Database = (props) => {
  return (
    <div className={cx('animated fadeIn  panel', props.database)}>
      <div className="panel-heading">
        <h6>{DATABASE_SVG} {!props.database || props.database === 'none' ? 'Database' : props.database}</h6>
      </div>
      <div className="panel-body">
        <div className="radio-group">
          <label className="radio-inline">
            <img className="btn-logo" src="/img/svg/none.png" alt="None" />
            <input type="radio" name="databaseRadios" value="none" onChange={props.handleChange} checked={props.database === 'none'} />
            <span>None</span>
          </label>
          <label className="radio-inline"><commit_msg>Added database descriptions<commit_after>import React from 'react';
import cx from 'classnames';

const DATABASE_SVG = (
  <svg xmlns="http://www.w3.org/2000/svg" width="16px" height="16px" viewBox="0 0 50 50">
    <path d="M24.985,0C37.556,0,46,4.576,46,8.849c0,4.274-8.444,8.85-21.015,8.85c-12.572,0-21.017-4.576-21.017-8.85 C3.968,4.576,12.413,0,24.985,0z M46,39.151C46,43.424,37.556,48,24.985,48c-12.572,0-21.017-4.576-21.017-8.849v-5.195 c3.676,3.753,11.597,6.302,21.017,6.302c9.418,0,17.34-2.549,21.015-6.302V39.151z M46,29.196c0,4.272-8.444,8.849-21.015,8.849 c-12.572,0-21.017-4.576-21.017-8.849v-5.286c3.676,3.752,11.597,6.301,21.017,6.301c9.418,0,17.34-2.549,21.015-6.301V29.196z M46,19.15C46,23.424,37.556,28,24.985,28c-12.572,0-21.017-4.576-21.017-8.85v-5.541c3.676,3.753,11.597,6.301,21.017,6.301 c9.418,0,17.34-2.547,21.015-6.301V19.15z"></path>
  </svg>
);


const Database = (props) => {
  let description;

  switch (props.database) {
    case 'mongodb':
      description = (
        <div>
          <strong><a href="http://mongodb.org/" target="_blank">MongoDB</a></strong> — Document-oriented, general purpose NoSQL database.
        </div>
      );
      break;
    case 'mysql':
      description = (
        <div>
          <strong><a href="http://www.mysql.com/" target="_blank">MySQL</a></strong> — The world's most popular open source database.
        </div>
      );
      break;
    case 'postgresql':
      description = (
        <div>
          <strong><a href="http://www.postgresql.org/" target="_blank">PostgreSQL </a></strong> — The world's most advanced open source database.
        </div>
      );
      break;
    case 'rethinkdb':
      description = (
        <div>
          <strong><a href="https://www.rethinkdb.com/" target="_blank">RethinkDB</a></strong> — The open source database
          for the realtime web.
        </div>
      );
      break;
    default:
      description = <div className="placeholder"> </div>;
  }

  return (
    <div className={cx('animated fadeIn  panel', props.database)}>
      <div className="panel-heading">
        <h6>{DATABASE_SVG} {!props.database || props.database === 'none' ? 'Database' : props.database}</h6>
      </div>
      <div className="panel-body">
        {description}
        <div className="radio-group">
          <label className="radio-inline">
            <img className="btn-logo" src="/img/svg/none.png" alt="None" />
            <input type="radio" name="databaseRadios" value="none" onChange={props.handleChange} checked={props.database === 'none'} />
            <span>None</span>
          </label>
          <label className="radio-inline">
{'fraction_non_alphanumeric': 0.2057142857142857, 'fraction_numerical': 0.2042857142857143, 'mean_word_length': 2.978219696969697, 'pattern_counts': {'":': 0, '<': 65, '<?xml version=': 0, '>': 67, 'https://': 1, 'lorem ipsum': 0, 'www.': 5, 'xml': 2}, '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': '782371', 'n_tokens_mistral': 2161, 'n_tokens_neox': 1720, 'n_words': 213}