@rimori/react-client 0.4.15 → 0.4.16-next.0

package/dist/components/ai/Avatar.js

@@ -12,9 +12,7 @@ export function Avatar({ avatarImageUrl, voiceId, agentTools, autoStartConversat
     const { isDark: isDarkThemeValue } = useTheme(plugin.theme);
     const [agentReplying, setAgentReplying] = useState(false);
     const [isProcessingMessage, setIsProcessingMessage] = useState(false);
-    const dialectTtsInstruction = !disableDialect && (userInfo === null || userInfo === void 0 ? void 0 : userInfo.dialect)
-        ? `Speak with a ${userInfo.dialect} accent and pronunciation.`
-        : undefined;
+    const dialectTtsInstruction = !disableDialect && (userInfo === null || userInfo === void 0 ? void 0 : userInfo.dialect) ? `Speak with a ${userInfo.dialect} accent and pronunciation.` : undefined;
     const sender = useMemo(() => new MessageSender((...args) => ai.getVoice(...args), voiceId, cache), [voiceId, ai, cache]);
     useEffect(() => {
         sender.setInstructions(dialectTtsInstruction);

package/dist/components/ai/utils.d.ts

@@ -1,6 +1,8 @@
+/** @deprecated Use server-side prompt definitions (prompt + variables) instead of building messages client-side. */
 export interface FirstMessages {
     instructions?: string;
     userMessage?: string;
     assistantMessage?: string;
 }
+/** @deprecated Use server-side prompt definitions (prompt + variables) instead of building messages client-side. */
 export declare function getFirstMessages(instructions: FirstMessages): any[];

package/dist/components/ai/utils.js

@@ -1,3 +1,4 @@
+/** @deprecated Use server-side prompt definitions (prompt + variables) instead of building messages client-side. */
 export function getFirstMessages(instructions) {
     const messages = [];
     if (instructions.instructions) {

package/dist/hooks/UseChatHook.d.ts

@@ -1,11 +1,23 @@
 import React from 'react';
 import { Tool } from '@rimori/client';
 import { Message } from '@rimori/client';
+export interface UseChatConfig {
+    /** Server-side prompt name (e.g. 'storytelling.story'). */
+    prompt?: string;
+    /** Variables for the server-side prompt template. */
+    promptVariables?: Record<string, any>;
+}
 export declare function useChat(tools?: Tool[], options?: {
-    knowledgeId?: string | (() => string | undefined);
+    /** @deprecated Use uuid variable with resolver 'knowledgeEntry' in prompt definitions instead. */
+    knowledgeId?: string;
+    /** Server-side prompt name (e.g. 'storytelling.story'). When set, the backend resolves the system prompt. */
+    prompt?: string;
+    /** Variables for the server-side prompt template. */
+    promptVariables?: Record<string, any>;
 }): {
     messages: Message[];
     append: (appendMessages: Message[]) => void;
+    init: (config: UseChatConfig) => void;
     isLoading: boolean;
     setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
     lastMessage: Message | undefined;

package/dist/hooks/UseChatHook.js

@@ -4,25 +4,41 @@ export function useChat(tools, options) {
     const [messages, setMessages] = React.useState([]);
     const [isLoading, setIsLoading] = React.useState(false);
     const { ai } = useRimori();
+    const configRef = React.useRef({
+        prompt: options === null || options === void 0 ? void 0 : options.prompt,
+        promptVariables: options === null || options === void 0 ? void 0 : options.promptVariables,
+    });
+    /**
+     * Set (or update) the prompt configuration after mount.
+     * Call this before the first `append` to configure the server-side prompt
+     * without needing refs. Does NOT trigger AI generation.
+     */
+    const init = React.useCallback((config) => {
+        configRef.current = Object.assign(Object.assign({}, configRef.current), config);
+    }, []);
     const append = (appendMessages) => {
+        var _a, _b;
         const allMessages = [...messages, ...appendMessages];
         setMessages(allMessages);
-        const knowledgeId = typeof (options === null || options === void 0 ? void 0 : options.knowledgeId) === 'function' ? options.knowledgeId() : options === null || options === void 0 ? void 0 : options.knowledgeId;
-        ai.getSteamedText(allMessages, (id, message, finished, toolInvocations) => {
-            const lastMessage = messages[messages.length - 1];
+        setIsLoading(true);
+        const knowledgeId = options === null || options === void 0 ? void 0 : options.knowledgeId;
+        const promptVariables = (_a = configRef.current.promptVariables) !== null && _a !== void 0 ? _a : options === null || options === void 0 ? void 0 : options.promptVariables;
+        const prompt = (_b = configRef.current.prompt) !== null && _b !== void 0 ? _b : options === null || options === void 0 ? void 0 : options.prompt;
+        void ai.getSteamedText(allMessages, (id, message, finished, toolInvocations) => {
             setIsLoading(!finished);
-            if ((lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.id) === id) {
-                lastMessage.content = message;
-                setMessages([...messages, lastMessage]);
-            }
-            else {
-                setMessages([...allMessages, { id, role: 'assistant', content: message, toolCalls: toolInvocations }]);
-            }
-        }, tools, false, undefined, knowledgeId);
+            setMessages((prev) => {
+                const last = prev[prev.length - 1];
+                if ((last === null || last === void 0 ? void 0 : last.id) === id) {
+                    return [...prev.slice(0, -1), Object.assign(Object.assign({}, last), { content: message, toolCalls: toolInvocations })];
+                }
+                return [...prev, { id, role: 'assistant', content: message, toolCalls: toolInvocations }];
+            });
+        }, tools, false, undefined, knowledgeId, prompt, promptVariables);
     };
     return {
         messages,
         append,
+        init,
         isLoading,
         setMessages,
         lastMessage: messages[messages.length - 1],

package/dist/hooks/UseSettingsHook.d.ts

@@ -0,0 +1,22 @@
+import type { BasePluginSettings, ExplicitUndefined } from '@rimori/client';
+export interface UseSettingsResult<T extends BasePluginSettings> {
+    /** The current settings (starts as `defaultSettings`, updated once loaded from server). */
+    settings: ExplicitUndefined<T>;
+    /** True while the initial load is in progress. */
+    isLoading: boolean;
+    /** Persist a partial or full settings update. Merges with current settings. */
+    setSettings: (update: Partial<T>) => Promise<void>;
+}
+/**
+ * Hook for managing plugin settings with loading state.
+ *
+ * Loads settings on mount (merging with defaults via `plugin.getSettings`),
+ * exposes the current value, a loading flag, and a setter that persists changes.
+ *
+ * ```tsx
+ * const { settings, isLoading, setSettings } = useSettings(DEFAULT_SETTINGS);
+ * if (isLoading) return <Spinner />;
+ * await setSettings({ genre: 'mystery' });
+ * ```
+ */
+export declare function useSettings<T extends BasePluginSettings>(defaultSettings: ExplicitUndefined<T>): UseSettingsResult<T>;

package/dist/hooks/UseSettingsHook.js

@@ -0,0 +1,48 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { useState, useEffect, useCallback } from 'react';
+import { useRimori } from '../providers/PluginProvider';
+/**
+ * Hook for managing plugin settings with loading state.
+ *
+ * Loads settings on mount (merging with defaults via `plugin.getSettings`),
+ * exposes the current value, a loading flag, and a setter that persists changes.
+ *
+ * ```tsx
+ * const { settings, isLoading, setSettings } = useSettings(DEFAULT_SETTINGS);
+ * if (isLoading) return <Spinner />;
+ * await setSettings({ genre: 'mystery' });
+ * ```
+ */
+export function useSettings(defaultSettings) {
+    const plugin = useRimori();
+    const [settings, setSettingsState] = useState(defaultSettings);
+    const [isLoading, setIsLoading] = useState(true);
+    useEffect(() => {
+        let cancelled = false;
+        void plugin.plugin.getSettings(defaultSettings).then((loaded) => {
+            if (cancelled)
+                return;
+            setSettingsState(loaded);
+            setIsLoading(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+        // Only run on mount — defaultSettings reference is stable by convention.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    const setSettings = useCallback((update) => __awaiter(this, void 0, void 0, function* () {
+        const merged = Object.assign(Object.assign({}, settings), update);
+        setSettingsState(merged);
+        yield plugin.plugin.setSettings(merged);
+    }), [settings, plugin]);
+    return { settings, isLoading, setSettings };
+}

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './hooks/UseChatHook';
+export * from './hooks/UseSettingsHook';
 export * from './providers/PluginProvider';
 export * from './components/audio/Playbutton';
 export * from './components/ai/Avatar';

package/dist/index.js

@@ -1,5 +1,6 @@
 // Re-export everything
 export * from './hooks/UseChatHook';
+export * from './hooks/UseSettingsHook';
 export * from './providers/PluginProvider';
 export * from './components/audio/Playbutton';
 export * from './components/ai/Avatar';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rimori/react-client",
-  "version": "0.4.15",
+  "version": "0.4.16-next.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -18,14 +18,14 @@
   },
   "scripts": {
     "build": "tsc && sass src/style.scss:dist/style.css",
-    "dev": "tsc -w  --preserveWatchOutput",
+    "dev": "git pull && tsc -w  --preserveWatchOutput",
     "dev:watch": "tsc -w  --preserveWatchOutput",
     "css-dev": "sass --watch src/style.scss:dist/style.css",
     "lint": "eslint . --fix",
     "format": "prettier --write ."
   },
   "peerDependencies": {
-    "@rimori/client": "^2.5.26",
+    "@rimori/client": "^2.5.27",
     "react": "^18.1.0",
     "react-dom": "^18.1.0"
   },
@@ -49,7 +49,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.37.0",
-    "@rimori/client": "^2.5.26",
+    "@rimori/client": "^2.5.27",
     "@types/react": "^18.3.21",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",

package/src/components/ai/Avatar.tsx

@@ -39,9 +39,8 @@ export function Avatar({
   const { isDark: isDarkThemeValue } = useTheme(plugin.theme);
   const [agentReplying, setAgentReplying] = useState(false);
   const [isProcessingMessage, setIsProcessingMessage] = useState(false);
-  const dialectTtsInstruction = !disableDialect && userInfo?.dialect
-    ? `Speak with a ${userInfo.dialect} accent and pronunciation.`
-    : undefined;
+  const dialectTtsInstruction =
+    !disableDialect && userInfo?.dialect ? `Speak with a ${userInfo.dialect} accent and pronunciation.` : undefined;
   const sender = useMemo(
     () => new MessageSender((...args) => ai.getVoice(...args), voiceId, cache),
     [voiceId, ai, cache],

package/src/components/ai/utils.ts

@@ -1,9 +1,11 @@
+/** @deprecated Use server-side prompt definitions (prompt + variables) instead of building messages client-side. */
 export interface FirstMessages {
   instructions?: string;
   userMessage?: string;
   assistantMessage?: string;
 }
 
+/** @deprecated Use server-side prompt definitions (prompt + variables) instead of building messages client-side. */
 export function getFirstMessages(instructions: FirstMessages): any[] {
   const messages = [];
 

package/src/hooks/UseChatHook.ts

@@ -3,38 +3,74 @@ import { Tool } from '@rimori/client';
 import { useRimori } from '../providers/PluginProvider';
 import { Message, ToolInvocation } from '@rimori/client';
 
-export function useChat(tools?: Tool[], options?: { knowledgeId?: string | (() => string | undefined) }) {
+export interface UseChatConfig {
+  /** Server-side prompt name (e.g. 'storytelling.story'). */
+  prompt?: string;
+  /** Variables for the server-side prompt template. */
+  promptVariables?: Record<string, any>;
+}
+
+export function useChat(
+  tools?: Tool[],
+  options?: {
+    /** @deprecated Use uuid variable with resolver 'knowledgeEntry' in prompt definitions instead. */
+    knowledgeId?: string;
+    /** Server-side prompt name (e.g. 'storytelling.story'). When set, the backend resolves the system prompt. */
+    prompt?: string;
+    /** Variables for the server-side prompt template. */
+    promptVariables?: Record<string, any>;
+  },
+) {
   const [messages, setMessages] = React.useState<Message[]>([]);
   const [isLoading, setIsLoading] = React.useState(false);
   const { ai } = useRimori();
+  const configRef = React.useRef<UseChatConfig>({
+    prompt: options?.prompt,
+    promptVariables: options?.promptVariables,
+  });
+
+  /**
+   * Set (or update) the prompt configuration after mount.
+   * Call this before the first `append` to configure the server-side prompt
+   * without needing refs. Does NOT trigger AI generation.
+   */
+  const init = React.useCallback((config: UseChatConfig) => {
+    configRef.current = { ...configRef.current, ...config };
+  }, []);
 
   const append = (appendMessages: Message[]) => {
     const allMessages = [...messages, ...appendMessages];
     setMessages(allMessages);
-    const knowledgeId = typeof options?.knowledgeId === 'function' ? options.knowledgeId() : options?.knowledgeId;
-    ai.getSteamedText(
+    setIsLoading(true);
+    const knowledgeId = options?.knowledgeId;
+    const promptVariables = configRef.current.promptVariables ?? options?.promptVariables;
+    const prompt = configRef.current.prompt ?? options?.prompt;
+
+    void ai.getSteamedText(
       allMessages,
       (id, message, finished: boolean, toolInvocations?: ToolInvocation[]) => {
-        const lastMessage = messages[messages.length - 1];
         setIsLoading(!finished);
-
-        if (lastMessage?.id === id) {
-          lastMessage.content = message;
-          setMessages([...messages, lastMessage]);
-        } else {
-          setMessages([...allMessages, { id, role: 'assistant', content: message, toolCalls: toolInvocations }]);
-        }
+        setMessages((prev) => {
+          const last = prev[prev.length - 1];
+          if (last?.id === id) {
+            return [...prev.slice(0, -1), { ...last, content: message, toolCalls: toolInvocations }];
+          }
+          return [...prev, { id, role: 'assistant', content: message, toolCalls: toolInvocations }];
+        });
       },
       tools,
       false,
       undefined,
       knowledgeId,
+      prompt,
+      promptVariables,
     );
   };
 
   return {
     messages,
     append,
+    init,
     isLoading,
     setMessages,
     lastMessage: messages[messages.length - 1] as Message | undefined,

package/src/hooks/UseSettingsHook.ts

@@ -0,0 +1,55 @@
+import { useState, useEffect, useCallback } from 'react';
+import type { BasePluginSettings, ExplicitUndefined } from '@rimori/client';
+import { useRimori } from '../providers/PluginProvider';
+
+export interface UseSettingsResult<T extends BasePluginSettings> {
+  /** The current settings (starts as `defaultSettings`, updated once loaded from server). */
+  settings: ExplicitUndefined<T>;
+  /** True while the initial load is in progress. */
+  isLoading: boolean;
+  /** Persist a partial or full settings update. Merges with current settings. */
+  setSettings: (update: Partial<T>) => Promise<void>;
+}
+
+/**
+ * Hook for managing plugin settings with loading state.
+ *
+ * Loads settings on mount (merging with defaults via `plugin.getSettings`),
+ * exposes the current value, a loading flag, and a setter that persists changes.
+ *
+ * ```tsx
+ * const { settings, isLoading, setSettings } = useSettings(DEFAULT_SETTINGS);
+ * if (isLoading) return <Spinner />;
+ * await setSettings({ genre: 'mystery' });
+ * ```
+ */
+export function useSettings<T extends BasePluginSettings>(defaultSettings: ExplicitUndefined<T>): UseSettingsResult<T> {
+  const plugin = useRimori();
+  const [settings, setSettingsState] = useState<ExplicitUndefined<T>>(defaultSettings);
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    let cancelled = false;
+    void plugin.plugin.getSettings<T>(defaultSettings).then((loaded) => {
+      if (cancelled) return;
+      setSettingsState(loaded);
+      setIsLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+    // Only run on mount — defaultSettings reference is stable by convention.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  const setSettings = useCallback(
+    async (update: Partial<T>): Promise<void> => {
+      const merged = { ...settings, ...update } as ExplicitUndefined<T>;
+      setSettingsState(merged);
+      await plugin.plugin.setSettings(merged);
+    },
+    [settings, plugin],
+  );
+
+  return { settings, isLoading, setSettings };
+}

package/src/index.ts

@@ -1,5 +1,6 @@
 // Re-export everything
 export * from './hooks/UseChatHook';
+export * from './hooks/UseSettingsHook';
 export * from './providers/PluginProvider';
 export * from './components/audio/Playbutton';
 export * from './components/ai/Avatar';