action.js

const getDDT = (userData) => async (dispatch) => {
  dispatch(loadDDT());

  await account
    .post("getAllDivisionsDistrictThana", userData)
    .then((res) => res)
    .catch((err) => err);
};

component.js

const { divisionList, unionList, districtList, thanaList } = useSelector(
    ({ tpGetDDT }) => tpGetDDT
  );
  const { entityList } = useSelector(({ getWalletRoles }) => getWalletRoles);

  const getReq = useCallback(
    (type) => {
      const commonReq = {
        walletOwnerId: val.walletOwnerId,
        token: val.token,
        list: type,
      };
    
      if (type === "district" && divisionList.length) {
        return {
          ...commonReq,
          divisionId: divisionList.find(({ name }) => name === state.division)
            .name,
        };
      }
      if (type === "thana" && districtList.length) {
        return {
          ...commonReq,
          districtId: districtList.find(({ name }) => name === state.district)
            .name,
        };
      }

      if (type === "union" && thanaList.length) {
        return {
          ...commonReq,
          thanaId: thanaList.find(({ name }) => name === state.thana).name,
        };
      }

      return commonReq;
    },
    [divisionList, state, districtList, thanaList]
  );

  useEffect(() => {
    dispatch(getDDT(getReq("division")));
    return () => {
      dispatch(resetDDT());
    };
  }, []);

  useEffect(() => {
    if (state.division && state.division.length) {
      dispatch(getDDT(getReq("district")));
    }
  }, [state.division]);

  useEffect(() => {
    if (state.district && state.district.length) {
      dispatch(getDDT(getReq("thana")));
    }
  }, [state.district]);

  useEffect(() => {
    if (state.thana && state.thana.length) {
      dispatch(getDDT(getReq("union")));
    }
  }, [state.thana]);