@meetsmore-oss/use-ai-client 1.3.0 → 1.5.0

package/dist/index.js

@@ -1,13 +1,13 @@
 import {
   generateChatId,
   generateMessageId
-} from "./chunk-QTQR7MAU.js";
+} from "./chunk-STF3H6F5.js";
 
 // src/useAI.ts
-import { useState as useState11, useEffect as useEffect10, useRef as useRef11, useCallback as useCallback10, useMemo as useMemo6 } from "react";
+import { useState as useState12, useEffect as useEffect11, useRef as useRef12, useCallback as useCallback11, useMemo as useMemo6 } from "react";
 
 // src/providers/useAIProvider.tsx
-import { createContext as createContext4, useContext as useContext4, useState as useState10, useEffect as useEffect9, useCallback as useCallback9, useRef as useRef9 } from "react";
+import { createContext as createContext4, useContext as useContext4, useState as useState11, useEffect as useEffect10, useCallback as useCallback10, useRef as useRef10 } from "react";
 
 // src/types.ts
 import { EventType, ErrorCode } from "@meetsmore-oss/use-ai-core";
@@ -51,7 +51,9 @@ var defaultStrings = {
     /** Input placeholder when connecting */
     connectingPlaceholder: "Connecting...",
     /** Loading indicator text */
-    thinking: "Thinking"
+    thinking: "Thinking",
+    /** File processing indicator text (shown during file transformation like OCR) */
+    processingFile: "Processing file..."
   },
   // File upload
   fileUpload: {
@@ -102,6 +104,11 @@ var defaultStrings = {
     RATE_LIMITED: "Too many requests. Please wait a moment before trying again.",
     /** Error for unknown/unexpected errors */
     UNKNOWN_ERROR: "An unexpected error occurred. Please try again."
+  },
+  // Tool execution status
+  toolExecution: {
+    /** Fallback messages when no tool title is provided (one randomly selected) */
+    fallbackMessages: ["Working", "Processing", "Thinking"]
   }
 };
 var StringsContext = createContext(defaultStrings);
@@ -1244,7 +1251,6 @@ async function processAttachments(attachments, config) {
   const chat = await getCurrentChat();
   const context = { chat };
   for (const attachment of attachments) {
-    onFileProgress?.(attachment.id, { status: "processing" });
     try {
       if (attachment.transformedContent !== void 0) {
         contentParts.push({
@@ -1256,11 +1262,11 @@ async function processAttachments(attachments, config) {
             size: attachment.file.size
           }
         });
-        onFileProgress?.(attachment.id, { status: "done" });
         continue;
       }
       const transformer = findTransformer(attachment.file.type, transformers);
       if (transformer) {
+        onFileProgress?.(attachment.id, { status: "processing" });
         const transformedText = await getTransformedContent(
           attachment.file,
           transformer,
@@ -1278,6 +1284,7 @@ async function processAttachments(attachments, config) {
             size: attachment.file.size
           }
         });
+        onFileProgress?.(attachment.id, { status: "done" });
       } else {
         const url = await backend.prepareForSend(attachment.file);
         if (attachment.file.type.startsWith("image/")) {
@@ -1291,7 +1298,6 @@ async function processAttachments(attachments, config) {
           });
         }
       }
-      onFileProgress?.(attachment.id, { status: "done" });
     } catch (error) {
       onFileProgress?.(attachment.id, { status: "error" });
       throw error;
@@ -1570,6 +1576,71 @@ function useDropdownState(options = {}) {
 
 // src/components/UseAIChatPanel.tsx
 import { Fragment, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+function FeedbackButton({ type, isSelected, onClick, selectedColor, unselectedColor }) {
+  const buttonRef = useRef4(null);
+  const handleClick = () => {
+    if (!isSelected && buttonRef.current) {
+      buttonRef.current.style.transform = "scale(1.3)";
+      setTimeout(() => {
+        if (buttonRef.current) {
+          buttonRef.current.style.transform = "scale(1)";
+        }
+      }, 150);
+    }
+    onClick();
+  };
+  const thumbsUpPath = "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3";
+  const thumbsDownPath = "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17";
+  return /* @__PURE__ */ jsx10(
+    "button",
+    {
+      ref: buttonRef,
+      "data-testid": `feedback-${type}`,
+      onClick: handleClick,
+      title: type === "upvote" ? "Good response" : "Poor response",
+      style: {
+        background: "transparent",
+        border: "none",
+        padding: "4px",
+        cursor: "pointer",
+        color: isSelected ? selectedColor : unselectedColor,
+        opacity: isSelected ? 1 : 0.5,
+        transition: "all 0.15s",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        borderRadius: "4px",
+        transform: "scale(1)"
+      },
+      onMouseEnter: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.opacity = "0.8";
+          e.currentTarget.style.color = selectedColor;
+        }
+      },
+      onMouseLeave: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.opacity = "0.5";
+          e.currentTarget.style.color = unselectedColor;
+        }
+      },
+      children: /* @__PURE__ */ jsx10(
+        "svg",
+        {
+          width: "14",
+          height: "14",
+          viewBox: "0 0 24 24",
+          fill: isSelected ? "currentColor" : "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          children: /* @__PURE__ */ jsx10("path", { d: type === "upvote" ? thumbsUpPath : thumbsDownPath })
+        }
+      )
+    }
+  );
+}
 function getTextContent(content) {
   if (typeof content === "string") {
     return content;
@@ -1597,11 +1668,15 @@ function UseAIChatPanel({
   selectedAgent,
   onAgentChange,
   fileUploadConfig,
+  fileProcessing,
   commands = [],
   onSaveCommand,
   onRenameCommand,
   onDeleteCommand,
-  closeButton
+  closeButton,
+  executingTool,
+  feedbackEnabled,
+  onFeedback
 }) {
   const strings = useStrings();
   const theme = useTheme();
@@ -2226,6 +2301,46 @@ function UseAIChatPanel({
                         ]
                       }
                     ),
+                    message.role === "assistant" && message.traceId && feedbackEnabled && onFeedback && /* @__PURE__ */ jsxs7(
+                      "div",
+                      {
+                        "data-testid": "feedback-buttons",
+                        style: {
+                          display: "flex",
+                          gap: "4px",
+                          marginTop: "4px",
+                          padding: "0 4px"
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx10(
+                            FeedbackButton,
+                            {
+                              type: "upvote",
+                              isSelected: message.feedback === "upvote",
+                              onClick: () => {
+                                const newFeedback = message.feedback === "upvote" ? null : "upvote";
+                                onFeedback(message.id, message.traceId, newFeedback);
+                              },
+                              selectedColor: theme.primaryColor,
+                              unselectedColor: theme.secondaryTextColor
+                            }
+                          ),
+                          /* @__PURE__ */ jsx10(
+                            FeedbackButton,
+                            {
+                              type: "downvote",
+                              isSelected: message.feedback === "downvote",
+                              onClick: () => {
+                                const newFeedback = message.feedback === "downvote" ? null : "downvote";
+                                onFeedback(message.id, message.traceId, newFeedback);
+                              },
+                              selectedColor: theme.errorTextColor,
+                              unselectedColor: theme.secondaryTextColor
+                            }
+                          )
+                        ]
+                      }
+                    ),
                     /* @__PURE__ */ jsx10(
                       "div",
                       {
@@ -2265,10 +2380,29 @@ function UseAIChatPanel({
                         color: theme.textColor,
                         maxWidth: "80%"
                       },
-                      children: streamingText ? /* @__PURE__ */ jsx10(MarkdownContent, { content: streamingText }) : /* @__PURE__ */ jsxs7(Fragment, { children: [
-                        /* @__PURE__ */ jsx10("span", { style: { opacity: 0.6 }, children: strings.input.thinking }),
-                        /* @__PURE__ */ jsx10("span", { className: "dots", style: { marginLeft: "4px" }, children: "..." })
-                      ] })
+                      children: streamingText ? /* @__PURE__ */ jsx10(MarkdownContent, { content: streamingText }) : fileProcessing && fileProcessing.status === "processing" ? /* @__PURE__ */ jsxs7("div", { children: [
+                        /* @__PURE__ */ jsx10("span", { style: { opacity: 0.6 }, children: strings.input.processingFile }),
+                        fileProcessing.progress != null && /* @__PURE__ */ jsxs7(Fragment, { children: [
+                          /* @__PURE__ */ jsxs7("span", { style: { opacity: 0.6, marginLeft: "4px" }, children: [
+                            Math.round(fileProcessing.progress),
+                            "%"
+                          ] }),
+                          /* @__PURE__ */ jsx10("div", { style: {
+                            marginTop: "6px",
+                            height: "4px",
+                            borderRadius: "2px",
+                            background: theme.borderColor,
+                            overflow: "hidden"
+                          }, children: /* @__PURE__ */ jsx10("div", { style: {
+                            height: "100%",
+                            width: `${fileProcessing.progress}%`,
+                            borderRadius: "2px",
+                            background: theme.primaryColor,
+                            transition: "width 0.3s ease"
+                          } }) })
+                        ] }),
+                        fileProcessing.progress == null && /* @__PURE__ */ jsx10("span", { className: "dots", style: { marginLeft: "4px" }, children: "..." })
+                      ] }) : /* @__PURE__ */ jsx10("span", { className: "dots", style: { opacity: 0.6 }, children: "..." })
                     }
                   )
                 }
@@ -2355,7 +2489,7 @@ function UseAIChatPanel({
                         value: input,
                         onChange: handleInputChange,
                         onKeyDown: handleKeyDown,
-                        placeholder: connected ? strings.input.placeholder : strings.input.connectingPlaceholder,
+                        placeholder: !connected ? strings.input.connectingPlaceholder : loading ? `${executingTool?.displayText ?? strings.input.thinking}...` : strings.input.placeholder,
                         disabled: !connected || loading,
                         rows: 1,
                         style: {
@@ -2613,10 +2747,14 @@ function UseAIChat({ floating = false }) {
     selectedAgent: ctx.agents.selected,
     onAgentChange: ctx.agents.set,
     fileUploadConfig: ctx.fileUploadConfig,
+    fileProcessing: ctx.fileProcessing,
     commands: ctx.commands.list,
     onSaveCommand: ctx.commands.save,
     onRenameCommand: ctx.commands.rename,
-    onDeleteCommand: ctx.commands.delete
+    onDeleteCommand: ctx.commands.delete,
+    executingTool: ctx.executingTool,
+    feedbackEnabled: ctx.feedback?.enabled,
+    onFeedback: ctx.feedback?.submit
   };
   if (floating) {
     return /* @__PURE__ */ jsx12(
@@ -2677,6 +2815,9 @@ var UseAIClient = class {
   _currentAssistantToolCalls = [];
   // Tool call assembly
   currentToolCalls = /* @__PURE__ */ new Map();
+  // Feedback tracking
+  _langfuseEnabled = false;
+  langfuseConfigHandlers = /* @__PURE__ */ new Set();
   /**
    * Establishes a Socket.IO connection to the server.
    * Connection state changes are notified via onConnectionStateChange().
@@ -2719,6 +2860,11 @@ var UseAIClient = class {
       this._defaultAgent = data.defaultAgent;
       this.agentsChangeHandlers.forEach((handler) => handler(data.agents, data.defaultAgent));
     });
+    this.socket.on("config", (data) => {
+      console.log("[Client] Received server config:", data);
+      this._langfuseEnabled = data.langfuseEnabled ?? false;
+      this.langfuseConfigHandlers.forEach((handler) => handler(this._langfuseEnabled));
+    });
     this.socket.on("connect_error", (error) => {
       console.warn("[UseAI] Connection error:", error.message);
     });
@@ -3135,6 +3281,41 @@ var UseAIClient = class {
   isConnected() {
     return this.socket !== null && this.socket.connected;
   }
+  /**
+   * Subscribes to Langfuse config changes.
+   *
+   * @param handler - Callback function receiving langfuse enabled status
+   * @returns Cleanup function to unsubscribe
+   */
+  onLangfuseConfigChange(handler) {
+    this.langfuseConfigHandlers.add(handler);
+    handler(this._langfuseEnabled);
+    return () => {
+      this.langfuseConfigHandlers.delete(handler);
+    };
+  }
+  /**
+   * Submits feedback for an assistant message.
+   * Sends feedback to the server, which forwards it to Langfuse.
+   *
+   * @param messageId - The client-side message ID
+   * @param traceId - The Langfuse trace ID (runId from RUN_FINISHED)
+   * @param feedback - 'upvote' for positive, 'downvote' for negative, null to remove
+   */
+  submitFeedback(messageId, traceId, feedback) {
+    if (!this.socket?.connected) {
+      console.warn("[UseAI] Cannot submit feedback: not connected");
+      return;
+    }
+    if (!this._langfuseEnabled) {
+      console.warn("[UseAI] Cannot submit feedback: Langfuse not enabled on server");
+      return;
+    }
+    this.send({
+      type: "message_feedback",
+      data: { messageId, traceId, feedback }
+    });
+  }
 };
 
 // src/defineTool.ts
@@ -3174,8 +3355,8 @@ function defineTool(description, schemaOrFn, fnOrOptions, options) {
         description,
         parameters
       };
-      if (this._options.confirmationRequired) {
-        toolDef.confirmationRequired = true;
+      if (this._options.annotations) {
+        toolDef.annotations = this._options.annotations;
       }
       return toolDef;
     },
@@ -3373,7 +3554,9 @@ function transformMessagesToUI(storageMessages) {
     role: msg.role,
     content: msg.content,
     timestamp: msg.createdAt,
-    displayMode: msg.displayMode
+    displayMode: msg.displayMode,
+    traceId: msg.traceId,
+    feedback: msg.feedback
   }));
 }
 function transformMessagesToClientFormat(uiMessages) {
@@ -3389,6 +3572,8 @@ function transformMessagesToClientFormat(uiMessages) {
 function useChatManagement({
   repository,
   clientRef,
+  messages,
+  setMessages,
   onSendMessage,
   setOpen,
   connected,
@@ -3396,7 +3581,6 @@ function useChatManagement({
 }) {
   const [currentChatId, setCurrentChatId] = useState5(null);
   const [pendingChatId, setPendingChatId] = useState5(null);
-  const [messages, setMessages] = useState5([]);
   const currentChatIdSnapshot = useRef5(null);
   const pendingChatIdSnapshot = useRef5(null);
   useEffect5(() => {
@@ -3515,7 +3699,7 @@ function useChatManagement({
         console.error("[ChatManagement] Chat not found:", chatId);
         return false;
       }
-      const { generateMessageId: generateMessageId2 } = await import("./types-64CH2HXY.js");
+      const { generateMessageId: generateMessageId2 } = await import("./types-GWPQMSYT.js");
       chat.messages.push({
         id: generateMessageId2(),
         role: "user",
@@ -3537,7 +3721,7 @@ function useChatManagement({
       return false;
     }
   }, [repository, reloadMessages]);
-  const saveAIResponse = useCallback4(async (content, displayMode) => {
+  const saveAIResponse = useCallback4(async (content, displayMode, traceId) => {
     const currentChatIdValue = currentChatIdSnapshot.current;
     const pendingChatIdValue = pendingChatIdSnapshot.current;
     const displayedChatId2 = pendingChatIdValue || currentChatIdValue;
@@ -3551,13 +3735,14 @@ function useChatManagement({
         console.error("[ChatManagement] Chat not found:", currentChatIdValue);
         return;
       }
-      const { generateMessageId: generateMessageId2 } = await import("./types-64CH2HXY.js");
+      const { generateMessageId: generateMessageId2 } = await import("./types-GWPQMSYT.js");
       chat.messages.push({
         id: generateMessageId2(),
         role: "assistant",
         content,
         createdAt: /* @__PURE__ */ new Date(),
-        displayMode
+        displayMode,
+        traceId
       });
       if (!chat.title) {
         const firstUserMessage = chat.messages.find((msg) => msg.role === "user");
@@ -3675,7 +3860,6 @@ function useChatManagement({
   return {
     currentChatId,
     pendingChatId,
-    messages,
     displayedChatId,
     createNewChat,
     loadChat,
@@ -4069,6 +4253,68 @@ function usePromptState({
   };
 }
 
+// src/hooks/useFeedback.ts
+import { useState as useState10, useEffect as useEffect9, useRef as useRef9, useCallback as useCallback9 } from "react";
+function useFeedback({
+  clientRef,
+  repository,
+  getDisplayedChatId,
+  setMessages
+}) {
+  const [enabled, setEnabled] = useState10(false);
+  const enabledRef = useRef9(false);
+  useEffect9(() => {
+    enabledRef.current = enabled;
+  }, [enabled]);
+  useEffect9(() => {
+    const client = clientRef.current;
+    if (!client) return;
+    const unsubscribe = client.onLangfuseConfigChange((isEnabled) => {
+      setEnabled(isEnabled);
+    });
+    return unsubscribe;
+  }, [clientRef.current]);
+  const updateFeedbackInStorage = useCallback9(async (messageId, feedback) => {
+    const displayedChatId = getDisplayedChatId();
+    if (!displayedChatId) {
+      console.warn("[useFeedback] No chat ID, cannot update feedback");
+      return;
+    }
+    try {
+      const chat = await repository.loadChat(displayedChatId);
+      if (!chat) {
+        console.error("[useFeedback] Chat not found:", displayedChatId);
+        return;
+      }
+      const message = chat.messages.find((msg) => msg.id === messageId);
+      if (message) {
+        message.feedback = feedback;
+        await repository.saveChat(chat);
+        setMessages(
+          (prevMessages) => prevMessages.map(
+            (msg) => msg.id === messageId ? { ...msg, feedback } : msg
+          )
+        );
+      } else {
+        console.warn("[useFeedback] Message not found:", messageId);
+      }
+    } catch (error) {
+      console.error("[useFeedback] Failed to update feedback:", error);
+    }
+  }, [repository, getDisplayedChatId, setMessages]);
+  const submitFeedback = useCallback9((messageId, traceId, feedback) => {
+    updateFeedbackInStorage(messageId, feedback);
+    const client = clientRef.current;
+    if (client && enabledRef.current) {
+      client.submitFeedback(messageId, traceId, feedback);
+    }
+  }, [clientRef, updateFeedbackInStorage]);
+  return {
+    enabled,
+    submitFeedback
+  };
+}
+
 // src/providers/useAIProvider.tsx
 import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
 var __UseAIContext = createContext4(null);
@@ -4150,20 +4396,24 @@ function UseAIProvider({
   const fileUploadConfig = fileUploadConfigProp === false ? void 0 : fileUploadConfigProp ?? DEFAULT_FILE_UPLOAD_CONFIG;
   const theme = { ...defaultTheme, ...customTheme };
   const strings = { ...defaultStrings, ...customStrings };
-  const [connected, setConnected] = useState10(false);
-  const [isChatOpen, setIsChatOpen] = useState10(false);
-  const [loading, setLoading] = useState10(false);
-  const handleSetChatOpen = useCallback9((open) => {
+  const [connected, setConnected] = useState11(false);
+  const [isChatOpen, setIsChatOpen] = useState11(false);
+  const [loading, setLoading] = useState11(false);
+  const [messages, setMessages] = useState11([]);
+  const [fileProcessingState, setFileProcessingState] = useState11(null);
+  const handleSetChatOpen = useCallback10((open) => {
     setIsChatOpen(open);
     onOpenChange?.(open);
   }, [onOpenChange]);
-  const [streamingText, setStreamingText] = useState10("");
-  const streamingChatIdRef = useRef9(null);
-  const clientRef = useRef9(null);
-  const repositoryRef = useRef9(
+  const [streamingText, setStreamingText] = useState11("");
+  const streamingChatIdRef = useRef10(null);
+  const [executingTool, setExecutingTool] = useState11(null);
+  const executingToolFallbackRef = useRef10(null);
+  const clientRef = useRef10(null);
+  const repositoryRef = useRef10(
     chatRepository || new LocalStorageChatRepository()
   );
-  const handleSendMessageRef = useRef9(null);
+  const handleSendMessageRef = useRef10(null);
   const {
     registerTools,
     unregisterTools,
@@ -4185,7 +4435,7 @@ function UseAIProvider({
     clientRef,
     connected
   });
-  const stableSendMessage = useCallback9(async (message, attachments) => {
+  const stableSendMessage = useCallback10(async (message, attachments) => {
     if (handleSendMessageRef.current) {
       await handleSendMessageRef.current(message, attachments);
     }
@@ -4193,6 +4443,8 @@ function UseAIProvider({
   const chatManagement = useChatManagement({
     repository: repositoryRef.current,
     clientRef,
+    messages,
+    setMessages,
     onSendMessage: stableSendMessage,
     setOpen: handleSetChatOpen,
     connected,
@@ -4201,7 +4453,6 @@ function UseAIProvider({
   const {
     currentChatId,
     pendingChatId,
-    messages,
     displayedChatId,
     createNewChat,
     loadChat,
@@ -4215,6 +4466,12 @@ function UseAIProvider({
     getCurrentChat,
     updateMetadata
   } = chatManagement;
+  const feedback = useFeedback({
+    clientRef,
+    repository: repositoryRef.current,
+    getDisplayedChatId: () => displayedChatId,
+    setMessages
+  });
   const {
     availableAgents,
     defaultAgent,
@@ -4228,7 +4485,7 @@ function UseAIProvider({
     renameCommand,
     deleteCommand
   } = useCommandManagement({ repository: commandRepository });
-  useEffect9(() => {
+  useEffect10(() => {
     console.log("[UseAIProvider] Initializing client with serverUrl:", serverUrl);
     const client = new UseAIClient(serverUrl);
     if (mcpHeadersProvider) {
@@ -4241,9 +4498,19 @@ function UseAIProvider({
     console.log("[UseAIProvider] Connecting...");
     client.connect();
     const unsubscribe = client.onEvent("globalChat", async (event) => {
-      if (event.type === EventType.TOOL_CALL_END) {
+      if (event.type === EventType.TOOL_CALL_START) {
+        const e = event;
+        const tool = aggregatedToolsRef.current[e.toolCallName];
+        const title = e.annotations?.title ?? tool?._options?.annotations?.title ?? null;
+        if (!title) {
+          const fallbacks = strings.toolExecution.fallbackMessages;
+          executingToolFallbackRef.current = fallbacks[Math.floor(Math.random() * fallbacks.length)];
+        }
+        setExecutingTool({ toolCallId: e.toolCallId, title });
+      } else if (event.type === EventType.TOOL_CALL_END) {
         const toolCallEnd = event;
         const toolCallId = toolCallEnd.toolCallId;
+        setExecutingTool((prev) => prev?.toolCallId === toolCallId ? null : prev);
         const toolCallData = client["currentToolCalls"].get(toolCallId);
         if (!toolCallData) {
           console.error(`[Provider] Tool call ${toolCallId} not found`);
@@ -4293,14 +4560,16 @@ function UseAIProvider({
         const contentEvent = event;
         setStreamingText((prev) => prev + contentEvent.delta);
       } else if (event.type === EventType.TEXT_MESSAGE_END) {
+        setStreamingText("");
+        streamingChatIdRef.current = null;
+      } else if (event.type === EventType.RUN_FINISHED) {
         const content = client.currentMessageContent;
         if (content) {
-          console.log("[Provider] Received text message:", content.substring(0, 100));
-          saveAIResponse(content);
-          setStreamingText("");
-          streamingChatIdRef.current = null;
-          setLoading(false);
+          const finishedEvent = event;
+          const traceId = finishedEvent.runId;
+          saveAIResponse(content, void 0, traceId);
         }
+        setLoading(false);
       } else if (event.type === EventType.RUN_ERROR) {
         const errorEvent = event;
         const errorCode = errorEvent.message;
@@ -4319,15 +4588,15 @@ function UseAIProvider({
       client.disconnect();
     };
   }, [serverUrl]);
-  useEffect9(() => {
+  useEffect10(() => {
     const client = clientRef.current;
     if (!client) return;
     if (mcpHeadersProvider) {
       client.setMcpHeadersProvider(mcpHeadersProvider);
     }
   }, [mcpHeadersProvider]);
-  const lastRegisteredToolsRef = useRef9("");
-  useEffect9(() => {
+  const lastRegisteredToolsRef = useRef10("");
+  useEffect10(() => {
     const client = clientRef.current;
     if (!client || !client.isConnected() || !hasTools) return;
     const toolKeys = Object.keys(aggregatedTools).sort().join(",");
@@ -4345,7 +4614,7 @@ function UseAIProvider({
       console.error("Failed to register tools:", err);
     }
   }, [hasTools, aggregatedTools, connected]);
-  const handleSendMessage = useCallback9(async (message, attachments) => {
+  const handleSendMessage = useCallback10(async (message, attachments) => {
     if (!clientRef.current) return;
     setStreamingText("");
     const activatedChatId = activatePendingChat();
@@ -4369,21 +4638,36 @@ function UseAIProvider({
         });
       }
       persistedContent = persistedParts;
-      const fileContent = await processAttachments(attachments, {
-        getCurrentChat,
-        backend: fileUploadConfig?.backend,
-        transformers: fileUploadConfig?.transformers
-      });
-      multimodalContent = [];
-      if (message.trim()) {
-        multimodalContent.push({ type: "text", text: message });
+      if (activeChatId) {
+        await saveUserMessage(activeChatId, persistedContent);
       }
-      multimodalContent.push(...fileContent);
-    }
-    if (activeChatId) {
-      await saveUserMessage(activeChatId, persistedContent);
+      setLoading(true);
+      try {
+        const fileContent = await processAttachments(attachments, {
+          getCurrentChat,
+          backend: fileUploadConfig?.backend,
+          transformers: fileUploadConfig?.transformers,
+          onFileProgress: (_fileId, state) => {
+            setFileProcessingState(state);
+          }
+        });
+        multimodalContent = [];
+        if (message.trim()) {
+          multimodalContent.push({ type: "text", text: message });
+        }
+        multimodalContent.push(...fileContent);
+      } catch (error) {
+        setLoading(false);
+        throw error;
+      } finally {
+        setFileProcessingState(null);
+      }
+    } else {
+      if (activeChatId) {
+        await saveUserMessage(activeChatId, persistedContent);
+      }
+      setLoading(true);
     }
-    setLoading(true);
     await clientRef.current.sendPrompt(message, multimodalContent);
   }, [activatePendingChat, currentChatId, saveUserMessage, fileUploadConfig, getCurrentChat]);
   handleSendMessageRef.current = handleSendMessage;
@@ -4426,6 +4710,9 @@ function UseAIProvider({
     }
   };
   const effectiveStreamingText = streamingChatIdRef.current === displayedChatId ? streamingText : "";
+  const executingToolDisplay = executingTool ? {
+    displayText: executingTool.title ?? executingToolFallbackRef.current ?? strings.toolExecution.fallbackMessages[0]
+  } : null;
   const chatUIContextValue = {
     connected,
     loading,
@@ -4434,6 +4721,7 @@ function UseAIProvider({
     streamingText: effectiveStreamingText,
     suggestions: aggregatedSuggestions,
     fileUploadConfig,
+    fileProcessing: fileProcessingState,
     history: {
       currentId: displayedChatId,
       create: createNewChat,
@@ -4457,6 +4745,11 @@ function UseAIProvider({
     ui: {
       isOpen: isChatOpen,
       setOpen: handleSetChatOpen
+    },
+    executingTool: executingToolDisplay,
+    feedback: {
+      enabled: feedback.enabled,
+      submit: feedback.submitFeedback
     }
   };
   const isUIDisabled = CustomButton === null || CustomChat === null;
@@ -4479,10 +4772,14 @@ function UseAIProvider({
     selectedAgent,
     onAgentChange: setAgent,
     fileUploadConfig,
+    fileProcessing: fileProcessingState,
     commands,
     onSaveCommand: saveCommand,
     onRenameCommand: renameCommand,
-    onDeleteCommand: deleteCommand
+    onDeleteCommand: deleteCommand,
+    executingTool: executingToolDisplay,
+    feedbackEnabled: feedback.enabled,
+    onFeedback: feedback.submitFeedback
   };
   const renderDefaultChat = () => {
     if (isUIDisabled) return null;
@@ -4546,11 +4843,11 @@ function useAIContext() {
 }
 
 // src/hooks/useStableTools.ts
-import { useRef as useRef10 } from "react";
+import { useRef as useRef11 } from "react";
 function useStableTools(tools) {
-  const latestToolsRef = useRef10({});
-  const stableToolsRef = useRef10({});
-  const prevToolNamesRef = useRef10("");
+  const latestToolsRef = useRef11({});
+  const stableToolsRef = useRef11({});
+  const prevToolNamesRef = useRef11("");
   if (!tools) {
     latestToolsRef.current = {};
     return void 0;
@@ -4620,25 +4917,25 @@ function useAI(options = {}) {
   const { connected, tools, client, prompts } = useAIContext();
   const { register: registerTools, unregister: unregisterTools } = tools;
   const { update: updatePrompt, registerWaiter, unregisterWaiter } = prompts;
-  const [response, setResponse] = useState11(null);
-  const [loading, setLoading] = useState11(false);
-  const [error, setError] = useState11(null);
-  const hookId = useRef11(`useAI-${Math.random().toString(36).substr(2, 9)}`);
-  const toolsRef = useRef11({});
-  const componentRef = useRef11(null);
-  const promptChangeResolvers = useRef11([]);
+  const [response, setResponse] = useState12(null);
+  const [loading, setLoading] = useState12(false);
+  const [error, setError] = useState12(null);
+  const hookId = useRef12(`useAI-${Math.random().toString(36).substr(2, 9)}`);
+  const toolsRef = useRef12({});
+  const componentRef = useRef12(null);
+  const promptChangeResolvers = useRef12([]);
   const stableTools = useStableTools(options.tools);
   const toolsKey = useMemo6(() => {
     if (!options.tools) return "";
     return Object.keys(options.tools).sort().join(",");
   }, [options.tools]);
   const memoizedSuggestions = useMemo6(() => options.suggestions, [options.suggestions]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (componentRef.current) {
       componentRef.current.setAttribute("data-useai-context", "true");
     }
   }, []);
-  const waitForPromptChange = useCallback10(() => {
+  const waitForPromptChange = useCallback11(() => {
     return new Promise((resolve) => {
       const timeoutMs = 100;
       const timeoutId = setTimeout(() => {
@@ -4655,14 +4952,14 @@ function useAI(options = {}) {
       promptChangeResolvers.current.push(resolveAndCleanup);
     });
   }, []);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!enabled || options.invisible) return;
     registerWaiter(hookId.current, waitForPromptChange);
     return () => {
       unregisterWaiter(hookId.current);
     };
   }, [enabled, options.invisible, registerWaiter, unregisterWaiter, waitForPromptChange]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!enabled) return;
     updatePrompt(hookId.current, options.prompt, memoizedSuggestions);
     if (promptChangeResolvers.current.length > 0) {
@@ -4670,15 +4967,15 @@ function useAI(options = {}) {
       promptChangeResolvers.current = [];
     }
   }, [enabled, options.prompt, memoizedSuggestions, updatePrompt]);
-  const updatePromptRef = useRef11(updatePrompt);
+  const updatePromptRef = useRef12(updatePrompt);
   updatePromptRef.current = updatePrompt;
-  useEffect10(() => {
+  useEffect11(() => {
     const id = hookId.current;
     return () => {
       updatePromptRef.current(id, void 0, void 0);
     };
   }, []);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!enabled) return;
     if (stableTools) {
       const componentId = options.id || componentRef.current?.id;
@@ -4692,7 +4989,7 @@ function useAI(options = {}) {
       }
     };
   }, [enabled, toolsKey, stableTools, options.id, options.invisible, registerTools, unregisterTools]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!enabled || !client) return;
     const unsubscribe = client.onEvent(hookId.current, (event) => {
       handleAGUIEvent(event);
@@ -4701,7 +4998,7 @@ function useAI(options = {}) {
       unsubscribe();
     };
   }, [enabled, client]);
-  const handleAGUIEvent = useCallback10(async (event) => {
+  const handleAGUIEvent = useCallback11(async (event) => {
     switch (event.type) {
       case EventType.TEXT_MESSAGE_END: {
         const content = client?.currentMessageContent;
@@ -4721,7 +5018,7 @@ function useAI(options = {}) {
       }
     }
   }, [client, options.onError]);
-  const generate = useCallback10(async (prompt) => {
+  const generate = useCallback11(async (prompt) => {
     if (!enabled) {
       const error2 = new Error("AI features are disabled");
       setError(error2);
@@ -4757,17 +5054,17 @@ function useAI(options = {}) {
 }
 
 // src/useAIWorkflow.ts
-import { useState as useState12, useCallback as useCallback11, useRef as useRef12, useEffect as useEffect11 } from "react";
+import { useState as useState13, useCallback as useCallback12, useRef as useRef13, useEffect as useEffect12 } from "react";
 import { EventType as EventType3 } from "@meetsmore-oss/use-ai-core";
 import { v4 as uuidv43 } from "uuid";
 function useAIWorkflow(runner, workflowId) {
   const { connected, client } = useAIContext();
-  const [status, setStatus] = useState12("idle");
-  const [text, setText] = useState12(null);
-  const [error, setError] = useState12(null);
-  const currentWorkflowRef = useRef12(null);
-  const eventListenerIdRef = useRef12(`useAIWorkflow-${Math.random().toString(36).substr(2, 9)}`);
-  const handleWorkflowEvent = useCallback11(async (event) => {
+  const [status, setStatus] = useState13("idle");
+  const [text, setText] = useState13(null);
+  const [error, setError] = useState13(null);
+  const currentWorkflowRef = useRef13(null);
+  const eventListenerIdRef = useRef13(`useAIWorkflow-${Math.random().toString(36).substr(2, 9)}`);
+  const handleWorkflowEvent = useCallback12(async (event) => {
     const currentWorkflow = currentWorkflowRef.current;
     if (!currentWorkflow) return;
     if (event.type === EventType3.RUN_STARTED) {
@@ -4852,14 +5149,14 @@ function useAIWorkflow(runner, workflowId) {
       }
     }
   }, [client]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!client) return;
     const unsubscribe = client.onEvent(eventListenerIdRef.current, handleWorkflowEvent);
     return () => {
       unsubscribe();
     };
   }, [client, handleWorkflowEvent]);
-  const trigger = useCallback11(async (options) => {
+  const trigger = useCallback12(async (options) => {
     if (!client?.isConnected()) {
       const err = new Error("Not connected to server");
       setError(err);
@@ -4948,6 +5245,7 @@ export {
   useChatManagement,
   useCommandManagement,
   useDropdownState,
+  useFeedback,
   useFileUpload,
   usePromptState,
   useSlashCommands,