Use default context for exports

packages/realm-react/CHANGELOG.md

@@ -11,7 +11,7 @@ import { RealmProvider, ProgressDirection, ProgressMode } from "@realm/react";
 const ProgressText = () => {
 	const progress = useProgress({ direction: ProgressDirection.Download, mode: ProgressMode.ReportIndefinitely });
 
-	return <Text>Loading: {progress}/1.0 Downloaded</Text>;
+    return <Text>Loading: {(100 * progress).toFixed()}%</Text>;  
 }
 
 const MyApp() = () => {

packages/realm-react/src/RealmContext.ts

@@ -27,6 +27,7 @@ import {
 } from "./RealmProvider";
 import { createContext } from "react";
 import Realm from "realm";
+import { createUseProgress } from "./useProgress";
 
 export type RealmContext<RealmProvider = DynamicRealmProvider> = {
   /**
@@ -112,6 +113,21 @@ export type RealmContext<RealmProvider = DynamicRealmProvider> = {
    * @returns either the desired {@link Realm.Object} or `null` in the case of it being deleted or not existing.
    */
   useObject: ReturnType<typeof createUseObject>;
+  /**
+   * Returns the value representing the progress for a given {@link Realm.ProgressDirection}
+   * and {@link Realm.ProgressMode}. The hook will register a progress notifier and update from
+   * any changes from it.
+   * @example
+   * ```
+   * const progress = useProgress({ direction: ProgressDirection.Download, mode: ProgressMode.ReportIndefinitely });
+   * return <Text>Loading: {(100 * progress).toFixed()}%</Text>;
+   * ```
+   * @param options
+   * @param options.direction - The {@link Realm.ProgressDirection} for the progress notifier.
+   * @param options.mode - The {@link Realm.ProgressMode} for the progress notifier.
+   * @returns a number between 0 and 1 representing the progress
+   */
+  useProgress: ReturnType<typeof createUseProgress>;
 };
 
 /**
@@ -186,11 +202,13 @@ export function createRealmContext(
   const useRealm = createUseRealm(RealmContext);
   const useQuery = createUseQuery(useRealm);
   const useObject = createUseObject(useRealm);
+  const useProgress = createUseProgress(useRealm);
 
   return {
     RealmProvider,
     useRealm,
     useQuery,
     useObject,
+    useProgress,
   };
 }

packages/realm-react/src/index.tsx

@@ -119,6 +119,21 @@ export const useQuery = defaultContext.useQuery;
  * @returns either the desired {@link Realm.Object} or `null` in the case of it being deleted or not existing.
  */
 export const useObject = defaultContext.useObject;
+/**
+ * Returns the value representing the progress for a given {@link Realm.ProgressDirection}
+ * and {@link Realm.ProgressMode}. The hook will register a progress notifier and update from
+ * any changes from it.
+ * @example
+ * ```
+ * const progress = useProgress({ direction: ProgressDirection.Download, mode: ProgressMode.ReportIndefinitely });
+ * return <Text>Loading: {(100 * progress).toFixed()}%</Text>;
+ * ```
+ * @param options
+ * @param options.direction - The {@link Realm.ProgressDirection} for the progress notifier.
+ * @param options.mode - The {@link Realm.ProgressMode} for the progress notifier.
+ * @returns a number between 0 and 1 representing the progress
+ */
+export const useProgress = defaultContext.useProgress;
 
 /*
  * @ignore This will end up documenting all of Realm, which is documented elsewhere
@@ -130,4 +145,3 @@ export { useUser, UserProvider } from "./UserProvider";
 export * from "./useAuth";
 export * from "./useEmailPasswordAuth";
 export * from "./types";
-export * from "./useProgress";

packages/realm-react/src/useProgress.tsx

@@ -17,35 +17,33 @@
 ////////////////////////////////////////////////////////////////////////////
 
 import { ProgressDirection, ProgressMode } from "realm";
-import { useRealm } from ".";
 import { useEffect, useState } from "react";
 import { EstimateProgressNotificationCallback } from "realm/dist/public-types/internal";
+import { UseRealmHook } from "./useRealm";
 
 type UserProgressHook = {
   direction: ProgressDirection;
   mode: ProgressMode;
 };
 
-/**
- *
- * @returns An object containing operations and state for authenticating with an Atlas App.
- */
-export function useProgress({ direction, mode }: UserProgressHook): number | null {
-  const realm = useRealm();
-  const [progress, setProgress] = useState<number | null>(null);
+export function createUseProgress(useRealm: UseRealmHook): ({ direction, mode }: UserProgressHook) => number | null {
+  return function useProgress({ direction, mode }: UserProgressHook): number | null {
+    const realm = useRealm();
+    const [progress, setProgress] = useState<number | null>(null);
 
-  useEffect(() => {
-    if (!realm.syncSession) {
-      throw new Error("No sync session found.");
-    }
-    const callback: EstimateProgressNotificationCallback = (estimate) => {
-      setProgress(estimate);
-    };
+    useEffect(() => {
+      if (!realm.syncSession) {
+        throw new Error("No sync session found.");
+      }
+      const callback: EstimateProgressNotificationCallback = (estimate) => {
+        setProgress(estimate);
+      };
 
-    realm.syncSession.addProgressNotification(direction, mode, callback);
+      realm.syncSession.addProgressNotification(direction, mode, callback);
 
-    return () => realm.syncSession?.removeProgressNotification(callback);
-  }, [realm, direction, mode]);
+      return () => realm.syncSession?.removeProgressNotification(callback);
+    }, [realm, direction, mode]);
 
-  return progress;
+    return progress;
+  };
 }