micro library to return @tanstack/react-query callbacks

Available callbacks

• onSettled(data, error) - called when the query status changes to success or error
• onSuccess(data) - called when the query status changes to success
• onError(error) - called when the query status changes to error
• onDataChanged(data) - called every time the data is fetched and is defined

Install

1npm install "react-query-callbacks"

Usage

1import { useQuery } from "@tanstack/react-query";
2import { useQueryCallbacks } from "react-query-callbacks";
3import User from "./your-components/User";
4import { getUsers } from "./your-services/users";
5
6const Users = () => {
7  const usersQuery = useQuery({
8    queryKey: ["users"],
9    queryFn: getUsers,
10  });
11  useQueryCallbacks({
12    query: usersQuery,
13    onError: (error) => {
14      console.error(`Could not fetch users: ${error}`);
15    },
16  });
17
18  return (
19    <>
20      {(usersQuery.data ?? []).map((user) => (
21        <User key={user.id} user={user} />
22      ))}
23    </>
24  );
25};
26
27export default Users;