@noya-app/noya-api-client-react 0.1.38 → 0.1.40

package/dist/index.mjs

@@ -5255,8 +5255,20 @@ import { isDeepEqual } from "@noya-app/noya-utils";
 import { Observable as Observable2 } from "@noya-app/observable";
 
 // ../state-manager/src/AssetManager.ts
-import { Base64, uuid } from "@noya-app/noya-utils";
+import { Base64, memoize, uuid } from "@noya-app/noya-utils";
 import { Observable as Observable3 } from "@noya-app/observable";
+var _toNoyaAsset = memoize(
+  (asset) => ({
+    id: asset.stableId,
+    url: asset.url,
+    createdAt: asset.createdAt,
+    size: asset.size,
+    contentType: asset.contentType,
+    width: asset.width ?? null,
+    height: asset.height ?? null,
+    userId: asset.userId ?? null
+  })
+);
 
 // ../noya-schemas/src/nullable.ts
 var Nullable = (schema) => Type.Union([Type.Null(), schema]);
@@ -5321,6 +5333,7 @@ var activityEventSchema = Type.Object({
 // ../noya-schemas/src/asset.ts
 var assetSchema = Type.Object({
   id: Type.String(),
+  stableId: Type.String(),
   url: Type.String(),
   createdAt: Type.String(),
   size: Type.Number(),
@@ -6015,11 +6028,11 @@ function handleValue(target, handledSet, options) {
     }
   });
   if (setMap) {
-    const set3 = target;
-    const values = Array.from(set3);
-    set3.clear();
+    const set4 = target;
+    const values = Array.from(set4);
+    set4.clear();
     values.forEach((value) => {
-      set3.add(setMap.has(value) ? setMap.get(value) : value);
+      set4.add(setMap.has(value) ? setMap.get(value) : value);
     });
   }
 }
@@ -6852,7 +6865,7 @@ var makeCreator = (arg) => {
       };
     }
     const base2 = arg0;
-    const mutate2 = arg1;
+    const mutate = arg1;
     let options = arg2;
     if (typeof arg1 !== "function") {
       options = arg1;
@@ -6896,7 +6909,7 @@ var makeCreator = (arg) => {
     }
     let result;
     try {
-      result = mutate2(draft);
+      result = mutate(draft);
     } catch (error) {
       revokeProxy(getProxyDraft(draft));
       throw error;
@@ -7004,7 +7017,7 @@ function apply(state, patches, applyOptions) {
   if (i > -1) {
     patches = patches.slice(i + 1);
   }
-  const mutate2 = (draft) => {
+  const mutate = (draft) => {
     patches.forEach((patch) => {
       const { path: _path, from: _fromPath, op } = patch;
       const path2 = unescapePath(_path);
@@ -7124,17 +7137,17 @@ function apply(state, patches, applyOptions) {
         console.warn('The "mutable" option is not allowed to be used with other options.');
       }
     }
-    mutate2(state);
+    mutate(state);
     return void 0;
   }
   if (isDraft(state)) {
     if (applyOptions !== void 0) {
       throw new Error(`Cannot apply patches with options to a draft.`);
     }
-    mutate2(state);
+    mutate(state);
     return state;
   }
-  return create(state, mutate2, Object.assign(Object.assign({}, applyOptions), { enablePatches: false }));
+  return create(state, mutate, Object.assign(Object.assign({}, applyOptions), { enablePatches: false }));
 }
 var constructorString = Object.prototype.constructor.toString();
 
@@ -7247,6 +7260,10 @@ var import_fast_diff = __toESM(require_diff());
 // ../state-manager/src/EvalManager.ts
 import { uuid as uuid2 } from "@noya-app/noya-utils";
 
+// ../state-manager/src/FilePropertyManager.ts
+import { uuid as uuid3 } from "@noya-app/noya-utils";
+import { Observable as Observable6 } from "@noya-app/observable";
+
 // ../state-manager/src/historyEntries.ts
 var HistoryEntries;
 ((HistoryEntries2) => {
@@ -7334,7 +7351,7 @@ var HistoryEntries;
 })(HistoryEntries || (HistoryEntries = {}));
 
 // ../state-manager/src/IOManager.ts
-import { Observable as Observable6 } from "@noya-app/observable";
+import { Observable as Observable7 } from "@noya-app/observable";
 
 // ../state-manager/src/jwt.ts
 function base64UrlEncode(str) {
@@ -7436,31 +7453,31 @@ var jwt;
 })(jwt || (jwt = {}));
 
 // ../state-manager/src/MenuManager.ts
-import { Observable as Observable7 } from "@noya-app/observable";
+import { isDeepEqual as isDeepEqual2 } from "@noya-app/noya-utils";
+import { Observable as Observable8 } from "@noya-app/observable";
 
 // ../state-manager/src/multiplayer.ts
-import { Cache, hash, uuid as uuid3 } from "@noya-app/noya-utils";
-import {
-  Observable as Observable8,
-  get as get2,
-  mutate
-} from "@noya-app/observable";
+import { Cache, hash, uuid as uuid4 } from "@noya-app/noya-utils";
+import { Observable as Observable10, get as get2, set as set2 } from "@noya-app/observable";
 
 // ../state-manager/src/stateManager.ts
-import { get as getPath2 } from "@noya-app/observable";
+import {
+  Observable as Observable9,
+  get as getPath2
+} from "@noya-app/observable";
 
 // ../state-manager/src/multiplayer.ts
 var createHash = (value, options) => hash(value, { ...options, ignoreUndefinedProperties: true });
 
 // ../state-manager/src/NoyaManager.ts
-import { uuid as uuid7 } from "@noya-app/noya-utils";
-import { Observable as Observable15, set as set2 } from "@noya-app/observable";
+import { uuid as uuid8 } from "@noya-app/noya-utils";
+import { Observable as Observable17, set as set3 } from "@noya-app/observable";
 
 // ../noya-pipeline/src/graphToTasks.ts
 import { get as get3 } from "@noya-app/observable";
 
 // ../noya-pipeline/src/state.ts
-import { uuid as uuid4 } from "@noya-app/noya-utils";
+import { uuid as uuid5 } from "@noya-app/noya-utils";
 var rectSchema = Type.Object({
   x: Type.Number(),
   y: Type.Number(),
@@ -7559,24 +7576,24 @@ var pipelineSchema = Type.Object(
 );
 
 // ../state-manager/src/PipelineManager.ts
-import { Observable as Observable9 } from "@noya-app/observable";
+import { Observable as Observable11 } from "@noya-app/observable";
 
 // ../state-manager/src/PublishingManager.ts
-import { Observable as Observable10 } from "@noya-app/observable";
+import { Observable as Observable12 } from "@noya-app/observable";
 
 // ../state-manager/src/ResourceManager.ts
-import { isDeepEqual as isDeepEqual2, uuid as uuid5 } from "@noya-app/noya-utils";
-import { Observable as Observable11 } from "@noya-app/observable";
+import { isDeepEqual as isDeepEqual3, uuid as uuid6 } from "@noya-app/noya-utils";
+import { Observable as Observable13 } from "@noya-app/observable";
 
 // ../state-manager/src/rpcManager.ts
-import { uuid as uuid6 } from "@noya-app/noya-utils";
-import { Observable as Observable12 } from "@noya-app/observable";
+import { uuid as uuid7 } from "@noya-app/noya-utils";
+import { Observable as Observable14 } from "@noya-app/observable";
 
 // ../state-manager/src/SecretManager.ts
-import { Observable as Observable13 } from "@noya-app/observable";
+import { Observable as Observable15 } from "@noya-app/observable";
 
 // ../state-manager/src/TaskManager.ts
-import { Observable as Observable14 } from "@noya-app/observable";
+import { Observable as Observable16 } from "@noya-app/observable";
 
 // ../state-manager/src/NoyaManager.ts
 var createMutatorParametersSchema = Type.Object({
@@ -7588,6 +7605,9 @@ var createMutatorParametersSchema = Type.Object({
   })
 });
 
+// ../state-manager/src/sync/localRpcHelpers.ts
+import { Base64 as Base642 } from "@noya-app/noya-utils";
+
 // ../noya-keymap/src/hooks.ts
 import { useEffect as useEffect2, useRef as useRef2 } from "react";
 
@@ -7703,7 +7723,7 @@ import { useEffect as useEffect16 } from "react";
 
 // ../noya-multiplayer-react/src/NoyaStateContext.tsx
 import {
-  Observable as Observable16
+  Observable as Observable18
 } from "@noya-app/observable";
 
 // ../noya-react-utils/src/components/AutoSizer.tsx
@@ -7886,7 +7906,7 @@ var FileDropTarget = memoGeneric(function FileDropTarget2({ children, onDropFile
 import { useCallback as useCallback4, useState as useState3 } from "react";
 
 // ../noya-react-utils/src/hooks/useDeepArray.ts
-import { isDeepEqual as isDeepEqual3 } from "@noya-app/noya-utils";
+import { isDeepEqual as isDeepEqual4 } from "@noya-app/noya-utils";
 import { useMemo as useMemo3, useState as useState4 } from "react";
 function useJsonMemo(value) {
   const stringified = useMemo3(
@@ -7901,7 +7921,7 @@ function useJsonMemo(value) {
 }
 
 // ../noya-react-utils/src/hooks/useDeepState.ts
-import { isDeepEqual as isDeepEqual4 } from "@noya-app/noya-utils";
+import { isDeepEqual as isDeepEqual5 } from "@noya-app/noya-utils";
 import { useCallback as useCallback5, useMemo as useMemo4, useState as useState5 } from "react";
 
 // ../noya-react-utils/src/hooks/useFetch.ts
@@ -8010,7 +8030,7 @@ function downloadBlob(...params) {
 }
 
 // ../noya-multiplayer-react/src/NoyaStateContext.tsx
-import React33, {
+import React34, {
   createContext as createContext3,
   useCallback as useCallback14,
   useContext as useContext4,
@@ -8113,7 +8133,7 @@ import React31 from "react";
 import { createRoot } from "react-dom/client";
 
 // ../noya-multiplayer-react/src/inspector/StateInspector.tsx
-import { Base64 as Base642, uuid as uuid8 } from "@noya-app/noya-utils";
+import { Base64 as Base643, memoize as memoize2, uuid as uuid9 } from "@noya-app/noya-utils";
 import React30, {
   useCallback as useCallback12,
   useEffect as useEffect13,
@@ -10452,19 +10472,17 @@ async function importAll(buffer, noyaManager, {
   }
   if (assets.length) {
     await Promise.all(
-      noyaManager.assetManager.assets$.get().map((asset) => noyaManager.assetManager.delete(asset.id))
+      noyaManager.assetManager.assets$.get().map((asset) => noyaManager.assetManager.delete(asset.stableId))
     );
-    const idPairs = await Promise.all(
+    await Promise.all(
       assets.map(async (asset) => {
-        const newAsset = await noyaManager.assetManager.create({
+        await noyaManager.assetManager.create({
           data: assetMap[asset.id],
-          contentType: asset.contentType
+          contentType: asset.contentType,
+          stableId: asset.stableId
         });
-        return [asset.id, newAsset.id];
       })
     );
-    const replacementMap = Object.fromEntries(idPairs);
-    state = replaceDeep(state, replacementMap);
   }
   noyaManager.initialState = state;
   noyaManager.forceInit();
@@ -10497,27 +10515,6 @@ function decodeAll(buffer) {
   }
   return { state, schema, assets, assetMap };
 }
-function replaceDeep(obj, replacementMap) {
-  switch (typeof obj) {
-    case "object":
-      if (obj === null) {
-        return obj;
-      }
-      if (Array.isArray(obj)) {
-        return obj.map((item) => replaceDeep(item, replacementMap));
-      }
-      return Object.fromEntries(
-        Object.entries(obj).map(([key, value]) => [
-          key,
-          replaceDeep(value, replacementMap)
-        ])
-      );
-    case "string":
-      return replacementMap[obj] ?? obj;
-    default:
-      return obj;
-  }
-}
 
 // ../noya-multiplayer-react/src/inspector/StateInspectorTitleLabel.tsx
 import React27 from "react";
@@ -10980,7 +10977,14 @@ var StateInspector = memoGeneric(function StateInspector2({
           "Upload"
         ))
       },
-      /* @__PURE__ */ React30.createElement(StateInspectorDisclosureRowInner, null, assets.map((asset) => /* @__PURE__ */ React30.createElement(StateInspectorRow, { key: asset.id, colorScheme }, /* @__PURE__ */ React30.createElement(themedObjectInspector, { name: asset.id, data: asset, theme: theme3 }), /* @__PURE__ */ React30.createElement(
+      /* @__PURE__ */ React30.createElement(StateInspectorDisclosureRowInner, null, assets.map((asset) => /* @__PURE__ */ React30.createElement(StateInspectorRow, { key: asset.id, colorScheme }, /* @__PURE__ */ React30.createElement(
+        themedObjectInspector,
+        {
+          name: asset.id,
+          data: truncateAsset(asset),
+          theme: theme3
+        }
+      ), /* @__PURE__ */ React30.createElement(
         StateInspectorButton,
         {
           theme: theme3,
@@ -11005,10 +11009,8 @@ var StateInspector = memoGeneric(function StateInspector2({
                 "Are you sure you want to delete all resources?"
               );
               if (!ok) return;
-              await Promise.all(
-                resources.map(
-                  (resource) => resourceManager.deleteResource({ id: resource.id })
-                )
+              await resourceManager.deleteResource(
+                resources.map((resource) => ({ id: resource.id }))
               );
             }
           },
@@ -11018,7 +11020,7 @@ var StateInspector = memoGeneric(function StateInspector2({
           {
             theme: theme3,
             onClick: async () => {
-              const path2 = prompt("Enter directory path") || uuid8();
+              const path2 = prompt("Enter directory path") || uuid9();
               await resourceManager.createResource({
                 type: "directory",
                 path: path2
@@ -11034,9 +11036,9 @@ var StateInspector = memoGeneric(function StateInspector2({
               const file = await uploadFile();
               resourceManager.createResource({
                 type: "asset",
-                path: file.name || uuid8(),
+                path: file.name || uuid9(),
                 asset: {
-                  content: Base642.encode(await file.arrayBuffer()),
+                  content: Base643.encode(await file.arrayBuffer()),
                   contentType: file.type,
                   encoding: "base64"
                 }
@@ -11221,6 +11223,12 @@ var StateInspector = memoGeneric(function StateInspector2({
     )
   );
 });
+var truncateAsset = memoize2((asset) => {
+  if (asset.url.startsWith("data:") || asset.url.startsWith("blob:")) {
+    return { ...asset, url: ellipsis(asset.url, 40) };
+  }
+  return asset;
+});
 
 // ../noya-multiplayer-react/src/hooks.ts
 function useManagedHistory(stateManager) {
@@ -11231,10 +11239,11 @@ function useManagedHistory(stateManager) {
   );
 }
 
+// ../noya-multiplayer-react/src/singleton.tsx
+import React33 from "react";
+
 // ../noya-multiplayer-react/src/NoyaStateContext.tsx
 var AnyNoyaStateContext = createContext3(void 0);
-var ConnectedUsersContext = createContext3(void 0);
-var AnyEphemeralUserDataManagerContext = createContext3(void 0);
 var emptyArray = [];
 function useActivityEventsForManager(streamFilter, activityEventsManager) {
   const [streamId, setStreamId] = useState17(void 0);
@@ -11253,8 +11262,8 @@ function useActivityEventsForManager(streamFilter, activityEventsManager) {
 }
 
 // ../noya-multiplayer-react/src/components/UserPointersOverlay.tsx
-import { Observable as Observable17 } from "@noya-app/observable";
-import React34, { useEffect as useEffect17, useMemo as useMemo12, useState as useState18 } from "react";
+import { Observable as Observable19 } from "@noya-app/observable";
+import React35, { useEffect as useEffect17, useMemo as useMemo12, useState as useState18 } from "react";
 function shouldShow(hideAfter, updatedAt) {
   return !!updatedAt && Date.now() - updatedAt < hideAfter;
 }
@@ -11267,7 +11276,7 @@ var UserPointerInternal = memoGeneric(function UserPointerInternal2({
   const observable = useMemo12(() => {
     const metadata$ = ephemeralUserDataManager.metadata$.observePath([user.id]).throttle(50);
     const data$ = ephemeralUserDataManager.data$.observePath([user.id]).throttle(50);
-    return Observable17.combine([metadata$, data$], ([metadata2, data2]) => {
+    return Observable19.combine([metadata$, data$], ([metadata2, data2]) => {
       return { metadata: metadata2, data: data2 };
     });
   }, [ephemeralUserDataManager, user.id]);
@@ -11297,9 +11306,9 @@ var UserPointersOverlay = memoGeneric(function UserPointers({
 }) {
   const currentUserId = useObservable2(ephemeralUserDataManager.currentUserId$);
   const connectedUsers = useObservable2(connectedUsersManager.connectedUsers$);
-  return /* @__PURE__ */ React34.createElement(React34.Fragment, null, connectedUsers.map((user) => {
+  return /* @__PURE__ */ React35.createElement(React35.Fragment, null, connectedUsers.map((user) => {
     if (user.id === currentUserId) return null;
-    return /* @__PURE__ */ React34.createElement(
+    return /* @__PURE__ */ React35.createElement(
       UserPointerInternal,
       {
         key: user.id,
@@ -11315,7 +11324,7 @@ var UserPointersOverlay = memoGeneric(function UserPointers({
 import {
   RefetchableObservable
 } from "@noya-app/observable-store";
-import { useEffect as useEffect18, useMemo as useMemo13 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect18, useMemo as useMemo13 } from "react";
 function useTable(table, {
   where,
   select
@@ -11363,21 +11372,39 @@ function useTable(table, {
     observable.start?.();
   }, [observable]);
   const { status, data } = useObservable2(observable);
+  const optimisticUpdate = useCallback15(
+    (entity, config) => {
+      if (!table) return;
+      table.optimisticUpdate(entity, config);
+    },
+    [table]
+  );
   return useMemo13(() => {
     return {
       status,
       data,
-      refetch: observable.refetch
+      refetch: observable.refetch,
+      optimisticUpdate
     };
-  }, [status, data, observable]);
+  }, [status, data, observable, optimisticUpdate]);
 }
 function useFileList(select, options = {}) {
   const client = useNoyaClientOrFallback();
-  return useTable(client.fileList$, { select }, options);
+  const { status, data, refetch, optimisticUpdate } = useTable(
+    client.fileList$,
+    { select },
+    options
+  );
+  return {
+    status,
+    data,
+    refetch,
+    optimisticUpdate
+  };
 }
 function useFileListItem(id, select, options = {}) {
   const client = useNoyaClientOrFallback();
-  const { status, data, refetch } = useTable(
+  const { status, data, refetch, optimisticUpdate } = useTable(
     client.fileList$,
     { where: { id: id ?? null }, select },
     options
@@ -11386,21 +11413,28 @@ function useFileListItem(id, select, options = {}) {
     return {
       data: data.at(0),
       status,
-      refetch
+      refetch,
+      optimisticUpdate
     };
-  }, [data, status, refetch]);
+  }, [data, status, refetch, optimisticUpdate]);
 }
 function useResourcesList(fileId, select, options = {}) {
   const client = useNoyaClientOrFallback();
-  return useTable(
+  const { status, data, refetch, optimisticUpdate } = useTable(
     client.resources$,
     { select, where: { accessibleByFileId: fileId } },
     options
   );
+  return {
+    status,
+    data,
+    refetch,
+    optimisticUpdate
+  };
 }
 function useUser(id, select, options = {}) {
   const client = useNoyaClientOrFallback();
-  const { status, data, refetch } = useTable(
+  const { status, data, refetch, optimisticUpdate } = useTable(
     client.users$,
     { select, where: { id: id ?? null } },
     options
@@ -11409,17 +11443,24 @@ function useUser(id, select, options = {}) {
     return {
       status,
       data: data.at(0),
-      refetch
+      refetch,
+      optimisticUpdate
     };
-  }, [status, data, refetch]);
+  }, [status, data, refetch, optimisticUpdate]);
 }
 function useActivityEventsList(fileId, select, options = {}) {
   const client = useNoyaClientOrFallback();
-  return useTable(
+  const { status, data, refetch, optimisticUpdate } = useTable(
     client.activityEvents$,
     { select, where: { fileId } },
     options
   );
+  return {
+    status,
+    data,
+    refetch,
+    optimisticUpdate
+  };
 }
 export {
   NoyaAPIProvider,