Console Error: Query data cannot be undefined & handleLogin hangs at `isLoading`

  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const handleUserChange = (text: string) => setEmail(text);
  const handlePassChange = (text: string) => setPassword(text);

  // Query function to handle login
  const loginQuery = useQuery({
    queryKey: ["userInfo"],
    queryFn: async () => {
      return axios
        .post("http://10.0.0.2:3000/api/v1/login", {
          email,
          password,
        })
        .then((response): {} => {
          return response.data;
        })
        .catch((error) => {
          console.error(error.message);
        });
    },
  });

  const handleLogin = () => {
    const { isPending, isSuccess, isError, error, data } = loginQuery;
    if (isSuccess) {
      return <Redirect href="/(tabs)/profile" />;
    }
    if (isPending) {
      return <Text>Loading...</Text>; // Render loading indicator
    }
    if (isError) {
      return <Text>An error occurred: {error.message}</Text>; // Render error message
    }
  };