i have a boolean state and my code depend on that state one of them if the this state is true i will use history.goback()function , the second one come after the first condition i check if the state is false then do something , but what is happening now if the history.goback() ,the state boolean become false then the second condition hit . so how to fix it .

this my code

  const [isFormSubmitted, setIsFormSubmitted] = useState<boolean>(false);

  useEffect(() => {
    if (submitForm.status === RequestStatus.resolved) {
      setFormLoading(false);
      notification.success({
        message: t('messages.success'),
        description: t('messages.success.requestCreated'),
      });
      setIsFormSubmitted(true);
    } else if (submitForm.status === RequestStatus.rejected) {
      setFormLoading(false);
      notification.error({
        message: t('leaves.newRequest.message.leaveRequestError'),
        description: submitForm.error?.message?.includes('Leave request already exists')
          ? t('leaves.newRequest.error.alreadyExists')
          : submitForm.error?.message,
      });
    }
  }, [submitForm.status, t, submitForm.error?.message]);

useEffect(() => {
    if (isFormSubmitted) {
      history.goBack();
    }
  }, [history, isFormSubmitted]);

  const deleteProcessInstance = useCallback(async () => {


    if (isFormSubmitted === false && processInstanceIdRef.current) {


      try {
.......

}));
      } catch {
        notification.error({
          message: t('messages.error.wentWrong'),
          description: t('messages.error.tryAgainLater'),
        });
      }
    }
  }, [leaveRequestPDK, isFormSubmitted, dispatch, t]);


//this if the user leave the page then this useEffect hit 
 useEffect(
    () => () => {
      deleteProcessInstance();
    },
    // eslint-disable-next-line react-hooks/exhaustive-deps
    []
  );