<commit_before>import React, { Component } from 'react'
import { Modal, Button, Radio, FormControl, Alert } from 'react-bootstrap'
import Select from 'react-select'
import _ from 'lodash'

const style = require('./style.scss')

export default class ConditionModalForm extends Component {
  constructor(props) {
    super(props)

    this.state = {
      typeOfTransition: 'end',
      flowToSubflow: null,
      flowToNode: null,
      transitionError: null,
      conditionError: null
    }
  }

  componentWillReceiveProps(nextProps) {
    const { item } = nextProps

    if (this.props.show || !nextProps.show) {
      return
    }

    if (item) {
      let typeOfTransition = item.node.indexOf('.') !== -1 ? 'subflow' : 'node'
      typeOfTransition = item.node === 'END' ? 'end' : typeOfTransition

      this.setState({
        typeOfTransition,
        condition: item.condition,
        flowToSubflow: typeOfTransition === 'subflow' ? item.node : null,
        flowToNode: typeOfTransition === 'node' ? { label: item.node, value: item.node } : null
      })
    } else {
      this.resetForm()
    }
    this.setState({ isEdit: Boolean(item) })
  }

  changeTransitionType(type) {
    const subflowOptions = this.getSubflowOptions()
    const nodeOptions = this.getNodeOptions()
    this.setState({
      typeOfTransition: type,
      flowToSubflow: this.state.flowToSubflow || (subflowOptions && subflowOptions[0]),
      flowToNode: this.state.flowToNode || (nodeOptions && nodeOptions[0])
    })
  }

  validation() {
    if (this.state.typeOfTransition === 'subflow' && !this.state.flowToSubflow) {
      this.setState({
        transitionError: 'You must select a subflow to transition to'
      })

      return false
    }

    if (this.state.typeOfTransition === 'node' && !this.state.flowToNode && this.getNodeOptions().length > 0) {
      this.setState({
        transitionError: 'You must select a subflow to transition to'
      })

      return false
    }

    if (_.isEmpty(this.state.condition)) {
      this.setState({
        conditionError: 'Specify a condition'
      })

      return false
    }

    this.setState({
      conditionError: null,
      transitionError: null
    })

    return true
  }

  resetForm() {
    this.setState({
      typeOfTransition: 'end',
      flowToSubflow: null,
      flowToNode: null,
      conditionError: null,
      transitionError: null,
      condition: ''
    })
  }

  onSubmitClick() {
    if (this.validation()) {
      const payload = { condition: this.state.condition }

      if (this.state.typeOfTransition === 'subflow') {
        payload.node = this.state.flowToSubflow.value
      } else if (this.state.typeOfTransition === 'end') {
        payload.node = 'END'
      } else if (this.state.typeOfTransition === 'node') {
        payload.node = this.state.flowToNode.value || ''
      } else {
        payload.node = ''
      }

      this.props.onSubmit(payload)
      this.resetForm()
    }
  }

  getSubflowOptions() {
    return this.props.subflows.map(flow => ({
      label: flow,
      value: flow
    }))
  }

  renderSubflowChoice() {
    return (
      <Select
        name="flowToSubflow"
        value={this.state.flowToSubflow}<commit_msg>fix - on transition to flow (on node) crash<commit_after>import React, { Component } from 'react'
import { Modal, Button, Radio, FormControl, Alert } from 'react-bootstrap'
import Select from 'react-select'
import _ from 'lodash'

const style = require('./style.scss')

export default class ConditionModalForm extends Component {
  constructor(props) {
    super(props)

    this.state = {
      typeOfTransition: 'end',
      flowToSubflow: null,
      flowToNode: null,
      transitionError: null,
      conditionError: null
    }
  }

  componentWillReceiveProps(nextProps) {
    const { item } = nextProps

    if (this.props.show || !nextProps.show) {
      return
    }

    if (item) {
      let typeOfTransition = item.node.indexOf('.') !== -1 ? 'subflow' : 'node'
      typeOfTransition = item.node === 'END' ? 'end' : typeOfTransition

      this.setState({
        typeOfTransition,
        condition: item.condition,
        flowToSubflow: typeOfTransition === 'subflow' ? item.node : null,
        flowToNode: typeOfTransition === 'node' ? { label: item.node, value: item.node } : null
      })
    } else {
      this.resetForm()
    }
    this.setState({ isEdit: Boolean(item) })
  }

  changeTransitionType(type) {
    const subflowOptions = this.getSubflowOptions()
    const nodeOptions = this.getNodeOptions()
    this.setState({
      typeOfTransition: type,
      flowToSubflow: this.state.flowToSubflow || (subflowOptions && subflowOptions[0]),
      flowToNode: this.state.flowToNode || (nodeOptions && nodeOptions[0])
    })
  }

  validation() {
    if (this.state.typeOfTransition === 'subflow' && !this.state.flowToSubflow) {
      this.setState({
        transitionError: 'You must select a subflow to transition to'
      })

      return false
    }

    if (this.state.typeOfTransition === 'node' && !this.state.flowToNode && this.getNodeOptions().length > 0) {
      this.setState({
        transitionError: 'You must select a subflow to transition to'
      })

      return false
    }

    if (_.isEmpty(this.state.condition)) {
      this.setState({
        conditionError: 'Specify a condition'
      })

      return false
    }

    this.setState({
      conditionError: null,
      transitionError: null
    })

    return true
  }

  resetForm() {
    this.setState({
      typeOfTransition: 'end',
      flowToSubflow: null,
      flowToNode: null,
      conditionError: null,
      transitionError: null,
      condition: ''
    })
  }

  onSubmitClick() {
    if (this.validation()) {
      const payload = { condition: this.state.condition }

      if (this.state.typeOfTransition === 'subflow') {
        payload.node = this.state.flowToSubflow.value
      } else if (this.state.typeOfTransition === 'end') {
        payload.node = 'END'
      } else if (this.state.typeOfTransition === 'node') {
        payload.node = _.get(this.state, 'flowToNode.value') || ''
      } else {
        payload.node = ''
      }

      this.props.onSubmit(payload)
      this.resetForm()
    }
  }

  getSubflowOptions() {
    return this.props.subflows.map(flow => ({
      label: flow,
      value: flow
    }))
  }

  renderSubflowChoice() {
    return (
      <Select
        name="flowToSubflow"
        value={this.state.flowToSubflow}
{'fraction_non_alphanumeric': 0.12761377613776137, 'fraction_numerical': 0.0012300123001230013, 'mean_word_length': 2.544959128065395, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 7, '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': '139980', 'n_tokens_mistral': 1984, 'n_tokens_neox': 1954, 'n_words': 421}