@noya-app/noya-multiplayer-react 0.1.70 → 0.1.72

package/src/__tests__/resourcePayload.test.ts

@@ -2,14 +2,9 @@ import {
   ModifiedResource,
   Resource,
   ResourceCreate,
-  ResourceCreateMap,
-  ResourceMap,
 } from "@noya-app/noya-schemas";
 import { describe, expect, it } from "bun:test";
-import {
-  buildCreateResourcePayload,
-  resourceToCreateParameters,
-} from "../NoyaStateContext";
+import { buildResourcePatchPayload } from "../NoyaStateContext";
 
 const ISO_DATE = "2024-01-01T00:00:00.000Z";
 
@@ -82,25 +77,23 @@ describe("resource payload helpers", () => {
   it("returns create parameters for added resources", () => {
     const addedResource = createDirectoryResourceCreate();
 
-    const result = buildCreateResourcePayload({
+    const result = buildResourcePatchPayload({
       addedResources: [addedResource],
       modifiedResources: [],
-      newResourceMap: {
-        [addedResource.path]: addedResource,
-      } satisfies ResourceCreateMap,
-      resourceMap: {},
+      removedResources: [],
     });
 
-    expect(result.payload).toEqual([
+    expect(result.create).toEqual([
       {
         path: "docs",
         type: "directory",
       },
     ]);
-    expect(result.consumedModifiedResourceIds).toEqual([]);
+    expect(result.update).toBeUndefined();
+    expect(result.delete).toBeUndefined();
   });
 
-  it("includes asset replacements when a modified resource swaps the asset", () => {
+  it("includes update entries when a modified resource swaps the asset", () => {
     const existingResource = createAssetResource({
       id: "existing-resource",
       stableId: "existing-stable",
@@ -115,117 +108,31 @@ describe("resource payload helpers", () => {
       assetId: "asset-new",
     });
 
-    const result = buildCreateResourcePayload({
+    const result = buildResourcePatchPayload({
       addedResources: [],
       modifiedResources: [
         {
           id: existingResource.id,
           stableId: existingResource.stableId,
           assetId: updatedResource.assetId,
-        } satisfies ModifiedResource,
-      ],
-      newResourceMap: {
-        [updatedResource.path]: updatedResource,
-      } satisfies ResourceCreateMap,
-      resourceMap: {
-        [existingResource.path]: existingResource,
-      } satisfies ResourceMap,
-    });
-
-    expect(result.payload).toEqual([
-      resourceToCreateParameters(updatedResource),
-    ]);
-    expect(result.consumedModifiedResourceIds).toEqual([
-      existingResource.id,
-    ]);
-  });
-
-  it("includes asset replacements when a modified resource provides inline asset data", () => {
-    const existingResource = createAssetResource({
-      id: "existing-resource",
-      stableId: "existing-stable",
-      path: "images/logo.png",
-      assetId: "asset-old",
-    });
-
-    const updatedResource = createAssetResourceCreate({
-      id: "existing-resource",
-      stableId: "existing-stable",
-      path: "images/logo.png",
-      assetId: "asset-old",
-      asset: {
-        content: "ZGF0YQ==",
-        contentType: "image/png",
-        encoding: "base64" as const,
-      },
-    });
-
-    const result = buildCreateResourcePayload({
-      addedResources: [],
-      modifiedResources: [
-        {
-          id: existingResource.id,
-          stableId: existingResource.stableId,
           asset: updatedResource.asset,
         } satisfies ModifiedResource,
       ],
-      newResourceMap: {
-        [updatedResource.path]: updatedResource,
-      } satisfies ResourceCreateMap,
-      resourceMap: {
-        [existingResource.path]: existingResource,
-      } satisfies ResourceMap,
+      removedResources: [],
     });
 
-    expect(result.payload).toEqual([
-      resourceToCreateParameters(updatedResource),
-    ]);
-    expect(result.consumedModifiedResourceIds).toEqual([
-      existingResource.id,
-    ]);
-  });
-
-  it("deduplicates payload entries by path", () => {
-    const existingResource = createAssetResource({
-      id: "existing-resource",
-      stableId: "existing-stable",
-      path: "shared/path",
-      assetId: "asset-old",
-    });
-
-    const updatedResource = createAssetResourceCreate({
-      id: "new-resource",
-      stableId: "new-stable",
-      path: "shared/path",
-      assetId: "asset-new",
-    });
-
-    const result = buildCreateResourcePayload({
-      addedResources: [updatedResource],
-      modifiedResources: [
-        {
-          id: existingResource.id,
-          stableId: existingResource.stableId,
-          assetId: updatedResource.assetId,
-        } satisfies ModifiedResource,
-      ],
-      newResourceMap: {
-        [updatedResource.path]: updatedResource,
-      } satisfies ResourceCreateMap,
-      resourceMap: {
-        [existingResource.path]: existingResource,
-      } satisfies ResourceMap,
-    });
-
-    expect(result.payload).toEqual([
-      resourceToCreateParameters(updatedResource),
-    ]);
-    expect(result.consumedModifiedResourceIds).toEqual([
-      existingResource.id,
+    expect(result.update).toEqual([
+      {
+        id: existingResource.id,
+        assetId: updatedResource.assetId,
+        asset: updatedResource.asset,
+      },
     ]);
+    expect(result.create).toBeUndefined();
+    expect(result.delete).toBeUndefined();
   });
 
-  it("excludes modified resources without asset changes from the consumed list", () => {
+  it("includes delete entries for removed resources", () => {
     const existingResource = createAssetResource({
       id: "existing-resource",
       stableId: "existing-stable",
@@ -233,31 +140,14 @@ describe("resource payload helpers", () => {
       assetId: "asset-old",
     });
 
-    const updatedResource = createAssetResourceCreate({
-      id: "existing-resource",
-      stableId: "existing-stable",
-      path: "images/logo.png",
-      assetId: "asset-old",
-    });
-
-    const result = buildCreateResourcePayload({
+    const result = buildResourcePatchPayload({
       addedResources: [],
-      modifiedResources: [
-        {
-          id: existingResource.id,
-          stableId: existingResource.stableId,
-          path: updatedResource.path,
-        } satisfies ModifiedResource,
-      ],
-      newResourceMap: {
-        [updatedResource.path]: updatedResource,
-      } satisfies ResourceCreateMap,
-      resourceMap: {
-        [existingResource.path]: existingResource,
-      } satisfies ResourceMap,
+      modifiedResources: [],
+      removedResources: [existingResource],
     });
 
-    expect(result.payload).toEqual([]);
-    expect(result.consumedModifiedResourceIds).toEqual([]);
+    expect(result.delete).toEqual([{ id: existingResource.id }]);
+    expect(result.create).toBeUndefined();
+    expect(result.update).toBeUndefined();
   });
 });

package/src/components/UserPointersOverlay.tsx

@@ -3,9 +3,9 @@
 import { Observable } from "@noya-app/observable";
 import { memoGeneric } from "@noya-app/react-utils";
 import {
-  ConnectedUsersManager,
-  EphemeralUserDataManager,
   MultiplayerUser,
+  SharedConnectionDataManager,
+  UserManager,
 } from "@noya-app/state-manager";
 import React, { useEffect, useMemo, useState } from "react";
 import { useObservable } from "../useObservable";
@@ -26,7 +26,7 @@ export type RenderUserPointer = {
 
 type InternalUserPointerProps<E extends UserPointerData> = {
   user: MultiplayerUser;
-  ephemeralUserDataManager: EphemeralUserDataManager<E>;
+  sharedConnectionDataManager: SharedConnectionDataManager<E>;
   hideAfter?: number;
 } & RenderUserPointer;
 
@@ -38,22 +38,22 @@ const UserPointerInternal = memoGeneric(function UserPointerInternal<
   E extends UserPointerData,
 >({
   user,
-  ephemeralUserDataManager,
+  sharedConnectionDataManager,
   hideAfter = 5000,
   renderUserPointer,
 }: InternalUserPointerProps<E>) {
   const observable = useMemo(() => {
-    const metadata$ = ephemeralUserDataManager.metadata$
-      .observePath([user.id] as const)
+    const metadata$ = sharedConnectionDataManager.metadata$
+      .observePath([user.connectionId] as const)
       .throttle(50);
-    const data$ = ephemeralUserDataManager.data$
-      .observePath([user.id] as const)
+    const data$ = sharedConnectionDataManager.data$
+      .observePath([user.connectionId] as const)
       .throttle(50);
 
     return Observable.combine([metadata$, data$], ([metadata, data]) => {
       return { metadata, data };
     });
-  }, [ephemeralUserDataManager, user.id]);
+  }, [sharedConnectionDataManager, user.connectionId]);
 
   const { metadata, data } = useObservable(observable);
 
@@ -75,7 +75,7 @@ const UserPointerInternal = memoGeneric(function UserPointerInternal<
   if (!data?.pointer) return null;
 
   return renderUserPointer({
-    userId: user.id,
+    userId: user.connectionId,
     name: user.name,
     point: data.pointer,
     visible: show,
@@ -83,31 +83,33 @@ const UserPointerInternal = memoGeneric(function UserPointerInternal<
 });
 
 export type UserPointersOverlayProps<E extends UserPointerData> = {
-  connectedUsersManager: ConnectedUsersManager;
-  ephemeralUserDataManager: EphemeralUserDataManager<E>;
+  userManager: UserManager;
+  sharedConnectionDataManager: SharedConnectionDataManager<E>;
 } & RenderUserPointer;
 
 export const UserPointersOverlay = memoGeneric(function UserPointers<
   E extends UserPointerData,
 >({
-  connectedUsersManager,
-  ephemeralUserDataManager,
+  userManager,
+  sharedConnectionDataManager,
   renderUserPointer,
 }: UserPointersOverlayProps<E>) {
-  const currentUserId = useObservable(ephemeralUserDataManager.currentUserId$);
-  const connectedUsers = useObservable(connectedUsersManager.connectedUsers$);
+  const currentConnectionId = useObservable(
+    sharedConnectionDataManager.currentConnectionId$
+  );
+  const connectedUsers = useObservable(userManager.connectedUsers$);
 
   return (
     <>
       {connectedUsers.map((user) => {
-        if (user.id === currentUserId) return null;
+        if (user.connectionId === currentConnectionId) return null;
 
         return (
           <UserPointerInternal
-            key={user.id}
+            key={user.connectionId}
             user={user}
-            ephemeralUserDataManager={
-              ephemeralUserDataManager as unknown as EphemeralUserDataManager<UserPointerData>
+            sharedConnectionDataManager={
+              sharedConnectionDataManager as unknown as SharedConnectionDataManager<UserPointerData>
             }
             renderUserPointer={renderUserPointer}
           />

package/src/hooks.ts

@@ -108,8 +108,9 @@ export type UseMultiplayerStateOptions<
   M extends object = object,
   E extends object = object,
   MenuT extends string = string,
+  I extends Record<string, any> = Record<string, unknown>,
 > = NoyaManagerOptions<S, M> & {
-  sync?: SyncAdapter<S, M, E, MenuT>;
+  sync?: SyncAdapter<S, M, E, MenuT, I>;
   inspector?: boolean | StateInspectorOptions;
 };
 
@@ -119,10 +120,11 @@ export function useBindNoyaManager<
   M extends object = object,
   E extends object = object,
   MenuT extends string = string,
+  I extends Record<string, any> = Record<string, unknown>,
 >(
-  noyaManager: NoyaManager<S, M, E, MenuT>,
+  noyaManager: NoyaManager<S, M, E, MenuT, I>,
   options?: Pick<
-    UseMultiplayerStateOptions<S, M, E, MenuT>,
+    UseMultiplayerStateOptions<S, M, E, MenuT, I>,
     "inspector" | "sync"
   >
 ) {
@@ -135,8 +137,8 @@ export function useBindNoyaManager<
     noyaManager: typeof noyaManager;
     taskManager: typeof noyaManager.taskManager;
     connectionEventManager: typeof noyaManager.connectionEventManager;
-    connectedUsersManager: typeof noyaManager.connectedUsersManager;
-    ephemeralUserDataManager: typeof noyaManager.ephemeralUserDataManager;
+    userManager: typeof noyaManager.userManager;
+    sharedConnectionDataManager: typeof noyaManager.sharedConnectionDataManager;
     multiplayerStateManager: typeof noyaManager.multiplayerStateManager;
     assetManager: typeof noyaManager.assetManager;
     aiManager: typeof noyaManager.aiManager;
@@ -154,8 +156,8 @@ export function useBindNoyaManager<
       noyaManager,
       taskManager: noyaManager.taskManager,
       connectionEventManager: noyaManager.connectionEventManager,
-      connectedUsersManager: noyaManager.connectedUsersManager,
-      ephemeralUserDataManager: noyaManager.ephemeralUserDataManager,
+      userManager: noyaManager.userManager,
+      sharedConnectionDataManager: noyaManager.sharedConnectionDataManager,
       multiplayerStateManager: noyaManager.multiplayerStateManager,
       assetManager: noyaManager.assetManager,
       aiManager: noyaManager.aiManager,
@@ -179,9 +181,10 @@ export function useBindNoyaManager<
 
   useErrorOverlay<MenuT>(noyaManager);
 
-  useStateInspector<S, M, E, MenuT>({
+  useStateInspector<S, M, E, MenuT, I>({
     noyaManager,
     disabled: !options?.inspector,
+    advanced: true,
     ...(typeof options?.inspector === "object" && options?.inspector),
   });
 
@@ -193,30 +196,35 @@ export function useMultiplayerState<
   M extends object = object,
   E extends object = object,
   MenuT extends string = string,
+  I extends Record<string, any> = Record<string, unknown>,
 >(
   initialState: S | (() => S),
-  options?: UseMultiplayerStateOptions<S, M, E, MenuT>
+  options?: UseMultiplayerStateOptions<S, M, E, MenuT, I>
 ) {
   const {
     sync = stubSync<
       unknown,
       object,
       object,
-      string
-    >() as unknown as SyncAdapter<S, M, E, MenuT>,
+      string,
+      Record<string, unknown>
+    >() as unknown as SyncAdapter<S, M, E, MenuT, I>,
     inspector,
     ...rest
   } = options ?? {};
 
   const [noyaManager] = useState(
-    () => new NoyaManager<S, M, E, MenuT>(initialState, rest)
+    () => new NoyaManager<S, M, E, MenuT, I>(initialState, rest)
   );
 
-  return useBindNoyaManager<S, M, E, MenuT>(noyaManager, { sync, inspector });
+  return useBindNoyaManager<S, M, E, MenuT, I>(noyaManager, {
+    sync,
+    inspector,
+  });
 }
 
 function useErrorOverlay<MenuT extends string = string>(
-  noyaManager: NoyaManager<any, any, any, MenuT>
+  noyaManager: NoyaManager<any, any, any, MenuT, any>
 ) {
   const unrecoverableError = useObservable(noyaManager.unrecoverableError);