<commit_before>
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import moment from 'moment-timezone';
import Markdown from 'markdown-to-jsx';
import { loadItem, unloadItem } from '../../actions';
import Loading from '../../components/Loading';
import Button from '../../components/Button';
import RightIcon from '../../icons/Right';
import FormAdd from './FormAdd';
import FormEdit from './FormEdit';
import PaymentPay from '../payment/PaymentPay';
import SessionSection from '../session/SessionSection';

const LABEL = {
  Register: 'Registered',
  'Sign Up': 'Signed up',
  Submit: 'Submitted',
  Subscribe: 'Subscribed',
};

const LABEL_MULTIPLE = {
  Submit: 'Submitted for',
};

const LOADING = 'loading';
const AUTHENTICATION_NEEDED = 'authenticationNeeded';
const SESSION = 'session';
const ADDING = 'adding';
const EDITING = 'editing';
const PAYING = 'paying';
const SUMMARY = 'summary';

const FormItem = (props) => {
  const {
    className, distinguish, intermediate, item: form, onClick, verb,
  } = props;
  const classNames = ['item__container', className];
  let message;
  let timestamp;
  if (intermediate) {
    message = `${form.name}`;
  } else {
    const date = moment(form.modified).format('MMM Do YYYY');
    timestamp = <span className="tertiary">{date}</span>;
    if (distinguish) {
      message = `${verb} ${form.name}`;
    } else {
      message = `${verb}`;
    }
  }

  return (
    <div className={classNames.join(' ')}>
      <div className="item item--full">
        <div>
          <button className="button button-plain" onClick={onClick}>
            {message} {timestamp} <RightIcon className="button__indicator" />
          </button>
        </div>
      </div>
    </div>
  );
};

FormItem.propTypes = {
  className: PropTypes.string,
  distinguish: PropTypes.bool,
  intermediate: PropTypes.bool,
  item: PropTypes.object.isRequired,
  onClick: PropTypes.func.isRequired,
  verb: PropTypes.string,
};

FormItem.defaultProps = {
  className: undefined,
  distinguish: false,
  intermediate: false,
  verb: undefined,
};

class FormSection extends Component {

  constructor(props) {
    super(props);
    this._nextState = this._nextState.bind(this);
    this._onCancel = this._onCancel.bind(this);
    this._onDone = this._onDone.bind(this);
    this.state = { state: LOADING };
  }

  componentDidMount() {
    this._load(this.props);
    this._resetState(this.props);
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.formTemplateId !== this.props.formTemplateId ||
      (nextProps.session && !this.props.session) ||
      (!nextProps.session && this.props.session)) {
      this._load(nextProps);
    } else {
      this._resetState(nextProps);
    }
  }

  componentWillUnmount() {
    const { dispatch, formTemplateId } = this.props;
    dispatch(unloadItem('form-templates', formTemplateId));
  }

  _load(props) {
    const { dispatch, formTemplate, formTemplateId } = props;
    if (formTemplateId) {
      if (!formTemplate) {
        dispatch(loadItem('form-templates', formTemplateId,
          { full: true, forSession: true }));
      }
    }
  }

  _resetState(props) {
    const { session, formTemplate } = props;
    const { editForm, editId } = this.state;

    let nextState;
    let activeFormTemplate = formTemplate;
    if (!formTemplate) {
      nextState = LOADING;
    } else if (!session && formTemplate.authenticate) {
      nextState = AUTHENTICATION_NEEDED;
    } else if (formTemplate.linkedFormTemplate) {
      if (formTemplate.linkedFormTemplate.forms.length === 0) {
        activeFormTemplate = formTemplate.linkedFormTemplate;
        nextState = ADDING;
      } else {
        nextState = SUMMARY;
      }
    } else if (!formTemplate.forms || formTemplate.forms.length === 0) {
      nextState = ADDING;
    } else if (editId || editForm) {
      nextState = EDITING;
    } else if (formTemplate.totalCost < formTemplate.paidAmount
      && !formTemplate.anotherLabel) {
      nextState = PAYING;
    } else {
      nextState = SUMMARY;
    }

    this.setState({ activeFormTemplate, state: nextState });
  }

  _add(linkedForm) {
    return () => {
      let { formTemplate } = this.props;
      const linkedFormTemplate = linkedForm ? formTemplate.linkedFormTemplate : undefined;
      while (formTemplate.linkedFormTemplate && !linkedForm) {
        formTemplate = formTemplate.linkedFormTemplate;
      }
      this.setState({
        state: ADDING,
        activeFormTemplate: formTemplate,
        linkedForm,
        linkedFormTemplate,
      });
    };
  }

  _edit(form) {
    return () => {
      const { formTemplate } = this.props;
      let linkedForm;
      let linkedFormTemplate;
      if (form.linkedFormId) {
        linkedFormTemplate = formTemplate.linkedFormTemplate;
        linkedFormTemplate.forms.some((form2) => {
          if (form2._id === form.linkedFormId) {
            linkedForm = form2;
            return true;
          }
          return false;
        });
      }
      this.setState({
        editForm: form, linkedForm, linkedFormTemplate, state: EDITING,
      });
    };
  }

  _onCancel() {
    this.setState({
      adding: undefined,
      editForm: undefined,
      paymentFormId: undefined,
      // layoutNeeded: true,
    });
  }

  _nextState(state) {
    return () => {
      this.setState({ state, editForm: undefined, paymentFormId: undefined });
    };
  }

  _onDone() {
    const { dispatch, formTemplateId } = this.props;
    dispatch(loadItem('form-templates', formTemplateId,
      { full: true, forSession: true }));
  }

  render() {
    const { className, formTemplate, formTemplateId, session } = this.props;
    const {
      activeFormTemplate, editForm, linkedForm, linkedFormTemplate, state,
    } = this.state;

    // determine which set of forms to show
    let forms = [];
    if (formTemplate && formTemplate.linkedFormTemplate) {
      forms = formTemplate.linkedFormTemplate.forms.map((form2) => {
        let bestForm = form2;
        formTemplate.forms.some((form) => {
          if (form.linkedFormId === form2._id) {
            bestForm = form;
            return true;
          }
          return false;
        });
        return bestForm;
      });
    } else if (formTemplate) {
      forms = formTemplate.forms || [];
    }

    const classes = ['form-summary__container'];
    if (className) {
      classes.push(className);
    }
<commit_msg>Fixed issues with updating and removing forms in FormSection<commit_after>
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import moment from 'moment-timezone';
import Markdown from 'markdown-to-jsx';
import { loadItem, unloadItem } from '../../actions';
import Loading from '../../components/Loading';
import Button from '../../components/Button';
import RightIcon from '../../icons/Right';
import FormAdd from './FormAdd';
import FormEdit from './FormEdit';
import PaymentPay from '../payment/PaymentPay';
import SessionSection from '../session/SessionSection';

const LABEL = {
  Register: 'Registered',
  'Sign Up': 'Signed up',
  Submit: 'Submitted',
  Subscribe: 'Subscribed',
};

const LABEL_MULTIPLE = {
  Submit: 'Submitted for',
};

const LOADING = 'loading';
const AUTHENTICATION_NEEDED = 'authenticationNeeded';
const SESSION = 'session';
const ADDING = 'adding';
const EDITING = 'editing';
const PAYING = 'paying';
const SUMMARY = 'summary';

const FormItem = (props) => {
  const {
    className, distinguish, intermediate, item: form, onClick, verb,
  } = props;
  const classNames = ['item__container', className];
  let message;
  let timestamp;
  if (intermediate) {
    message = `${form.name}`;
  } else {
    const date = moment(form.modified).format('MMM Do YYYY');
    timestamp = <span className="tertiary">{date}</span>;
    if (distinguish) {
      message = `${verb} ${form.name}`;
    } else {
      message = `${verb}`;
    }
  }

  return (
    <div className={classNames.join(' ')}>
      <div className="item item--full">
        <div>
          <button className="button button-plain" onClick={onClick}>
            {message} {timestamp} <RightIcon className="button__indicator" />
          </button>
        </div>
      </div>
    </div>
  );
};

FormItem.propTypes = {
  className: PropTypes.string,
  distinguish: PropTypes.bool,
  intermediate: PropTypes.bool,
  item: PropTypes.object.isRequired,
  onClick: PropTypes.func.isRequired,
  verb: PropTypes.string,
};

FormItem.defaultProps = {
  className: undefined,
  distinguish: false,
  intermediate: false,
  verb: undefined,
};

class FormSection extends Component {

  constructor(props) {
    super(props);
    this._nextState = this._nextState.bind(this);
    this._onCancel = this._onCancel.bind(this);
    this._onDone = this._onDone.bind(this);
    this.state = { state: LOADING };
  }

  componentDidMount() {
    this._load(this.props);
    this._resetState(this.props);
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.formTemplateId !== this.props.formTemplateId ||
      (nextProps.session && !this.props.session) ||
      (!nextProps.session && this.props.session)) {
      this._load(nextProps);
    } else {
      this._resetState(nextProps);
    }
  }

  componentWillUnmount() {
    const { dispatch, formTemplateId } = this.props;
    dispatch(unloadItem('form-templates', formTemplateId));
  }

  _load(props) {
    const { dispatch, formTemplate, formTemplateId } = props;
    if (formTemplateId) {
      if (!formTemplate) {
        dispatch(loadItem('form-templates', formTemplateId,
          { full: true, forSession: true }));
      }
    }
  }

  _resetState(props) {
    const { session, formTemplate } = props;
    const { editForm, editId } = this.state;

    let nextState;
    let activeFormTemplate = formTemplate;
    if (!formTemplate) {
      nextState = LOADING;
    } else if (!session && formTemplate.authenticate) {
      nextState = AUTHENTICATION_NEEDED;
    } else if (formTemplate.linkedFormTemplate) {
      if (formTemplate.linkedFormTemplate.forms.length === 0) {
        activeFormTemplate = formTemplate.linkedFormTemplate;
        nextState = ADDING;
      } else {
        nextState = SUMMARY;
      }
    } else if (!formTemplate.forms || formTemplate.forms.length === 0) {
      nextState = ADDING;
    } else if (editId || editForm) {
      nextState = EDITING;
    } else if (formTemplate.totalCost < formTemplate.paidAmount
      && !formTemplate.anotherLabel) {
      nextState = PAYING;
    } else {
      nextState = SUMMARY;
    }

    this.setState({ activeFormTemplate, state: nextState });
  }

  _add(linkedForm) {
    return () => {
      let { formTemplate } = this.props;
      const linkedFormTemplate = linkedForm ? formTemplate.linkedFormTemplate : undefined;
      while (formTemplate.linkedFormTemplate && !linkedForm) {
        formTemplate = formTemplate.linkedFormTemplate;
      }
      this.setState({
        state: ADDING,
        activeFormTemplate: formTemplate,
        linkedForm,
        linkedFormTemplate,
      });
    };
  }

  _edit(form) {
    return () => {
      const { formTemplate } = this.props;
      let linkedForm;
      let linkedFormTemplate;
      if (form.linkedFormId) {
        linkedFormTemplate = formTemplate.linkedFormTemplate;
        linkedFormTemplate.forms.some((form2) => {
          if (form2._id === form.linkedFormId) {
            linkedForm = form2;
            return true;
          }
          return false;
        });
      }
      this.setState({
        editForm: form, linkedForm, linkedFormTemplate, state: EDITING,
      });
    };
  }

  _onCancel() {
    this.setState({
      adding: undefined,
      editForm: undefined,
      paymentFormId: undefined,
      // layoutNeeded: true,
    });
  }

  _nextState(state) {
    return () => {
      this.setState({ state, editForm: undefined, paymentFormId: undefined });
    };
  }

  _onDone() {
    const { dispatch, formTemplateId } = this.props;
    this.setState({ editId: undefined, editForm: undefined, state: LOADING });
    dispatch(loadItem('form-templates', formTemplateId,
      { full: true, forSession: true, new: true }));
  }

  render() {
    const { className, formTemplate, formTemplateId, session } = this.props;
    const {
      activeFormTemplate, editForm, linkedForm, linkedFormTemplate, state,
    } = this.state;

    // determine which set of forms to show
    let forms = [];
    if (formTemplate && formTemplate.linkedFormTemplate) {
      forms = formTemplate.linkedFormTemplate.forms.map((form2) => {
        let bestForm = form2;
        formTemplate.forms.some((form) => {
          if (form.linkedFormId === form2._id) {
            bestForm = form;
            return true;
          }
          return false;
        });
        return bestForm;
      });
    } else if (formTemplate) {
      forms = formTemplate.forms || [];
    }

    const classes = ['form-summary__container'];
    if (className) {
      classes.push(className);
    }

{'fraction_non_alphanumeric': 0.13167259786476868, 'fraction_numerical': 0.0012114787612629665, 'mean_word_length': 2.821759259259259, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 39, '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': '7636778', 'n_tokens_mistral': 3920, 'n_tokens_neox': 3890, 'n_words': 877}