@inkeep/agents-ui 0.0.0-dev-20260402200940 → 0.0.0-dev-20260402205727

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

@@ -1,26 +1,26 @@
 "use client";
-import { useChat as nt } from "@ai-sdk/react";
-import { normalizeFileType as Te } from "./file-upload-input.js";
-import { DefaultChatTransport as ot } from "ai";
-import { useRef as l, useEffect as M, useState as C, useMemo as xe, useCallback as B, useImperativeHandle as at } from "react";
-import { useModal as it } from "../modal/modal-provider.js";
-import { useOptionalChatBubble as lt } from "../../providers/chat-bubble-provider.js";
-import { useOptionalSidebarChat as ct } from "../../providers/sidebar-chat-provider.js";
-import { useInkeepConfig as ut } from "../../providers/config-provider.js";
-import { useCaptcha as pt } from "./use-captcha.js";
-import { useMediaQuery as dt } from "../../hooks/use-media-query.js";
-import { useAnonymousSession as ft } from "../../hooks/use-anonymous-session.js";
-import { useAuthToken as mt } from "../../hooks/use-auth-token.js";
-import { useConversationLoader as ht } from "../../hooks/use-conversation-loader.js";
-import { generateUid as U } from "../../utils/generate-uid.js";
-import { useBaseEvents as gt } from "../../providers/base-events-provider.js";
-import { useChatForm as yt } from "../../providers/chat-form-provider.js";
-import { useWidget as vt } from "../../providers/widget-provider.js";
-import { useControllableState as bt } from "@radix-ui/react-use-controllable-state";
-import { useStreamingEvents as Ct } from "../../hooks/use-streaming-events.js";
-import { parseAuthError as wt } from "../../hooks/use-inkeep-api-client.js";
-import { useInputNotification as St } from "../../hooks/use-input-notification.js";
-function At(h) {
+import { useChat as et } from "@ai-sdk/react";
+import { normalizeFileType as Re } from "./file-upload-input.js";
+import { DefaultChatTransport as tt } from "ai";
+import { useRef as l, useEffect as k, useState as D, useMemo as Te, useCallback as $, useImperativeHandle as st } from "react";
+import { useModal as rt } from "../modal/modal-provider.js";
+import { useOptionalChatBubble as nt } from "../../providers/chat-bubble-provider.js";
+import { useOptionalSidebarChat as ot } from "../../providers/sidebar-chat-provider.js";
+import { useInkeepConfig as at } from "../../providers/config-provider.js";
+import { useCaptcha as it } from "./use-captcha.js";
+import { useMediaQuery as lt } from "../../hooks/use-media-query.js";
+import { useAnonymousSession as ct } from "../../hooks/use-anonymous-session.js";
+import { useAuthToken as ut } from "../../hooks/use-auth-token.js";
+import { useConversationLoader as pt } from "../../hooks/use-conversation-loader.js";
+import { generateUid as L } from "../../utils/generate-uid.js";
+import { useBaseEvents as dt } from "../../providers/base-events-provider.js";
+import { useChatForm as ft } from "../../providers/chat-form-provider.js";
+import { useWidget as mt } from "../../providers/widget-provider.js";
+import { useControllableState as ht } from "@radix-ui/react-use-controllable-state";
+import { useStreamingEvents as gt } from "../../hooks/use-streaming-events.js";
+import { parseAuthError as yt } from "../../hooks/use-inkeep-api-client.js";
+import { useInputNotification as vt } from "../../hooks/use-input-notification.js";
+function bt(h) {
   const g = h.message ?? "";
   let s = Number(h.code) || Number(h.statusCode);
   if (Number.isNaN(s))
@@ -28,19 +28,19 @@ function At(h) {
       s = Number(JSON.parse(g).status);
     } catch {
     }
-  const p = wt(s, { detail: g });
+  const p = yt(s, { detail: g });
   return p !== null ? p : s === 401 ? "session" : null;
 }
-const re = `Hmm.. 
+const te = `Hmm.. 
 
-It seems I might be having some issues right now. Please clear the chat and try again.`, Wt = () => {
-  const { baseSettings: h, aiChatSettings: g } = ut(), [s = "", p] = bt({
+It seems I might be having some issues right now. Please clear the chat and try again.`, zt = () => {
+  const { baseSettings: h, aiChatSettings: g } = at(), [s = "", p] = ht({
     prop: g.conversationId,
     defaultProp: g.conversationId ?? ""
-  }), Me = it(), Ee = lt(), Fe = ct(), { logEvent: y } = gt(), { setConversationId: Ne, emitToParent: E } = Ct(), ne = l(s);
-  M(() => {
-    const e = ne.current;
-    ne.current = s, e !== s && y({
+  }), ke = rt(), xe = nt(), Me = ot(), { logEvent: y } = dt(), { setConversationId: Ee, emitToParent: x } = gt(), se = l(s);
+  k(() => {
+    const e = se.current;
+    se.current = s, e !== s && y({
       eventName: "chat_conversation_changed",
       properties: {
         conversationId: s,
@@ -48,79 +48,79 @@ It seems I might be having some issues right now. Please clear the chat and try
       }
     });
   }, [s, y]);
-  const [w, F] = C(""), Pe = (e) => F(e.target.value), { shouldBypassCaptcha: oe, filters: ae, privacyPreferences: Oe, userProperties: z } = h, { authToken: N, isLoading: _e, refreshToken: ie } = mt(), le = !!h.getAuthToken, d = !!N, {
-    onInputMessageChange: De,
-    filters: ce,
-    baseUrl: P,
-    agentUrl: $e,
-    context: ue,
-    headers: pe,
-    appId: S,
+  const [C, M] = D(""), Fe = (e) => M(e.target.value), { shouldBypassCaptcha: re, filters: ne, privacyPreferences: Ne, userProperties: B } = h, { authToken: E, isLoading: Pe, refreshToken: oe } = ut(), ae = !!h.getAuthToken, d = !!E, {
+    onInputMessageChange: Oe,
+    filters: ie,
+    baseUrl: F,
+    agentUrl: _e,
+    context: le,
+    headers: ce,
+    appId: w,
     apiKey: v,
-    files: A
-  } = g, Le = Me?.isOpen ?? Ee?.isOpen ?? Fe?.isOpen ?? !0, { getCaptchaHeader: I, invalidate: c } = pt({
-    baseUrl: P,
-    shouldBypassCaptcha: oe || !!v,
-    shouldMakeInitialRequest: Le
-  }), de = l(I);
-  de.current = I;
-  const fe = $e || `${P}/run/api/chat`, { sessionToken: H, refreshSession: q } = ft({
-    baseUrl: P,
-    appId: S,
+    files: S
+  } = g, De = ke?.isOpen ?? xe?.isOpen ?? Me?.isOpen ?? !0, { getCaptchaHeader: I, invalidate: c } = it({
+    baseUrl: F,
+    shouldBypassCaptcha: re || !!v,
+    shouldMakeInitialRequest: De
+  }), ue = l(I);
+  ue.current = I;
+  const pe = _e || `${F}/run/api/chat`, { sessionToken: U, refreshSession: z } = ct({
+    baseUrl: F,
+    appId: w,
     getCaptchaHeader: I,
     invalidateCaptcha: c,
-    optOutAllAnalytics: Oe?.optOutAllAnalytics,
-    enabled: !d && !_e
-  }), { loadConversation: me } = ht({
-    baseUrl: P,
-    appId: S,
-    authToken: v ?? (d ? N : H),
+    optOutAllAnalytics: Ne?.optOutAllAnalytics,
+    enabled: !d && !Pe
+  }), { loadConversation: de } = pt({
+    baseUrl: F,
+    appId: w,
+    authToken: v ?? (d ? E : U),
     getCaptchaHeader: I,
     invalidateCaptcha: c,
-    refreshSession: v || d ? void 0 : q
-  }), [Be, he] = C(!1), K = l(null);
-  K.current = H;
-  const W = l(null);
-  W.current = N;
-  const J = l(void 0);
-  J.current = z && Object.keys(z).length > 0 ? JSON.stringify(z) : void 0;
-  const b = l(0), ge = l(null), j = l(null), k = l(void 0), Ue = A?.map((e) => `${e.filename ?? ""}:${e.mediaType}:${e.url.length}:${e.url.slice(0, 64)}:${e.url.slice(-32)}`).join(`
+    refreshSession: v || d ? void 0 : z
+  }), [$e, fe] = D(!1), H = l(null);
+  H.current = U;
+  const q = l(null);
+  q.current = E;
+  const K = l(void 0);
+  K.current = B && Object.keys(B).length > 0 ? JSON.stringify(B) : void 0;
+  const b = l(0), me = l(null), J = l(null), A = l(void 0), Le = S?.map((e) => `${e.filename ?? ""}:${e.mediaType}:${e.url.length}:${e.url.slice(0, 64)}:${e.url.slice(-32)}`).join(`
 `) ?? "";
-  M(() => {
-    k.current = A?.length ? A : void 0;
-  }, [Ue]);
-  const ye = l(pe);
-  ye.current = pe;
-  const G = l(void 0);
-  G.current = ae || ce ? JSON.stringify({ ...ae, ...ce }) : void 0;
-  const ze = (e) => {
+  k(() => {
+    A.current = S?.length ? S : void 0;
+  }, [Le]);
+  const he = l(ce);
+  he.current = ce;
+  const j = l(void 0);
+  j.current = ne || ie ? JSON.stringify({ ...ne, ...ie }) : void 0;
+  const Be = (e) => {
     switch (e.code) {
       case 400:
         return e.message;
       case 401:
-        return le ? "Authentication failed. Please try again." : re;
+        return ae ? "Authentication failed. Please try again." : te;
       case 403:
         return `There seems to be a configuration error. Please contact ${h.organizationDisplayName ?? "Administrator"}`;
       default:
-        return re;
+        return te;
     }
-  }, [He, R] = C([]), [qe, O] = C(null), [_, Q] = C([]), Ke = xe(
-    () => new ot({
-      api: fe,
+  }, [N, W] = D([]), Ue = Te(
+    () => new tt({
+      api: pe,
       headers: () => {
-        const e = v ?? W.current ?? K.current;
+        const e = v ?? q.current ?? H.current;
         return {
           "x-inkeep-client-timezone": Intl.DateTimeFormat().resolvedOptions().timeZone,
           "x-inkeep-client-timestamp": (/* @__PURE__ */ new Date()).toISOString(),
-          ...S ? { "x-inkeep-app-id": S } : {},
+          ...w ? { "x-inkeep-app-id": w } : {},
           ...e ? { Authorization: `Bearer ${e}` } : {},
-          ...G.current ? { "inkeep-filters": G.current } : {},
-          ...J.current ? { "x-inkeep-user-properties": J.current } : {},
-          ...ye.current
+          ...j.current ? { "inkeep-filters": j.current } : {},
+          ...K.current ? { "x-inkeep-user-properties": K.current } : {},
+          ...he.current
         };
       },
       prepareSendMessagesRequest: async (e) => {
-        const i = await de.current(), t = e.messages[e.messages.length - 1];
+        const i = await ue.current(), t = e.messages[e.messages.length - 1];
         return t || console.warn("[useInkeepChat] prepareSendMessagesRequest called with empty messages array"), {
           body: {
             ...e.body,
@@ -136,25 +136,25 @@ It seems I might be having some issues right now. Please clear the chat and try
         };
       },
       body: {
-        requestContext: ue
+        requestContext: le
       }
     }),
-    [fe, ue, S, v]
+    [pe, le, w, v]
   ), {
-    messages: D,
-    sendMessage: V,
-    addToolApprovalResponse: Z,
-    status: ve,
+    messages: P,
+    sendMessage: G,
+    addToolApprovalResponse: Q,
+    status: ge,
     setMessages: m,
-    stop: $,
-    error: X
-  } = nt({
-    transport: Ke,
+    stop: O,
+    error: V
+  } = et({
+    transport: Ue,
     onData(e) {
-      E(e.type, e.data);
+      x(e.type, e.data);
     },
     async onFinish() {
-      E("completion", { conversationId: s }), await y({
+      x("completion", { conversationId: s }), await y({
         eventName: "assistant_message_received",
         properties: {
           conversationId: s
@@ -168,28 +168,28 @@ It seems I might be having some issues right now. Please clear the chat and try
     },
     onError(e) {
       console.error("onError", { code: e.code, message: e.message });
-      const i = oe || v ? null : At(e);
+      const i = re || v ? null : bt(e);
       if (i !== null && b.current < 1) {
         b.current++;
-        const t = j.current, r = ge.current;
+        const t = J.current, r = me.current;
         (async () => {
-          if (i === "session" && le) {
-            const n = await ie();
+          if (i === "session" && ae) {
+            const n = await oe();
             if (!n) throw new Error("Auth token refresh failed");
-            W.current = n;
+            q.current = n;
           } else if (i === "session") {
-            const n = await q();
-            n && (K.current = n);
+            const n = await z();
+            n && (H.current = n);
           } else
             c();
           if (t) {
-            Z(t);
+            Q(t);
             return;
           }
           r && (m((n) => {
             let o = [...n];
             return o.at(-1)?.role === "assistant" && (o = o.slice(0, -1)), o.at(-1)?.role === "user" && (o = o.slice(0, -1)), o;
-          }), V(
+          }), G(
             r.files?.length ? { parts: [{ type: "text", text: r.content }, ...r.files] } : { text: r.content },
             { body: r.body }
           ));
@@ -197,9 +197,9 @@ It seems I might be having some issues right now. Please clear the chat and try
           b.current = 0, c(), m((n) => {
             const o = [...n], f = o[o.length - 1];
             if (!f) return o;
-            const u = re;
+            const u = te;
             return f.role === "user" ? o.push({
-              id: U(16),
+              id: L(16),
               role: "assistant",
               parts: [{ type: "text", text: u }]
             }) : f.parts = [{ type: "text", text: u }], o;
@@ -216,9 +216,9 @@ It seems I might be having some issues right now. Please clear the chat and try
       }), m((t) => {
         const r = [...t], a = r[r.length - 1];
         if (a) {
-          const n = ze(e);
+          const n = Be(e);
           a.role === "user" ? r.push({
-            id: U(16),
+            id: L(16),
             role: "assistant",
             parts: [{ type: "text", text: n }]
           }) : a.parts = [{ type: "text", text: n }];
@@ -226,69 +226,69 @@ It seems I might be having some issues right now. Please clear the chat and try
         return r;
       });
     }
-  }), be = l(d);
-  M(() => {
-    const e = be.current;
-    be.current = d, e !== d && ($(), T(null), m([]), p(""), F(""), R([]), Q([]), O(null), c());
-  }, [d, $, m, p, c]);
-  const Ce = ve === "submitted", Y = ve === "streaming", We = xe(() => {
+  }), ye = l(d);
+  k(() => {
+    const e = ye.current;
+    ye.current = d, e !== d && (O(), R(null), m([]), p(""), M(""), W([]), c());
+  }, [d, O, m, p, c]);
+  const ve = ge === "submitted", Z = ge === "streaming", ze = Te(() => {
     const e = (a) => {
       if (!a || typeof a != "object") return !1;
       const n = a;
       return typeof n.type == "string" && n.type.startsWith("tool-");
-    }, t = [...D ?? []].reverse().find((a) => a.role === "assistant");
+    }, t = [...P ?? []].reverse().find((a) => a.role === "assistant");
     if (!t) return !1;
     const r = t.parts?.at(-1);
-    return !(!e(r) || r.state !== "output-available" || !r.approval?.id || Y);
-  }, [D, Y]), we = Y || We, Se = Ce || we, Je = D.length === 0, ee = !w.trim() && _.length === 0 || Se, je = dt("(max-width: 768px)"), [Ge, T] = C(null);
-  M(() => {
-    X && T(X);
-  }, [X]);
-  const Qe = () => T(null), { inputNotification: Ve, showInputNotification: Ae, clearInputNotification: Ze } = St(), Ie = l(null);
-  M(() => {
-    De?.(w);
-  }, [w]);
-  const Xe = (e) => {
-    e.key === "Enter" && !e.shiftKey && !ee && !e.nativeEvent.isComposing && (e.preventDefault(), te());
-  }, te = async (e = w) => {
-    if (ee && (!e || e.trim().length === 0) && _.length === 0) return;
-    const i = _;
-    Q([]), R([]), F(""), b.current = 0, j.current = null, await y({
+    return !(!e(r) || r.state !== "output-available" || !r.approval?.id || Z);
+  }, [P, Z]), be = Z || ze, Ce = ve || be, He = P.length === 0, X = !C.trim() && N.length === 0 || Ce, qe = lt("(max-width: 768px)"), [Ke, R] = D(null);
+  k(() => {
+    V && R(V);
+  }, [V]);
+  const Je = () => R(null), { inputNotification: je, showInputNotification: we, clearInputNotification: We } = vt(), Se = l(null);
+  k(() => {
+    Oe?.(C);
+  }, [C]);
+  const Ge = (e) => {
+    e.key === "Enter" && !e.shiftKey && !X && !e.nativeEvent.isComposing && (e.preventDefault(), Y());
+  }, Y = async (e = C) => {
+    if (X && (!e || e.trim().length === 0) && N.length === 0) return;
+    const i = N;
+    W([]), M(""), b.current = 0, J.current = null, await y({
       eventName: "user_message_submitted",
       properties: {
         conversationId: s
       }
     });
     let t = s;
-    t || (t = `conv_${U(16)}`, p(t)), Ne(t);
-    const r = k.current;
-    k.current = void 0;
+    t || (t = `conv_${L(16)}`, p(t)), Ee(t);
+    const r = A.current;
+    A.current = void 0;
     let a, n;
     if (r?.length) {
       let o;
       try {
         o = await Promise.all(
           i.map((f) => {
-            const u = Te(f);
-            return new Promise((rt, Re) => {
-              const x = new FileReader();
-              x.onload = () => {
-                if (typeof x.result != "string") {
-                  Re(new Error(`Failed to read file "${u.name}"`));
+            const u = Re(f);
+            return new Promise((Ye, Ae) => {
+              const T = new FileReader();
+              T.onload = () => {
+                if (typeof T.result != "string") {
+                  Ae(new Error(`Failed to read file "${u.name}"`));
                   return;
                 }
-                rt({
+                Ye({
                   type: "file",
-                  url: x.result,
+                  url: T.result,
                   mediaType: u.type,
                   filename: u.name
                 });
-              }, x.onerror = () => Re(new Error(`Failed to read file "${u.name}"`)), x.readAsDataURL(u);
+              }, T.onerror = () => Ae(new Error(`Failed to read file "${u.name}"`)), T.readAsDataURL(u);
             });
           })
         );
       } catch {
-        Ae({
+        we({
           title: "Failed to attach files",
           message: "Could not read one or more files. Please try again."
         });
@@ -297,107 +297,102 @@ It seems I might be having some issues right now. Please clear the chat and try
       n = [...o, ...r], a = e.trim() ? { parts: [{ type: "text", text: e }, ...n] } : { parts: n };
     } else if (i.length > 0) {
       const o = new DataTransfer();
-      for (const u of i) o.items.add(Te(u));
+      for (const u of i) o.items.add(Re(u));
       const f = o.files;
       a = e.trim() ? { text: e, files: f } : { files: f };
     } else
       a = { text: e };
-    ge.current = {
+    me.current = {
       content: e,
       body: { conversationId: t },
       files: n
-    }, V(a, {
+    }, G(a, {
       body: { conversationId: t }
     });
-  }, Ye = B(
+  }, Qe = $(
     (e) => {
-      b.current = 0, j.current = e, Z(e);
+      b.current = 0, J.current = e, Q(e);
     },
-    [Z]
-  ), se = B(() => {
-    $().then(() => {
-      E("aborted", { conversationId: s });
+    [Q]
+  ), ee = $(() => {
+    O().then(() => {
+      x("aborted", { conversationId: s });
     });
-  }, [$, s, E]), ke = () => {
-    Qe(), m([]), p(""), R([]), O(null), c(), k.current = A?.length ? A : void 0, y({
+  }, [O, s, x]), Ie = () => {
+    Je(), m([]), p(""), c(), A.current = S?.length ? S : void 0, y({
       eventName: "chat_clear_button_clicked",
       properties: {
         conversationId: s
       }
     });
-  }, L = B(
+  }, _ = $(
     (e, i) => {
-      T(null), m(i), p(e), R([]), O(null), c(), k.current = void 0;
+      R(null), m(i), p(e), c(), A.current = void 0;
     },
     [m, p, c]
-  ), et = B(
+  ), Ve = $(
     async (e, i) => {
-      se(), L(e, []), he(!0);
+      ee(), _(e, []), fe(!0);
       try {
-        const t = await me(e, i), r = t?.[t.length - 1], a = t !== null && r?.role === "user" ? [...t, {
-          id: U(16),
+        const t = await de(e, i), r = t?.[t.length - 1], a = t !== null && r?.role === "user" ? [...t, {
+          id: L(16),
           role: "assistant",
           parts: [{ type: "text", text: "This session was interrupted. Please check back in a few minutes or start a new conversation." }]
         }] : t;
-        a !== null && L(e, a);
+        a !== null && _(e, a);
       } finally {
-        i?.aborted || he(!1);
+        i?.aborted || fe(!1);
       }
     },
-    [L, me, se]
-  ), { openForm: tt } = yt(), st = vt();
-  return at(g.chatFunctionsRef, () => ({
-    submitMessage: te,
+    [_, de, ee]
+  ), { openForm: Ze } = ft(), Xe = mt();
+  return st(g.chatFunctionsRef, () => ({
+    submitMessage: Y,
     updateInputMessage(e) {
-      F(e);
+      M(e);
     },
-    clearChat: ke,
+    clearChat: Ie,
     openForm: (e) => {
-      st?.setView("chat"), tt(e, void 0);
+      Xe?.setView("chat"), Ze(e, void 0);
     },
     focusInput: () => {
-      Ie.current?.focus();
+      Se.current?.focus();
     }
   })), {
-    messages: D,
-    sendMessage: V,
-    addToolApprovalResponse: Ye,
-    isLoading: Ce,
-    isStreaming: we,
-    isBusy: Se,
-    error: Ge,
-    setError: T,
-    isSubmitDisabled: ee,
-    input: w,
-    handleInputChange: Pe,
-    handleInputKeyDown: Xe,
-    handleSubmit: te,
-    stop: se,
-    clear: ke,
-    inputRef: Ie,
-    isMobile: je,
-    // Additional state for attachments and workflow
-    messageAttachments: He,
-    setMessageAttachments: R,
-    selectedWorkflow: qe,
-    setSelectedWorkflow: O,
-    files: _,
-    setFiles: Q,
-    isNewChat: Je,
+    messages: P,
+    sendMessage: G,
+    addToolApprovalResponse: Qe,
+    isLoading: ve,
+    isStreaming: be,
+    isBusy: Ce,
+    error: Ke,
+    setError: R,
+    isSubmitDisabled: X,
+    input: C,
+    handleInputChange: Fe,
+    handleInputKeyDown: Ge,
+    handleSubmit: Y,
+    stop: ee,
+    clear: Ie,
+    inputRef: Se,
+    isMobile: qe,
+    files: N,
+    setFiles: W,
+    isNewChat: He,
     conversationId: s,
-    restoreSession: L,
-    loadAndRestoreSession: et,
-    isSessionLoading: Be,
-    authToken: d ? N : H,
-    refreshSession: d ? ie : q,
+    restoreSession: _,
+    loadAndRestoreSession: Ve,
+    isSessionLoading: $e,
+    authToken: d ? E : U,
+    refreshSession: d ? oe : z,
     getCaptchaHeader: I,
     invalidateCaptcha: c,
-    inputNotification: Ve,
-    showInputNotification: Ae,
-    clearInputNotification: Ze
+    inputNotification: je,
+    showInputNotification: we,
+    clearInputNotification: We
   };
 };
 export {
-  re as DEFAULT_ERROR_MESSAGE,
-  Wt as useInkeepChat
+  te as DEFAULT_ERROR_MESSAGE,
+  zt as useInkeepChat
 };