feat(database): add database module

.gitignore

@@ -5,5 +5,6 @@
 
 # modules
 /auth/
+/database/
 /firestore/
 /storage/

package.json

@@ -14,6 +14,10 @@
             "require": "./lib/cjs/auth/index.js",
             "default": "./lib/esm/auth/index.js"
         },
+        "./database": {
+            "require": "./lib/cjs/database/index.js",
+            "default": "./lib/esm/database/index.js"
+        },
         "./firestore": {
             "require": "./lib/cjs/firestore/index.js",
             "default": "./lib/esm/firestore/index.js"
@@ -26,6 +30,7 @@
     "files": [
         "lib",
         "auth",
+        "database",
         "firestore",
         "storage"
     ],

scripts/create-modules.js

@@ -1,6 +1,6 @@
 const fs = require("fs");
 
-const modules = ["auth", "firestore", "storage"];
+const modules = ["auth", "database", "firestore", "storage"];
 for (const module of modules) {
     const packageJson = {
         main: `../lib/cjs/${module}/index.js`,

src/database/index.ts

@@ -0,0 +1,2 @@
+export * from './useObject';
+export * from './useObjectOnce';

src/database/internal.ts

@@ -0,0 +1,18 @@
+import { Query } from "firebase/database";
+import { useStableValue } from "../util/useStableValue";
+
+/**
+ * @internal
+ */
+function isQueryEqual(a: Query | undefined, b: Query | undefined): boolean {
+    const areBothUndefined = a === undefined || b === undefined;
+    const areSameRef = a !== undefined && b !== undefined && a.isEqual(b);
+    return areBothUndefined || areSameRef;
+}
+
+/**
+ * @internal
+ */
+export function useStableQuery(query: Query | undefined): Query | undefined {
+    return useStableValue(query, isQueryEqual);
+}

src/database/useObject.ts

@@ -0,0 +1,42 @@
+import { DataSnapshot, get, Query } from "firebase/database";
+import { useEffect, useMemo } from "react";
+import { ValueHookResult } from "../common";
+import { useIsMounted } from "../util/useIsMounted";
+import { useLoadingValue } from "../util/useLoadingValue";
+import { useStableQuery } from "./internal";
+
+export type UseObjectOnceResult = ValueHookResult<DataSnapshot, Error>;
+
+export function useObjectOnce(query: Query | undefined | null): UseObjectOnceResult {
+    const isMounted = useIsMounted();
+    const { error, loading, setLoading, setError, setValue, value } = useLoadingValue<DataSnapshot, Error>();
+
+    const stableQuery = useStableQuery(query ?? undefined);
+
+    useEffect(() => {
+        (async () => {
+            if (stableQuery === undefined) {
+                setValue();
+            } else {
+                setLoading();
+
+                try {
+                    const snap = await get(stableQuery);
+                    if (!isMounted.current) {
+                        return;
+                    }
+
+                    setValue(snap);
+                } catch (e) {
+                    if (!isMounted.current) {
+                        return;
+                    }
+
+                    setError(e as Error);
+                }
+            }
+        })();
+    }, [stableQuery]);
+
+    return useMemo(() => [value, loading, error], [value, loading, error]);
+}

src/database/useObjectOnce.ts

@@ -0,0 +1,26 @@
+import { DataSnapshot, onValue, Query } from "firebase/database";
+import { useEffect, useMemo } from "react";
+import { ValueHookResult } from "../common";
+import { useLoadingValue } from "../util/useLoadingValue";
+import { useStableQuery } from "./internal";
+
+export type UseObjectResult = ValueHookResult<DataSnapshot, Error>;
+
+export function useObject(query: Query | undefined | null): UseObjectResult {
+    const { error, loading, setLoading, setError, setValue, value } = useLoadingValue<DataSnapshot, Error>();
+
+    const stableQuery = useStableQuery(query ?? undefined);
+
+    useEffect(() => {
+        if (stableQuery === undefined) {
+            setValue();
+        } else {
+            setLoading();
+
+            const unsubscribe = onValue(stableQuery, setValue, setError);
+            return () => unsubscribe();
+        }
+    }, [stableQuery]);
+
+    return useMemo(() => [value, loading, error], [value, loading, error]);
+}

src/database/useObjectValue.ts

@@ -0,0 +1,26 @@
+import { onValue, Query } from "firebase/database";
+import { useEffect, useMemo } from "react";
+import { ValueHookResult } from "../common";
+import { useLoadingValue } from "../util/useLoadingValue";
+import { useStableQuery } from "./internal";
+
+export type UseObjectValueResult<Value = unknown> = ValueHookResult<Value, Error>;
+
+export function useObjectValue<Value = unknown>(query: Query | undefined | null): UseObjectValueResult<Value> {
+    const { error, loading, setLoading, setError, setValue, value } = useLoadingValue<Value, Error>();
+
+    const stableQuery = useStableQuery(query ?? undefined);
+
+    useEffect(() => {
+        if (stableQuery === undefined) {
+            setValue();
+        } else {
+            setLoading();
+
+            const unsubscribe = onValue(stableQuery, (snap) => setValue(snap.val()), setError);
+            return () => unsubscribe();
+        }
+    }, [stableQuery]);
+
+    return useMemo(() => [value, loading, error], [value, loading, error]);
+}

src/database/useObjectValueOnce.ts

@@ -0,0 +1,42 @@
+import { get, Query } from "firebase/database";
+import { useEffect, useMemo } from "react";
+import { ValueHookResult } from "../common";
+import { useIsMounted } from "../util/useIsMounted";
+import { useLoadingValue } from "../util/useLoadingValue";
+import { useStableQuery } from "./internal";
+
+export type UseObjectValueOnceResult<Value = unknown> = ValueHookResult<Value, Error>;
+
+export function useObjectValueOnce<Value = unknown>(query: Query | undefined | null): UseObjectValueOnceResult<Value> {
+    const isMounted = useIsMounted();
+    const { error, loading, setLoading, setError, setValue, value } = useLoadingValue<Value, Error>();
+
+    const stableQuery = useStableQuery(query ?? undefined);
+
+    useEffect(() => {
+        (async () => {
+            if (stableQuery === undefined) {
+                setValue();
+            } else {
+                setLoading();
+
+                try {
+                    const snap = await get(stableQuery);
+                    if (!isMounted.current) {
+                        return;
+                    }
+
+                    setValue(snap.val());
+                } catch (e) {
+                    if (!isMounted.current) {
+                        return;
+                    }
+
+                    setError(e as Error);
+                }
+            }
+        })();
+    }, [stableQuery]);
+
+    return useMemo(() => [value, loading, error], [value, loading, error]);
+}

src/index.ts

@@ -1,5 +1,6 @@
 export * from "./auth";
 export * from "./common";
+export * from "./database";
 export * from "./firestore";
 export * from "./storage";
 

src/util/useLoadingValue.ts

@@ -24,7 +24,7 @@ export interface UseLoadingValueResult<Value, Error> {
 /**
  * @internal
  */
-export function useLoadingValue<Value, Error = unknown>(defaultValue?: Value): UseLoadingValueResult<Value, Error> {
+export function useLoadingValue<Value, Error>(defaultValue?: Value): UseLoadingValueResult<Value, Error> {
     const [state, setState] = useState<State<Value, Error>>({
         error: undefined,
         loading: defaultValue === undefined ? true : false,