@hef2024/llmasaservice-ui 0.20.3 → 0.21.0

package/dist/index.js

@@ -5952,22 +5952,6 @@ var AIAgentPanel = import_react14.default.forwardRef(({
       }
     }
   }), [apiKey, customerId, getAgent, fetchFirstPrompt]);
-  const stripContextFromPrompt = (0, import_react14.useCallback)((prompt) => {
-    let cleanPrompt = prompt;
-    const contextIndex = cleanPrompt.indexOf("---context---");
-    if (contextIndex !== -1) {
-      cleanPrompt = cleanPrompt.substring(0, contextIndex).trim();
-    }
-    const isoTimestampRegex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z:/;
-    if (isoTimestampRegex.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(":", 19);
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    } else if (/^\d+:/.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(":");
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    }
-    return cleanPrompt.trim();
-  }, []);
   const loadConversationTranscript = (0, import_react14.useCallback)((conversationId, agentIdForConversation, title) => __async(void 0, null, function* () {
     var _a2;
     const existingActive = activeConversationsRef.current.get(conversationId);
@@ -6004,23 +5988,49 @@ var AIAgentPanel = import_react14.default.forwardRef(({
       const history = {};
       let firstPrompt = null;
       if (Array.isArray(payload) && payload.length > 0) {
-        payload.forEach((call, index) => {
-          var _a3;
-          if (call.prompt && call.response) {
-            const rawPrompt = typeof call.prompt === "string" ? call.prompt : ((_a3 = call.prompt[0]) == null ? void 0 : _a3.text) || "";
-            const cleanedPrompt = stripContextFromPrompt(rawPrompt);
-            if (index === 0 && cleanedPrompt) {
-              firstPrompt = cleanedPrompt.length > 60 ? cleanedPrompt.slice(0, 57) + "..." : cleanedPrompt;
+        const lastCall = payload[payload.length - 1];
+        const callId = lastCall.id || "";
+        const timestamp = lastCall.createdAt || lastCall.created_at || (/* @__PURE__ */ new Date()).toISOString();
+        if (lastCall.messages) {
+          try {
+            const messages2 = JSON.parse(lastCall.messages);
+            console.log("loadConversationTranscript - parsed messages:", messages2);
+            const relevantMessages = messages2.filter(
+              (msg) => msg.role !== "system" && !(msg.role === "user" && msg.content.startsWith("__system__:"))
+            );
+            console.log("loadConversationTranscript - filtered messages:", relevantMessages);
+            for (let i = 0; i < relevantMessages.length; i++) {
+              const msg = relevantMessages[i];
+              if (!msg) continue;
+              if (msg.role === "user") {
+                if (!firstPrompt) {
+                  firstPrompt = msg.content.length > 60 ? msg.content.slice(0, 57) + "..." : msg.content;
+                }
+                const nextMsg = relevantMessages[i + 1];
+                if (nextMsg && nextMsg.role === "assistant") {
+                  const historyKey = `${timestamp}:${msg.content}`;
+                  history[historyKey] = {
+                    content: nextMsg.content,
+                    callId
+                  };
+                  i++;
+                } else {
+                  if (lastCall.response) {
+                    const historyKey = `${timestamp}:${msg.content}`;
+                    history[historyKey] = {
+                      content: lastCall.response,
+                      callId
+                    };
+                  }
+                }
+              }
             }
-            const timestamp = call.createdAt || call.created_at || (/* @__PURE__ */ new Date()).toISOString();
-            const historyKey = `${timestamp}:${cleanedPrompt}`;
-            history[historyKey] = {
-              content: call.response,
-              callId: call.id || ""
-            };
+          } catch (err) {
+            console.error("loadConversationTranscript - failed to parse messages property:", err);
           }
-        });
+        }
       }
+      console.log("loadConversationTranscript - created", Object.keys(history).length, "history entries");
       console.log("loadConversationTranscript - parsed history:", history);
       if (firstPrompt) {
         setConversationFirstPrompts((prev) => __spreadProps(__spreadValues({}, prev), {
@@ -6051,7 +6061,7 @@ var AIAgentPanel = import_react14.default.forwardRef(({
       setConversationsError(error.message || "Failed to load conversation");
       setLoadingConversationId(null);
     }
-  }), [apiKey, currentAgentId, getAgent, onConversationChange, stripContextFromPrompt]);
+  }), [apiKey, currentAgentId, getAgent, onConversationChange]);
   const handleRefreshConversations = (0, import_react14.useCallback)(() => {
     fetchConversations(currentAgentId);
   }, [currentAgentId, fetchConversations]);

package/dist/index.mjs

@@ -5919,22 +5919,6 @@ var AIAgentPanel = React13.forwardRef(({
       }
     }
   }), [apiKey, customerId, getAgent, fetchFirstPrompt]);
-  const stripContextFromPrompt = useCallback4((prompt) => {
-    let cleanPrompt = prompt;
-    const contextIndex = cleanPrompt.indexOf("---context---");
-    if (contextIndex !== -1) {
-      cleanPrompt = cleanPrompt.substring(0, contextIndex).trim();
-    }
-    const isoTimestampRegex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z:/;
-    if (isoTimestampRegex.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(":", 19);
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    } else if (/^\d+:/.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(":");
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    }
-    return cleanPrompt.trim();
-  }, []);
   const loadConversationTranscript = useCallback4((conversationId, agentIdForConversation, title) => __async(void 0, null, function* () {
     var _a2;
     const existingActive = activeConversationsRef.current.get(conversationId);
@@ -5971,23 +5955,49 @@ var AIAgentPanel = React13.forwardRef(({
       const history = {};
       let firstPrompt = null;
       if (Array.isArray(payload) && payload.length > 0) {
-        payload.forEach((call, index) => {
-          var _a3;
-          if (call.prompt && call.response) {
-            const rawPrompt = typeof call.prompt === "string" ? call.prompt : ((_a3 = call.prompt[0]) == null ? void 0 : _a3.text) || "";
-            const cleanedPrompt = stripContextFromPrompt(rawPrompt);
-            if (index === 0 && cleanedPrompt) {
-              firstPrompt = cleanedPrompt.length > 60 ? cleanedPrompt.slice(0, 57) + "..." : cleanedPrompt;
+        const lastCall = payload[payload.length - 1];
+        const callId = lastCall.id || "";
+        const timestamp = lastCall.createdAt || lastCall.created_at || (/* @__PURE__ */ new Date()).toISOString();
+        if (lastCall.messages) {
+          try {
+            const messages2 = JSON.parse(lastCall.messages);
+            console.log("loadConversationTranscript - parsed messages:", messages2);
+            const relevantMessages = messages2.filter(
+              (msg) => msg.role !== "system" && !(msg.role === "user" && msg.content.startsWith("__system__:"))
+            );
+            console.log("loadConversationTranscript - filtered messages:", relevantMessages);
+            for (let i = 0; i < relevantMessages.length; i++) {
+              const msg = relevantMessages[i];
+              if (!msg) continue;
+              if (msg.role === "user") {
+                if (!firstPrompt) {
+                  firstPrompt = msg.content.length > 60 ? msg.content.slice(0, 57) + "..." : msg.content;
+                }
+                const nextMsg = relevantMessages[i + 1];
+                if (nextMsg && nextMsg.role === "assistant") {
+                  const historyKey = `${timestamp}:${msg.content}`;
+                  history[historyKey] = {
+                    content: nextMsg.content,
+                    callId
+                  };
+                  i++;
+                } else {
+                  if (lastCall.response) {
+                    const historyKey = `${timestamp}:${msg.content}`;
+                    history[historyKey] = {
+                      content: lastCall.response,
+                      callId
+                    };
+                  }
+                }
+              }
             }
-            const timestamp = call.createdAt || call.created_at || (/* @__PURE__ */ new Date()).toISOString();
-            const historyKey = `${timestamp}:${cleanedPrompt}`;
-            history[historyKey] = {
-              content: call.response,
-              callId: call.id || ""
-            };
+          } catch (err) {
+            console.error("loadConversationTranscript - failed to parse messages property:", err);
           }
-        });
+        }
       }
+      console.log("loadConversationTranscript - created", Object.keys(history).length, "history entries");
       console.log("loadConversationTranscript - parsed history:", history);
       if (firstPrompt) {
         setConversationFirstPrompts((prev) => __spreadProps(__spreadValues({}, prev), {
@@ -6018,7 +6028,7 @@ var AIAgentPanel = React13.forwardRef(({
       setConversationsError(error.message || "Failed to load conversation");
       setLoadingConversationId(null);
     }
-  }), [apiKey, currentAgentId, getAgent, onConversationChange, stripContextFromPrompt]);
+  }), [apiKey, currentAgentId, getAgent, onConversationChange]);
   const handleRefreshConversations = useCallback4(() => {
     fetchConversations(currentAgentId);
   }, [currentAgentId, fetchConversations]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hef2024/llmasaservice-ui",
-  "version": "0.20.3",
+  "version": "0.21.0",
   "description": "Prebuilt UI components for LLMAsAService.io",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/src/AIAgentPanel.tsx

@@ -1092,28 +1092,6 @@ const AIAgentPanel = React.forwardRef<AIAgentPanelHandle, AIAgentPanelProps>(({
   }, [apiKey, customerId, getAgent, fetchFirstPrompt]);
 
   // Helper to strip context/template data from a prompt - keeps only the user's actual message
-  const stripContextFromPrompt = useCallback((prompt: string): string => {
-    let cleanPrompt = prompt;
-    
-    // Strip ---context--- block and everything after it
-    const contextIndex = cleanPrompt.indexOf('---context---');
-    if (contextIndex !== -1) {
-      cleanPrompt = cleanPrompt.substring(0, contextIndex).trim();
-    }
-    
-    // Strip timestamp prefix (ISO format: 2024-01-01T00:00:00.000Z:)
-    const isoTimestampRegex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z:/;
-    if (isoTimestampRegex.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(':', 19);
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    } else if (/^\d+:/.test(cleanPrompt)) {
-      const colonIndex = cleanPrompt.indexOf(':');
-      cleanPrompt = cleanPrompt.substring(colonIndex + 1);
-    }
-    
-    return cleanPrompt.trim();
-  }, []);
-
   // Load a specific conversation's transcript (or switch to it if already active)
   const loadConversationTranscript = useCallback(async (conversationId: string, agentIdForConversation?: string, title?: string) => {
     // Check if conversation is already in activeConversations (use ref to avoid dependency)
@@ -1160,40 +1138,75 @@ const AIAgentPanel = React.forwardRef<AIAgentPanelHandle, AIAgentPanelProps>(({
       console.log('loadConversationTranscript - API response:', payload);
       
       // The /calls endpoint returns an array of calls
-      // Build history from all calls in chronological order
-      // IMPORTANT: Strip context/template data from prompts to prevent token bloat
+      // Use the messages property from the LAST call, which contains the full conversation history
       const history: Record<string, { content: string; callId: string }> = {};
       let firstPrompt: string | null = null;
       
       if (Array.isArray(payload) && payload.length > 0) {
-        // Parse all calls in order
-        payload.forEach((call: any, index: number) => {
-          if (call.prompt && call.response) {
-            // Get the raw prompt text
-            const rawPrompt = typeof call.prompt === 'string' 
-              ? call.prompt 
-              : call.prompt[0]?.text || '';
+        // Get the last call - it contains the full conversation history in the messages property
+        const lastCall = payload[payload.length - 1];
+        const callId = lastCall.id || '';
+        const timestamp = lastCall.createdAt || lastCall.created_at || new Date().toISOString();
+        
+        if (lastCall.messages) {
+          try {
+            // Parse the messages JSON string
+            const messages = JSON.parse(lastCall.messages) as { role: string; content: string }[];
+            console.log('loadConversationTranscript - parsed messages:', messages);
             
-            // Strip context/template data - keep only the user's actual message
-            const cleanedPrompt = stripContextFromPrompt(rawPrompt);
+            // Filter out system messages and special __system__: user messages
+            const relevantMessages = messages.filter(msg => 
+              msg.role !== 'system' && 
+              !(msg.role === 'user' && msg.content.startsWith('__system__:'))
+            );
+            console.log('loadConversationTranscript - filtered messages:', relevantMessages);
             
-            // Extract first prompt for display in list
-            if (index === 0 && cleanedPrompt) {
-              firstPrompt = cleanedPrompt.length > 60 ? cleanedPrompt.slice(0, 57) + '...' : cleanedPrompt;
+            // Pair user/assistant messages to build history
+            // Note: The messages array contains the INPUT to the LLM (history + new prompt)
+            // The LAST user message needs to be paired with the call's response field
+            for (let i = 0; i < relevantMessages.length; i++) {
+              const msg = relevantMessages[i];
+              
+              if (!msg) continue;
+              
+              if (msg.role === 'user') {
+                // Extract first prompt for conversation title
+                if (!firstPrompt) {
+                  firstPrompt = msg.content.length > 60 ? msg.content.slice(0, 57) + '...' : msg.content;
+                }
+                
+                // Look for the next assistant message in the array
+                const nextMsg = relevantMessages[i + 1];
+                
+                if (nextMsg && nextMsg.role === 'assistant') {
+                  // This is a historical turn - pair the user message with the assistant message from the array
+                  const historyKey = `${timestamp}:${msg.content}`;
+                  history[historyKey] = {
+                    content: nextMsg.content,
+                    callId: callId,
+                  };
+                  
+                  // Skip the assistant message we just processed
+                  i++;
+                } else {
+                  // This is the LAST user message - pair it with the response field
+                  if (lastCall.response) {
+                    const historyKey = `${timestamp}:${msg.content}`;
+                    history[historyKey] = {
+                      content: lastCall.response,
+                      callId: callId,
+                    };
+                  }
+                }
+              }
             }
-            
-            // Use timestamp-prefixed key to maintain order and uniqueness
-            const timestamp = call.createdAt || call.created_at || new Date().toISOString();
-            const historyKey = `${timestamp}:${cleanedPrompt}`;
-            
-            history[historyKey] = {
-              content: call.response,
-              callId: call.id || '',
-            };
+          } catch (err) {
+            console.error('loadConversationTranscript - failed to parse messages property:', err);
           }
-        });
+        }
       }
 
+      console.log('loadConversationTranscript - created', Object.keys(history).length, 'history entries');
       console.log('loadConversationTranscript - parsed history:', history);
       
       // Update first prompt in state if we found one
@@ -1234,7 +1247,7 @@ const AIAgentPanel = React.forwardRef<AIAgentPanelHandle, AIAgentPanelProps>(({
       // Clear loading state on error
       setLoadingConversationId(null);
     }
-  }, [apiKey, currentAgentId, getAgent, onConversationChange, stripContextFromPrompt]);
+  }, [apiKey, currentAgentId, getAgent, onConversationChange]);
 
 
   // Refresh conversations callback