react-query-firebase 1.3.0 → 1.3.1

package/dist/src/firestore/useGetRealtimeDocData.d.ts

@@ -11,7 +11,7 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
     /**
      * A reference to a collection.
      */
-    reference: CollectionReference<AppModelType, DbModelType> | DocumentReference<AppModelType, DbModelType>;
+    reference?: CollectionReference<AppModelType, DbModelType> | DocumentReference<AppModelType, DbModelType>;
     /**
      * Additional path segments that will be applied relative
      * to the first argument.
@@ -21,7 +21,16 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
      * A callback to be called if the listen fails or is
      * cancelled. No further callbacks will occur.
      */
-    onError: (error: FirebaseError) => unknown;
+    onError?: (error: FirebaseError) => unknown;
+};
+/**
+ * @inline
+ */
+export type UseGetRealtimeDocDataResult<AppModelType> = {
+    data: AppModelType | null;
+    isError: boolean;
+    error: FirebaseError | null;
+    isFetching: boolean;
 };
 /**
  * A hook to get realtime updates to a firestore document.
@@ -30,19 +39,19 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
  *
  * @param {UseGetRealtimeDocDataOptions<AppModelType, DbModelType>} options
  *
- * @returns {AppModelType | null}
+ * @returns {UseGetRealtimeDocDataResult<AppModelType>}
  *
  * @example
  * ```jsx
  * const firebaseConfig = {};
  * export const MyComponent = () => {
- *  const doc = useGetRealtimeDocData('collection/documentId');
+ *  const result = useGetRealtimeDocData('collection/documentId');
  *  return (
  *      <div>
- *          {JSON.stringify(doc)}
+ *          {JSON.stringify(result)}
  *      </div>
  *  );
  * };
  * ```
  */
-export declare const useGetRealtimeDocData: <AppModelType, DbModelType extends DocumentData = DocumentData>({ path, pathSegments, reference, onError }: UseGetRealtimeDocDataOptions<AppModelType, DbModelType>) => AppModelType | null;
+export declare const useGetRealtimeDocData: <AppModelType, DbModelType extends DocumentData = DocumentData>({ path, pathSegments, reference, onError }: UseGetRealtimeDocDataOptions<AppModelType, DbModelType>) => UseGetRealtimeDocDataResult<AppModelType>;

package/dist/src/firestore/useGetRealtimeDocData.js

@@ -1,5 +1,5 @@
 import { onSnapshot } from "firebase/firestore";
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { useDocReference } from "./useDocReference";
 /**
  * A hook to get realtime updates to a firestore document.
@@ -8,16 +8,16 @@ import { useDocReference } from "./useDocReference";
  *
  * @param {UseGetRealtimeDocDataOptions<AppModelType, DbModelType>} options
  *
- * @returns {AppModelType | null}
+ * @returns {UseGetRealtimeDocDataResult<AppModelType>}
  *
  * @example
  * ```jsx
  * const firebaseConfig = {};
  * export const MyComponent = () => {
- *  const doc = useGetRealtimeDocData('collection/documentId');
+ *  const result = useGetRealtimeDocData('collection/documentId');
  *  return (
  *      <div>
- *          {JSON.stringify(doc)}
+ *          {JSON.stringify(result)}
  *      </div>
  *  );
  * };
@@ -26,16 +26,31 @@ import { useDocReference } from "./useDocReference";
 export const useGetRealtimeDocData = ({ path, pathSegments, reference, onError }) => {
     const ref = useDocReference({ path, reference, pathSegments });
     const [doc, setDoc] = useState(null);
+    const [isError, setIsError] = useState(false);
+    const [isFetching, setIsFetching] = useState(true);
+    const [error, setError] = useState(null);
     useEffect(() => {
         const unsubscribe = ref
             ? onSnapshot(ref, {
                 next: async (snapshot) => {
+                    setIsFetching(false);
                     setDoc(snapshot.data() || null);
+                    setError(null);
+                    setIsError(false);
                 },
-                error: onError
+                error: (e) => {
+                    setIsError(true);
+                    setError(e);
+                    onError?.(e);
+                }
             })
             : () => { };
         return () => unsubscribe();
-    }, [ref, doc]);
-    return doc;
+    }, [ref, doc, isError, onError, isFetching, error]);
+    return useMemo(() => ({
+        data: doc,
+        isError,
+        isFetching,
+        error
+    }), [doc, isError, error]);
 };

package/package.json

@@ -60,5 +60,5 @@
         "docs:build": "vitepress build docs",
         "docs:preview": "vitepress preview docs"
     },
-    "version": "1.3.0"
+    "version": "1.3.1"
 }

package/src/firestore/useGetRealtimeDocData.ts

@@ -1,6 +1,6 @@
 import { CollectionReference, DocumentData, DocumentReference, onSnapshot } from "firebase/firestore";
 
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { FirebaseError } from "firebase/app";
 import { useDocReference } from "./useDocReference";
 
@@ -15,7 +15,7 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
     /**
      * A reference to a collection.
      */
-    reference: CollectionReference<AppModelType, DbModelType> | DocumentReference<AppModelType, DbModelType>;
+    reference?: CollectionReference<AppModelType, DbModelType> | DocumentReference<AppModelType, DbModelType>;
     /**
      * Additional path segments that will be applied relative
      * to the first argument.
@@ -25,7 +25,17 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
      * A callback to be called if the listen fails or is
      * cancelled. No further callbacks will occur.
      */
-    onError: (error: FirebaseError) => unknown;
+    onError?: (error: FirebaseError) => unknown;
+};
+
+/**
+ * @inline
+ */
+export type UseGetRealtimeDocDataResult<AppModelType> = {
+    data: AppModelType | null;
+    isError: boolean;
+    error: FirebaseError | null;
+    isFetching: boolean;
 };
 
 /**
@@ -35,16 +45,16 @@ export type UseGetRealtimeDocDataOptions<AppModelType, DbModelType extends Docum
  *
  * @param {UseGetRealtimeDocDataOptions<AppModelType, DbModelType>} options
  *
- * @returns {AppModelType | null}
+ * @returns {UseGetRealtimeDocDataResult<AppModelType>}
  *
  * @example
  * ```jsx
  * const firebaseConfig = {};
  * export const MyComponent = () => {
- *  const doc = useGetRealtimeDocData('collection/documentId');
+ *  const result = useGetRealtimeDocData('collection/documentId');
  *  return (
  *      <div>
- *          {JSON.stringify(doc)}
+ *          {JSON.stringify(result)}
  *      </div>
  *  );
  * };
@@ -55,22 +65,40 @@ export const useGetRealtimeDocData = <AppModelType, DbModelType extends Document
     pathSegments,
     reference,
     onError
-}: UseGetRealtimeDocDataOptions<AppModelType, DbModelType>): AppModelType | null => {
+}: UseGetRealtimeDocDataOptions<AppModelType, DbModelType>): UseGetRealtimeDocDataResult<AppModelType> => {
     const ref = useDocReference({ path, reference, pathSegments });
     const [doc, setDoc] = useState<AppModelType | null>(null);
+    const [isError, setIsError] = useState(false);
+    const [isFetching, setIsFetching] = useState(true);
+    const [error, setError] = useState<FirebaseError | null>(null);
 
     useEffect(() => {
         const unsubscribe = ref
             ? onSnapshot(ref, {
                   next: async (snapshot) => {
+                      setIsFetching(false);
                       setDoc(snapshot.data() || null);
+                      setError(null);
+                      setIsError(false);
                   },
-                  error: onError
+                  error: (e) => {
+                      setIsError(true);
+                      setError(e);
+                      onError?.(e);
+                  }
               })
             : () => {};
 
         return () => unsubscribe();
-    }, [ref, doc]);
+    }, [ref, doc, isError, onError, isFetching, error]);
 
-    return doc;
+    return useMemo(
+        () => ({
+            data: doc,
+            isError,
+            isFetching,
+            error
+        }),
+        [doc, isError, error]
+    );
 };