useConnectQuery

useConnectQuery is a hook designed to simplify data fetching and state management with Firebase Data Connect. This hook integrates with Firebase Data Connect, which leverages GraphQL to interact with a PostgreSQL database (via Cloud SQL) for secure, scalable data operations. The hook simplifies the process of querying data from Firebase Data Connect and provides an easy-to-use interface to manage loading, success, and error states in your React application.

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 { useConnectQuery } from "@tanstack-query-firebase/react";
import { listMoviesQuery } from "@your-package-name/your-connector";

function Component() {
  const { data, isPending, isSuccess, isError, error } = useConnectQuery(
    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>
  );
}