Tweak some firestore helpers

Author: chrisbianca

README.md

@@ -7,7 +7,7 @@ A set of reusable [React Hooks](https://reactjs.org/docs/hooks-intro.html) for [
 
 This documentation is for v4 of React Firebase Hooks which makes the package compatible with Firebase v9 and drops support for previous versions of Firebase - more details [here](https://github.com/CSFrequency/react-firebase-hooks/releases/tag/v4.0.0).
 
-- For v3 documentation (Firebase v8), see [here](https://github.com/CSFrequency/react-firebase-hooks/tree/v3.0.0).
+- For v3 documentation (Firebase v8), see [here](https://github.com/CSFrequency/react-firebase-hooks/tree/v3.0.4).
 - For v2 documentation, see [here](https://github.com/CSFrequency/react-firebase-hooks/tree/v2.2.0).
 
 ## Installation

firestore/helpers/index.ts

@@ -1,8 +1,14 @@
 import {
+  CollectionReference,
   DocumentData,
+  DocumentReference,
   DocumentSnapshot,
+  Query,
+  queryEqual,
+  refEqual,
   SnapshotOptions,
 } from 'firebase/firestore';
+import { RefHook, useComparatorRef } from '../../util';
 
 export const snapshotToData = <T = DocumentData>(
   snapshot: DocumentSnapshot<T>,
@@ -28,3 +34,39 @@ export const snapshotToData = <T = DocumentData>(
 
   return data;
 };
+
+const isRefEqual = <
+  T extends DocumentReference<any> | CollectionReference<any>
+>(
+  v1: T | null | undefined,
+  v2: T | null | undefined
+): boolean => {
+  const bothNull: boolean = !v1 && !v2;
+  const equal: boolean = !!v1 && !!v2 && refEqual(v1, v2);
+  return bothNull || equal;
+};
+
+export const useIsFirestoreRefEqual = <
+  T extends DocumentReference<any> | CollectionReference<any>
+>(
+  value: T | null | undefined,
+  onChange?: () => void
+): RefHook<T | null | undefined> => {
+  return useComparatorRef(value, isRefEqual, onChange);
+};
+
+const isQueryEqual = <T extends Query<any>>(
+  v1: T | null | undefined,
+  v2: T | null | undefined
+): boolean => {
+  const bothNull: boolean = !v1 && !v2;
+  const equal: boolean = !!v1 && !!v2 && queryEqual(v1, v2);
+  return bothNull || equal;
+};
+
+export const useIsFirestoreQueryEqual = <T extends Query<any>>(
+  value: T | null | undefined,
+  onChange?: () => void
+): RefHook<T | null | undefined> => {
+  return useComparatorRef(value, isQueryEqual, onChange);
+};

firestore/useCollection.ts

@@ -10,7 +10,7 @@ import {
 } from 'firebase/firestore';
 import { useEffect, useMemo } from 'react';
 import { useLoadingValue } from '../util';
-import { snapshotToData } from './helpers';
+import { snapshotToData, useIsFirestoreQueryEqual } from './helpers';
 import {
   CollectionDataHook,
   CollectionHook,
@@ -21,7 +21,6 @@ import {
   OnceOptions,
   Options,
 } from './types';
-import { useIsEqualFirestoreQuery } from './util';
 
 export const useCollection = <T = DocumentData>(
   query?: Query<T> | null,
@@ -68,7 +67,7 @@ const useCollectionInternal = <T = DocumentData>(
     QuerySnapshot<T>,
     FirestoreError
   >();
-  const ref = useIsEqualFirestoreQuery<Query<T>>(query, reset);
+  const ref = useIsFirestoreQueryEqual<Query<T>>(query, reset);
 
   useEffect(() => {
     if (!ref.current) {
@@ -90,7 +89,9 @@ const useCollectionInternal = <T = DocumentData>(
         listener();
       };
     } else {
-      const get = getDocsFnFromGetOptions(options ? options.getOptions : undefined);
+      const get = getDocsFnFromGetOptions(
+        options ? options.getOptions : undefined
+      );
       get(ref.current).then(setValue).catch(setError);
     }
   }, [ref.current]);

firestore/useDocument.ts

@@ -10,7 +10,7 @@ import {
 } from 'firebase/firestore';
 import { useEffect, useMemo } from 'react';
 import { useLoadingValue } from '../util';
-import { snapshotToData } from './helpers';
+import { snapshotToData, useIsFirestoreRefEqual } from './helpers';
 import {
   Data,
   DataOptions,
@@ -21,8 +21,6 @@ import {
   OnceOptions,
   Options,
 } from './types';
-import { useIsEqualFirestoreRef } from './util';
-
 export const useDocument = <T = DocumentData>(
   docRef?: DocumentReference<T> | null,
   options?: Options
@@ -68,7 +66,7 @@ const useDocumentInternal = <T = DocumentData>(
     DocumentSnapshot<T>,
     FirestoreError
   >();
-  const ref = useIsEqualFirestoreRef<DocumentReference<T>>(docRef, reset);
+  const ref = useIsFirestoreRefEqual<DocumentReference<T>>(docRef, reset);
 
   useEffect(() => {
     if (!ref.current) {