fix(plugins): fix i18n message protocol for iframe communication

Fixed the message passing between plugin iframes and plugin.ts to use
the proper PLUGIN_MESSAGE/PLUGIN_MESSAGE_RESPONSE protocol instead of
custom messages. This ensures translations and other messages are
correctly routed through the plugin bridge.

Changes:
- Updated useTranslate to use PLUGIN_MESSAGE type
- Listen for PLUGIN_MESSAGE_RESPONSE instead of custom response
- Wrap message in { type, payload } structure
- Updated plugin.ts to read from message.payload
- Added debug logging for troubleshooting
- Applied fixes to both procrastination-buster and boilerplate

packages/plugin-dev/boilerplate-solid-js/src/plugin.ts

@@ -83,12 +83,12 @@ if (plugin.onMessage) {
         };
       case 'createTask': {
         const newTask = await plugin.addTask({
-          title: message.data.title,
-          projectId: message.data.projectId,
+          title: message.payload.title,
+          projectId: message.payload.projectId,
         });
 
         plugin.showSnack({
-          msg: `Task "${message.data.title}" created!`,
+          msg: `Task "${message.payload.title}" created!`,
           type: 'SUCCESS',
         });
 
@@ -100,7 +100,7 @@ if (plugin.onMessage) {
         return await plugin.getAllProjects();
       // Example: Persist plugin data
       case 'saveSettings':
-        await plugin.persistDataSynced(JSON.stringify(message.data));
+        await plugin.persistDataSynced(JSON.stringify(message.payload));
         return { success: true };
       // Example: Load plugin data
       case 'loadSettings': {
@@ -109,9 +109,9 @@ if (plugin.onMessage) {
       }
       // i18n support
       case 'translate':
-        return plugin.translate(message.data.key, message.data.params);
+        return await plugin.translate(message.payload.key, message.payload.params);
       case 'getCurrentLanguage':
-        return plugin.getCurrentLanguage();
+        return await plugin.getCurrentLanguage();
       default:
         return { error: 'Unknown message type' };
     }

packages/plugin-dev/boilerplate-solid-js/src/utils/useTranslate.ts

@@ -1,19 +1,22 @@
 import { createSignal, createEffect, onCleanup } from 'solid-js';
 
-// Communication with plugin.js
+// Communication with plugin.js via the PluginAPI.onMessage system
 const sendMessage = async (type: string, payload?: any): Promise<any> => {
   return new Promise((resolve) => {
     const messageId = Math.random().toString(36).substring(2, 9);
 
     const handler = (event: MessageEvent) => {
-      if (event.data.messageId === messageId) {
+      // Listen for MESSAGE_RESPONSE from parent
+      if (event.data.type === 'PLUGIN_MESSAGE_RESPONSE' && event.data.messageId === messageId) {
         window.removeEventListener('message', handler);
-        resolve(event.data.response);
+        resolve(event.data.result);
       }
     };
 
     window.addEventListener('message', handler);
-    window.parent.postMessage({ type, payload, messageId }, '*');
+    const message = { type, payload };
+    // Use the proper PLUGIN_MESSAGE type for the plugin message system
+    window.parent.postMessage({ type: 'PLUGIN_MESSAGE', message, messageId }, '*');
   });
 };
 

packages/plugin-dev/procrastination-buster/src/plugin.ts

@@ -12,12 +12,21 @@ plugin.log.info('Procrastination Buster plugin initialized');
 // i18n support - handle translation requests from iframe
 if (plugin.onMessage) {
   plugin.onMessage(async (message: any) => {
+    plugin.log.info('[plugin.ts] Received message:', message);
     switch (message?.type) {
       case 'translate':
-        return plugin.translate(message.payload.key, message.payload.params);
+        const translation = await plugin.translate(
+          message.payload.key,
+          message.payload.params,
+        );
+        plugin.log.info('[plugin.ts] Returning translation:', translation);
+        return translation;
       case 'getCurrentLanguage':
-        return plugin.getCurrentLanguage();
+        const lang = await plugin.getCurrentLanguage();
+        plugin.log.info('[plugin.ts] Returning language:', lang);
+        return lang;
       default:
+        plugin.log.info('[plugin.ts] Unknown message type:', message?.type);
         return { error: 'Unknown message type' };
     }
   });

packages/plugin-dev/procrastination-buster/src/utils/useTranslate.ts

@@ -1,19 +1,32 @@
 import { createSignal, createEffect, onCleanup } from 'solid-js';
 
-// Communication with plugin.js
+// Communication with plugin.js via the PluginAPI.onMessage system
 const sendMessage = async (type: string, payload?: any): Promise<any> => {
   return new Promise((resolve) => {
     const messageId = Math.random().toString(36).substring(2, 9);
 
     const handler = (event: MessageEvent) => {
-      if (event.data.messageId === messageId) {
+      console.log('[useTranslate] Received message:', event.data);
+      // Listen for MESSAGE_RESPONSE from parent
+      if (
+        event.data.type === 'PLUGIN_MESSAGE_RESPONSE' &&
+        event.data.messageId === messageId
+      ) {
+        console.log('[useTranslate] Message matched, resolving with:', event.data.result);
         window.removeEventListener('message', handler);
-        resolve(event.data.response);
+        resolve(event.data.result);
       }
     };
 
     window.addEventListener('message', handler);
-    window.parent.postMessage({ type, payload, messageId }, '*');
+    const message = { type, payload };
+    console.log('[useTranslate] Sending message:', {
+      type: 'PLUGIN_MESSAGE',
+      message,
+      messageId,
+    });
+    // Use the proper PLUGIN_MESSAGE type for the plugin message system
+    window.parent.postMessage({ type: 'PLUGIN_MESSAGE', message, messageId }, '*');
   });
 };