@inkeep/agents-ui 0.0.0-dev-20260508233535 → 0.0.0-dev-20260509021601

package/dist/primitives/components/embedded-chat/use-inkeep-chat.js

@@ -1,117 +1,125 @@
 "use client";
-import { useChat as Ye } from "@ai-sdk/react";
-import { normalizeFileType as Me } from "./file-upload-input.js";
-import { DefaultChatTransport as et } from "ai";
-import { useRef as c, useEffect as k, useState as M, useMemo as xe, useCallback as L, useImperativeHandle as tt } from "react";
-import { useInkeepConfig as st } from "../../providers/config-provider.js";
-import { useChatAuth as rt } from "../../providers/chat-auth-provider.js";
-import { useMediaQuery as nt } from "../../hooks/use-media-query.js";
-import { useConversationLoader as ot } from "../../hooks/use-conversation-loader.js";
-import { useInitialConversation as at } from "../../hooks/use-initial-conversation.js";
+import { useChat as tt } from "@ai-sdk/react";
+import { normalizeFileType as Fe } from "./file-upload-input.js";
+import { DefaultChatTransport as st } from "ai";
+import { useRef as l, useEffect as x, useState as M, useMemo as _e, useCallback as L, useImperativeHandle as rt } from "react";
+import { useInkeepConfig as nt } from "../../providers/config-provider.js";
+import { useChatAuth as ot } from "../../providers/chat-auth-provider.js";
+import { useMediaQuery as at } from "../../hooks/use-media-query.js";
+import { useConversationLoader as it } from "../../hooks/use-conversation-loader.js";
+import { useInitialConversation as lt } from "../../hooks/use-initial-conversation.js";
 import { generateUid as $ } from "../../utils/generate-uid.js";
-import { useBaseEvents as it } from "../../providers/base-events-provider.js";
-import { useChatForm as lt } from "../../providers/chat-form-provider.js";
-import { useWidget as ct } from "../../providers/widget-provider.js";
-import { useControllableState as ut } from "@radix-ui/react-use-controllable-state";
-import { useStreamingEvents as pt } from "../../hooks/use-streaming-events.js";
-import { useInputNotification as ft } from "../../hooks/use-input-notification.js";
-import { resolveStreamingAuthError as dt, DEFAULT_ERROR_MESSAGE as oe, isRecoverableError as mt, RECOVERABLE_NOTIFICATION_DURATION_MS as gt, resolveHttpStatusCode as ht, RATE_LIMIT_MESSAGE as vt, RECOVERABLE_FALLBACK_MESSAGE as Fe } from "./chat-error-helpers.js";
-const Dt = () => {
-  const { baseSettings: ae, aiChatSettings: v } = st(), [i = "", g] = ut({
+import { useBaseEvents as ct } from "../../providers/base-events-provider.js";
+import { useChatForm as ut } from "../../providers/chat-form-provider.js";
+import { useWidget as pt } from "../../providers/widget-provider.js";
+import { useControllableState as dt } from "@radix-ui/react-use-controllable-state";
+import { useStreamingEvents as ft } from "../../hooks/use-streaming-events.js";
+import { useInputNotification as mt } from "../../hooks/use-input-notification.js";
+import { resolveStreamingAuthError as gt, DEFAULT_ERROR_MESSAGE as ie, isRecoverableError as ht, RECOVERABLE_NOTIFICATION_DURATION_MS as vt, resolveHttpStatusCode as yt, RATE_LIMIT_MESSAGE as Ct, RECOVERABLE_FALLBACK_MESSAGE as Ne } from "./chat-error-helpers.js";
+const Lt = () => {
+  const { baseSettings: le, aiChatSettings: v } = nt(), [c = "", g] = dt({
     prop: v.conversationIdOverride,
     defaultProp: v.conversationIdOverride ?? ""
-  }), { logEvent: m } = it(), { setConversationId: _e, emitToParent: x } = pt(), ie = c(i);
-  k(() => {
-    const e = ie.current;
-    ie.current = i, e !== i && m({
+  }), { logEvent: m } = ct(), { setConversationId: Pe, emitToParent: F } = ft(), ce = l(c);
+  x(() => {
+    const e = ce.current;
+    ce.current = c, e !== c && m({
       eventName: "chat_conversation_changed",
       properties: {
-        conversationId: i,
+        conversationId: c,
         previousConversationId: e
       }
     });
-  }, [i, m]);
-  const [y, C] = M(""), Ne = (e) => C(e.target.value), { shouldBypassCaptcha: Pe, filters: le, userProperties: B } = ae, {
-    authToken: U,
-    isAuthenticated: d,
-    isAuthConfigured: ce,
-    refreshAuthToken: ue,
-    sessionToken: z,
-    refreshSession: H,
-    getCaptchaHeader: F,
+  }, [c, m]);
+  const [y, C] = M(""), Oe = (e) => C(e.target.value), {
+    shouldBypassCaptcha: De,
+    filters: ue,
+    userProperties: B,
+    analyticsProperties: U
+  } = le, {
+    authToken: z,
+    isAuthenticated: f,
+    isAuthConfigured: pe,
+    refreshAuthToken: de,
+    sessionToken: H,
+    refreshSession: K,
+    getCaptchaHeader: _,
     invalidateCaptcha: p
-  } = rt(), {
-    onInputMessageChange: De,
-    filters: pe,
-    baseUrl: fe,
-    agentUrl: Oe,
-    context: de,
-    headers: me,
-    appId: _,
-    apiKey: R,
-    files: S
-  } = v, ge = c(F);
-  ge.current = F;
-  const he = Oe || `${fe}/run/api/chat`, ve = R ?? (d ? U : z), { loadConversation: ye } = ot({
-    baseUrl: fe,
-    appId: _,
-    authToken: ve,
-    getCaptchaHeader: F,
+  } = ot(), {
+    onInputMessageChange: Le,
+    filters: fe,
+    baseUrl: me,
+    agentUrl: $e,
+    context: ge,
+    headers: he,
+    appId: N,
+    apiKey: I,
+    files: R
+  } = v, ve = l(_);
+  ve.current = _;
+  const ye = $e || `${me}/run/api/chat`, Ce = I ?? (f ? z : H), { loadConversation: Ie } = it({
+    baseUrl: me,
+    appId: N,
+    authToken: Ce,
+    getCaptchaHeader: _,
     invalidateCaptcha: p,
-    refreshSession: R || d ? void 0 : H
-  }), [Le, Ce] = M(!1), K = c(null);
-  K.current = z;
-  const q = c(null);
-  q.current = U;
-  const G = c(void 0);
-  G.current = B && Object.keys(B).length > 0 ? JSON.stringify(B) : void 0;
-  const h = c(0), J = c(null), V = c(null), I = c(void 0), $e = S?.map(
+    refreshSession: I || f ? void 0 : K
+  }), [Be, Re] = M(!1), q = l(null);
+  q.current = H;
+  const J = l(null);
+  J.current = z;
+  const j = l(void 0);
+  j.current = B && Object.keys(B).length > 0 ? JSON.stringify(B) : void 0;
+  const G = l(void 0);
+  G.current = U && Object.keys(U).length > 0 ? JSON.stringify(U) : void 0;
+  const h = l(0), V = l(null), W = l(null), S = l(void 0), Ue = R?.map(
     (e) => `${e.filename ?? ""}:${e.mediaType}:${e.url.length}:${e.url.slice(0, 64)}:${e.url.slice(-32)}`
   ).join(`
 `) ?? "";
-  k(() => {
-    I.current = S?.length ? S : void 0;
-  }, [$e]);
-  const Re = c(me);
-  Re.current = me;
-  const j = c(void 0);
-  j.current = le || pe ? JSON.stringify({ ...le, ...pe }) : void 0;
-  const Be = (e) => {
-    switch (ht(e)) {
+  x(() => {
+    S.current = R?.length ? R : void 0;
+  }, [Ue]);
+  const Se = l(he);
+  Se.current = he;
+  const Q = l(void 0);
+  Q.current = ue || fe ? JSON.stringify({ ...ue, ...fe }) : void 0;
+  const ze = (e) => {
+    switch (yt(e)) {
       case 400:
         try {
           const t = JSON.parse(e.message ?? "");
-          return t.detail ?? t.error?.message ?? Fe;
+          return t.detail ?? t.error?.message ?? Ne;
         } catch {
-          return e.message?.trim() || Fe;
+          return e.message?.trim() || Ne;
         }
       case 401:
-        return ce ? "Authentication failed. Please try again." : oe;
+        return pe ? "Authentication failed. Please try again." : ie;
       case 403:
-        return `There seems to be a configuration error. Please contact ${ae.organizationDisplayName ?? "Administrator"}`;
+        return `There seems to be a configuration error. Please contact ${le.organizationDisplayName ?? "Administrator"}`;
       case 429:
-        return vt;
+        return Ct;
       default:
-        return oe;
+        return ie;
     }
-  }, [N, W] = M([]), Ue = xe(
-    () => new et({
-      api: he,
+  }, [P, Z] = M([]), He = _e(
+    () => new st({
+      api: ye,
       headers: () => {
-        const e = R ?? q.current ?? K.current;
+        const e = I ?? J.current ?? q.current;
         return {
           "x-inkeep-client-timezone": Intl.DateTimeFormat().resolvedOptions().timeZone,
           "x-inkeep-client-timestamp": (/* @__PURE__ */ new Date()).toISOString(),
           "x-inkeep-invocation-type": "chat_widget",
-          ..._ ? { "x-inkeep-app-id": _ } : {},
+          ...N ? { "x-inkeep-app-id": N } : {},
           ...e ? { Authorization: `Bearer ${e}` } : {},
-          ...j.current ? { "inkeep-filters": j.current } : {},
-          ...G.current ? { "x-inkeep-user-properties": G.current } : {},
-          ...Re.current
+          ...Q.current ? { "inkeep-filters": Q.current } : {},
+          ...j.current ? { "x-inkeep-user-properties": j.current } : {},
+          ...G.current ? { "x-inkeep-properties": G.current } : {},
+          ...Se.current
         };
       },
       prepareSendMessagesRequest: async (e) => {
-        const a = await ge.current(), t = e.messages[e.messages.length - 1];
+        const a = await ve.current(), t = e.messages[e.messages.length - 1];
         return t || console.warn(
           "[useInkeepChat] prepareSendMessagesRequest called with empty messages array"
         ), {
@@ -129,68 +137,70 @@ const Dt = () => {
         };
       },
       body: {
-        requestContext: de
+        requestContext: ge
       }
     }),
-    [he, de, _, R]
+    [ye, ge, N, I]
   ), {
-    messages: P,
-    sendMessage: Q,
-    addToolApprovalResponse: Z,
-    status: Se,
-    setMessages: f,
-    stop: D,
-    error: O
-  } = Ye({
-    transport: Ue,
+    messages: w,
+    sendMessage: X,
+    addToolApprovalResponse: Y,
+    status: we,
+    setMessages: d,
+    stop: O,
+    error: D
+  } = tt({
+    transport: He,
     onData(e) {
-      x(e.type, e.data);
+      F(e.type, e.data);
     },
-    async onFinish() {
-      x("completion", { conversationId: i }), await m({
+    async onFinish({ message: e }) {
+      F("completion", { conversationId: c }), await m({
         eventName: "assistant_message_received",
         properties: {
-          conversationId: i
+          conversationId: c,
+          messageId: e.id
         }
       }), m({
         eventName: "assistant_answer_displayed",
         properties: {
-          conversationId: i
+          conversationId: c,
+          messageId: e.id
         }
       });
     },
     onError(e) {
       console.error("onError", { code: e.code, message: e.message });
-      const a = Pe || R ? null : dt(e);
+      const a = De || I ? null : gt(e);
       if (a !== null && h.current < 1) {
         h.current++;
-        const n = V.current, s = J.current;
+        const n = W.current, s = V.current;
         (async () => {
-          if (a === "session" && ce) {
-            const l = await ue();
-            if (!l) throw new Error("Auth token refresh failed");
-            q.current = l;
+          if (a === "session" && pe) {
+            const i = await de();
+            if (!i) throw new Error("Auth token refresh failed");
+            J.current = i;
           } else if (a === "session") {
-            const l = await H();
-            l && (K.current = l);
+            const i = await K();
+            i && (q.current = i);
           } else
             p();
           if (n) {
-            Z(n);
+            Y(n);
             return;
           }
-          s && (f((l) => {
-            let r = [...l];
+          s && (d((i) => {
+            let r = [...i];
             return r.at(-1)?.role === "assistant" && (r = r.slice(0, -1)), r.at(-1)?.role === "user" && (r = r.slice(0, -1)), r;
-          }), Q(
+          }), X(
             s.files?.length ? { parts: [{ type: "text", text: s.content }, ...s.files] } : { text: s.content },
             { body: s.body }
           ));
         })().catch(() => {
-          h.current = 0, p(), f((l) => {
-            const r = [...l], E = r[r.length - 1];
+          h.current = 0, p(), d((i) => {
+            const r = [...i], E = r[r.length - 1];
             if (!E) return r;
-            const T = oe;
+            const T = ie;
             return E.role === "user" ? r.push({
               id: $(16),
               role: "assistant",
@@ -201,26 +211,27 @@ const Dt = () => {
         return;
       }
       h.current = 0, a !== null && p();
-      const t = mt(e), u = Be(e);
+      const t = ht(e), u = ze(e);
       if (m({
         eventName: "chat_error",
         properties: {
-          conversationId: i,
+          conversationId: c,
+          messageId: w.at(-1)?.id,
           error: e.message
         }
       }), t) {
-        se(
+        ne(
           { title: "Request failed", message: u },
-          gt
-        ), f((s) => {
+          vt
+        ), d((s) => {
           let o = [...s];
           return o.at(-1)?.role === "assistant" && (o = o.slice(0, -1)), o.at(-1)?.role === "user" && (o = o.slice(0, -1)), o;
         });
-        const n = J.current?.content;
-        n && C(n), te.current = e;
+        const n = V.current?.content;
+        n && C(n), re.current = e;
         return;
       }
-      f((n) => {
+      d((n) => {
         const s = [...n], o = s[s.length - 1];
         return o && (o.role === "user" ? s.push({
           id: $(16),
@@ -229,75 +240,75 @@ const Dt = () => {
         }) : o.parts = [{ type: "text", text: u }]), s;
       });
     }
-  }), Ie = c(d);
-  k(() => {
-    const e = Ie.current;
-    Ie.current = d, e !== d && (D(), w(null), f([]), g(""), C(""), W([]), p());
-  }, [d, D, f, g, p]);
-  const we = Se === "submitted", X = Se === "streaming", ze = xe(() => {
+  }), Ae = l(f);
+  x(() => {
+    const e = Ae.current;
+    Ae.current = f, e !== f && (O(), A(null), d([]), g(""), C(""), Z([]), p());
+  }, [f, O, d, g, p]);
+  const be = we === "submitted", ee = we === "streaming", Ke = _e(() => {
     const e = (n) => {
       if (!n || typeof n != "object") return !1;
       const s = n;
       return typeof s.type == "string" && s.type.startsWith("tool-");
-    }, t = [...P ?? []].reverse().find((n) => n.role === "assistant");
+    }, t = [...w ?? []].reverse().find((n) => n.role === "assistant");
     if (!t) return !1;
     const u = t.parts?.at(-1);
-    return !(!e(u) || u.state !== "output-available" || !u.approval?.id || X);
-  }, [P, X]), [He, Y] = M(!1), Ae = X || ze && !He, Ee = we || Ae, Ke = P.length === 0, ee = !y.trim() && N.length === 0 || Ee, qe = nt("(max-width: 768px)"), [Ge, w] = M(null), te = c(null);
-  k(() => {
-    if (O) {
-      if (te.current === O) {
-        te.current = null;
+    return !(!e(u) || u.state !== "output-available" || !u.approval?.id || ee);
+  }, [w, ee]), [qe, te] = M(!1), Ee = ee || Ke && !qe, Te = be || Ee, Je = w.length === 0, se = !y.trim() && P.length === 0 || Te, je = at("(max-width: 768px)"), [Ge, A] = M(null), re = l(null);
+  x(() => {
+    if (D) {
+      if (re.current === D) {
+        re.current = null;
         return;
       }
-      w(O);
+      A(D);
     }
-  }, [O]);
-  const Je = () => w(null), { inputNotification: Ve, showInputNotification: se, clearInputNotification: je } = ft(), Te = c(null);
-  k(() => {
-    De?.(y);
+  }, [D]);
+  const Ve = () => A(null), { inputNotification: We, showInputNotification: ne, clearInputNotification: Qe } = mt(), ke = l(null);
+  x(() => {
+    Le?.(y);
   }, [y]);
-  const We = (e) => {
-    e.key === "Enter" && !e.shiftKey && !ee && !e.nativeEvent.isComposing && (e.preventDefault(), re());
-  }, re = async (e = y) => {
-    if (ee && (!e || e.trim().length === 0) && N.length === 0) return;
-    const a = N;
-    W([]), C(""), h.current = 0, V.current = null, Y(!1), await m({
+  const Ze = (e) => {
+    e.key === "Enter" && !e.shiftKey && !se && !e.nativeEvent.isComposing && (e.preventDefault(), oe());
+  }, oe = async (e = y) => {
+    if (se && (!e || e.trim().length === 0) && P.length === 0) return;
+    const a = P;
+    Z([]), C(""), h.current = 0, W.current = null, te(!1);
+    let t = c;
+    t || (t = `conv_${$(16)}`, g(t)), Pe(t), await m({
       eventName: "user_message_submitted",
       properties: {
-        conversationId: i
+        conversationId: t
       }
     });
-    let t = i;
-    t || (t = `conv_${$(16)}`, g(t)), _e(t);
-    const u = I.current;
-    I.current = void 0;
+    const u = S.current;
+    S.current = void 0;
     let n, s;
     if (u?.length) {
       let o;
       try {
         o = await Promise.all(
-          a.map((l) => {
-            const r = Me(l);
+          a.map((i) => {
+            const r = Fe(i);
             return new Promise((E, T) => {
-              const b = new FileReader();
-              b.onload = () => {
-                if (typeof b.result != "string") {
+              const k = new FileReader();
+              k.onload = () => {
+                if (typeof k.result != "string") {
                   T(new Error(`Failed to read file "${r.name}"`));
                   return;
                 }
                 E({
                   type: "file",
-                  url: b.result,
+                  url: k.result,
                   mediaType: r.type,
                   filename: r.name
                 });
-              }, b.onerror = () => T(new Error(`Failed to read file "${r.name}"`)), b.readAsDataURL(r);
+              }, k.onerror = () => T(new Error(`Failed to read file "${r.name}"`)), k.readAsDataURL(r);
             });
           })
         );
       } catch {
-        se({
+        ne({
           title: "Failed to attach files",
           message: "Could not read one or more files. Please try again."
         });
@@ -306,44 +317,44 @@ const Dt = () => {
       s = [...o, ...u], n = e.trim() ? { parts: [{ type: "text", text: e }, ...s] } : { parts: s };
     } else if (a.length > 0) {
       const o = new DataTransfer();
-      for (const r of a) o.items.add(Me(r));
-      const l = o.files;
-      n = e.trim() ? { text: e, files: l } : { files: l };
+      for (const r of a) o.items.add(Fe(r));
+      const i = o.files;
+      n = e.trim() ? { text: e, files: i } : { files: i };
     } else
       n = { text: e };
-    J.current = {
+    V.current = {
       content: e,
       body: { conversationId: t },
       files: s
-    }, Q(n, {
+    }, X(n, {
       body: { conversationId: t }
     });
-  }, Qe = L(
+  }, Xe = L(
     (e) => {
-      h.current = 0, V.current = e, Y(!1), Z(e);
+      h.current = 0, W.current = e, te(!1), Y(e);
     },
-    [Z]
-  ), ne = L(() => {
-    Y(!0), D().then(() => {
-      x("aborted", { conversationId: i });
+    [Y]
+  ), ae = L(() => {
+    te(!0), O().then(() => {
+      F("aborted", { conversationId: c });
     });
-  }, [D, i, x]), be = () => {
-    Je(), f([]), g(""), p(), I.current = S?.length ? S : void 0, m({
+  }, [O, c, F]), xe = () => {
+    Ve(), d([]), g(""), p(), S.current = R?.length ? R : void 0, m({
       eventName: "chat_clear_button_clicked",
       properties: {
-        conversationId: i
+        conversationId: c
       }
     });
-  }, A = L(
+  }, b = L(
     (e, a) => {
-      w(null), f(a), g(e), p(), I.current = void 0;
+      A(null), d(a), g(e), p(), S.current = void 0;
     },
-    [f, g, p]
-  ), ke = L(
+    [d, g, p]
+  ), Me = L(
     async (e, a) => {
-      ne(), A(e, []), Ce(!0);
+      ae(), b(e, []), Re(!0);
       try {
-        const t = await ye(e, a);
+        const t = await Ie(e, a);
         if (t === null) return !1;
         const n = t[t.length - 1]?.role === "user" ? [
           ...t,
@@ -358,66 +369,66 @@ const Dt = () => {
             ]
           }
         ] : t;
-        return A(e, n), !0;
+        return b(e, n), !0;
       } finally {
-        a?.aborted || Ce(!1);
+        a?.aborted || Re(!1);
       }
     },
-    [A, ye, ne]
+    [b, Ie, ae]
   );
-  at({
+  lt({
     conversationId: v.conversationId,
-    effectiveAuthToken: ve,
-    loadAndRestoreSession: ke,
-    onLoadFailed: () => A("", [])
+    effectiveAuthToken: Ce,
+    loadAndRestoreSession: Me,
+    onLoadFailed: () => b("", [])
   });
-  const { openForm: Ze } = lt(), Xe = ct();
-  return tt(v.chatFunctionsRef, () => ({
-    submitMessage: re,
+  const { openForm: Ye } = ut(), et = pt();
+  return rt(v.chatFunctionsRef, () => ({
+    submitMessage: oe,
     updateInputMessage(e) {
       C(e);
     },
-    clearChat: be,
+    clearChat: xe,
     openForm: (e) => {
-      Xe?.setView("chat"), Ze(e, void 0);
+      et?.setView("chat"), Ye(e, void 0);
     },
     focusInput: () => {
-      Te.current?.focus();
+      ke.current?.focus();
     }
   })), {
-    messages: P,
-    sendMessage: Q,
-    addToolApprovalResponse: Qe,
-    isLoading: we,
-    isStreaming: Ae,
-    isBusy: Ee,
+    messages: w,
+    sendMessage: X,
+    addToolApprovalResponse: Xe,
+    isLoading: be,
+    isStreaming: Ee,
+    isBusy: Te,
     error: Ge,
-    setError: w,
-    isSubmitDisabled: ee,
+    setError: A,
+    isSubmitDisabled: se,
     input: y,
-    handleInputChange: Ne,
-    handleInputKeyDown: We,
-    handleSubmit: re,
-    stop: ne,
-    clear: be,
-    inputRef: Te,
-    isMobile: qe,
-    files: N,
-    setFiles: W,
-    isNewChat: Ke,
-    conversationId: i,
-    restoreSession: A,
-    loadAndRestoreSession: ke,
-    isSessionLoading: Le,
-    authToken: d ? U : z,
-    refreshSession: d ? ue : H,
-    getCaptchaHeader: F,
+    handleInputChange: Oe,
+    handleInputKeyDown: Ze,
+    handleSubmit: oe,
+    stop: ae,
+    clear: xe,
+    inputRef: ke,
+    isMobile: je,
+    files: P,
+    setFiles: Z,
+    isNewChat: Je,
+    conversationId: c,
+    restoreSession: b,
+    loadAndRestoreSession: Me,
+    isSessionLoading: Be,
+    authToken: f ? z : H,
+    refreshSession: f ? de : K,
+    getCaptchaHeader: _,
     invalidateCaptcha: p,
-    inputNotification: Ve,
-    showInputNotification: se,
-    clearInputNotification: je
+    inputNotification: We,
+    showInputNotification: ne,
+    clearInputNotification: Qe
   };
 };
 export {
-  Dt as useInkeepChat
+  Lt as useInkeepChat
 };