useDataConnectQuery
useDataConnectQuery
is a hook designed to simplify data fetching and state management with Firebase Data Connect.
See querying for more information.
Features
- Provides type-safe handling of queries based on the Firebase Data Connect schema.
- Simplifies data fetching using Firebase Data Connect.
- Automatically manages loading, success, and error states.
- Supports refetching data with integrated caching.
Usage
import { useDataConnectQuery } from "@tanstack-query-firebase/react/data-connect";
import { listMoviesQuery } from "@your-package-name/your-connector";
function Component() {
const { data, isPending, isSuccess, isError, error } = useDataConnectQuery(
listMoviesQuery()
);
if (isPending) return <div>Loading...</div>;
if (isError) return <div>Error: {error.message}</div>;
return (
<div>
{isSuccess && (
<ul>
{data.movies.map((movie) => (
<li key={movie.id}>{movie.title}</li>
))}
</ul>
)}
</div>
);
}