Add IMC error handling

Shellishack · Shellishack · commit 2955b3ac6de9 · 2025-10-04T06:55:47.000+08:00
diff --git a/.changeset/bumpy-parents-pull.md b/.changeset/bumpy-parents-pull.md
@@ -0,0 +1,6 @@
+---
+"@pulse-editor/shared-utils": patch
+"@pulse-editor/react-api": patch
+---
+
+Rename pre-regsitered actions
diff --git a/.changeset/pre.json b/.changeset/pre.json
@@ -15,6 +15,7 @@
   "changesets": [
     "angry-llamas-smash",
     "beige-pandas-rhyme",
+    "bumpy-parents-pull",
     "calm-rivers-march",
     "chatty-trains-beam",
     "chubby-insects-shake",
@@ -45,6 +46,7 @@
     "sad-tables-join",
     "sharp-memes-give",
     "shiny-doodles-jump",
+    "silent-glasses-kick",
     "slick-roses-fix",
     "social-donkeys-cross",
     "soft-cases-share",
diff --git a/.changeset/silent-glasses-kick.md b/.changeset/silent-glasses-kick.md
@@ -0,0 +1,6 @@
+---
+"@pulse-editor/shared-utils": patch
+"@pulse-editor/react-api": patch
+---
+
+Update register action hook for react api
diff --git a/.changeset/tough-aliens-appear.md b/.changeset/tough-aliens-appear.md
@@ -0,0 +1,6 @@
+---
+"@pulse-editor/shared-utils": patch
+"@pulse-editor/react-api": patch
+---
+
+Add error handler in IMC
diff --git a/npm-packages/react-api/CHANGELOG.md b/npm-packages/react-api/CHANGELOG.md
@@ -1,5 +1,21 @@
 # @pulse-editor/react-api
 
+## 0.1.1-alpha.41
+
+### Patch Changes
+
+- Update register action hook for react api
+- Updated dependencies
+  - @pulse-editor/shared-utils@0.1.1-alpha.41
+
+## 0.1.1-alpha.40
+
+### Patch Changes
+
+- Rename pre-regsitered actions
+- Updated dependencies
+  - @pulse-editor/shared-utils@0.1.1-alpha.40
+
 ## 0.1.1-alpha.39
 
 ### 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.39",
+  "version": "0.1.1-alpha.41",
   "main": "dist/main.js",
   "files": [
     "dist"
@@ -38,7 +38,7 @@
     "typescript-eslint": "^8.30.1"
   },
   "peerDependencies": {
-    "@pulse-editor/shared-utils": "0.1.1-alpha.39",
+    "@pulse-editor/shared-utils": "0.1.1-alpha.41",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   }
diff --git a/npm-packages/react-api/src/hooks/editor/use-register-action.ts b/npm-packages/react-api/src/hooks/editor/use-register-action.ts
@@ -21,10 +21,12 @@ import useIMC from "../../lib/use-imc";
  *
  */
 export default function useRegisterAction(
-  name: string,
-  description: string,
-  parameters: Record<string, TypedVariable>,
-  returns: Record<string, TypedVariable>,
+  actionInfo: {
+    name: string;
+    description: string;
+    parameters?: Record<string, TypedVariable>;
+    returns?: Record<string, TypedVariable>;
+  },
   callbackHandler?: (args: any) => Promise<string | void>,
   isExtReady: boolean = true
 ) {
@@ -34,10 +36,10 @@ export default function useRegisterAction(
   const commandQueue = useRef<{ args: any; resolve: (v: any) => void }[]>([]);
 
   const [action, setAction] = useState<Action>({
-    name,
-    description,
-    parameters,
-    returns,
+    name: actionInfo.name,
+    description: actionInfo.description,
+    parameters: actionInfo.parameters ?? {},
+    returns: actionInfo.returns ?? {},
     handler: callbackHandler,
   });
 
@@ -76,7 +78,13 @@ export default function useRegisterAction(
   }, [action, imc, isExtReady]);
 
   useEffect(() => {
-    setAction((prev) => ({ ...prev, name, description, parameters, returns }));
+    setAction((prev) => ({
+      ...prev,
+      name: actionInfo.name,
+      description: actionInfo.description,
+      parameters: actionInfo.parameters ?? {},
+      returns: actionInfo.returns ?? {},
+    }));
   }, [callbackHandler]);
 
   async function executeAction(args: any) {
@@ -94,9 +102,9 @@ export default function useRegisterAction(
           const { name: requestedName, args }: { name: string; args: any } =
             message.payload;
 
-          if (name === requestedName) {
+          if (actionInfo.name === requestedName) {
             // Validate parameters
-            const actionParams = parameters;
+            const actionParams = actionInfo.parameters ?? {};
             if (Object.keys(args).length !== Object.keys(actionParams).length) {
               throw new Error(
                 `Invalid number of parameters: expected ${
@@ -106,13 +114,13 @@ export default function useRegisterAction(
             }
 
             for (const [key, value] of Object.entries(args)) {
-              if (parameters[key] === undefined) {
+              if (actionParams[key] === undefined) {
                 throw new Error(`Invalid parameter: ${key}`);
               }
-              if (typeof value !== parameters[key].type) {
+              if (typeof value !== actionParams[key].type) {
                 throw new Error(
                   `Invalid type for parameter ${key}: expected ${
-                    parameters[key].type
+                    actionParams[key].type
                   }, got ${typeof value}. Value received: ${value}`
                 );
               }
diff --git a/npm-packages/shared-utils/CHANGELOG.md b/npm-packages/shared-utils/CHANGELOG.md
@@ -1,5 +1,17 @@
 # @pulse-editor/shared-utils
 
+## 0.1.1-alpha.41
+
+### Patch Changes
+
+- Update register action hook for react api
+
+## 0.1.1-alpha.40
+
+### Patch Changes
+
+- Rename pre-regsitered actions
+
 ## 0.1.1-alpha.39
 
 ### 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.39",
+    "version": "0.1.1-alpha.41",
     "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
@@ -1,9 +1,9 @@
+import { messageTimeout } from "../types/constants";
 import {
   IMCMessage,
   IMCMessageTypeEnum,
   ReceiverHandlerMap,
 } from "../types/types";
-import { messageTimeout } from "../types/constants";
 import { MessageReceiver } from "./message-receiver";
 import { MessageSender } from "./message-sender";
 
@@ -72,7 +72,10 @@ export class InterModuleCommunication {
       }
 
       const message = event.data;
-      if (process.env.NODE_ENV === "development" && message.from !== undefined) {
+      if (
+        process.env.NODE_ENV === "development" &&
+        message.from !== undefined
+      ) {
         console.log(
           `Module ${this.thisWindowId} received message from module ${
             message.from
@@ -198,7 +201,17 @@ export class InterModuleCommunication {
         const pendingMessage = this.sender?.getPendingMessage(message.id);
         if (pendingMessage) {
           pendingMessage.resolve(message.payload);
-          this.sender?.removePendingMessage(message.id);
+        }
+      }
+    );
+
+    // Handle error message from the other window.
+    this.receiverHandlerMap?.set(
+      IMCMessageTypeEnum.SignalError,
+      async (senderWindow: Window, message: IMCMessage) => {
+        const pendingMessage = this.sender?.getPendingMessage(message.id);
+        if (pendingMessage) {
+          pendingMessage.reject(new Error(message.payload));
         }
       }
     );
diff --git a/npm-packages/shared-utils/src/imc/message-sender.ts b/npm-packages/shared-utils/src/imc/message-sender.ts
@@ -6,7 +6,7 @@ export class MessageSender {
 
   private pendingMessages: Map<
     string,
-    { resolve: (result: any) => void; reject: () => void }
+    { resolve: (value: any) => void; reject: (reason: any) => void }
   >;
 
   private moduleId: string;
@@ -58,43 +58,37 @@ export class MessageSender {
       // Attach abort listener
       abortSignal?.addEventListener("abort", abortHandler);
 
-      // Send message
-      this.pendingMessages.set(id, {
-        resolve,
-        reject,
-      });
-      this.targetWindow.postMessage(message, "*");
-
       // Check timeout
       const timeoutId = setTimeout(() => {
         this.pendingMessages.delete(id);
         abortSignal?.removeEventListener("abort", abortHandler);
         reject(new Error("Communication with Pulse Editor timeout."));
       }, this.timeout);
-
       // Ensure cleanup on resolution
-      const currentMessage = this.pendingMessages.get(id);
-      if (currentMessage) {
-        currentMessage.resolve = (result) => {
-          clearTimeout(timeoutId);
-          abortSignal?.removeEventListener("abort", abortHandler);
-          resolve(result);
-        };
+      const onResolve = (value: any) => {
+        clearTimeout(timeoutId);
+        abortSignal?.removeEventListener("abort", abortHandler);
+        this.pendingMessages.delete(id);
+        resolve(value);
+      };
 
-        currentMessage.reject = () => {
-          clearTimeout(timeoutId);
-          abortSignal?.removeEventListener("abort", abortHandler);
-          reject();
-        };
-      }
+      const onReject = (reason: any) => {
+        clearTimeout(timeoutId);
+        abortSignal?.removeEventListener("abort", abortHandler);
+        this.pendingMessages.delete(id);
+        reject(reason);
+      };
+      this.pendingMessages.set(id, {
+        resolve: onResolve,
+        reject: onReject,
+      });
+
+      // Send message
+      this.targetWindow.postMessage(message, "*");
     });
   }
 
   public getPendingMessage(id: string) {
     return this.pendingMessages.get(id);
   }
-
-  public removePendingMessage(id: string) {
-    this.pendingMessages.delete(id);
-  }
 }
diff --git a/npm-packages/shared-utils/src/types/types.ts b/npm-packages/shared-utils/src/types/types.ts
@@ -132,7 +132,7 @@ export type AppConfig = {
   // App installed agents
   agents?: Agent[];
   // Exposed actions in the modular app
-  actions?: Action[];
+  preRegisteredActions?: Action[];
   // Visibility
   visibility: string;
   // Recommended dimensions for app view in canvas

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.39",`
	`3`	`+ "version": "0.1.1-alpha.41",`
`4`	`4`	`"main": "dist/main.js",`
`5`	`5`	`"files": [`
`6`	`6`	`"dist"`