<commit_before>import React from 'react';

import ErrorableTextInput from '../../common/components/form-elements/ErrorableTextInput';
import Modal from '../../common/components/Modal';
import { makeField } from '../../common/model/fields';
import { validateFolderName } from '../utils/validations';
import { createNewFolderSettings } from '../config';

class ModalCreateFolder extends React.Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleValueChange = this.handleValueChange.bind(this);
  }

  handleValueChange(field) {
    this.props.onValueChange(makeField(field.value, true));
  }

  handleSubmit(domEvent) {
    domEvent.preventDefault();
    const newFolderName = this.props.newFolderName;

    // Mark the field dirty upon submit to trigger validation
    // that only works on dirty fields.
    if (!newFolderName.dirty) {
      this.handleValueChange(newFolderName);
    } else {
      this.props.onSubmit(newFolderName.value);
    }
  }

  render() {
    const foldersWeHave = this.props.folders;
    const newFolderName = this.props.newFolderName;
    const error = validateFolderName(newFolderName, foldersWeHave);

    const modalContents = (
      <form onSubmit={this.handleSubmit}>
        <h3 className="messaging-modal-title">
          Create new folder
        </h3>
        <ErrorableTextInput
            errorMessage={error.hasError ? createNewFolderSettings.errorMessages[error.type] : undefined}
            label="Please enter a new folder name:"
            onValueChange={this.handleValueChange}
            name="newFolderName"
            charMax={createNewFolderSettings.maxLength}
            field={this.props.newFolderName}/>

        <div className="va-modal-button-group">
          <button
              disabled={error.hasError}
              type="submit">Create</button>
          <button
              className="usa-button-outline"
              onClick={this.props.onClose}<commit_msg>Disables 'Create' button until field is dirty.<commit_after>import React from 'react';

import ErrorableTextInput from '../../common/components/form-elements/ErrorableTextInput';
import Modal from '../../common/components/Modal';
import { makeField } from '../../common/model/fields';
import { validateFolderName } from '../utils/validations';
import { createNewFolderSettings } from '../config';

class ModalCreateFolder extends React.Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleValueChange = this.handleValueChange.bind(this);
  }

  handleValueChange(field) {
    this.props.onValueChange(makeField(field.value, true));
  }

  handleSubmit(domEvent) {
    domEvent.preventDefault();
    const newFolderName = this.props.newFolderName;

    // Mark the field dirty upon submit to trigger validation
    // that only works on dirty fields.
    if (!newFolderName.dirty) {
      this.handleValueChange(newFolderName);
    } else {
      this.props.onSubmit(newFolderName.value);
    }
  }

  render() {
    const foldersWeHave = this.props.folders;
    const newFolderName = this.props.newFolderName;
    const error = validateFolderName(newFolderName, foldersWeHave);

    const modalContents = (
      <form onSubmit={this.handleSubmit}>
        <h3 className="messaging-modal-title">
          Create new folder
        </h3>
        <ErrorableTextInput
            errorMessage={error.hasError ? createNewFolderSettings.errorMessages[error.type] : undefined}
            label="Please enter a new folder name:"
            onValueChange={this.handleValueChange}
            name="newFolderName"
            charMax={createNewFolderSettings.maxLength}
            field={this.props.newFolderName}/>

        <div className="va-modal-button-group">
          <button
              disabled={error.hasError || this.props.newFolderName.dirty === false}
              type="submit">Create</button>
          <button
              className="usa-button-outline"
              onClick={this.props.onClose}
{'fraction_non_alphanumeric': 0.11486651971589518, 'fraction_numerical': 0.0009796718099436689, 'mean_word_length': 2.984390243902439, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 17, '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': '2268100', 'n_tokens_mistral': 1100, 'n_tokens_neox': 1090, 'n_words': 217}