React Navigation taking me to home screen from login screen even if the credentials are right or wrong. Also, no error Alert is being displayed

Question

Loginhandler is the function which evokes after clicking log in button. Below are the pieces of two files. LoginScreen is my login.js file where as Action is my action file. I have made reducer file too, but my focus is to get the username and the password from input field, send it to action file using loginhandler function and on success, opens up my Home Screen and on Error, the Alert pops up.

----------------Login Screen------------
    useEffect(() => {
        if (error) {
          Alert.alert("An Error Occurred!", error, [{ text: "Okay" }]);
        }
      }, [error]);
    
      const loginHandler = async () => {
        let action = authActions.login(
          formState.inputValues.username,
          formState.inputValues.password
        );
        setError(null);
        setIsLoading(true);
        try {
          await dispatch(action);
          props.navigation.navigate("PostAuth");
        } catch (err) {
          setError(err);
          setIsLoading(false);
        }
      };
    
    -----------------ACTION FILE-------------------
    const axios = require("axios");
    export const LOGIN = "LOGIN";
    export const login = (username, password) => {
      const params = new URLSearchParams();
      params.append("username", username);
      params.append("password", password);
      return async (dispatch) => {enter code here
        axios
          .post("xyz.com/testApp/api/login.php", params)
          .then((response) => {
            const res = response.data.response;
            const resMsg = res.message;
    
            let preDefinedErrMsg;
    
            if (resMsg !== "success") {
              preDefinedErrMsg = "Wrong Credentials";
              throw new Error(preDefinedErrMsg);
            }
    
            dispatch({
              type: LOGIN,
              token: "resData.idToken",
              userId: "resData.id",
              errorMessage: "message",
            });
    
            console.log(response);
          })
          .catch((err) => {
            //console.log(err);
          });
      };
    };

Answer 1

Yes I got it solved, by handling error in my action file.

const axios = require("axios");
export const LOGIN = "LOGIN";
export const login = (username, password) => {
  const params = new URLSearchParams();
  params.append("username", username);
  params.append("password", password);
  return async (dispatch) => {
    await axios
      .post("xyz.com/api/login.php", params)
      .then((response) => {
        const res = response.data.response;
        const resMsg = res.message;
        let preDefinedMsg;

        if (resMsg === "Error") {
          preDefinedErrMsg = "Wrong Credentials";
          throw new Error(preDefinedErrMsg);
        } else if (resMsg === "success") {
          preDefinedMsg = "success";
          dispatch({
            type: LOGIN,
            token: "resData.idToken",
            userId: "resData.id",
            errorMessage: "message",
          });
        }
      })
      .catch((error) => {
        if (error.message === preDefinedErrMsg) {
          throw new Error(preDefinedErrMsg);
        }
      });
  };
};