Function RuleContent

ui/src/components/Rule/RuleContent.tsx:26–164

(props: IProps)

}

const RuleContent = (props: IProps) => {
  const {
    rule,
    disabled,
    ruleIndex,
    useSegment,
    ruleContainer,
    subjectOptions,
    segmentContainer,
    variationContainer,
    hooksFormContainer,
  } = props;

  const intl = useIntl();
  const { registerErrorName } = useFormErrorScrollIntoView();

  const {
    formState: { errors },
  } = hooksFormContainer.useContainer();

  let variations;

  if (variationContainer) {
    variations = variationContainer.useContainer().variations;
  }

  const {
    handleAddCondition,
    handleChangeServe,
  } = ruleContainer.useContainer();

  const ruleAddCls = classNames(
    {
      [styles['rule-add']]: rule.conditions.length > 0
    },
    {
      [styles['rule-add-one']]: rule.conditions.length === 0
    }
  );

  const btnCls = classNames(
    {
      [styles['rule-add-btn']]: true
    },
    {
      [styles['rule-add-btn-error']]: !!errors[`rule_${rule.id}_add`]
    }
  );

	return (
    <div className={styles['rule-content']}>
      {
        rule.conditions?.map((condition: ICondition, index: number) => {
          return (
            <Condition
              key={condition.id}
              rule={rule}
              disabled={disabled}