<commit_before>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Immutable from 'immutable';
import _ from 'lodash';
import { intlShape, FormattedMessage } from 'react-intl';
import SelectMenu from '../../common/SelectMenu';
import SidebarHeader from './SidebarHeader';
import SidebarControls from './SidebarControls';
import { filterColumns, columnSelectOptions, columnSelectSelectedOption } from '../../../utilities/column';

function SelectColumn({ columns, latOrLong, onChange, value, intl }) {
  const columnName = 'columnName'.concat(_.capitalize(latOrLong));
  const translationId = `select_column_${latOrLong}`;
  const cols = filterColumns(columns, ['number']);
  return (
    <div className="inputGroup">
      <label htmlFor={columnName}>
        <FormattedMessage id={translationId} />
      </label>
      <SelectMenu
        name={columnName}
        value={columnSelectSelectedOption(value, cols)}
        onChange={onChange}
        options={columnSelectOptions(intl, cols)}
      />
    </div>
  );
}

SelectColumn.propTypes = {
  columns: PropTypes.object.isRequired,
  latOrLong: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
  value: PropTypes.string,
  intl: intlShape,
};

export default class GenerateGeopoints extends Component {
  constructor() {
    super();
    this.state = {
      transformation: Immutable.fromJS({
        op: 'core/generate-geopoints',
        args: {
          columnNameLat: null,
          columnNameLong: null,
          ColumnTitleGeo: '',
        },
        onError: 'fail',
      }),
    };
    this.handleSelectColumn = this.handleSelectColumn.bind(this);
    this.isValidTransformation = this.isValidTransformation.bind(this);
    this.handleChangeColumnTitleGeo = this.handleChangeColumnTitleGeo.bind(this);
  }

  handleSelectColumn(value, latOrLong) {
    const { transformation } = this.state;
    const columnName = 'columnName'.concat(_.capitalize(latOrLong));
    this.setState({
      transformation: transformation.setIn(['args', columnName], value),
    });
  }

  isValidTransformation() {
    const { transformation } = this.state;
    return transformation.getIn(['args', 'columnNameLat']) != null
      && transformation.getIn(['args', 'columnNameLong']) != null
      && transformation.getIn(['args', 'columnTitleGeo']) !== '';
  }

  handleChangeColumnTitleGeo(value) {
    const { transformation } = this.state;
    this.setState({
      transformation: transformation.setIn(['args', 'columnTitleGeo'], value),
    });
  }

  render() {
    const { onClose, onApply, columns, intl } = this.props;
    const args = this.state.transformation.get('args');
    return (
      <div
        className="DataTableSidebar"
      >
        <SidebarHeader onClose={onClose}>
          <FormattedMessage id="generate_geopoints" />
        </SidebarHeader>
        <div className="inputs">
          <SelectColumn
            columns={columns}
            latOrLong="lat"
            intl={intl}
            onChange={value => this.handleSelectColumn(value, 'lat')}
            value={args.get('columnNameLat')}
          />
          <SelectColumn
            columns={columns}
            latOrLong="long"
            intl={intl}
            onChange={value => this.handleSelectColumn(value, 'long')}
            value={args.get('columnNameLong')}
          />
          <div className="inputGroup">
            <label
              htmlFor="titleTextInput"
            >
              <FormattedMessage id="column_title_geo" />
            </label>
            <input
              value={args.get('columnTitleGeo') || ''}
              type="text"
              className="titleTextInput"
              data-test-id="columnTitle"
              onChange={evt => this.handleChangeColumnTitleGeo(evt.target.value)}
            />
          </div>
        </div>
        <SidebarControls
          positiveButtonText={<FormattedMessage id="generate" />}<commit_msg>[#2933] Adjust the position of the column definition<commit_after>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Immutable from 'immutable';
import _ from 'lodash';
import { intlShape, FormattedMessage } from 'react-intl';
import SelectMenu from '../../common/SelectMenu';
import SidebarHeader from './SidebarHeader';
import SidebarControls from './SidebarControls';
import { filterColumns, columnSelectOptions, columnSelectSelectedOption } from '../../../utilities/column';

function SelectColumn({ columns, latOrLong, onChange, value, intl }) {
  const columnName = 'columnName'.concat(_.capitalize(latOrLong));
  const translationId = `select_column_${latOrLong}`;
  const cols = filterColumns(columns, ['number']);
  return (
    <div className="inputGroup">
      <label htmlFor={columnName}>
        <FormattedMessage id={translationId} />
      </label>
      <SelectMenu
        name={columnName}
        value={columnSelectSelectedOption(value, cols)}
        onChange={onChange}
        options={columnSelectOptions(intl, cols)}
      />
    </div>
  );
}

SelectColumn.propTypes = {
  columns: PropTypes.object.isRequired,
  latOrLong: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
  value: PropTypes.string,
  intl: intlShape,
};

export default class GenerateGeopoints extends Component {
  constructor() {
    super();
    this.state = {
      transformation: Immutable.fromJS({
        op: 'core/generate-geopoints',
        args: {
          columnNameLat: null,
          columnNameLong: null,
          ColumnTitleGeo: '',
        },
        onError: 'fail',
      }),
    };
    this.handleSelectColumn = this.handleSelectColumn.bind(this);
    this.isValidTransformation = this.isValidTransformation.bind(this);
    this.handleChangeColumnTitleGeo = this.handleChangeColumnTitleGeo.bind(this);
  }

  handleSelectColumn(value, latOrLong) {
    const { transformation } = this.state;
    const columnName = 'columnName'.concat(_.capitalize(latOrLong));
    this.setState({
      transformation: transformation.setIn(['args', columnName], value),
    });
  }

  isValidTransformation() {
    const { transformation } = this.state;
    return transformation.getIn(['args', 'columnNameLat']) != null
      && transformation.getIn(['args', 'columnNameLong']) != null
      && transformation.getIn(['args', 'columnTitleGeo']) !== '';
  }

  handleChangeColumnTitleGeo(value) {
    const { transformation } = this.state;
    this.setState({
      transformation: transformation.setIn(['args', 'columnTitleGeo'], value),
    });
  }

  render() {
    const { onClose, onApply, columns, intl } = this.props;
    const args = this.state.transformation.get('args');
    // We have now an Array ['group', [{col_1}, {col_2}, {col_n}]]
    const js_columms = columns.toJS()[1];
    return (
      <div
        className="DataTableSidebar"
      >
        <SidebarHeader onClose={onClose}>
          <FormattedMessage id="generate_geopoints" />
        </SidebarHeader>
        <div className="inputs">
          <SelectColumn
            columns={js_columms}
            latOrLong="lat"
            intl={intl}
            onChange={value => this.handleSelectColumn(value, 'lat')}
            value={args.get('columnNameLat')}
          />
          <SelectColumn
            columns={js_columms}
            latOrLong="long"
            intl={intl}
            onChange={value => this.handleSelectColumn(value, 'long')}
            value={args.get('columnNameLong')}
          />
          <div className="inputGroup">
            <label
              htmlFor="titleTextInput"
            >
              <FormattedMessage id="column_title_geo" />
            </label>
            <input
              value={args.get('columnTitleGeo') || ''}
              type="text"
              className="titleTextInput"
              data-test-id="columnTitle"
              onChange={evt => this.handleChangeColumnTitleGeo(evt.target.value)}
            />
          </div>
        </div>
        <SidebarControls
          positiveButtonText={<FormattedMessage id="generate" />}
{'fraction_non_alphanumeric': 0.13288177339901477, 'fraction_numerical': 0.0008620689655172414, 'mean_word_length': 2.7510392609699768, 'pattern_counts': {'":': 0, '<': 47, '<?xml version=': 0, '>': 51, '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': '4668119', 'n_tokens_mistral': 2252, 'n_tokens_neox': 2280, 'n_words': 419}