@oneblink/apps-react 5.14.0 → 6.0.0-beta.2

package/dist/hooks/useDrafts.d.ts

@@ -1,27 +1,26 @@
 import * as React from 'react';
-import { SubmissionTypes } from '@oneblink/types';
+import { draftService } from '@oneblink/apps';
 /** The value returned from `useDrafts()` hook */
 export type DraftsContextValue = {
-    /** `true` drafts are currently loading. */
+    /** `true` if drafts are currently loading for the first time. */
     isLoading: boolean;
-    /** An Error object if loading drafts fails */
-    loadError: Error | null;
     /** The incomplete submissions that were saved for later */
-    drafts: SubmissionTypes.FormsAppDraft[];
-    /** A function to trigger loading of the drafts */
-    reloadDrafts: () => Promise<void>;
-    /** A function to clear Error object from loading drafts */
-    clearLoadError: () => void;
+    drafts: draftService.LocalFormSubmissionDraft[];
     /** `true` drafts are syncing with other devices */
     isSyncing: boolean;
+    /**
+     * The date when the sync process last completed successfully, will be `null`
+     * until it has completed the first time.
+     */
+    lastSyncTime: Date | null;
     /** A function to trigger syncing of the drafts */
-    syncDrafts: () => Promise<void>;
+    syncDrafts: (abortSignal: AbortSignal | undefined) => Promise<void>;
     /** An Error object if syncing drafts fails */
     syncError: Error | null;
     /** A function to clear Error object from syncing drafts */
     clearSyncError: () => void;
     /** A function to remove a draft */
-    deleteDraft: (draftId: string) => Promise<void>;
+    deleteDraft: (formSubmissionDraftId: string) => Promise<void>;
 };
 /**
  * React Component that provides the context for the `useDrafts()` hook to be

package/dist/hooks/useDrafts.js

@@ -3,15 +3,6 @@ import { draftService, submissionService } from '@oneblink/apps';
 import useAuth from './useAuth';
 import useIsMounted from './useIsMounted';
 import useIsOffline from './useIsOffline';
-const defaultLoadState = {
-    isLoading: false,
-    loadError: null,
-    drafts: [],
-};
-const defaultSyncState = {
-    isSyncing: false,
-    syncError: null,
-};
 const DraftsContext = React.createContext(undefined);
 /**
  * React Component that provides the context for the `useDrafts()` hook to be
@@ -61,28 +52,34 @@ children, }) {
     const isMounted = useIsMounted();
     const isOffline = useIsOffline();
     const { isLoggedIn, isUsingFormsKey } = useAuth();
-    const [syncState, setSyncState] = React.useState(defaultSyncState);
+    const [syncState, setSyncState] = React.useState({
+        lastSyncTime: null,
+        isSyncing: false,
+        syncError: null,
+    });
     const clearSyncError = React.useCallback(() => {
         setSyncState((currentState) => ({
             ...currentState,
             syncError: null,
         }));
     }, []);
-    const syncDrafts = React.useCallback(async () => {
+    const syncDrafts = React.useCallback(async (abortSignal) => {
         if (!isDraftsEnabled || !isLoggedIn || isUsingFormsKey) {
             return;
         }
         if (isMounted.current) {
-            setSyncState({
+            setSyncState((currentState) => ({
+                ...currentState,
                 isSyncing: true,
                 syncError: null,
-            });
+            }));
         }
         let newError = null;
         try {
             await draftService.syncDrafts({
                 formsAppId,
                 throwError: false,
+                abortSignal,
             });
         }
         catch (error) {
@@ -90,52 +87,13 @@ children, }) {
         }
         if (isMounted.current) {
             setSyncState({
+                lastSyncTime: new Date(),
                 isSyncing: false,
                 syncError: newError,
             });
         }
     }, [formsAppId, isDraftsEnabled, isLoggedIn, isMounted, isUsingFormsKey]);
-    const [loadState, setLoadState] = React.useState(defaultLoadState);
-    const clearLoadError = React.useCallback(() => {
-        setLoadState((currentState) => ({
-            ...currentState,
-            loadError: null,
-        }));
-    }, []);
-    const reloadDrafts = React.useCallback(async () => {
-        if (!isLoggedIn) {
-            if (isMounted.current) {
-                setLoadState({
-                    isLoading: false,
-                    loadError: null,
-                    drafts: [],
-                });
-            }
-            return;
-        }
-        if (isMounted.current) {
-            setLoadState((currentState) => ({
-                isLoading: true,
-                loadError: null,
-                drafts: currentState.drafts,
-            }));
-        }
-        let newError = null;
-        let newDrafts = [];
-        try {
-            newDrafts = await draftService.getDrafts();
-        }
-        catch (error) {
-            newError = error;
-        }
-        if (isMounted.current) {
-            setLoadState({
-                isLoading: false,
-                loadError: newError,
-                drafts: newDrafts,
-            });
-        }
-    }, [isMounted, isLoggedIn]);
+    const [drafts, setDrafts] = React.useState(null);
     const deleteDraft = React.useCallback((draftId) => {
         return draftService.deleteDraft(draftId, formsAppId);
     }, [formsAppId]);
@@ -144,45 +102,39 @@ children, }) {
         syncDrafts,
         isSyncing: syncState.isSyncing,
         syncError: syncState.syncError,
+        lastSyncTime: syncState.lastSyncTime,
         clearSyncError,
         // Load
-        reloadDrafts,
-        isLoading: loadState.isLoading,
-        drafts: loadState.drafts,
-        loadError: loadState.loadError,
-        clearLoadError,
+        isLoading: !drafts,
+        drafts: drafts || [],
         // Delete,
         deleteDraft,
     }), [
-        clearLoadError,
-        clearSyncError,
-        loadState.drafts,
-        loadState.isLoading,
-        loadState.loadError,
-        reloadDrafts,
         syncDrafts,
         syncState.isSyncing,
         syncState.syncError,
+        syncState.lastSyncTime,
+        clearSyncError,
+        drafts,
         deleteDraft,
     ]);
     React.useEffect(() => {
-        reloadDrafts();
-        const unregisterPendingQueueListener = submissionService.registerPendingQueueListener(reloadDrafts);
-        const unregisterDraftsListener = draftService.registerDraftsListener((drafts) => {
-            setLoadState({
-                isLoading: false,
-                drafts,
-                loadError: null,
-            });
-        });
+        const abortController = new AbortController();
+        const unregisterPendingQueueListener = submissionService.registerPendingQueueListener(() => syncDrafts(undefined));
+        const unregisterDraftsListener = draftService.registerDraftsListener(setDrafts);
         return () => {
+            abortController.abort();
             unregisterPendingQueueListener();
             unregisterDraftsListener();
         };
-    }, [reloadDrafts]);
+    }, [syncDrafts]);
     React.useEffect(() => {
         if (!isOffline) {
-            syncDrafts();
+            const abortController = new AbortController();
+            syncDrafts(abortController.signal);
+            return () => {
+                abortController.abort();
+            };
         }
     }, [isOffline, syncDrafts]);
     return (React.createElement(DraftsContext.Provider, { value: value }, children));

package/dist/hooks/useDrafts.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDrafts.js","sourceRoot":"","sources":["../../src/hooks/useDrafts.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { draftService, submissionService } from '@oneblink/apps'\nimport { SubmissionTypes } from '@oneblink/types'\nimport useAuth from './useAuth'\nimport useIsMounted from './useIsMounted'\nimport useIsOffline from './useIsOffline'\n\n/** The value returned from `useDrafts()` hook */\nexport type DraftsContextValue = {\n  /** `true` drafts are currently loading. */\n  isLoading: boolean\n  /** An Error object if loading drafts fails */\n  loadError: Error | null\n  /** The incomplete submissions that were saved for later */\n  drafts: SubmissionTypes.FormsAppDraft[]\n  /** A function to trigger loading of the drafts */\n  reloadDrafts: () => Promise<void>\n  /** A function to clear Error object from loading drafts */\n  clearLoadError: () => void\n  /** `true` drafts are syncing with other devices */\n  isSyncing: boolean\n  /** A function to trigger syncing of the drafts */\n  syncDrafts: () => Promise<void>\n  /** An Error object if syncing drafts fails */\n  syncError: Error | null\n  /** A function to clear Error object from syncing drafts */\n  clearSyncError: () => void\n  /** A function to remove a draft */\n  deleteDraft: (draftId: string) => Promise<void>\n}\n\nconst defaultLoadState = {\n  isLoading: false,\n  loadError: null,\n  drafts: [],\n}\n\nconst defaultSyncState = {\n  isSyncing: false,\n  syncError: null,\n}\n\nconst DraftsContext = React.createContext<DraftsContextValue | undefined>(\n  undefined,\n)\n\n/**\n * React Component that provides the context for the `useDrafts()` hook to be\n * used by components further down your component tree. **It should only be\n * included in your component tree once and ideally at the root of the\n * application.**\n *\n * #### Example\n *\n * ```jsx\n * import * as React from 'react'\n * import { DraftsContextProvider, useDrafts } from '@oneblink/apps-react'\n *\n * function Component() {\n *   const draftsContext = useDrafts()\n *   // use drafts here\n * }\n *\n * function App() {\n *   return (\n *     <DraftsContextProvider>\n *       <Component />\n *     </DraftsContextProvider>\n *   )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n *   ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport function DraftsContextProvider({\n  /** The identifier for the forms app associated with the user's drafts */\n  formsAppId,\n  /**\n   * `true` if drafts are enabled, otherwise `false`. Can be used for account\n   * tier validation.\n   */\n  isDraftsEnabled,\n  /** Your application components */\n  children,\n}: {\n  formsAppId: number\n  isDraftsEnabled: boolean\n  children: React.ReactNode\n}) {\n  const isMounted = useIsMounted()\n  const isOffline = useIsOffline()\n  const { isLoggedIn, isUsingFormsKey } = useAuth()\n\n  const [syncState, setSyncState] = React.useState<{\n    isSyncing: boolean\n    syncError: Error | null\n  }>(defaultSyncState)\n  const clearSyncError = React.useCallback(() => {\n    setSyncState((currentState) => ({\n      ...currentState,\n      syncError: null,\n    }))\n  }, [])\n  const syncDrafts = React.useCallback(async () => {\n    if (!isDraftsEnabled || !isLoggedIn || isUsingFormsKey) {\n      return\n    }\n\n    if (isMounted.current) {\n      setSyncState({\n        isSyncing: true,\n        syncError: null,\n      })\n    }\n\n    let newError = null\n\n    try {\n      await draftService.syncDrafts({\n        formsAppId,\n        throwError: false,\n      })\n    } catch (error) {\n      newError = error as Error\n    }\n\n    if (isMounted.current) {\n      setSyncState({\n        isSyncing: false,\n        syncError: newError,\n      })\n    }\n  }, [formsAppId, isDraftsEnabled, isLoggedIn, isMounted, isUsingFormsKey])\n\n  const [loadState, setLoadState] = React.useState<{\n    isLoading: boolean\n    loadError: Error | null\n    drafts: SubmissionTypes.FormsAppDraft[]\n  }>(defaultLoadState)\n  const clearLoadError = React.useCallback(() => {\n    setLoadState((currentState) => ({\n      ...currentState,\n      loadError: null,\n    }))\n  }, [])\n  const reloadDrafts = React.useCallback(async () => {\n    if (!isLoggedIn) {\n      if (isMounted.current) {\n        setLoadState({\n          isLoading: false,\n          loadError: null,\n          drafts: [],\n        })\n      }\n      return\n    }\n\n    if (isMounted.current) {\n      setLoadState((currentState) => ({\n        isLoading: true,\n        loadError: null,\n        drafts: currentState.drafts,\n      }))\n    }\n\n    let newError = null\n    let newDrafts: SubmissionTypes.FormsAppDraft[] = []\n\n    try {\n      newDrafts = await draftService.getDrafts()\n    } catch (error) {\n      newError = error as Error\n    }\n\n    if (isMounted.current) {\n      setLoadState({\n        isLoading: false,\n        loadError: newError,\n        drafts: newDrafts,\n      })\n    }\n  }, [isMounted, isLoggedIn])\n\n  const deleteDraft = React.useCallback(\n    (draftId) => {\n      return draftService.deleteDraft(draftId, formsAppId)\n    },\n    [formsAppId],\n  )\n\n  const value = React.useMemo(\n    () => ({\n      // Sync\n      syncDrafts,\n      isSyncing: syncState.isSyncing,\n      syncError: syncState.syncError,\n      clearSyncError,\n      // Load\n      reloadDrafts,\n      isLoading: loadState.isLoading,\n      drafts: loadState.drafts,\n      loadError: loadState.loadError,\n      clearLoadError,\n      // Delete,\n      deleteDraft,\n    }),\n    [\n      clearLoadError,\n      clearSyncError,\n      loadState.drafts,\n      loadState.isLoading,\n      loadState.loadError,\n      reloadDrafts,\n      syncDrafts,\n      syncState.isSyncing,\n      syncState.syncError,\n      deleteDraft,\n    ],\n  )\n\n  React.useEffect(() => {\n    reloadDrafts()\n    const unregisterPendingQueueListener =\n      submissionService.registerPendingQueueListener(reloadDrafts)\n    const unregisterDraftsListener = draftService.registerDraftsListener(\n      (drafts) => {\n        setLoadState({\n          isLoading: false,\n          drafts,\n          loadError: null,\n        })\n      },\n    )\n    return () => {\n      unregisterPendingQueueListener()\n      unregisterDraftsListener()\n    }\n  }, [reloadDrafts])\n\n  React.useEffect(() => {\n    if (!isOffline) {\n      syncDrafts()\n    }\n  }, [isOffline, syncDrafts])\n\n  return (\n    <DraftsContext.Provider value={value}>{children}</DraftsContext.Provider>\n  )\n}\n\n/**\n * React hook to get the context value for Drafts. Will throw an Error if used\n * outside of the `<DraftsContextProvider />` component.\n *\n * @returns\n * @group Hooks\n */\nexport default function useDrafts(): DraftsContextValue {\n  const value = React.useContext(DraftsContext)\n  if (!value) {\n    throw new Error(\n      `\"useDrafts\" hook was used outside of the \"<DraftsContextProvider />\" component's children.`,\n    )\n  }\n  return value\n}\n"]}
+{"version":3,"file":"useDrafts.js","sourceRoot":"","sources":["../../src/hooks/useDrafts.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { draftService, submissionService } from '@oneblink/apps'\nimport useAuth from './useAuth'\nimport useIsMounted from './useIsMounted'\nimport useIsOffline from './useIsOffline'\n\n/** The value returned from `useDrafts()` hook */\nexport type DraftsContextValue = {\n  /** `true` if drafts are currently loading for the first time. */\n  isLoading: boolean\n  /** The incomplete submissions that were saved for later */\n  drafts: draftService.LocalFormSubmissionDraft[]\n  /** `true` drafts are syncing with other devices */\n  isSyncing: boolean\n  /**\n   * The date when the sync process last completed successfully, will be `null`\n   * until it has completed the first time.\n   */\n  lastSyncTime: Date | null\n  /** A function to trigger syncing of the drafts */\n  syncDrafts: (abortSignal: AbortSignal | undefined) => Promise<void>\n  /** An Error object if syncing drafts fails */\n  syncError: Error | null\n  /** A function to clear Error object from syncing drafts */\n  clearSyncError: () => void\n  /** A function to remove a draft */\n  deleteDraft: (formSubmissionDraftId: string) => Promise<void>\n}\n\nconst DraftsContext = React.createContext<DraftsContextValue | undefined>(\n  undefined,\n)\n\n/**\n * React Component that provides the context for the `useDrafts()` hook to be\n * used by components further down your component tree. **It should only be\n * included in your component tree once and ideally at the root of the\n * application.**\n *\n * #### Example\n *\n * ```jsx\n * import * as React from 'react'\n * import { DraftsContextProvider, useDrafts } from '@oneblink/apps-react'\n *\n * function Component() {\n *   const draftsContext = useDrafts()\n *   // use drafts here\n * }\n *\n * function App() {\n *   return (\n *     <DraftsContextProvider>\n *       <Component />\n *     </DraftsContextProvider>\n *   )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n *   ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport function DraftsContextProvider({\n  /** The identifier for the forms app associated with the user's drafts */\n  formsAppId,\n  /**\n   * `true` if drafts are enabled, otherwise `false`. Can be used for account\n   * tier validation.\n   */\n  isDraftsEnabled,\n  /** Your application components */\n  children,\n}: {\n  formsAppId: number\n  isDraftsEnabled: boolean\n  children: React.ReactNode\n}) {\n  const isMounted = useIsMounted()\n  const isOffline = useIsOffline()\n  const { isLoggedIn, isUsingFormsKey } = useAuth()\n\n  const [syncState, setSyncState] = React.useState<{\n    lastSyncTime: Date | null\n    isSyncing: boolean\n    syncError: Error | null\n  }>({\n    lastSyncTime: null,\n    isSyncing: false,\n    syncError: null,\n  })\n  const clearSyncError = React.useCallback(() => {\n    setSyncState((currentState) => ({\n      ...currentState,\n      syncError: null,\n    }))\n  }, [])\n  const syncDrafts = React.useCallback(\n    async (abortSignal: AbortSignal | undefined) => {\n      if (!isDraftsEnabled || !isLoggedIn || isUsingFormsKey) {\n        return\n      }\n\n      if (isMounted.current) {\n        setSyncState((currentState) => ({\n          ...currentState,\n          isSyncing: true,\n          syncError: null,\n        }))\n      }\n\n      let newError = null\n\n      try {\n        await draftService.syncDrafts({\n          formsAppId,\n          throwError: false,\n          abortSignal,\n        })\n      } catch (error) {\n        newError = error as Error\n      }\n\n      if (isMounted.current) {\n        setSyncState({\n          lastSyncTime: new Date(),\n          isSyncing: false,\n          syncError: newError,\n        })\n      }\n    },\n    [formsAppId, isDraftsEnabled, isLoggedIn, isMounted, isUsingFormsKey],\n  )\n\n  const [drafts, setDrafts] = React.useState<\n    draftService.LocalFormSubmissionDraft[] | null\n  >(null)\n\n  const deleteDraft = React.useCallback(\n    (draftId) => {\n      return draftService.deleteDraft(draftId, formsAppId)\n    },\n    [formsAppId],\n  )\n\n  const value = React.useMemo<DraftsContextValue>(\n    () => ({\n      // Sync\n      syncDrafts,\n      isSyncing: syncState.isSyncing,\n      syncError: syncState.syncError,\n      lastSyncTime: syncState.lastSyncTime,\n      clearSyncError,\n      // Load\n      isLoading: !drafts,\n      drafts: drafts || [],\n      // Delete,\n      deleteDraft,\n    }),\n    [\n      syncDrafts,\n      syncState.isSyncing,\n      syncState.syncError,\n      syncState.lastSyncTime,\n      clearSyncError,\n      drafts,\n      deleteDraft,\n    ],\n  )\n\n  React.useEffect(() => {\n    const abortController = new AbortController()\n    const unregisterPendingQueueListener =\n      submissionService.registerPendingQueueListener(() =>\n        syncDrafts(undefined),\n      )\n    const unregisterDraftsListener =\n      draftService.registerDraftsListener(setDrafts)\n    return () => {\n      abortController.abort()\n      unregisterPendingQueueListener()\n      unregisterDraftsListener()\n    }\n  }, [syncDrafts])\n\n  React.useEffect(() => {\n    if (!isOffline) {\n      const abortController = new AbortController()\n      syncDrafts(abortController.signal)\n      return () => {\n        abortController.abort()\n      }\n    }\n  }, [isOffline, syncDrafts])\n\n  return (\n    <DraftsContext.Provider value={value}>{children}</DraftsContext.Provider>\n  )\n}\n\n/**\n * React hook to get the context value for Drafts. Will throw an Error if used\n * outside of the `<DraftsContextProvider />` component.\n *\n * @returns\n * @group Hooks\n */\nexport default function useDrafts(): DraftsContextValue {\n  const value = React.useContext(DraftsContext)\n  if (!value) {\n    throw new Error(\n      `\"useDrafts\" hook was used outside of the \"<DraftsContextProvider />\" component's children.`,\n    )\n  }\n  return value\n}\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@oneblink/apps-react",
   "description": "Helper functions for OneBlink apps in ReactJS.",
-  "version": "5.14.0",
+  "version": "6.0.0-beta.2",
   "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
   "bugs": {
     "url": "https://github.com/oneblink/apps-react/issues"
@@ -46,7 +46,7 @@
     "@mui/lab": "^5.0.0-alpha.152",
     "@mui/material": "^5.15.6",
     "@mui/x-date-pickers": "^6.19.2",
-    "@oneblink/apps": "^11.2.0-beta.2",
+    "@oneblink/apps": "^12.0.0-beta.1",
     "@oneblink/release-cli": "^3.1.0",
     "@oneblink/types": "github:oneblink/types",
     "@types/blueimp-load-image": "^5.16.6",