@rimori/client 1.2.0 → 1.3.0

package/src/plugin/PluginController.ts

@@ -1,10 +1,11 @@
 import { createClient, SupabaseClient } from '@supabase/supabase-js';
 import { UserInfo } from '../core/controller/SettingsController';
 import { EventBus, EventBusMessage } from '../fromRimori/EventBus';
-import { Plugin } from '../fromRimori/PluginTypes';
+import { ActivePlugin, Plugin } from '../fromRimori/PluginTypes';
 import { RimoriClient } from "./RimoriClient";
 import { StandaloneClient } from './StandaloneClient';
 import { setTheme } from './ThemeSetter';
+import { Logger } from './Logger';
 
 // Add declaration for WorkerGlobalScope
 declare const WorkerGlobalScope: any;
@@ -19,46 +20,116 @@ export interface RimoriInfo {
   pluginId: string
   installedPlugins: Plugin[]
   profile: UserInfo
+  mainPanelPlugin?: ActivePlugin
+  sidePanelPlugin?: ActivePlugin
 }
 
 export class PluginController {
   private static client: RimoriClient;
   private static instance: PluginController;
-  private communicationSecret: string | null = null;
+  private port: MessagePort | null = null;
+  private queryParams: Record<string, string> = {};
   private supabase: SupabaseClient | null = null;
   private rimoriInfo: RimoriInfo | null = null;
   private pluginId: string;
+  private isMessageChannelReady: boolean = false;
+  private pendingRequests: Array<() => void> = [];
 
   private constructor(pluginId: string, standalone: boolean) {
     this.pluginId = pluginId;
     this.getClient = this.getClient.bind(this);
 
     if (typeof WorkerGlobalScope === 'undefined') {
-      setTheme();
+      // In standalone mode, use URL fallback. In iframe mode, theme will be set after MessageChannel init
+      if (standalone) {
+        setTheme();
+      }
     }
 
-    //no need to forward messages to parent in standalone mode
+    //no need to forward messages to parent in standalone mode or worker context
     if (standalone) return;
 
-    window.addEventListener("message", (event) => {
-      // console.log("client: message received", event);
-      const { topic, sender, data, eventId } = event.data.event as EventBusMessage;
+    this.initMessageChannel(typeof WorkerGlobalScope !== 'undefined');
+  }
+
+  private initMessageChannel(worker: boolean = false) {
+    const listener = (event: MessageEvent) => {
+      console.log("[PluginController] window message", { origin: event.origin, data: event.data });
+      const { type, pluginId, queryParams, rimoriInfo } = event.data || {};
+      const [transferredPort] = event.ports || [];
+
+      if (type !== "rimori:init" || !transferredPort || pluginId !== this.pluginId) {
+        console.log("[PluginController] message ignored (not init or wrong plugin)", { type, pluginId, hasPort: !!transferredPort });
+        return;
+      }
+
+      this.queryParams = queryParams || {};
+      this.port = transferredPort;
+
+      // Initialize Supabase client immediately with provided info
+      if (rimoriInfo) {
+        this.rimoriInfo = rimoriInfo;
+        this.supabase = createClient(rimoriInfo.url, rimoriInfo.key, {
+          accessToken: () => Promise.resolve(rimoriInfo.token)
+        });
+      }
+
+      // Handle messages from parent
+      this.port.onmessage = ({ data }) => {
+        const { event, type, eventId, response, error } = data || {};
+
+        // no idea why this is needed but it works for now
+        if (type === 'response' && eventId) {
+          EventBus.emit(this.pluginId, response.topic, response.data, eventId);
+        } else if (type === 'error' && eventId) {
+          EventBus.emit(this.pluginId, 'error', { error }, eventId);
+        } else if (event) {
+          const { topic, sender, data: eventData, eventId } = event as EventBusMessage;
+          if (sender !== this.pluginId) {
+            EventBus.emit(sender, topic, eventData, eventId);
+          }
+        }
+      };
 
-      // skip forwarding messages from own plugin
-      if (sender === pluginId) return;
+      // Set theme from MessageChannel query params
+      if (!worker) {
+        const theme = this.queryParams['rm_theme'];
+        setTheme(theme);
+      }
 
-      EventBus.emit(sender, topic, data, eventId);
-    });
+      // Forward plugin events to parent (only after MessageChannel is ready)
+      EventBus.on("*", (ev) => {
+        if (ev.sender === this.pluginId && !ev.topic.startsWith("self.")) {
+          this.port?.postMessage({ event: ev });
+        }
+      });
 
-    const secret = this.getSecret();
+      // Mark MessageChannel as ready and process pending requests
+      this.isMessageChannelReady = true;
 
-    EventBus.on("*", (event) => {
-      // skip messages which are not from the own plugin
-      if (event.sender !== this.pluginId) return;
-      if (event.topic.startsWith("self.")) return;
-      // console.log("sending event to parent", event);
-      window.parent.postMessage({ event, secret }, "*")
-    });
+      // Process any pending requests
+      this.pendingRequests.forEach(request => request());
+      this.pendingRequests = [];
+    };
+    if (worker) {
+      self.onmessage = listener;
+    } else {
+      window.addEventListener("message", listener);
+    }
+    this.sendHello(worker);
+  }
+
+  private sendHello(isWorker: boolean = false) {
+    try {
+      const payload = { type: "rimori:hello", pluginId: this.pluginId };
+      if (isWorker) {
+        self.postMessage(payload);
+      } else {
+        window.parent.postMessage(payload, "*");
+      }
+    } catch (e) {
+      console.error("[PluginController] Error sending hello:", e);
+    }
   }
 
   public static async getInstance(pluginId: string, standalone = false): Promise<RimoriClient> {
@@ -68,56 +139,113 @@ export class PluginController {
       }
       PluginController.instance = new PluginController(pluginId, standalone);
       PluginController.client = await RimoriClient.getInstance(PluginController.instance);
+
+      //only init logger in workers and on main plugin pages
+      if (PluginController.instance.getQueryParam("applicationMode") !== "sidebar") {
+        Logger.getInstance(PluginController.client);
+      }
     }
     return PluginController.client;
   }
 
-  private getSecret(): string | null {
-    if (!this.communicationSecret) {
-      const secret = new URLSearchParams(window.location.search).get("secret");
-      if (!secret) {
-        console.info("Communication secret not found in URL as query parameter");
-      }
-      this.communicationSecret = secret;
-    }
-    return this.communicationSecret;
+  public getQueryParam(key: string): string | null {
+    return this.queryParams[key] || null;
   }
 
   public async getClient(): Promise<{ supabase: SupabaseClient, info: RimoriInfo }> {
-    if (
-      this.supabase &&
-      this.rimoriInfo &&
-      this.rimoriInfo.expiration > new Date()
-    ) {
+    // Return cached client if valid
+    if (this.supabase && this.rimoriInfo && this.rimoriInfo.expiration > new Date()) {
       return { supabase: this.supabase, info: this.rimoriInfo };
     }
 
-    const { data } = await EventBus.request<RimoriInfo>(this.pluginId, "global.supabase.requestAccess");
-    this.rimoriInfo = data;
-    this.supabase = createClient(this.rimoriInfo.url, this.rimoriInfo.key, {
-      accessToken: () => Promise.resolve(this.getToken())
-    });
+    // If MessageChannel is not ready yet, queue the request
+    if (!this.isMessageChannelReady) {
+      return new Promise<{ supabase: SupabaseClient, info: RimoriInfo }>((resolve) => {
+        this.pendingRequests.push(async () => {
+          const result = await this.getClient();
+          resolve(result);
+        });
+      });
+    }
+
+    // If we have rimoriInfo from MessageChannel init, use it directly
+    if (this.rimoriInfo && this.supabase) {
+      return { supabase: this.supabase, info: this.rimoriInfo };
+    }
+
+    // Fallback: request from parent
+    if (!this.rimoriInfo) {
+      if (typeof WorkerGlobalScope !== 'undefined') {
+        // In worker context, send request via self.postMessage to WorkerHandler
+        const eventId = Math.floor(Math.random() * 1000000000);
+        const requestEvent = {
+          event: {
+            timestamp: new Date().toISOString(),
+            eventId,
+            sender: this.pluginId,
+            topic: 'global.supabase.requestAccess',
+            data: {},
+            debug: false
+          }
+        };
+
+        return new Promise<{ supabase: SupabaseClient, info: RimoriInfo }>((resolve) => {
+          // Listen for the response
+          const originalOnMessage = self.onmessage;
+          self.onmessage = (event) => {
+            if (event.data?.topic === 'global.supabase.requestAccess' && event.data?.eventId === eventId) {
+              this.rimoriInfo = event.data.data;
+              this.supabase = createClient(this.rimoriInfo!.url, this.rimoriInfo!.key, {
+                accessToken: () => Promise.resolve(this.getToken())
+              });
+              self.onmessage = originalOnMessage; // Restore original handler
+              resolve({ supabase: this.supabase, info: this.rimoriInfo! });
+            } else if (originalOnMessage) {
+              originalOnMessage.call(self, event);
+            }
+          };
 
-    return { supabase: this.supabase, info: this.rimoriInfo };
+          // Send the request
+          self.postMessage(requestEvent);
+        });
+      } else {
+        // In main thread context, use EventBus
+        const { data } = await EventBus.request<RimoriInfo>(this.pluginId, "global.supabase.requestAccess");
+        this.rimoriInfo = data;
+        this.supabase = createClient(this.rimoriInfo.url, this.rimoriInfo.key, {
+          accessToken: () => Promise.resolve(this.getToken())
+        });
+      }
+    }
+
+    return { supabase: this.supabase!, info: this.rimoriInfo };
   }
 
-  public async getToken() {
+  public async getToken(): Promise<string> {
     if (this.rimoriInfo && this.rimoriInfo.expiration && this.rimoriInfo.expiration > new Date()) {
       return this.rimoriInfo.token;
     }
 
-    const { data } = await EventBus.request<{ token: string, expiration: Date }>(this.pluginId, "global.supabase.requestAccess");
-
+    // If we don't have rimoriInfo, request it
     if (!this.rimoriInfo) {
-      throw new Error("Supabase info not found");
+      const { data } = await EventBus.request<RimoriInfo>(this.pluginId, "global.supabase.requestAccess");
+      this.rimoriInfo = data;
+      return this.rimoriInfo.token;
     }
 
+    // If token is expired, request fresh access
+    const { data } = await EventBus.request<{ token: string, expiration: Date }>(this.pluginId, "global.supabase.requestAccess");
     this.rimoriInfo.token = data.token;
     this.rimoriInfo.expiration = data.expiration;
 
     return this.rimoriInfo.token;
   }
 
+  /**
+   * Gets the Supabase URL.
+   * @returns The Supabase URL.
+   * @deprecated All endpoints should use the backend URL instead.
+   */
   public getSupabaseUrl() {
     if (!this.rimoriInfo) {
       throw new Error("Supabase info not found");

package/src/plugin/RimoriClient.ts

@@ -2,12 +2,12 @@ import { PostgrestQueryBuilder } from "@supabase/postgrest-js";
 import { SupabaseClient } from "@supabase/supabase-js";
 import { GenericSchema } from "@supabase/supabase-js/dist/module/lib/types";
 import { generateText, Message, OnLLMResponse, streamChatGPT } from "../core/controller/AIController";
-import { generateObject as generateObjectFunction, ObjectRequest } from "../core/controller/ObjectController";
+import { generateObject, ObjectRequest } from "../core/controller/ObjectController";
 import { SettingsController, UserInfo } from "../core/controller/SettingsController";
 import { SharedContent, SharedContentController, SharedContentFilter, SharedContentObjectRequest } from "../core/controller/SharedContentController";
 import { getSTTResponse, getTTSResponse } from "../core/controller/VoiceController";
 import { EventBus, EventBusMessage, EventHandler, EventPayload } from "../fromRimori/EventBus";
-import { Plugin, Tool } from "../fromRimori/PluginTypes";
+import { ActivePlugin, MainPanelAction, Plugin, Tool } from "../fromRimori/PluginTypes";
 import { AccomplishmentHandler, AccomplishmentPayload } from "./AccomplishmentHandler";
 import { PluginController, RimoriInfo } from "./PluginController";
 
@@ -17,7 +17,7 @@ interface Db {
     <TableName extends string & keyof GenericSchema['Tables'], Table extends GenericSchema['Tables'][TableName]>(relation: TableName): PostgrestQueryBuilder<GenericSchema, Table, TableName>;
     <ViewName extends string & keyof GenericSchema['Views'], View extends GenericSchema['Views'][ViewName]>(relation: ViewName): PostgrestQueryBuilder<GenericSchema, View, ViewName>;
   };
-  storage: SupabaseClient["storage"];
+  // storage: SupabaseClient["storage"];
 
   // functions: SupabaseClient["functions"];
   /**
@@ -44,11 +44,26 @@ interface PluginInterface {
    */
   getSettings: <T extends object>(defaultSettings: T) => Promise<T>;
   /**
-  * Fetches all installed plugins.
-  * @returns A promise that resolves to an array of plugins
-  */
-  getInstalled: () => Promise<Plugin[]>;
-  getUserInfo: () => Promise<UserInfo>;
+   * Retrieves information about plugins, including:
+   * - All installed plugins
+   * - The currently active plugin in the main panel
+   * - The currently active plugin in the side panel
+   */
+  getPluginInfo: () => {
+    /**
+     * All installed plugins.
+     */
+    installedPlugins: Plugin[],
+    /**
+     * The plugin that is loaded in the main panel.
+     */
+    mainPanelPlugin?: ActivePlugin,
+    /**
+     * The plugin that is loaded in the side panel.
+     */
+    sidePanelPlugin?: ActivePlugin,
+  };
+  getUserInfo: () => UserInfo;
 }
 
 export class RimoriClient {
@@ -58,27 +73,23 @@ export class RimoriClient {
   private settingsController: SettingsController;
   private sharedContentController: SharedContentController;
   private accomplishmentHandler: AccomplishmentHandler;
-  private supabaseUrl: string;
-  private installedPlugins: Plugin[];
-  private profile: UserInfo;
+  private rimoriInfo: RimoriInfo;
   public plugin: PluginInterface;
   public db: Db;
 
   private constructor(supabase: SupabaseClient, info: RimoriInfo, pluginController: PluginController) {
+    this.rimoriInfo = info;
     this.superbase = supabase;
     this.pluginController = pluginController;
     this.settingsController = new SettingsController(supabase, info.pluginId);
     this.sharedContentController = new SharedContentController(this.superbase, this);
-    this.supabaseUrl = this.pluginController.getSupabaseUrl();
     this.accomplishmentHandler = new AccomplishmentHandler(info.pluginId);
-    this.installedPlugins = info.installedPlugins;
-    this.profile = info.profile;
 
     this.from = this.from.bind(this);
 
     this.db = {
       from: this.from,
-      storage: this.superbase.storage,
+      // storage: this.superbase.storage,
       // functions: this.superbase.functions,
       tablePrefix: info.tablePrefix,
       getTableName: this.getTableName.bind(this),
@@ -91,11 +102,15 @@ export class RimoriClient {
       getSettings: async <T extends object>(defaultSettings: T): Promise<T> => {
         return await this.settingsController.getSettings<T>(defaultSettings);
       },
-      getInstalled: async (): Promise<Plugin[]> => {
-        return this.installedPlugins;
+      getUserInfo: (): UserInfo => {
+        return this.rimoriInfo.profile;
       },
-      getUserInfo: async (): Promise<UserInfo> => {
-        return this.profile;
+      getPluginInfo: () => {
+        return {
+          installedPlugins: this.rimoriInfo.installedPlugins,
+          mainPanelPlugin: this.rimoriInfo.mainPanelPlugin,
+          sidePanelPlugin: this.rimoriInfo.sidePanelPlugin,
+        }
       }
     }
   }
@@ -175,6 +190,12 @@ export class RimoriClient {
      */
     emitSidebarAction: (pluginId: string, actionKey: string, text?: string) => {
       this.event.emit("global.sidebar.triggerAction", { plugin_id: pluginId, action_key: actionKey, text });
+    },
+
+    onMainPanelAction: (callback: (data: MainPanelAction) => void) => {
+      // this needs to be a emit and on because the main panel action is triggered by the user and not by the plugin
+      this.event.emit("action.requestMain")
+      this.event.on<MainPanelAction>("action.requestMain", ({ data }) => callback(data));
     }
   }
 
@@ -184,6 +205,15 @@ export class RimoriClient {
     }
   }
 
+  /**
+   * Get a query parameter value that was passed via MessageChannel
+   * @param key The query parameter key
+   * @returns The query parameter value or null if not found
+   */
+  public getQueryParam(key: string): string | null {
+    return this.pluginController.getQueryParam(key);
+  }
+
   public static async getInstance(pluginController: PluginController): Promise<RimoriClient> {
     if (!RimoriClient.instance) {
       const client = await pluginController.getClient();
@@ -204,11 +234,14 @@ export class RimoriClient {
     return this.superbase.from(this.getTableName(relation));
   }
 
-  private getTableName(type: string) {
-    if (type.startsWith("global_")) {
-      return type.replace("global_", "");
+  private getTableName(table: string) {
+    if (/[A-Z]/.test(table)) {
+      throw new Error("Table name cannot include uppercase letters. Please use snake_case for table names.");
+    }
+    if (table.startsWith("global_")) {
+      return table.replace("global_", "");
     }
-    return this.db.tablePrefix + "_" + type;
+    return this.db.tablePrefix + "_" + table;
   }
 
   public ai = {
@@ -222,18 +255,32 @@ export class RimoriClient {
     },
     getVoice: async (text: string, voice = "alloy", speed = 1, language?: string): Promise<Blob> => {
       const token = await this.pluginController.getToken();
-      return getTTSResponse(this.supabaseUrl, { input: text, voice, speed, language }, token);
+      return getTTSResponse(this.pluginController.getBackendUrl(), { input: text, voice, speed, language }, token);
     },
-    getTextFromVoice: (file: Blob): Promise<string> => {
-      return getSTTResponse(this.superbase, file);
+    getTextFromVoice: async (file: Blob): Promise<string> => {
+      const token = await this.pluginController.getToken();
+      return getSTTResponse(this.pluginController.getBackendUrl(), file, token);
     },
     getObject: async (request: ObjectRequest): Promise<any> => {
       const token = await this.pluginController.getToken();
-      return generateObjectFunction(this.supabaseUrl, request, token);
+      return generateObject(this.pluginController.getBackendUrl(), request, token);
     },
     // getSteamedObject: this.generateObjectStream,
   }
 
+  public runtime = {
+    fetchBackend: async (url: string, options: RequestInit) => {
+      const token = await this.pluginController.getToken();
+      return fetch(this.pluginController.getBackendUrl() + url, {
+        ...options,
+        headers: {
+          ...options.headers,
+          'Authorization': `Bearer ${token}`
+        }
+      });
+    }
+  }
+
   public community = {
     /**
      * Shared content is a way to share completable content with other users using this plugin.
@@ -265,16 +312,20 @@ export class RimoriClient {
        * @param contentType The type of shared content to fetch. E.g. assignments, exercises, etc.
        * @param generatorInstructions The instructions for the creation of new shared content. The object will automatically be extended with a tool property with a topic and keywords property to let a new unique topic be generated.
        * @param filter The optional additional filter for checking new shared content based on a column and value. This is useful if the aditional information stored on the shared content is used to further narrow down the kind of shared content wanted to be received. E.g. only adjective grammar exercises.
-       * @param privateTopic An optional flag to indicate if the topic should be private and only be visible to the user. This is useful if the topic is not meant to be shared with other users. Like for personal topics or if the content is based on the personal study goal.
+       * @param options An optional object with options for the new shared content.
+       * @param options.privateTopic An optional flag to indicate if the topic should be private and only be visible to the user. This is useful if the topic is not meant to be shared with other users. Like for personal topics or if the content is based on the personal study goal.
+       * @param options.skipDbSave An optional flag to indicate if the new shared content should not be saved to the database. This is useful if the new shared content is not meant to be saved to the database.
+       * @param options.alwaysGenerateNew An optional flag to indicate if the new shared content should always be generated even if there is already a content with the same filter. This is useful if the new shared content is not meant to be saved to the database.
+       * @param options.excludeIds An optional list of ids to exclude from the selection. This is useful if the new shared content is not meant to be saved to the database.
        * @returns The new shared content.
        */
       getNew: async <T = any>(
         contentType: string,
         generatorInstructions: SharedContentObjectRequest,
         filter?: SharedContentFilter,
-        privateTopic?: boolean,
+        options?: { privateTopic?: boolean; skipDbSave?: boolean; alwaysGenerateNew?: boolean; excludeIds?: string[] },
       ): Promise<SharedContent<T>> => {
-        return await this.sharedContentController.getNewSharedContent(contentType, generatorInstructions, filter, privateTopic);
+        return await this.sharedContentController.getNewSharedContent(contentType, generatorInstructions, filter, options);
       },
       /**
        * Create a new shared content item.
@@ -301,6 +352,20 @@ export class RimoriClient {
       complete: async (contentType: string, assignmentId: string) => {
         return await this.sharedContentController.completeSharedContent(contentType, assignmentId);
       },
+      /**
+       /**
+        * Update the state of a shared content item for a specific user.
+        * Useful for marking content as completed, ongoing, hidden, liked, disliked, or bookmarked.
+        */
+      updateState: async (params: {
+        contentType: string
+        id: string
+        state?: 'completed' | 'ongoing' | 'hidden'
+        reaction?: 'liked' | 'disliked' | null
+        bookmarked?: boolean
+      }): Promise<void> => {
+        return await this.sharedContentController.updateSharedContentState(params);
+      },
       /**
        * Remove a shared content item.
        * @param id The id of the shared content item to remove.

package/src/plugin/StandaloneClient.ts

@@ -4,7 +4,8 @@ import { DEFAULT_ANON_KEY, DEFAULT_ENDPOINT } from "../utils/endpoint";
 
 export interface StandaloneConfig {
   url: string,
-  key: string
+  key: string,
+  backendUrl?: string
 }
 
 export class StandaloneClient {
@@ -25,6 +26,7 @@ export class StandaloneClient {
       StandaloneClient.instance = new StandaloneClient({
         url: config?.SUPABASE_URL || DEFAULT_ENDPOINT,
         key: config?.SUPABASE_ANON_KEY || DEFAULT_ANON_KEY,
+        backendUrl: config?.BACKEND_URL || 'https://api.rimori.se',
       });
     }
     return StandaloneClient.instance;
@@ -58,18 +60,32 @@ export class StandaloneClient {
     EventBus.respond("standalone", "global.supabase.requestAccess", async () => {
       const session = await supabase.auth.getSession();
       console.log("session", session);
-      const { data, error } = await supabase.functions.invoke("plugin-token", {
-        body: { pluginId },
-        headers: { authorization: `Bearer ${session.data.session?.access_token}` },
+      
+      // Call the NestJS backend endpoint instead of the Supabase edge function
+      const response = await fetch(`${config.backendUrl}/plugin/token`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'Authorization': `Bearer ${session.data.session?.access_token}`
+        },
+        body: JSON.stringify({
+          pluginId: pluginId
+        })
       });
-      if (error) {
-        throw new Error("Failed to get plugin token. " + error.message);
+
+      if (!response.ok) {
+        const errorText = await response.text();
+        throw new Error(`Failed to get plugin token. ${response.status}: ${errorText}`);
       }
+
+      const data = await response.json();
+      
       return {
         token: data.token,
         pluginId: pluginId,
         url: config.url,
         key: config.key,
+        backendUrl: config.backendUrl,
         tablePrefix: pluginId,
         expiration: new Date(Date.now() + 1000 * 60 * 60 * 1.5), // 1.5 hours
       }

package/src/plugin/ThemeSetter.ts

@@ -1,17 +1,20 @@
-export function setTheme() {
+export function setTheme(theme?: string | null) {
   document.documentElement.classList.add("dark:text-gray-200");
 
-  if (isDarkTheme()) {
+  if (isDarkTheme(theme)) {
     document.documentElement.setAttribute("data-theme", "dark");
     document.documentElement.classList.add('dark', "dark:bg-gray-950");
     document.documentElement.style.background = "hsl(var(--background))";
   }
 }
 
-export function isDarkTheme(): boolean {
-  const urlParams = new URLSearchParams(window.location.search);
+export function isDarkTheme(theme?: string | null): boolean {
+  // If no theme provided, try to get from URL as fallback (for standalone mode)
+  if (!theme) {
+    const urlParams = new URLSearchParams(window.location.search);
+    theme = urlParams.get('theme');
+  }
 
-  let theme = urlParams.get('theme');
   if (!theme || theme === 'system') {
     return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
   }