<commit_before>/* eslint-disable react/no-array-index-key */

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { SortableContainer, SortableElement, SortableHandle, arrayMove } from 'react-sortable-hoc';

import { shapeOfCustomField } from '../../prop-types';
import { GetMessage } from '../../../form-filler/helpers';

function isNotEmpty(item) {
  return item !== undefined && item !== null;
}

const DragHandle = SortableHandle(() => (
  <button type="button" className="btn btn-xs btn-default">
    <i className="glyphicon glyphicon-sort" />
  </button>
));

const SortableItem = SortableElement(({ customField, itemIndex, onEdit, onDelete }) => (
  <div className="well well-sm">
    <strong>{customField.name}</strong>
    <div className="pull-right">
      <div className="btn-group">
        <DragHandle />
        <button className="btn btn-xs btn-default" onClick={() => onEdit(customField, itemIndex)}>
          <i className="glyphicon glyphicon-edit" /> {GetMessage('edit')}
        </button>
        <button className="btn btn-xs btn-default" onClick={() => onDelete(itemIndex)}>
          <i className="glyphicon glyphicon-trash" />
        </button>
      </div>
    </div>
    <dl className="dl-horizontal">
      <dt>{GetMessage('customFields_label_dataType')}</dt>
      <dd>{customField.type}</dd><commit_msg>Fixed sorting of custom fields in Firefox. Closes #73.<commit_after>/* eslint-disable react/no-array-index-key */

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { SortableContainer, SortableElement, SortableHandle, arrayMove } from 'react-sortable-hoc';

import { shapeOfCustomField } from '../../prop-types';
import { GetMessage } from '../../../form-filler/helpers';

function isNotEmpty(item) {
  return item !== undefined && item !== null;
}

const DragHandle = SortableHandle(() => (
  <div className="btn btn-xs btn-default">
    <i className="glyphicon glyphicon-sort" />
  </div>
));

const SortableItem = SortableElement(({ customField, itemIndex, onEdit, onDelete }) => (
  <div className="well well-sm">
    <strong>{customField.name}</strong>
    <div className="pull-right">
      <div className="btn-group">
        <DragHandle />
        <button className="btn btn-xs btn-default" onClick={() => onEdit(customField, itemIndex)}>
          <i className="glyphicon glyphicon-edit" /> {GetMessage('edit')}
        </button>
        <button className="btn btn-xs btn-default" onClick={() => onDelete(itemIndex)}>
          <i className="glyphicon glyphicon-trash" />
        </button>
      </div>
    </div>
    <dl className="dl-horizontal">
      <dt>{GetMessage('customFields_label_dataType')}</dt>
      <dd>{customField.type}</dd>
{'fraction_non_alphanumeric': 0.17011995637949837, 'fraction_numerical': 0.0007270083605961468, 'mean_word_length': 3.6802721088435373, 'pattern_counts': {'":': 0, '<': 47, '<?xml version=': 0, '>': 55, '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': '7661556', 'n_tokens_mistral': 822, 'n_tokens_neox': 818, 'n_words': 186}