@arcote.tech/arc-react 0.0.23 → 0.0.25

package/dist/index.js

@@ -54,6 +54,10 @@ class IDBReadTransaction {
   }
   async findById(store, id) {
     return new Promise((resolve) => {
+      if (!id) {
+        resolve(undefined);
+        return;
+      }
       const result = this.transaction.objectStore(store).get(id);
       result.onsuccess = (e) => {
         resolve(e.target.result);
@@ -137,16 +141,28 @@ import {
   MasterDataStorage,
   rtcClientFactory
 } from "@arcote.tech/arc";
-import { createContext, useContext, useEffect, useRef, useState } from "react";
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useState
+} from "react";
 import { jsx } from "react/jsx-runtime";
+"use client";
 var reactModel = (arcContext, databaseName) => {
   const LiveModelContext = createContext(null);
   const LocalModelContext = createContext(null);
-  let dataStorage = null;
+  let modelMasterDataStorage = null;
   return [
     function LiveModelProvider(props) {
-      const dbAdapterPromise = idbAdapterFactory(databaseName, arcContext.version)(arcContext);
-      dataStorage = new MasterDataStorage(dbAdapterPromise, rtcClientFactory, arcContext);
+      const dataStorage = useMemo(() => {
+        const dbAdapterPromise = idbAdapterFactory(databaseName, arcContext.version)(arcContext);
+        const dataStorage2 = new MasterDataStorage(dbAdapterPromise, rtcClientFactory, arcContext);
+        modelMasterDataStorage = dataStorage2;
+        return dataStorage2;
+      }, [arcContext, databaseName, arcContext.version]);
       const [syncProgress, setSyncProgress] = useState([]);
       const [syncDone, setSyncDone] = useState(false);
       useEffect(() => {
@@ -159,7 +175,11 @@ var reactModel = (arcContext, databaseName) => {
         sync();
       }, []);
       return /* @__PURE__ */ jsx(LiveModelContext.Provider, {
-        value: { dataStorage, dbAdapterPromise },
+        value: {
+          dataStorage,
+          client: props.client,
+          catchErrorCallback: props.catchErrorCallback
+        },
         children: syncDone ? props.children : /* @__PURE__ */ jsx(props.syncView, {
           progress: syncProgress
         }, undefined, false, undefined, this)
@@ -171,11 +191,14 @@ var reactModel = (arcContext, databaseName) => {
         throw new Error("LocalModelProvider must be used within a LiveModelProvider");
       }
       const [localContext] = useState(() => ({
-        dbAdapterPromise: parentContext.dbAdapterPromise,
         dataStorage: parentContext.dataStorage.fork()
       }));
       return /* @__PURE__ */ jsx(LocalModelContext.Provider, {
-        value: localContext,
+        value: {
+          dataStorage: localContext.dataStorage,
+          client: parentContext.client,
+          catchErrorCallback: parentContext.catchErrorCallback
+        },
         children
       }, undefined, false, undefined, this);
     },
@@ -188,6 +211,8 @@ var reactModel = (arcContext, databaseName) => {
       const [loading, setLoading] = useState(true);
       const queryRef = useRef(null);
       useEffect(() => {
+        if (queryRef.current)
+          queryRef.current.unsubscribe();
         const queryBuilder = arcContext.queryBuilder();
         const query = queryBuilderFn(queryBuilder).toQuery();
         queryRef.current = query;
@@ -212,35 +237,20 @@ var reactModel = (arcContext, databaseName) => {
       if (!context) {
         throw new Error("useQuery must be used within a ModelProvider");
       }
-      const commands = arcContext.commands;
-      return new Proxy({}, {
-        get: (_, name) => {
-          if (name in commands) {
-            return async (...args) => {
-              const dataStorage2 = context.dataStorage.fork();
-              const commandContext = arcContext.commandContext(dataStorage2);
-              const result = await commands[name](commandContext, ...args);
-              await dataStorage2.merge();
-              return result;
-            };
-          }
-          console.warn(`Command '${name}' not found in the context.`);
-          return;
-        }
-      });
+      return arcContext.commandsClient(context.client, context.dataStorage, context.catchErrorCallback);
     },
     async function query(queryBuilderFn) {
       const queryBuilder = arcContext.queryBuilder();
       const query = queryBuilderFn(queryBuilder).toQuery();
-      if (!dataStorage)
+      if (!modelMasterDataStorage)
         throw new Error("dataStorage not found");
-      const result = await query.run(dataStorage);
+      const result = await query.run(modelMasterDataStorage);
       return result;
     },
     function useLocalDataStorage() {
       const context = useContext(LocalModelContext);
       if (!context) {
-        throw new Error("hook must be used within a ModelProvider");
+        return null;
       }
       return context.dataStorage;
     }
@@ -252,4 +262,4 @@ export {
   formResolver
 };
 
-//# debugId=4A9F9D29F4CCB1FA64756E2164756E21
+//# debugId=1A90F216CD67D17164756E2164756E21

package/dist/reactModel.d.ts

@@ -1,13 +1,15 @@
 import { ForkedDataStorage, type ArcContextAny, type CommandsClient, type QueryBuilderFunctionResult, type QueryFactoryFunction } from "@arcote.tech/arc";
 export declare const reactModel: <C extends ArcContextAny>(arcContext: C, databaseName: string) => readonly [(props: {
     children: React.ReactNode;
+    client: string;
     syncView: React.ComponentType<{
         progress: {
             store: string;
             size: number;
         }[];
     }>;
+    catchErrorCallback: (error: any) => void;
 }) => import("react/jsx-dev-runtime").JSX.Element, ({ children }: {
     children: React.ReactNode;
-}) => import("react/jsx-dev-runtime").JSX.Element, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn, dependencies?: any[]) => [QueryBuilderFunctionResult<QueryBuilderFn>, boolean], () => CommandsClient<C["commands"]>, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn) => Promise<QueryBuilderFunctionResult<QueryBuilderFn>>, () => ForkedDataStorage];
+}) => import("react/jsx-dev-runtime").JSX.Element, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn, dependencies?: any[]) => [QueryBuilderFunctionResult<QueryBuilderFn>, boolean], () => CommandsClient<C["commands"]>, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn) => Promise<QueryBuilderFunctionResult<QueryBuilderFn>>, () => ForkedDataStorage | null];
 //# sourceMappingURL=reactModel.d.ts.map

package/package.json

@@ -4,7 +4,7 @@
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "type": "module",
-  "version": "0.0.23",
+  "version": "0.0.25",
   "private": false,
   "author": "Przemysław Krasiński [arcote.tech]",
   "description": "React client for the Arc framework, providing utilities for querying data and executing commands, enhancing the development of reactive and efficient user interfaces.",