@invergent/agent-chat-react 2.0.7 → 2.0.8

package/dist/index.cjs

@@ -6470,6 +6470,194 @@ function ChatComposerInner({
     }
   );
 }
+
+// src/components/chat/turn-feedback.tsx
+init_utils();
+var MAX_REASON_LENGTH2 = 500;
+function TurnFeedback({ msg }) {
+  const { adapter, sessionId } = useAgentChatAdapterContext();
+  const [pending, setPending] = react.useState(
+    null
+  );
+  const [error, setError] = react.useState(null);
+  const [reasonDraft, setReasonDraft] = react.useState(null);
+  const llmResponseEventId = msg.llmResponseEventId;
+  const canRate = llmResponseEventId !== void 0 && msg.status === "complete" && sessionId !== null && adapter.submitUserFeedback !== void 0;
+  if (!canRate) return null;
+  const rating = msg.userFeedback?.rating ?? pending;
+  const alreadyRated = msg.userFeedback !== void 0;
+  const submit = async (next, reason) => {
+    if (sessionId === null || llmResponseEventId === void 0 || adapter.submitUserFeedback === void 0) return;
+    setPending(next);
+    setError(null);
+    try {
+      await adapter.submitUserFeedback({
+        sessionId,
+        llmResponseEventId,
+        rating: next,
+        ...reason ? { reason } : {}
+      });
+      setReasonDraft(null);
+    } catch (e) {
+      setPending(null);
+      setError(e instanceof Error ? e.message : "Failed to submit feedback");
+    }
+  };
+  const handleRate = (next) => {
+    if (alreadyRated || pending !== null) return;
+    if (next === "down") {
+      setReasonDraft("");
+      return;
+    }
+    void submit("up");
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 space-y-1.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon-xs",
+          "aria-label": "Good response",
+          title: alreadyRated && rating === "up" ? "Good response (recorded)" : "Good response",
+          disabled: pending !== null || alreadyRated,
+          onClick: () => handleRate("up"),
+          className: cn(
+            rating === "up" ? "text-foreground" : "text-muted-foreground/60"
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsUpIcon, { className: "size-3.5" })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon-xs",
+          "aria-label": "Poor response",
+          title: alreadyRated && rating === "down" ? "Poor response (recorded)" : "Poor response",
+          disabled: pending !== null || reasonDraft !== null || alreadyRated,
+          onClick: () => handleRate("down"),
+          className: cn(
+            rating === "down" ? "text-foreground" : "text-muted-foreground/60"
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsDownIcon, { className: "size-3.5" })
+        }
+      ),
+      alreadyRated && msg.userFeedback?.reason && /* @__PURE__ */ jsxRuntime.jsxs(
+        "span",
+        {
+          className: "text-muted-foreground/70 truncate max-w-xs",
+          title: msg.userFeedback.reason,
+          children: [
+            '\xB7 "',
+            msg.userFeedback.reason,
+            '"'
+          ]
+        }
+      ),
+      error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-500 ml-1", children: error })
+    ] }),
+    reasonDraft !== null && !alreadyRated && /* @__PURE__ */ jsxRuntime.jsx(
+      ReasonForm2,
+      {
+        initialValue: reasonDraft,
+        busy: pending !== null,
+        onSubmit: (reason) => void submit("down", reason),
+        onCancel: () => {
+          setReasonDraft(null);
+          setError(null);
+        }
+      }
+    )
+  ] });
+}
+function ReasonForm2({
+  initialValue,
+  busy,
+  onSubmit,
+  onCancel
+}) {
+  const [value, setValue] = react.useState(initialValue);
+  const trimmed = value.trim();
+  const charsLeft = MAX_REASON_LENGTH2 - value.length;
+  const submit = () => {
+    if (trimmed && !busy) onSubmit(trimmed);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border bg-muted/30 p-2 space-y-1.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "label",
+      {
+        className: "text-xs text-muted-foreground",
+        htmlFor: "turn-feedback-reason",
+        children: "What was wrong with the response?"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Textarea,
+      {
+        id: "turn-feedback-reason",
+        autoFocus: true,
+        rows: 3,
+        value,
+        maxLength: MAX_REASON_LENGTH2,
+        placeholder: "e.g. wrong answer, missed a constraint, hallucinated a fact\u2026",
+        onChange: (e) => setValue(e.target.value),
+        onKeyDown: (e) => {
+          if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+            e.preventDefault();
+            submit();
+          } else if (e.key === "Escape") {
+            e.preventDefault();
+            onCancel();
+          }
+        },
+        className: "text-xs min-h-12",
+        disabled: busy
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "span",
+        {
+          className: cn(
+            "text-[10px] tabular-nums",
+            charsLeft < 50 ? "text-amber-500" : "text-muted-foreground/60"
+          ),
+          children: [
+            charsLeft,
+            " characters left"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "xs",
+            onClick: onCancel,
+            disabled: busy,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            type: "button",
+            variant: "default",
+            size: "xs",
+            onClick: submit,
+            disabled: busy || !trimmed,
+            children: busy ? "Sending\u2026" : "Send feedback"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
 var MIN_CPS = 40;
 var MAX_CPS = 240;
 var DRAIN_SECONDS = 0.25;
@@ -7130,7 +7318,8 @@ function messageToEntries(msg, isLast, artifactFallbacks) {
       kind: "text",
       key: `${msg.id}-text`,
       content: msg.content,
-      isStreaming
+      isStreaming,
+      msg
     });
   }
   const hasRunningTool = hasToolCalls && msg.toolCalls.some(
@@ -7433,7 +7622,10 @@ function TextEntry({
       /* @__PURE__ */ jsxRuntime.jsx(TimelineSeparator, { style: { backgroundColor: "var(--color-border)" } }),
       /* @__PURE__ */ jsxRuntime.jsx(TimelineIndicator, { className: "size-2 border-none bg-foreground/40" })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(TimelineContent, { children: /* @__PURE__ */ jsxRuntime.jsx(MessageResponse, { children: content }) })
+    /* @__PURE__ */ jsxRuntime.jsxs(TimelineContent, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(MessageResponse, { children: content }),
+      entry.isFinalTurnText && entry.msg.status === "complete" && /* @__PURE__ */ jsxRuntime.jsx(TurnFeedback, { msg: entry.msg })
+    ] })
   ] });
 }
 function AssistantGroup({
@@ -7453,6 +7645,13 @@ function AssistantGroup({
   }
   entries = groupBrowserActivityEntries(entries);
   entries = groupWebSearchEntries(entries);
+  for (let i = entries.length - 1; i >= 0; i--) {
+    const entry = entries[i];
+    if (entry?.kind === "text") {
+      entries[i] = { ...entry, isFinalTurnText: true };
+      break;
+    }
+  }
   const isTailGroup = lastGlobalIndex === totalMessages - 1;
   const lastEntry = entries[entries.length - 1];
   const hasRunningTool = entries.some(
@@ -8774,6 +8973,7 @@ var AGENT_CHAT_LISTENED_EVENTS = [
   "expert.result",
   "expert.endorse",
   "expert.override",
+  "user.feedback",
   "artifact.created",
   "artifact.updated",
   "browser.provisioned",
@@ -8932,6 +9132,11 @@ function applyAgentChatEvent(state, event) {
         nextState,
         applyExpertFeedback(nextState.messages, event.type, event.data)
       );
+    case "user.feedback":
+      return withMessages(
+        nextState,
+        applyUserFeedback(nextState.messages, event.data)
+      );
     case "clarify.response":
       return withMessages(
         nextState,
@@ -9129,17 +9334,23 @@ function applyLlmResponse(state, event) {
         ...current,
         reasoning: (current.reasoning ?? "") + current.content,
         content: "",
-        status: "streaming"
+        status: "streaming",
+        llmResponseEventId: event.eventId
       };
     } else {
-      messages[idx] = { ...current, status: "complete" };
+      messages[idx] = {
+        ...current,
+        status: "complete",
+        llmResponseEventId: event.eventId
+      };
     }
   } else if (matchesExistingToolTurn && idx >= 0) {
     const current = messages[idx];
     messages[idx] = {
       ...current,
       reasoning: responseContent ? appendText(current.reasoning, responseContent) : current.reasoning,
-      status: "streaming"
+      status: "streaming",
+      llmResponseEventId: event.eventId
     };
   } else if (prevHasTools || !prevAssistant || hasUserAfter) {
     messages.push({
@@ -9148,7 +9359,8 @@ function applyLlmResponse(state, event) {
       content: hasToolCalls ? "" : responseContent,
       reasoning: hasToolCalls && responseContent ? responseContent : void 0,
       createdAt: /* @__PURE__ */ new Date(),
-      status: hasToolCalls ? "streaming" : "complete"
+      status: hasToolCalls ? "streaming" : "complete",
+      llmResponseEventId: event.eventId
     });
   } else {
     const current = messages[idx];
@@ -9156,13 +9368,15 @@ function applyLlmResponse(state, event) {
       messages[idx] = {
         ...current,
         reasoning: (current.reasoning ?? "") + responseContent,
-        status: "streaming"
+        status: "streaming",
+        llmResponseEventId: event.eventId
       };
     } else {
       messages[idx] = {
         ...current,
         content: responseContent || current.content,
-        status: hasToolCalls ? "streaming" : "complete"
+        status: hasToolCalls ? "streaming" : "complete",
+        llmResponseEventId: event.eventId
       };
     }
   }
@@ -9375,6 +9589,26 @@ function applyExpertFeedback(messages, type, data) {
   }
   return messages;
 }
+function applyUserFeedback(messages, data) {
+  const source = typeof data.source === "string" ? data.source : "user";
+  if (source !== "user") return messages;
+  const targetEventId = typeof data.target_event_id === "number" ? data.target_event_id : void 0;
+  if (targetEventId == null) return messages;
+  const rating = data.rating === "down" ? "down" : "up";
+  const reason = typeof data.reason === "string" ? data.reason : void 0;
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const msg = messages[i];
+    if (msg?.role !== "assistant") continue;
+    if (msg.llmResponseEventId !== targetEventId) continue;
+    if (msg.userFeedback?.rating === rating && msg.userFeedback?.reason === reason) {
+      return messages;
+    }
+    const next = [...messages];
+    next[i] = { ...msg, userFeedback: { rating, reason } };
+    return next;
+  }
+  return messages;
+}
 function applyClarifyResponse(messages, data) {
   const targetToolId = stringValue2(data.tool_call_id);
   const responses = Array.isArray(data.responses) ? data.responses : void 0;
@@ -11494,7 +11728,6 @@ function MetadataPane({ mission }) {
 }
 init_utils();
 var DEFAULT_POLL_INTERVAL_MS2 = 3e4;
-var DEFAULT_STATUS = "active,paused";
 function fingerprint(items) {
   return items.map(
     (m) => `${m.id}:${m.status}:${m.iteration}:${m.lastEvaluationResult ?? ""}:${m.lastEvaluationAt ?? ""}:${m.pausedReason ?? ""}:${m.updatedAt}`
@@ -11620,7 +11853,7 @@ function MissionsPanel({
   adapter,
   agentId,
   title = "Missions",
-  status = DEFAULT_STATUS,
+  status,
   hideHeader = false,
   pollIntervalMs = DEFAULT_POLL_INTERVAL_MS2,
   onMissionSelect,