@agentiffai/design 1.3.7 → 1.3.8

package/dist/copilotkit/index.cjs

@@ -4,6 +4,7 @@ var button = require('@react-aria/button');
 var react = require('react');
 var styled8 = require('styled-components');
 var jsxRuntime = require('react/jsx-runtime');
+var reactCore = require('@copilotkit/react-core');
 var reactUi = require('@copilotkit/react-ui');
 var textfield = require('@react-aria/textfield');
 
@@ -1224,6 +1225,77 @@ var TOOL_CALL_MARKER_REGEX = /<!--TOOL_CALL:([^:]+):(.+?)-->/g;
 function stripToolCallMarkers(content) {
   return content.replace(TOOL_CALL_MARKER_REGEX, "").trim();
 }
+var ERROR_PATTERNS = [
+  /\bfailed\b/i,
+  /\berror\b/i,
+  /\bunable to\b/i,
+  /\bcouldn't\b/i,
+  /\bcan't\b/i,
+  /\bcannot\b/i,
+  /\bsomething went wrong\b/i,
+  /\btry again\b/i,
+  /\bunexpected\b/i,
+  /\btimed out\b/i,
+  /\bconnection\b.*\b(lost|failed|refused)\b/i
+];
+var CORRELATION_ID_PATTERNS = [
+  /reference:\s*([a-f0-9-]+)/i,
+  /correlation[_\s]?id:\s*([a-f0-9-]+)/i,
+  /\[([a-f0-9]{8,})\]/i
+];
+function inferErrorCategory(content) {
+  const lowerContent = content.toLowerCase();
+  if (lowerContent.includes("network") || lowerContent.includes("internet") || lowerContent.includes("connection") || lowerContent.includes("offline") || lowerContent.includes("timed out")) {
+    return "Network";
+  }
+  if (lowerContent.includes("unauthorized") || lowerContent.includes("authentication") || lowerContent.includes("login") || lowerContent.includes("session expired") || lowerContent.includes("credentials")) {
+    return "Auth";
+  }
+  if (lowerContent.includes("oauth") || lowerContent.includes("reconnect") || lowerContent.includes("authorization") || lowerContent.includes("token") && lowerContent.includes("expired")) {
+    return "OAuth";
+  }
+  if (lowerContent.includes("workflow") || lowerContent.includes("execution") || lowerContent.includes("failed to start") || lowerContent.includes("automation")) {
+    return "Workflow";
+  }
+  return "Unknown";
+}
+function extractCorrelationId(content) {
+  for (const pattern of CORRELATION_ID_PATTERNS) {
+    const match = content.match(pattern);
+    if (match?.[1]) {
+      return match[1];
+    }
+  }
+  return void 0;
+}
+function detectErrorInMessage(content) {
+  const hasError = ERROR_PATTERNS.some((pattern) => pattern.test(content));
+  if (!hasError) {
+    return { hasError: false };
+  }
+  return {
+    hasError: true,
+    category: inferErrorCategory(content),
+    correlationId: extractCorrelationId(content),
+    errorMessage: content
+  };
+}
+function buildChatSnippet(messages, errorMessageContent, maxMessages = 5, maxLength = 1500) {
+  const recentMessages = messages.filter((msg) => msg.content && msg.content !== errorMessageContent).slice(-maxMessages);
+  const formattedMessages = recentMessages.map((msg) => {
+    const role = msg.role === "user" ? "User" : "Assistant";
+    const content = msg.content || "";
+    const truncatedContent = content.length > 300 ? content.slice(0, 300) + "..." : content;
+    return `[${role}]: ${truncatedContent}`;
+  });
+  const errorSnippet = errorMessageContent.length > 500 ? errorMessageContent.slice(0, 500) + "..." : errorMessageContent;
+  formattedMessages.push(`[Assistant - Error]: ${errorSnippet}`);
+  let result = formattedMessages.join("\n\n");
+  if (result.length > maxLength) {
+    result = result.slice(0, maxLength) + "\n...[truncated]";
+  }
+  return result;
+}
 var GenerativeUIContainer = styled8__default.default.div`
   margin-top: ${tokens.spacing.sm};
   margin-bottom: ${tokens.spacing.sm};
@@ -1319,6 +1391,95 @@ function createAssistantMessageAdapter(ThinkingIndicator, ToolCallsComponent) {
   CustomAssistantMessageAdapter.displayName = "CustomAssistantMessageAdapter";
   return react.memo(CustomAssistantMessageAdapter);
 }
+function createAssistantMessageAdapterWithErrorReporting(onReportIssue, ThinkingIndicator, ToolCallsComponent) {
+  const ErrorReportingAssistantMessageAdapter = ({
+    message,
+    isLoading,
+    isGenerating,
+    isCurrentMessage
+  }) => {
+    const { visibleMessages } = reactCore.useCopilotChat();
+    const showThinking = isLoading || isGenerating && !message?.content;
+    const shouldShowToolCalls = isCurrentMessage && ToolCallsComponent;
+    const rawContent = message?.content || "";
+    const content = stripToolCallMarkers(rawContent);
+    const errorContext = react.useMemo(() => detectErrorInMessage(content), [content]);
+    const chatSnippet = react.useMemo(() => {
+      if (!errorContext.hasError) return "";
+      return buildChatSnippet(visibleMessages, content);
+    }, [visibleMessages, content, errorContext.hasError]);
+    const actions = react.useMemo(() => {
+      if (!errorContext.hasError || !onReportIssue || isGenerating) {
+        return [];
+      }
+      return [
+        {
+          label: "Report Issue",
+          onClick: () => {
+            onReportIssue({
+              errorCategory: errorContext.category,
+              correlationId: errorContext.correlationId,
+              // Include conversation history leading to the error
+              chatSnippet
+            });
+          },
+          icon: /* @__PURE__ */ jsxRuntime.jsxs(
+            "svg",
+            {
+              width: "14",
+              height: "14",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+                /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
+                /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
+              ]
+            }
+          )
+        }
+      ];
+    }, [errorContext, chatSnippet, isGenerating]);
+    let generativeUIOutput = null;
+    const msgWithUI = message;
+    if (msgWithUI && typeof msgWithUI.generativeUI === "function") {
+      try {
+        generativeUIOutput = msgWithUI.generativeUI();
+      } catch (e) {
+        console.warn("[AssistantMessageAdapter] Error rendering generativeUI:", e);
+      }
+    }
+    const attachments = [];
+    if (showThinking) {
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        ThinkingIndicator ? /* @__PURE__ */ jsxRuntime.jsx(ThinkingIndicator, { isLoading, isGenerating }) : /* @__PURE__ */ jsxRuntime.jsx(AssistantThinking, { message: "Thinking..." }),
+        shouldShowToolCalls && /* @__PURE__ */ jsxRuntime.jsx(ToolCallsComponent, {})
+      ] });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      shouldShowToolCalls && /* @__PURE__ */ jsxRuntime.jsx(ToolCallsComponent, {}),
+      generativeUIOutput && /* @__PURE__ */ jsxRuntime.jsx(GenerativeUIContainer, { children: generativeUIOutput }),
+      content && /* @__PURE__ */ jsxRuntime.jsx(
+        AssistantMessage,
+        {
+          content,
+          avatarInitials: "AI",
+          isLoading: false,
+          isStreaming: isGenerating,
+          attachments,
+          enableMarkdown: true,
+          actions
+        }
+      )
+    ] });
+  };
+  ErrorReportingAssistantMessageAdapter.displayName = "ErrorReportingAssistantMessageAdapter";
+  return react.memo(ErrorReportingAssistantMessageAdapter);
+}
 var ChatInputContainer = styled8__default.default.div`
   display: flex;
   flex-direction: column;
@@ -2917,7 +3078,8 @@ function CustomCopilotSidebar2({
   onError,
   renderError,
   ThinkingIndicator,
-  ToolCallsComponent
+  ToolCallsComponent,
+  onReportIssue
 }) {
   const HeaderAdapterWithClose = react.useMemo(
     () => createHeaderAdapter(onSetOpen),
@@ -2928,8 +3090,8 @@ function CustomCopilotSidebar2({
     [disabled, disabledReason, onSetOpen]
   );
   const AssistantMessageAdapterMemo = react.useMemo(
-    () => ThinkingIndicator || ToolCallsComponent ? createAssistantMessageAdapter(ThinkingIndicator, ToolCallsComponent) : AssistantMessageAdapter,
-    [ThinkingIndicator, ToolCallsComponent]
+    () => onReportIssue ? createAssistantMessageAdapterWithErrorReporting(onReportIssue, ThinkingIndicator, ToolCallsComponent) : ThinkingIndicator || ToolCallsComponent ? createAssistantMessageAdapter(ThinkingIndicator, ToolCallsComponent) : AssistantMessageAdapter,
+    [ThinkingIndicator, ToolCallsComponent, onReportIssue]
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(GlobalSidebarStyles2, {}),