Function RuleContent

ui/src/components/Rule/condition.tsx:42–629

(props: IProps)

const SPECIAL_PREDICATE = ['<', '<=', '>', '>='];

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

  const intl = useIntl();
  const [ options, setOption ] = useState<IOption[]>([]);
  const [ popupOpen, setPopupOpen ] = useState<boolean>(false);
  const segmentList: ISegmentList = segmentContainer?.useContainer().segmentList;

  useEffect(() => {
    const handler = () => {
      if (popupOpen) {
        setPopupOpen(false);
      }
    };
    window.addEventListener('click', handler);

    return () => window.removeEventListener('click', handler);
  }, [popupOpen]);

  const {
    handleChangeAttr,
    handleChangeOperator,
    handleChangeDateTime,
    handleChangeTimeZone,
    handleChangeValue,
    handleDeleteCondition,
    handleChangeRightValue,
    handleChangePredict,
    handleChangeRightPredict,
  } = ruleContainer.useContainer();

  const {
    formState: { errors },
    register,
    unregister,
    setValue,
    trigger,
    getValues,
    clearErrors,
    setError,
  } = hooksFormContainer.useContainer();

  const handleDelete = useCallback(async (ruleIndex: number, conditionIndex: number, ruleId?: string) => {
    for(const key in getValues()) {
      if (key.startsWith(`rule_${ruleId}_condition`)) {
        unregister(key);
        clearErrors(key);