Fix simultaneous messages cause message id conflicts & reset imcContext initialization map when tab is closed

Shellishack · Shellishack · commit 1936675b616d · 2025-10-14T07:40:57.000+08:00
diff --git a/.changeset/crazy-cities-stand.md b/.changeset/crazy-cities-stand.md
@@ -0,0 +1,6 @@
+---
+"@pulse-editor/shared-utils": patch
+"@pulse-editor/react-api": patch
+---
+
+Fix simultaneous messages cause message id conflicts
diff --git a/.changeset/pre.json b/.changeset/pre.json
@@ -21,6 +21,7 @@
     "chubby-insects-shake",
     "clean-mangos-swim",
     "cold-shrimps-give",
+    "crazy-cities-stand",
     "cruel-waves-double",
     "cruel-zoos-play",
     "curvy-places-wash",
diff --git a/npm-packages/react-api/CHANGELOG.md b/npm-packages/react-api/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @pulse-editor/react-api
 
+## 0.1.1-alpha.48
+
+### Patch Changes
+
+- Fix simultaneous messages cause message id conflicts
+- Updated dependencies
+  - @pulse-editor/shared-utils@0.1.1-alpha.48
+
 ## 0.1.1-alpha.47
 
 ### Patch Changes
diff --git a/npm-packages/react-api/package.json b/npm-packages/react-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@pulse-editor/react-api",
-  "version": "0.1.1-alpha.47",
+  "version": "0.1.1-alpha.48",
   "main": "dist/main.js",
   "files": [
     "dist"
@@ -38,7 +38,7 @@
     "typescript-eslint": "^8.30.1"
   },
   "peerDependencies": {
-    "@pulse-editor/shared-utils": "0.1.1-alpha.47",
+    "@pulse-editor/shared-utils": "0.1.1-alpha.48",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   }
diff --git a/npm-packages/react-api/src/providers/snapshot-provider.tsx b/npm-packages/react-api/src/providers/snapshot-provider.tsx
@@ -33,6 +33,7 @@ export default function SnapshotProvider({
         const { states } = message.payload;
 
         // Update all states in the context
+        console.log("Restoring snapshot states:", states);
         setStates((prev) => ({ ...states }));
       },
     ],
diff --git a/npm-packages/shared-utils/CHANGELOG.md b/npm-packages/shared-utils/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @pulse-editor/shared-utils
 
+## 0.1.1-alpha.48
+
+### Patch Changes
+
+- Fix simultaneous messages cause message id conflicts
+
 ## 0.1.1-alpha.47
 
 ### Patch Changes
diff --git a/npm-packages/shared-utils/package.json b/npm-packages/shared-utils/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@pulse-editor/shared-utils",
-    "version": "0.1.1-alpha.47",
+    "version": "0.1.1-alpha.48",
     "main": "dist/main.js",
     "files": [
         "dist"
diff --git a/npm-packages/shared-utils/src/imc/inter-module-communication.ts b/npm-packages/shared-utils/src/imc/inter-module-communication.ts
@@ -57,7 +57,9 @@ export class InterModuleCommunication {
         type !== IMCMessageTypeEnum.SignalGetWindowId
       ) {
         console.warn(
-          `Duplicate message received with message ID: ${messageId}. Ignoring this message. Message: ${JSON.stringify(
+          `[${
+            this.thisWindowId
+          }]: Duplicate message received with message ID: ${messageId}. Ignoring this message. Message: ${JSON.stringify(
             event.data
           )}`
         );
diff --git a/npm-packages/shared-utils/src/imc/message-sender.ts b/npm-packages/shared-utils/src/imc/message-sender.ts
@@ -1,3 +1,4 @@
+import { v4 } from "uuid";
 import { IMCMessage, IMCMessageTypeEnum } from "../types/types";
 
 export class MessageSender {
@@ -25,7 +26,7 @@ export class MessageSender {
     abortSignal?: AbortSignal
   ): Promise<any> {
     // Generate a unique id for the message using timestamp
-    const id = new Date().getTime().toString();
+    const id = v4() + new Date().getTime().toString();
     const message: IMCMessage = {
       id,
       type: handlingType,
diff --git a/web/components/app-loaders/sandbox-app-loader.tsx b/web/components/app-loaders/sandbox-app-loader.tsx
@@ -57,8 +57,8 @@ export default function SandboxAppLoader({
     // If the view Id changes (e.g. when switching file but not extension),
     // remove the old IMC channel and create a new one
     if (viewModel.viewId !== currentViewId) {
-      if (currentViewId && imcContext?.polyIMC?.hasChannel(currentViewId)) {
-        imcContext.polyIMC.removeChannel(currentViewId);
+      if (currentViewId && imcContext?.hasChannel(currentViewId)) {
+        imcContext.removeChannel(currentViewId);
       }
       setCurrentViewId(viewModel.viewId);
     }
diff --git a/web/components/providers/imc-provider.tsx b/web/components/providers/imc-provider.tsx
@@ -108,6 +108,18 @@ export default function InterModuleCommunicationProvider({
     });
   }
 
+  function hasChannel(viewId: string) {
+    if (!polyIMCRef.current) return false;
+    return polyIMCRef.current.hasChannel(viewId);
+  }
+
+  function removeChannel(viewId: string) {
+    if (!polyIMCRef.current) return;
+    polyIMCRef.current.removeChannel(viewId);
+    imcInitializedMapRef.current.delete(viewId);
+    delete imcInitializedResolvePromisesRef.current[viewId];
+  }
+
   /**
    * Provide a map of handlers for the IMC messages used for Pulse Editor APIs.
    */
@@ -487,6 +499,8 @@ export default function InterModuleCommunicationProvider({
         resolveWhenViewInitialized,
         markIMCInitialized,
         resolveWhenActionRegistered,
+        hasChannel,
+        removeChannel,
       }}
     >
       {children}
diff --git a/web/lib/hooks/use-canvas-workflow.ts b/web/lib/hooks/use-canvas-workflow.ts
@@ -421,17 +421,19 @@ export default function useCanvasWorkflow(
   }
 
   async function restoreAppsSnapshotStates(content: WorkflowContent) {
-    if (!imcContext) return;
-    else if (!content.snapshotStates) return;
+    if (!imcContext || !imcContext.polyIMC) {
+      console.error("IMC context not available for restoring snapshot states");
+      return;
+    } else if (!content.snapshotStates) return;
 
     const apps = content.nodes.map((node) => node.data.config);
     for (const app of apps) {
       if (!app.viewId) continue;
       if (content.snapshotStates[app.viewId]) {
         // Wait until the view is initialized
-        await imcContext?.resolveWhenViewInitialized(app.viewId);
+        await imcContext.resolveWhenViewInitialized(app.viewId);
         // Send snapshot restore message
-        await imcContext?.polyIMC?.sendMessage(
+        await imcContext.polyIMC.sendMessage(
           app.viewId,
           IMCMessageTypeEnum.EditorAppStateSnapshotRestore,
           { states: content.snapshotStates[app.viewId] },
diff --git a/web/lib/hooks/use-tab-view-manager.ts b/web/lib/hooks/use-tab-view-manager.ts
@@ -211,10 +211,10 @@ export function useTabViewManager() {
     if (view.type === ViewModeEnum.Canvas) {
       // Remove the app nodes' view IDs from IMC context
       (view.config as CanvasViewConfig).appConfigs?.forEach((appConfig) => {
-        imcContext?.polyIMC?.removeChannel(appConfig.viewId);
+        imcContext?.removeChannel(appConfig.viewId);
       });
     } else if (view.type === ViewModeEnum.App) {
-      imcContext?.polyIMC?.removeChannel((view.config as AppViewConfig).viewId);
+      imcContext?.removeChannel((view.config as AppViewConfig).viewId);
     }
   }
 
@@ -237,10 +237,10 @@ export function useTabViewManager() {
     tabViews.forEach((view) => {
       if (view.type === ViewModeEnum.Canvas) {
         (view.config as CanvasViewConfig).appConfigs?.forEach((appConfig) => {
-          imcContext?.polyIMC?.removeChannel(appConfig.viewId);
+          imcContext?.removeChannel(appConfig.viewId);
         });
       } else if (view.type === ViewModeEnum.App) {
-        imcContext?.polyIMC?.removeChannel(
+        imcContext?.removeChannel(
           (view.config as AppViewConfig).viewId,
         );
       }
diff --git a/web/lib/types.ts b/web/lib/types.ts
@@ -306,6 +306,8 @@ export type IMCContextType = {
   resolveWhenViewInitialized: (viewId: string) => Promise<void>;
   markIMCInitialized: (viewId: string) => void;
   resolveWhenActionRegistered: (action: Action) => Promise<void>;
+  hasChannel: (viewId: string) => boolean;
+  removeChannel: (viewId: string) => void;
 };
 
 // #endregion

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@pulse-editor/shared-utils",`
`3`		`- "version": "0.1.1-alpha.47",`
	`3`	`+ "version": "0.1.1-alpha.48",`
`4`	`4`	`"main": "dist/main.js",`
`5`	`5`	`"files": [`
`6`	`6`	`"dist"`
Original file line number	Diff line number	Diff line change
`@@ -57,8 +57,8 @@ export default function SandboxAppLoader({`
`57`	`57`	`// If the view Id changes (e.g. when switching file but not extension),`
`58`	`58`	`// remove the old IMC channel and create a new one`
`59`	`59`	`if (viewModel.viewId !== currentViewId) {`
`60`		`- if (currentViewId && imcContext?.polyIMC?.hasChannel(currentViewId)) {`
`61`		`- imcContext.polyIMC.removeChannel(currentViewId);`
	`60`	`+ if (currentViewId && imcContext?.hasChannel(currentViewId)) {`
	`61`	`+ imcContext.removeChannel(currentViewId);`
`62`	`62`	`}`
`63`	`63`	`setCurrentViewId(viewModel.viewId);`
`64`	`64`	`}`