I have a login error handling with redux which looks likes this:

export const login = (params: any) => async (dispatch: Dispatch) => {
  try {
    const authData = await API.post("login", params);
    sessionStorage.setItem("access_token", authData?.data?.access_token);
    dispatch(ActionCreators.getTokens(authData?.data?.access_token));
  } catch (error) {
    throw error;
  }
};

Then in my component, I am trying to catch the error with try/catch again, but I do not have an access to response. Guess because of try/catch scope.

  const submitHandler = async (e: SyntheticEvent) => {
    e.preventDefault();
    try {
      var res: any = await dispatch(
        login({
          email,
          password,
          token,
        })
      );

      router.push("/dashboard");
    } catch (error) {
      setError(res?.response.data.message);
    }
  };

Any idea how to fix that? Thank you.