@brainfish-ai/components 0.26.0 → 0.27.0

package/dist/esm/components/convos.js

@@ -1,608 +1,28 @@
-import React__default, { useState, useEffect, useRef } from 'react';
-import { S as StatusBadge } from '../chunks/status-badge.eFJ1PYeb.js';
-import { ArrowSquareOut, CheckCircle, XCircle, ListMagnifyingGlass, UserCircle, Eye, UserFocus, Circle } from '@phosphor-icons/react';
-import { F as FormattedMessage } from '../chunks/FormattedMessage.CRbM-hF6.js';
-import { Spinner } from './ui/spinner.js';
-import { B as Button } from '../chunks/button.DQL6gCAt.js';
-import { useForm, Controller } from 'react-hook-form';
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './ui/select.js';
-import { Label } from './ui/label.js';
-import { Textarea } from './ui/textarea.js';
-import { Tooltip, TooltipTrigger, TooltipContent } from './ui/tooltip.js';
-import { c as cn } from '../chunks/utils.Cwtlq8dh.js';
-import { DivButton } from './ui/div-button.js';
-import { ScrollArea } from './ui/scroll-area.js';
-import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from './ui/sheet.js';
-import { Badge } from './ui/badge.js';
-import { G as GeneratingStar } from '../chunks/generating-star.DMDPNTaM.js';
-import { Item, ItemHeader, ItemTitle, ItemContent, ItemDescription } from './ui/item.js';
-import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './ui/accordion.js';
-import { c as formatDate, b as formatDistance } from '../chunks/formatDate.CWN6IFKq.js';
-import { createId } from '@paralleldrive/cuid2';
-import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './ui/table.js';
-import '../global.css';import '../convos.css';/* empty css                        */
-import '@radix-ui/react-avatar';
-import 'clsx';
-import 'tailwind-merge';
-import '@radix-ui/react-collapsible';
-import './ui/dropdown-menu.js';
-import './ui/switch.js';
-import './ui/input.js';
-import './ui/popover.js';
-import './ui/command.js';
-import './ui/dialog.js';
-import './ui/card.js';
-import './ui/progress.js';
-import '@radix-ui/react-accordion';
-import './ui/alert-dialog.js';
-import './ui/alert.js';
-import './ui/button-group.js';
-import './ui/calendar.js';
-import './ui/icon.js';
-import './ui/separator.js';
-import '../logos/microsoft-teams-logo.js';
-import '../logos/slack-logo.js';
-import '../logos/microsoft-logo.js';
-import { d as dark } from '../chunks/dark.Cq2RCgy4.js';
-
-function AnswerDiagnosticsSection({ messageId }) {
-  const { fetchAnswerDiagnostics } = useConvosContext();
-  const [answerDiagnostics, setAnswerDiagnostics] = useState(null);
-  const [isLoading, setIsLoading] = useState(true);
-  useEffect(() => {
-    void fetchAnswerDiagnostics(messageId).then((diagnostics) => setAnswerDiagnostics(diagnostics)).finally(() => setIsLoading(false));
-  }, [fetchAnswerDiagnostics, messageId]);
-  return /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-4 px-4 flex-shrink-0 bg-surface", "data-name": "discard-dialog-answer-diagnostic" }, isLoading ? /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center justify-center h-full" }, /* @__PURE__ */ React__default.createElement(Spinner, null)) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, answerDiagnostics && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("dl", { className: "grid grid-cols-[1fr_2fr] grid-rows-2 gap-5" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React__default.createElement("dt", { className: "heading-xs" }, "Confidence"), /* @__PURE__ */ React__default.createElement("dd", { className: "text-sm" }, answerDiagnostics.confidence_score)), answerDiagnostics.answer_generation_type && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React__default.createElement("dt", { className: "heading-xs" }, "Answer Type"), /* @__PURE__ */ React__default.createElement("dd", { className: "text-sm" }, answerDiagnostics.answer_generation_type)), answerDiagnostics.query_context_relevance && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React__default.createElement("dt", { className: "heading-xs" }, "Relevance"), /* @__PURE__ */ React__default.createElement("dd", { className: "text-sm" }, answerDiagnostics.query_context_relevance)), answerDiagnostics.context_sufficiency && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React__default.createElement("dt", { className: "heading-xs" }, "Context"), /* @__PURE__ */ React__default.createElement("dd", { className: "text-sm" }, answerDiagnostics.context_sufficiency))), answerDiagnostics.confidence_justification && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-2", "data-name": "diagnostic-justification" }, /* @__PURE__ */ React__default.createElement("span", { className: "heading-xs" }, "Justification"), /* @__PURE__ */ React__default.createElement("p", { className: "text-sm my-0" }, answerDiagnostics.confidence_justification)), answerDiagnostics.evidence_from_context && answerDiagnostics.evidence_from_context.length > 0 && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-2", "data-name": "diagnostic-evidence" }, /* @__PURE__ */ React__default.createElement("span", { className: "heading-xs" }, "Evidence (from Knowledge Base)"), answerDiagnostics.evidence_from_context.map((evidence, index) => /* @__PURE__ */ React__default.createElement("div", { key: index, className: "flex flex-col gap-1" }, evidence.supporting_quote && /* @__PURE__ */ React__default.createElement("p", { className: "text-sm my-0" }, evidence.supporting_quote), evidence.url && /* @__PURE__ */ React__default.createElement(Button, { variant: "link", size: "sm", className: "flex gap-1 text-sm self-end items-center", asChild: true }, /* @__PURE__ */ React__default.createElement("a", { href: evidence.url, target: "_blank", rel: "noopener noreferrer" }, /* @__PURE__ */ React__default.createElement("span", null, "Source"), /* @__PURE__ */ React__default.createElement(ArrowSquareOut, { size: 16 })))))))));
-}
-
-var DiscardReason = /* @__PURE__ */ ((DiscardReason2) => {
-  DiscardReason2["INCORRECT_ANSWER"] = "incorrect_answer";
-  DiscardReason2["HALLUCINATED_ANSWER"] = "hallucinated_answer";
-  DiscardReason2["OVERSHARING"] = "oversharing";
-  DiscardReason2["WRONG_ARTICLE_SURFACED"] = "wrong_article_surfaced";
-  DiscardReason2["OTHER"] = "other";
-  return DiscardReason2;
-})(DiscardReason || {});
-const DiscardReasonLabels = {
-  ["incorrect_answer" /* INCORRECT_ANSWER */]: "Incorrect answer",
-  ["hallucinated_answer" /* HALLUCINATED_ANSWER */]: "Hallucinated answer",
-  ["oversharing" /* OVERSHARING */]: "Oversharing",
-  ["wrong_article_surfaced" /* WRONG_ARTICLE_SURFACED */]: "Wrong article surfaced",
-  ["other" /* OTHER */]: "Other"
-};
-function DiscardForm({
-  discarded,
-  discardedMeta,
-  onSubmit,
-  onApprove,
-  selectOpenRef,
-  className
-}) {
-  const [isExpanded, setIsExpanded] = useState(discarded ?? false);
-  const [isSelectOpen, setIsSelectOpenState] = useState(false);
-  const [isDiscarded, setIsDiscarded] = useState(discarded);
-  const formRef = useRef(null);
-  useEffect(() => {
-    setIsDiscarded(discarded);
-    if (discarded) setIsExpanded(true);
-  }, [discarded]);
-  const setIsSelectOpen = (open) => {
-    setIsSelectOpenState(open);
-    if (selectOpenRef) selectOpenRef.current.isOpen = open;
-  };
-  useEffect(() => {
-    if (selectOpenRef) {
-      selectOpenRef.current.close = () => setIsSelectOpen(false);
-    }
-  }, [selectOpenRef]);
-  const {
-    control,
-    register,
-    handleSubmit,
-    reset,
-    formState: { isSubmitting }
-  } = useForm({
-    defaultValues: {
-      reason: discardedMeta?.reason,
-      preferredAnswer: discardedMeta?.suggestedAnswer || ""
-    }
-  });
-  useEffect(() => {
-    reset({
-      reason: discardedMeta?.reason,
-      preferredAnswer: discardedMeta?.suggestedAnswer || ""
-    });
-  }, [discardedMeta, reset]);
-  useEffect(() => {
-    if (formRef.current) {
-      formRef.current.inert = !isExpanded;
-    }
-  }, [isExpanded]);
-  const handleCancel = () => {
-    setIsExpanded(false);
-    setIsSelectOpen(false);
-    reset();
-  };
-  const handleApprove = async () => {
-    try {
-      await onApprove();
-      setIsDiscarded(false);
-      setIsExpanded(false);
-      setIsSelectOpen(false);
-    } catch (error) {
-      console.error("Failed to approve:", error);
-    }
-  };
-  const handleDiscard = async (data) => {
-    try {
-      await onSubmit(data);
-      setIsDiscarded(true);
-      setIsSelectOpen(false);
-    } catch (error) {
-      console.error("Failed to discard:", error);
-    }
-  };
-  const isResolved = isDiscarded !== void 0 && isDiscarded !== null;
-  const showApproveButton = !isResolved || isDiscarded === false;
-  const showDiscardButton = !isResolved || isDiscarded === true;
-  return /* @__PURE__ */ React__default.createElement("div", { className: cn("space-y-4", className) }, /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-2 px-4" }, showApproveButton && /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(
-    Button,
-    {
-      variant: "shadowSurface",
-      size: "sm",
-      className: cn("text-default !opacity-100", { "bg-green-600 text-dark-100": isDiscarded === false }),
-      disabled: isResolved,
-      onClick: handleApprove
-    },
-    /* @__PURE__ */ React__default.createElement(CheckCircle, null),
-    " ",
-    isDiscarded === false ? "Approved" : "Approve"
-  )), /* @__PURE__ */ React__default.createElement(TooltipContent, null, /* @__PURE__ */ React__default.createElement("span", null, "Approve the answer"))), showDiscardButton && /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(
-    Button,
-    {
-      variant: "shadowSurface",
-      size: "sm",
-      className: cn("text-default !opacity-100", { "bg-red-600 text-dark-100": isDiscarded === true }),
-      disabled: isResolved,
-      onClick: () => setIsExpanded(!isExpanded)
-    },
-    /* @__PURE__ */ React__default.createElement(XCircle, null),
-    isDiscarded === true ? "Discarded" : "Discard"
-  )), /* @__PURE__ */ React__default.createElement(TooltipContent, null, /* @__PURE__ */ React__default.createElement("span", null, "Discard the answer")))), /* @__PURE__ */ React__default.createElement(
-    "div",
-    {
-      className: cn(
-        "grid transition-[grid-template-rows] duration-300 ease-in-out",
-        isExpanded ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
-      )
-    },
-    isDiscarded ? /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        className: cn("overflow-hidden min-h-0 px-4 bg-dark-200 space-y-4", isExpanded ? "py-4 mb-4" : "py-0"),
-        "data-name": "discard-dialog-reason"
-      },
-      /* @__PURE__ */ React__default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React__default.createElement(Label, { htmlFor: "reason", className: "text-sm" }, "Reason"), /* @__PURE__ */ React__default.createElement("span", { className: "text-sm block" }, discardedMeta?.reason && DiscardReasonLabels[discardedMeta.reason])),
-      /* @__PURE__ */ React__default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React__default.createElement(Label, { htmlFor: "preferredAnswer", className: "text-sm" }, "Preferred answer"), /* @__PURE__ */ React__default.createElement("span", { className: "text-sm block" }, discardedMeta?.suggestedAnswer))
-    ) : /* @__PURE__ */ React__default.createElement(
-      "form",
-      {
-        ref: formRef,
-        onSubmit: handleSubmit(handleDiscard),
-        className: cn(
-          "overflow-hidden min-h-0 px-4 bg-dark-200 transition-all duration-300 ease-in-out",
-          isExpanded ? "py-4 mb-4" : "py-0"
-        )
-      },
-      /* @__PURE__ */ React__default.createElement("fieldset", { className: "space-y-4", "data-name": "discard-dialog-reason" }, /* @__PURE__ */ React__default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React__default.createElement(Label, { htmlFor: "reason", className: "heading-xs" }, "Reason"), /* @__PURE__ */ React__default.createElement(
-        Controller,
-        {
-          control,
-          name: "reason",
-          rules: { required: true },
-          render: ({ field }) => /* @__PURE__ */ React__default.createElement(
-            Select,
-            {
-              value: field.value,
-              onValueChange: field.onChange,
-              open: isSelectOpen,
-              onOpenChange: setIsSelectOpen,
-              required: true
-            },
-            /* @__PURE__ */ React__default.createElement(SelectTrigger, { className: "border-dark-300 bg-surface" }, /* @__PURE__ */ React__default.createElement(SelectValue, { placeholder: "Select a reason" })),
-            /* @__PURE__ */ React__default.createElement(SelectContent, null, Object.values(DiscardReason).map((reason) => /* @__PURE__ */ React__default.createElement(SelectItem, { key: reason, value: reason }, DiscardReasonLabels[reason])))
-          )
-        }
-      ), /* @__PURE__ */ React__default.createElement("span", { className: "text-xs text-subtle ml-1 hidden" }, "Give your ambient agent a descriptive name that reflects its purpose. This agent will learn from your content to provide personalized assistance.")), /* @__PURE__ */ React__default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React__default.createElement(Label, { htmlFor: "preferredAnswer", className: "heading-xs" }, "Preferred answer"), /* @__PURE__ */ React__default.createElement(
-        Textarea,
-        {
-          id: "preferredAnswer",
-          required: true,
-          minLength: 10,
-          placeholder: "Explain what you'd like Brainfish to do next time in this case....",
-          rows: 4,
-          className: "h-52 resize-none bg-surface",
-          ...register("preferredAnswer")
-        }
-      ), /* @__PURE__ */ React__default.createElement("span", { className: "text-xs text-subtle ml-1 hidden" }, "Tell Brainfish why this is the incorrect answer.")), /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-2 !mb-1 justify-end mr-1" }, /* @__PURE__ */ React__default.createElement(Button, { variant: "link", size: "sm", type: "button", onClick: handleCancel }, "Cancel"), /* @__PURE__ */ React__default.createElement(Button, { type: "submit", variant: "shadow", size: "sm", disabled: isSubmitting }, isSubmitting ? "Submitting..." : "Submit")))
-    )
-  ));
-}
-
-function FeedbackDialog({
-  id,
-  discarded,
-  discardedMeta,
-  open: externalOpen,
-  onOpenChange: externalOnOpenChange,
-  ...args
-}) {
-  const { onDiscard, onApprove } = useConvosContext();
-  const [internalOpen, setInternalOpen] = useState(false);
-  const selectOpenRef = useRef({ isOpen: false, close: () => {
-  } });
-  const isOpen = externalOpen ?? internalOpen;
-  const setIsOpen = externalOnOpenChange ?? setInternalOpen;
-  const onSubmitForm = async (data) => {
-    await onDiscard(id, data.reason, data.preferredAnswer).then(() => setIsOpen(false));
-  };
-  const handleApprove = async () => {
-    await onApprove(id);
-  };
-  return /* @__PURE__ */ React__default.createElement(Sheet, { modal: false, open: isOpen, onOpenChange: setIsOpen, ...args }, /* @__PURE__ */ React__default.createElement(SheetTrigger, { asChild: true, onClick: (e) => e.stopPropagation(), onKeyUp: (e) => e.stopPropagation() }, /* @__PURE__ */ React__default.createElement(DivButton, { variant: "shadowSurface", size: "sm", "aria-label": "Inspect answer information" }, /* @__PURE__ */ React__default.createElement(ListMagnifyingGlass, { className: "text-dark-600" }), " Inspect")), /* @__PURE__ */ React__default.createElement(
-    SheetContent,
-    {
-      className: "space-y-4 px-0",
-      onEscapeKeyDown: (e) => {
-        if (selectOpenRef.current.isOpen) {
-          e.preventDefault();
-          selectOpenRef.current.close();
-        }
-      },
-      onInteractOutside: (e) => {
-        if (selectOpenRef.current.isOpen) {
-          e.preventDefault();
-        }
-      }
-    },
-    /* @__PURE__ */ React__default.createElement(SheetHeader, { className: "px-4" }, /* @__PURE__ */ React__default.createElement(SheetTitle, { className: "heading-sm m-0" }, "Answer information"), /* @__PURE__ */ React__default.createElement(SheetDescription, { className: "sr-only" }, "Shows answer diagnostics and allows you to provide feedback.")),
-    /* @__PURE__ */ React__default.createElement(ScrollArea, { className: "h-[calc(100vh-4rem)] pb-4" }, /* @__PURE__ */ React__default.createElement(
-      DiscardForm,
-      {
-        discarded,
-        discardedMeta,
-        onSubmit: onSubmitForm,
-        onApprove: handleApprove,
-        selectOpenRef
-      }
-    ), /* @__PURE__ */ React__default.createElement(AnswerDiagnosticsSection, { messageId: id }))
-  ));
-}
-
-const ConfidenceBadge = ({ score }) => {
-  const formattedScore = `${score}%`;
-  if (!score || score > 100) {
-    return /* @__PURE__ */ React__default.createElement(Badge, { variant: "disabled" }, "N/A");
-  } else if (score >= 80) {
-    return /* @__PURE__ */ React__default.createElement(Badge, { variant: "success" }, formattedScore);
-  } else if (score >= 40 && score < 80) {
-    return /* @__PURE__ */ React__default.createElement(Badge, { variant: "warning" }, formattedScore);
-  } else {
-    return /* @__PURE__ */ React__default.createElement(Badge, { variant: "disabled" }, "N/A");
-  }
-};
-
-var MessageType = /* @__PURE__ */ ((MessageType2) => {
-  MessageType2["ACTION"] = "action";
-  MessageType2["FEEDBACK"] = "feedback";
-  MessageType2["QUESTION"] = "question";
-  MessageType2["ANSWER"] = "answer";
-  return MessageType2;
-})(MessageType || {});
-var Feedback = /* @__PURE__ */ ((Feedback2) => {
-  Feedback2["Positive"] = "positive";
-  Feedback2["Negative"] = "negative";
-  return Feedback2;
-})(Feedback || {});
-const isAIAnswer = (msg) => msg.type === "answer" /* ANSWER */;
-const isUserQuestion = (msg) => msg.type === "question" /* QUESTION */;
-const isFeedback = (msg) => msg.type === "feedback" /* FEEDBACK */;
-const isAction = (msg) => msg.type === "action" /* ACTION */;
-function MessageAttachmentImageThumbnails({ attachments }) {
-  return /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-2 flex-wrap" }, attachments.filter((a) => a.type === "image").map((att, i) => /* @__PURE__ */ React__default.createElement("div", { key: i, className: "relative bg-dark-300 p-1 rounded shrink-0" }, /* @__PURE__ */ React__default.createElement("a", { href: att.url, target: "_blank", rel: "noopener noreferrer" }, /* @__PURE__ */ React__default.createElement("img", { src: att.url, alt: "", className: "size-14 object-cover rounded" })), /* @__PURE__ */ React__default.createElement("div", { className: "absolute top-1.5 right-1.5 bg-dark-300 rounded-full p-0.5" }, /* @__PURE__ */ React__default.createElement(Eye, { size: 8 })))));
-}
-function Message(props) {
-  const { id, content, timestamp, locale: localeOverride, isFeedbackDialogOpen, onFeedbackDialogChange } = props;
-  const { locale: contextLocale } = useConvosContext();
-  const locale = localeOverride || contextLocale;
-  const formattedDate = formatDate(timestamp, locale);
-  if (isAIAnswer(props)) {
-    const { relatedArticles, discarded, discardedMeta, confidenceScore } = props;
-    return /* @__PURE__ */ React__default.createElement("li", { className: "relative before-line after-line list-none [&_a]:break-all" }, /* @__PURE__ */ React__default.createElement(Item, { className: "message-item" }, /* @__PURE__ */ React__default.createElement(ItemHeader, { className: "justify-start gap-0" }, /* @__PURE__ */ React__default.createElement(GeneratingStar, { variant: "gradient", className: "relative -left-[6px]" }), /* @__PURE__ */ React__default.createElement(ItemTitle, { className: "text-xs font-bold" }, `Generated answer ${discarded ? "(Discarded)" : ""}`)), /* @__PURE__ */ React__default.createElement(
-      ItemContent,
-      {
-        className: cn("message-ai-content", {
-          "py-6": !relatedArticles?.length,
-          "pt-6 pb-0": relatedArticles?.length
-        })
-      },
-      /* @__PURE__ */ React__default.createElement("div", { className: "message-content-wrapper" }, /* @__PURE__ */ React__default.createElement(FormattedMessage, { message: { content } }), /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-2 justify-between mt-2 items-center" }, /* @__PURE__ */ React__default.createElement("span", { className: "message-timestamp" }, formattedDate), /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center gap-2" }, confidenceScore && /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(DivButton, { variant: "outline", size: "sm", className: "text-xs p-1 h-auto" }, confidenceScore)), /* @__PURE__ */ React__default.createElement(TooltipContent, null, /* @__PURE__ */ React__default.createElement("p", null, "Answer score: ", confidenceScore))), /* @__PURE__ */ React__default.createElement(
-        FeedbackDialog,
-        {
-          id,
-          discarded,
-          discardedMeta,
-          open: isFeedbackDialogOpen,
-          onOpenChange: onFeedbackDialogChange
-        }
-      )))),
-      !!relatedArticles?.length && /* @__PURE__ */ React__default.createElement(Accordion, { type: "single", collapsible: true, className: "p-0 custom-dashed-border-t-dark-300 w-full" }, /* @__PURE__ */ React__default.createElement(AccordionItem, { value: "related-articles" }, /* @__PURE__ */ React__default.createElement(AccordionTrigger, { className: "px-6" }, "Related articles"), /* @__PURE__ */ React__default.createElement(AccordionContent, null, /* @__PURE__ */ React__default.createElement("ul", { className: "message-article-list" }, relatedArticles.map((article) => /* @__PURE__ */ React__default.createElement(
-        "li",
-        {
-          key: article.id,
-          className: "grid gap-2 grid-cols-[auto_1fr] items-center justify-items-start"
-        },
-        /* @__PURE__ */ React__default.createElement(ConfidenceBadge, { score: Math.round(article.score * 100) }),
-        /* @__PURE__ */ React__default.createElement(
-          Button,
-          {
-            variant: "link",
-            size: "xs",
-            asChild: true,
-            className: "flex items-center gap-2 min-w-0 !justify-start w-full"
-          },
-          /* @__PURE__ */ React__default.createElement("a", { href: article.url, target: "_blank", rel: "noopener noreferrer" }, /* @__PURE__ */ React__default.createElement("span", { className: "truncate" }, article.title), /* @__PURE__ */ React__default.createElement(ArrowSquareOut, { className: "size-4 flex-shrink-0", weight: "regular" }))
-        )
-      ))))))
-    )));
-  }
-  const feedback = isFeedback(props) ? props.feedback : null;
-  return /* @__PURE__ */ React__default.createElement("li", { className: "relative list-none before-line--user after-line--user" }, /* @__PURE__ */ React__default.createElement(Item, { className: "message-item" }, /* @__PURE__ */ React__default.createElement(ItemHeader, { className: "basis-0" }, /* @__PURE__ */ React__default.createElement(UserCircle, { weight: "fill", size: 24 })), /* @__PURE__ */ React__default.createElement(ItemContent, { className: "message-user-content" }, isUserQuestion(props) && /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-2" }, props.attachments && props.attachments.some((a) => a.type === "image") && /* @__PURE__ */ React__default.createElement(MessageAttachmentImageThumbnails, { attachments: props.attachments }), !props.onlyShowAttachments && /* @__PURE__ */ React__default.createElement(FormattedMessage, { message: { content } }), /* @__PURE__ */ React__default.createElement("span", { className: "message-timestamp" }, formattedDate)), isFeedback(props) && feedback && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: "message-header" }, /* @__PURE__ */ React__default.createElement("div", { className: "message-feedback-text" }, feedback === "positive" /* Positive */ ? "Upvoted as helpful" : "Downvoted as not helpful"), /* @__PURE__ */ React__default.createElement("div", { className: "message-meta" }, /* @__PURE__ */ React__default.createElement(StatusBadge, { variant: feedback === "positive" /* Positive */ ? "success" : "destructive" }, feedback === "positive" /* Positive */ ? "Answered" : "Unable to help"))), content && /* @__PURE__ */ React__default.createElement("div", { className: "text-base mb-1" }, content), /* @__PURE__ */ React__default.createElement("span", { className: "message-timestamp-simple" }, formattedDate)), isAction(props) && /* @__PURE__ */ React__default.createElement("div", { className: "message-header" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React__default.createElement("span", { className: "text-subtle text-sm italic" }, content), /* @__PURE__ */ React__default.createElement("span", { className: "message-timestamp-simple" }, formattedDate)), /* @__PURE__ */ React__default.createElement("div", { className: "message-meta" }, /* @__PURE__ */ React__default.createElement(StatusBadge, { variant: "warning" }, "Action"))))));
-}
-
-function sortAttributeKeys(attributes) {
-  const PRIORITY_KEYS = ["id", "name", "email", "phone"];
-  if (attributes.length === 0) {
-    return [];
-  }
-  const priority = (key) => {
-    const idx = PRIORITY_KEYS.indexOf(key);
-    return idx === -1 ? Infinity : idx;
-  };
-  return Object.keys(attributes[0]).sort((a, b) => priority(a) - priority(b));
-}
-
-function AttributesDialog({ conversationId, open, onOpenChange, ...args }) {
-  const [attributes, setAttributes] = useState();
-  const [sortedAttributesKeys, setSortedAttributesKeys] = useState();
-  const { fetchAttributes } = useConvosContext();
-  useEffect(() => {
-    void fetchAttributes(conversationId).then((attrs) => {
-      setAttributes(attrs);
-      setSortedAttributesKeys(sortAttributeKeys(attrs));
-    }).catch(() => {
-    });
-  }, [fetchAttributes, conversationId]);
-  if (!attributes?.length) {
-    return null;
-  }
-  return /* @__PURE__ */ React__default.createElement(Sheet, { modal: false, open, onOpenChange, ...args }, /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(SheetTrigger, { asChild: true, onClick: (e) => e.stopPropagation(), onKeyUp: (e) => e.stopPropagation() }, /* @__PURE__ */ React__default.createElement(
-    DivButton,
-    {
-      variant: "ghost",
-      size: "icon",
-      className: "size-7 [&_svg]:size-6 text-dark-900",
-      "aria-label": "Open Custom attributes dialog"
-    },
-    /* @__PURE__ */ React__default.createElement(UserFocus, { size: 24 })
-  ))), /* @__PURE__ */ React__default.createElement(TooltipContent, null, "Customer attributes")), /* @__PURE__ */ React__default.createElement(SheetContent, { className: "space-y-4" }, /* @__PURE__ */ React__default.createElement(SheetHeader, null, /* @__PURE__ */ React__default.createElement(SheetTitle, { className: "heading-sm m-0" }, "Custom attributes"), /* @__PURE__ */ React__default.createElement(SheetDescription, { className: "sr-only" }, "Custom attributes are used to store additional information about the conversation.")), sortedAttributesKeys && /* @__PURE__ */ React__default.createElement(ScrollArea, { className: "h-[calc(100vh-8rem)]" }, " ", /* @__PURE__ */ React__default.createElement(Table, { className: "bg-surface", "data-test-id": "attributes-table" }, /* @__PURE__ */ React__default.createElement(TableHeader, null, /* @__PURE__ */ React__default.createElement(TableRow, null, sortedAttributesKeys.map((key) => /* @__PURE__ */ React__default.createElement(TableHead, { key, className: "capitalize font-bold" }, key)))), /* @__PURE__ */ React__default.createElement(TableBody, null, attributes.map((record) => /* @__PURE__ */ React__default.createElement(TableRow, { key: record?.id ?? createId(), className: "border-none" }, sortedAttributesKeys.map((key) => /* @__PURE__ */ React__default.createElement(TableCell, { key, "data-title": key }, typeof record[key] === "boolean" ? String(record[key]) : record[key])))))))));
-}
-
-const StreamBadge = React__default.forwardRef(
-  ({ className, streamName, dotColor = "transparent", ...props }, ref) => {
-    return /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ref,
-        role: "button",
-        className: cn("flex items-center gap-1 rounded-full p-0", className),
-        tabIndex: 0
-      },
-      /* @__PURE__ */ React__default.createElement(Badge, { ...props, className: "bg-surface rounded-full border border-dark-300 text-subtle" }, /* @__PURE__ */ React__default.createElement("span", { className: "flex items-center gap-1" }, /* @__PURE__ */ React__default.createElement(
-        Circle,
-        {
-          size: 8,
-          weight: "bold",
-          className: "!size-2 rounded-full",
-          style: { backgroundColor: dotColor },
-          color: dotColor === "transparent" ? dark[300] : "transparent"
-        }
-      ), /* @__PURE__ */ React__default.createElement("span", { className: "max-w-32 truncate inline-block" }, streamName)))
-    )), /* @__PURE__ */ React__default.createElement(TooltipContent, null, streamName));
-  }
-);
-StreamBadge.displayName = "StreamBadge";
-
-const EnrichedStatusBadge = ({ score, status, statusMessage }) => {
-  return score ? /* @__PURE__ */ React__default.createElement(Tooltip, null, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(DivButton, { variant: "ghost", size: "sm", className: "p-0 h-[26px]" }, /* @__PURE__ */ React__default.createElement(StatusBadge, { variant: status, suffix: score }, statusMessage))), /* @__PURE__ */ React__default.createElement(TooltipContent, null, /* @__PURE__ */ React__default.createElement("p", null, "Conversation score: ", score))) : /* @__PURE__ */ React__default.createElement(StatusBadge, { variant: status, suffix: score }, statusMessage);
-};
-function Convo({
-  locale: localeOverride,
-  value: queryId,
-  question,
-  timestamp,
-  location,
-  source,
-  status,
-  statusMessage,
-  hasAttributes,
-  onClick,
-  className,
-  score,
-  ...props
-}) {
-  const { getMessages, isLoading: isLoadingFromContext, locale: contextLocale } = useConvosContext();
-  const [openDialog, setOpenDialog] = useState(null);
-  const [openFeedbackMessageId, setOpenFeedbackMessageId] = useState(null);
-  const handleDialogChange = (dialogType, messageId) => (isOpen) => {
-    if (isOpen) {
-      setOpenDialog(dialogType);
-      if (messageId) setOpenFeedbackMessageId(messageId);
-    } else {
-      setOpenDialog(null);
-      setOpenFeedbackMessageId(null);
-    }
-  };
-  const isAnyDialogOpen = openDialog !== null;
-  const locale = localeOverride || contextLocale;
-  const messages = getMessages(queryId);
-  const isLoading = isLoadingFromContext(queryId);
-  const formattedDateRelative = formatDistance(timestamp, locale);
-  const description = [formattedDateRelative, location].filter(Boolean).join(" • ");
-  const handleAccordionClick = (e) => {
-    if (e.target.closest('[role="dialog"]')) {
-      e.preventDefault();
-      e.stopPropagation();
-      return;
-    }
-    onClick?.();
-  };
-  return /* @__PURE__ */ React__default.createElement(
-    AccordionItem,
-    {
-      value: queryId,
-      className: cn(
-        'border border-dark-200 hover:border-dark-300 rounded-lg bg-dark-100 [&[data-state="open"]]:bg-surface [&[data-state="open"]]:border-dark-100',
-        { "shadow-md shadow-dark-300": isAnyDialogOpen },
-        className
-      ),
-      ...props
-    },
-    /* @__PURE__ */ React__default.createElement(
-      AccordionTrigger,
-      {
-        className: "flex-row-reverse px-4 gap-1 items-center [&[data-state=open]]:px-6",
-        onClick: handleAccordionClick
-      },
-      /* @__PURE__ */ React__default.createElement(Item, { size: "sm", className: "flex-1 p-0 justify-between" }, /* @__PURE__ */ React__default.createElement(ItemContent, { className: "max-w-[400px]" }, /* @__PURE__ */ React__default.createElement(ItemTitle, { className: "text-base text-default" }, question), /* @__PURE__ */ React__default.createElement(ItemDescription, { className: "text-xs text-default flex items-center gap-1" }, description, source && /* @__PURE__ */ React__default.createElement(StreamBadge, { streamName: source.name, dotColor: source.color }))), /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center gap-0" }, hasAttributes && /* @__PURE__ */ React__default.createElement(
-        AttributesDialog,
-        {
-          conversationId: queryId,
-          open: openDialog === "attributes",
-          onOpenChange: handleDialogChange("attributes")
-        }
-      ), status && /* @__PURE__ */ React__default.createElement(EnrichedStatusBadge, { score, status, statusMessage })))
-    ),
-    /* @__PURE__ */ React__default.createElement(AccordionContent, { className: "flex flex-col gap-4 text-balance px-5" }, isLoading ? /* @__PURE__ */ React__default.createElement("div", { className: "text-center text-subtle py-4" }, "Loading messages...") : /* @__PURE__ */ React__default.createElement("ul", { className: "list-none space-y-4" }, messages.map((message, idx) => {
-      const userMsg = isUserQuestion(message) ? message : null;
-      const attachments = userMsg?.attachments?.length ? userMsg.attachments : null;
-      if (idx === 0) {
-        return attachments ? /* @__PURE__ */ React__default.createElement(
-          Message,
-          {
-            key: message.id,
-            ...{ ...message, onlyShowAttachments: true },
-            isFeedbackDialogOpen: openDialog === "feedback" && openFeedbackMessageId === message.id,
-            onFeedbackDialogChange: handleDialogChange("feedback", message.id)
-          }
-        ) : null;
-      }
-      return /* @__PURE__ */ React__default.createElement(
-        Message,
-        {
-          key: message.id,
-          ...message,
-          isFeedbackDialogOpen: openDialog === "feedback" && openFeedbackMessageId === message.id,
-          onFeedbackDialogChange: handleDialogChange("feedback", message.id)
-        }
-      );
-    })))
-  );
-}
-
-const ConvosContext = React__default.createContext(void 0);
-function useConvosContext() {
-  const context = React__default.useContext(ConvosContext);
-  if (context === void 0) {
-    throw new Error("useConvosContext must be used within a ConvosProvider");
-  }
-  return context;
-}
-function ConvosProvider({ children, value }) {
-  return /* @__PURE__ */ React__default.createElement(ConvosContext.Provider, { value }, children);
-}
-function Convos({
-  convos,
-  fetchMessages,
-  fetchAttributes,
-  fetchAnswerDiagnostics,
-  onDiscard,
-  onApprove
-}) {
-  const [messagesMap, setMessagesMap] = React__default.useState({});
-  const [loadingMap, setLoadingMap] = React__default.useState({});
-  const fetchedSetRef = React__default.useRef(/* @__PURE__ */ new Set());
-  const loadingMapRef = React__default.useRef({});
-  const handleFetchMessages = React__default.useCallback(
-    (conversationId) => {
-      if (fetchedSetRef.current.has(conversationId) || loadingMapRef.current[conversationId]) {
-        return;
-      }
-      loadingMapRef.current[conversationId] = true;
-      setLoadingMap((prev) => ({ ...prev, [conversationId]: true }));
-      fetchMessages(conversationId).then((fetchedMessages) => {
-        setMessagesMap((prev) => ({ ...prev, [conversationId]: fetchedMessages }));
-        fetchedSetRef.current.add(conversationId);
-      }).catch(() => {
-      }).finally(() => {
-        delete loadingMapRef.current[conversationId];
-        setLoadingMap((prev) => {
-          const newMap = { ...prev };
-          delete newMap[conversationId];
-          return newMap;
-        });
-      });
-    },
-    [fetchMessages]
-  );
-  const defaultLocale = convos[0]?.locale;
-  const contextValue = React__default.useMemo(
-    () => ({
-      fetchMessages,
-      fetchAttributes,
-      getMessages: (conversationId) => messagesMap[conversationId] || [],
-      isLoading: (conversationId) => loadingMap[conversationId] || false,
-      handleFetchMessages,
-      locale: defaultLocale,
-      fetchAnswerDiagnostics: (messageId) => fetchAnswerDiagnostics(messageId),
-      onDiscard,
-      onApprove
-    }),
-    [
-      fetchMessages,
-      fetchAttributes,
-      messagesMap,
-      loadingMap,
-      handleFetchMessages,
-      defaultLocale,
-      fetchAnswerDiagnostics,
-      onDiscard,
-      onApprove
-    ]
-  );
-  return /* @__PURE__ */ React__default.createElement(ConvosProvider, { value: contextValue }, /* @__PURE__ */ React__default.createElement(Accordion, { type: "single", collapsible: true, className: "w-full space-y-2" }, convos.map((convo) => /* @__PURE__ */ React__default.createElement(
-    Convo,
-    {
-      ...convo,
-      key: convo.value,
-      onClick: () => handleFetchMessages(convo.value)
-    }
-  ))));
-}
-
-const EmptyConvos = ({ children }) => {
-  return /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col items-center justify-center h-full w-full mt-40 gap-2" }, /* @__PURE__ */ React__default.createElement(GeneratingStar, { className: "size-8", variant: "disabled" }), /* @__PURE__ */ React__default.createElement("div", { className: "text-subtlest text-sm w-96 text-center leading-5" }, children));
-};
-
-export { Convo, Convos, ConvosProvider, EmptyConvos, Feedback, Message, MessageAttachmentImageThumbnails, MessageType, StatusBadge, isAIAnswer, isAction, isFeedback, isUserQuestion, useConvosContext };
+import e,{useState as t,useEffect as a,useRef as s}from"react";import{S as r}from"../chunks/status-badge.BLB0pWDn.js";import{ArrowSquareOut as n,CheckCircle as l,XCircle as c,ListMagnifyingGlass as i,UserCircle as m,Eye as o,UserFocus as d,Circle as u}from"@phosphor-icons/react";import{F as p}from"../chunks/FormattedMessage.XNMN23hm.js";import{Spinner as f}from"./ui/spinner.js";import{B as E}from"../chunks/button.D_2SonNs.js";import{useForm as g,Controller as h}from"react-hook-form";import{Select as v,SelectTrigger as N,SelectValue as x,SelectContent as b,SelectItem as w}from"./ui/select.js";import{Label as y}from"./ui/label.js";import{Textarea as k}from"./ui/textarea.js";import{Tooltip as C,TooltipTrigger as j,TooltipContent as A}from"./ui/tooltip.js";import{c as _}from"../chunks/utils.C6Qu-kwd.js";import{DivButton as O}from"./ui/div-button.js";import{ScrollArea as S}from"./ui/scroll-area.js";import{Sheet as z,SheetTrigger as D,SheetContent as F,SheetHeader as R,SheetTitle as M,SheetDescription as I}from"./ui/sheet.js";import{Badge as q}from"./ui/badge.js";import{G as P}from"../chunks/generating-star.BN9p_FDu.js";import{Item as T,ItemHeader as B,ItemTitle as L,ItemContent as U,ItemDescription as G}from"./ui/item.js";import{Accordion as K,AccordionItem as W,AccordionTrigger as H,AccordionContent as V}from"./ui/accordion.js";import{c as J,b as Q}from"../chunks/formatDate.D2xEZm8f.js";import{createId as $}from"@paralleldrive/cuid2";import{Table as X,TableHeader as Y,TableRow as Z,TableHead as ee,TableBody as te,TableCell as ae}from"./ui/table.js";import '../global.css';import '../convos.css';/* empty css                       */import"@radix-ui/react-avatar";import"clsx";import"tailwind-merge";import"@radix-ui/react-collapsible";import"./ui/dropdown-menu.js";import"./ui/switch.js";import"./ui/input.js";import"./ui/popover.js";import"./ui/command.js";import"./ui/dialog.js";import"./ui/card.js";import"./ui/progress.js";import"@radix-ui/react-accordion";import"./ui/alert-dialog.js";import"./ui/alert.js";import"./ui/button-group.js";import"./ui/calendar.js";import"./ui/icon.js";import"./ui/separator.js";import"../logos/microsoft-teams-logo.js";import"../logos/slack-logo.js";import"../logos/microsoft-logo.js";import{d as se}from"../chunks/dark.DuW7JuAk.js";function re({messageId:s}){const{fetchAnswerDiagnostics:r}=ye(),[l,c]=t(null),[i,m]=t(!0);return a(()=>{r(s).then(e=>c(e)).finally(()=>m(!1))},[r,s]),/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-4 px-4 flex-shrink-0 bg-surface","data-name":"discard-dialog-answer-diagnostic"},i?/* @__PURE__ */e.createElement("div",{className:"flex items-center justify-center h-full"},/* @__PURE__ */e.createElement(f,null)):/* @__PURE__ */e.createElement(e.Fragment,null,l&&/* @__PURE__ */e.createElement(e.Fragment,null,/* @__PURE__ */e.createElement("dl",{className:"grid grid-cols-[1fr_2fr] grid-rows-2 gap-5"},/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-1"},/* @__PURE__ */e.createElement("dt",{className:"heading-xs"},"Confidence"),/* @__PURE__ */e.createElement("dd",{className:"text-sm"},l.confidence_score)),l.answer_generation_type&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-1"},/* @__PURE__ */e.createElement("dt",{className:"heading-xs"},"Answer Type"),/* @__PURE__ */e.createElement("dd",{className:"text-sm"},l.answer_generation_type)),l.query_context_relevance&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-1"},/* @__PURE__ */e.createElement("dt",{className:"heading-xs"},"Relevance"),/* @__PURE__ */e.createElement("dd",{className:"text-sm"},l.query_context_relevance)),l.context_sufficiency&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-1"},/* @__PURE__ */e.createElement("dt",{className:"heading-xs"},"Context"),/* @__PURE__ */e.createElement("dd",{className:"text-sm"},l.context_sufficiency))),l.confidence_justification&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-2","data-name":"diagnostic-justification"},/* @__PURE__ */e.createElement("span",{className:"heading-xs"},"Justification"),/* @__PURE__ */e.createElement("p",{className:"text-sm my-0"},l.confidence_justification)),l.evidence_from_context&&l.evidence_from_context.length>0&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-2","data-name":"diagnostic-evidence"},/* @__PURE__ */e.createElement("span",{className:"heading-xs"},"Evidence (from Knowledge Base)"),l.evidence_from_context.map((t,a)=>/* @__PURE__ */e.createElement("div",{key:a,className:"flex flex-col gap-1"},t.supporting_quote&&/* @__PURE__ */e.createElement("p",{className:"text-sm my-0"},t.supporting_quote),t.url&&/* @__PURE__ */e.createElement(E,{variant:"link",size:"sm",className:"flex gap-1 text-sm self-end items-center",asChild:!0},/* @__PURE__ */e.createElement("a",{href:t.url,target:"_blank",rel:"noopener noreferrer"},/* @__PURE__ */e.createElement("span",null,"Source"),/* @__PURE__ */e.createElement(n,{size:16})))))))))}var ne=/* @__PURE__ */(e=>(e.INCORRECT_ANSWER="incorrect_answer",e.HALLUCINATED_ANSWER="hallucinated_answer",e.OVERSHARING="oversharing",e.WRONG_ARTICLE_SURFACED="wrong_article_surfaced",e.OTHER="other",e))(ne||{});const le={incorrect_answer:"Incorrect answer",hallucinated_answer:"Hallucinated answer",oversharing:"Oversharing",wrong_article_surfaced:"Wrong article surfaced",other:"Other"};function ce({discarded:r,discardedMeta:n,onSubmit:i,onApprove:m,selectOpenRef:o,className:d}){const[u,p]=t(r??!1),[f,O]=t(!1),[S,z]=t(r),D=s(null);a(()=>{z(r),r&&p(!0)},[r]);const F=e=>{O(e),o&&(o.current.isOpen=e)};a(()=>{o&&(o.current.close=()=>F(!1))},[o]);const{control:R,register:M,handleSubmit:I,reset:q,formState:{isSubmitting:P}}=g({defaultValues:{reason:n?.reason,preferredAnswer:n?.suggestedAnswer||""}});a(()=>{q({reason:n?.reason,preferredAnswer:n?.suggestedAnswer||""})},[n,q]),a(()=>{D.current&&(D.current.inert=!u)},[u]);const T=null!=S,B=!T||!1===S,L=!T||!0===S;/* @__PURE__ */
+return e.createElement("div",{className:_("space-y-4",d)},/* @__PURE__ */e.createElement("div",{className:"flex gap-2 px-4"},B&&/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(E,{variant:"surface",elevation:"shadow",size:"sm",className:_("text-default !opacity-100",{"bg-green-600 text-dark-100":!1===S}),disabled:T,onClick:async()=>{try{await m(),z(!1),p(!1),F(!1)}catch(e){console.error("Failed to approve:",e)}}},
+/* @__PURE__ */e.createElement(l,null)," ",!1===S?"Approved":"Approve")),/* @__PURE__ */e.createElement(A,null,/* @__PURE__ */e.createElement("span",null,"Approve the answer"))),L&&/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(E,{variant:"surface",elevation:"shadow",size:"sm",className:_("text-default !opacity-100",{"bg-red-600 text-dark-100":!0===S}),disabled:T,onClick:()=>p(!u)},
+/* @__PURE__ */e.createElement(c,null),!0===S?"Discarded":"Discard")),/* @__PURE__ */e.createElement(A,null,/* @__PURE__ */e.createElement("span",null,"Discard the answer")))),/* @__PURE__ */e.createElement("div",{className:_("grid transition-[grid-template-rows] duration-300 ease-in-out",u?"grid-rows-[1fr]":"grid-rows-[0fr]")},S?/* @__PURE__ */e.createElement("div",{className:_("overflow-hidden min-h-0 px-4 bg-dark-200 space-y-4",u?"py-4 mb-4":"py-0"),"data-name":"discard-dialog-reason"},
+/* @__PURE__ */e.createElement("div",{className:"space-y-1"},/* @__PURE__ */e.createElement(y,{htmlFor:"reason",className:"text-sm"},"Reason"),/* @__PURE__ */e.createElement("span",{className:"text-sm block"},n?.reason&&le[n.reason])),
+/* @__PURE__ */e.createElement("div",{className:"space-y-1"},/* @__PURE__ */e.createElement(y,{htmlFor:"preferredAnswer",className:"text-sm"},"Preferred answer"),/* @__PURE__ */e.createElement("span",{className:"text-sm block"},n?.suggestedAnswer))):/* @__PURE__ */e.createElement("form",{ref:D,onSubmit:I(async e=>{try{await i(e),z(!0),F(!1)}catch(t){console.error("Failed to discard:",t)}}),className:_("overflow-hidden min-h-0 px-4 bg-dark-200 transition-all duration-300 ease-in-out",u?"py-4 mb-4":"py-0")},
+/* @__PURE__ */e.createElement("fieldset",{className:"space-y-4","data-name":"discard-dialog-reason"},/* @__PURE__ */e.createElement("div",{className:"space-y-1"},/* @__PURE__ */e.createElement(y,{htmlFor:"reason",className:"heading-xs"},"Reason"),/* @__PURE__ */e.createElement(h,{control:R,name:"reason",rules:{required:!0},render:({field:t})=>/* @__PURE__ */e.createElement(v,{value:t.value,onValueChange:t.onChange,open:f,onOpenChange:F,required:!0},
+/* @__PURE__ */e.createElement(N,{className:"border-dark-300 bg-surface"},/* @__PURE__ */e.createElement(x,{placeholder:"Select a reason"})),
+/* @__PURE__ */e.createElement(b,null,Object.values(ne).map(t=>/* @__PURE__ */e.createElement(w,{key:t,value:t},le[t]))))}),/* @__PURE__ */e.createElement("span",{className:"text-xs text-subtle ml-1 hidden"},"Give your ambient agent a descriptive name that reflects its purpose. This agent will learn from your content to provide personalized assistance.")),/* @__PURE__ */e.createElement("div",{className:"space-y-1"},/* @__PURE__ */e.createElement(y,{htmlFor:"preferredAnswer",className:"heading-xs"},"Preferred answer"),/* @__PURE__ */e.createElement(k,{id:"preferredAnswer",required:!0,minLength:10,placeholder:"Explain what you'd like Brainfish to do next time in this case....",rows:4,className:"h-52 resize-none bg-surface",...M("preferredAnswer")}),/* @__PURE__ */e.createElement("span",{className:"text-xs text-subtle ml-1 hidden"},"Tell Brainfish why this is the incorrect answer.")),/* @__PURE__ */e.createElement("div",{className:"flex gap-2 !mb-1 justify-end mr-1"},/* @__PURE__ */e.createElement(E,{variant:"link",size:"sm",type:"button",onClick:()=>{p(!1),F(!1),q()}},"Cancel"),/* @__PURE__ */e.createElement(E,{type:"submit",variant:"default",elevation:"shadow",size:"sm",disabled:P},P?"Submitting...":"Submit"))))))}function ie({id:a,discarded:r,discardedMeta:n,open:l,onOpenChange:c,...m}){const{onDiscard:o,onApprove:d}=ye(),[u,p]=t(!1),f=s({isOpen:!1,close:()=>{}}),E=l??u,g=c??p;/* @__PURE__ */
+return e.createElement(z,{modal:!1,open:E,onOpenChange:g,...m},/* @__PURE__ */e.createElement(D,{asChild:!0,onClick:e=>e.stopPropagation(),onKeyUp:e=>e.stopPropagation()},/* @__PURE__ */e.createElement(O,{variant:"shadowSurface",size:"sm","aria-label":"Inspect answer information"},/* @__PURE__ */e.createElement(i,{className:"text-dark-600"})," Inspect")),/* @__PURE__ */e.createElement(F,{className:"space-y-4 px-0",onEscapeKeyDown:e=>{f.current.isOpen&&(e.preventDefault(),f.current.close())},onInteractOutside:e=>{f.current.isOpen&&e.preventDefault()}},
+/* @__PURE__ */e.createElement(R,{className:"px-4"},/* @__PURE__ */e.createElement(M,{className:"heading-sm m-0"},"Answer information"),/* @__PURE__ */e.createElement(I,{className:"sr-only"},"Shows answer diagnostics and allows you to provide feedback.")),
+/* @__PURE__ */e.createElement(S,{className:"h-[calc(100vh-4rem)] pb-4"},/* @__PURE__ */e.createElement(ce,{discarded:r,discardedMeta:n,onSubmit:async e=>{await o(a,e.reason,e.preferredAnswer).then(()=>g(!1))},onApprove:async()=>{await d(a)},selectOpenRef:f}),/* @__PURE__ */e.createElement(re,{messageId:a}))))}const me=({score:t})=>{const a=`${t}%`;return!t||t>100?/* @__PURE__ */e.createElement(q,{variant:"disabled"},"N/A"):t>=80?/* @__PURE__ */e.createElement(q,{variant:"success"},a):t>=40&&t<80?/* @__PURE__ */e.createElement(q,{variant:"warning"},a):/* @__PURE__ */e.createElement(q,{variant:"disabled"},"N/A")};var oe=/* @__PURE__ */(e=>(e.ACTION="action",e.FEEDBACK="feedback",e.QUESTION="question",e.ANSWER="answer",e))(oe||{}),de=/* @__PURE__ */(e=>(e.Positive="positive",e.Negative="negative",e))(de||{});const ue=e=>"answer"===e.type,pe=e=>"question"===e.type,fe=e=>"feedback"===e.type,Ee=e=>"action"===e.type;function ge({attachments:t}){/* @__PURE__ */
+return e.createElement("div",{className:"flex gap-2 flex-wrap"},t.filter(e=>"image"===e.type).map((t,a)=>/* @__PURE__ */e.createElement("div",{key:a,className:"relative bg-dark-300 p-1 rounded shrink-0"},/* @__PURE__ */e.createElement("a",{href:t.url,target:"_blank",rel:"noopener noreferrer"},/* @__PURE__ */e.createElement("img",{src:t.url,alt:"",className:"size-14 object-cover rounded"})),/* @__PURE__ */e.createElement("div",{className:"absolute top-1.5 right-1.5 bg-dark-300 rounded-full p-0.5"},/* @__PURE__ */e.createElement(o,{size:8})))))}function he(t){const{id:a,content:s,timestamp:l,locale:c,isFeedbackDialogOpen:i,onFeedbackDialogChange:o}=t,{locale:d}=ye(),u=J(l,c||d);if(ue(t)){const{relatedArticles:r,discarded:l,discardedMeta:c,confidenceScore:m}=t;/* @__PURE__ */
+return e.createElement("li",{className:"relative before-line after-line list-none [&_a]:break-all"},/* @__PURE__ */e.createElement(T,{className:"message-item"},/* @__PURE__ */e.createElement(B,{className:"justify-start gap-0"},/* @__PURE__ */e.createElement(P,{variant:"gradient",className:"relative -left-[6px]"}),/* @__PURE__ */e.createElement(L,{className:"text-xs font-bold"},"Generated answer "+(l?"(Discarded)":""))),/* @__PURE__ */e.createElement(U,{className:_("message-ai-content",{"py-6":!r?.length,"pt-6 pb-0":r?.length})},
+/* @__PURE__ */e.createElement("div",{className:"message-content-wrapper"},/* @__PURE__ */e.createElement(p,{message:{content:s}}),/* @__PURE__ */e.createElement("div",{className:"flex gap-2 justify-between mt-2 items-center"},/* @__PURE__ */e.createElement("span",{className:"message-timestamp"},u),/* @__PURE__ */e.createElement("div",{className:"flex items-center gap-2"},m&&/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(O,{variant:"outline",size:"sm",className:"text-xs p-1 h-auto"},m)),/* @__PURE__ */e.createElement(A,null,/* @__PURE__ */e.createElement("p",null,"Answer score: ",m))),/* @__PURE__ */e.createElement(ie,{id:a,discarded:l,discardedMeta:c,open:i,onOpenChange:o})))),!!r?.length&&/* @__PURE__ */e.createElement(K,{type:"single",collapsible:!0,className:"p-0 custom-dashed-border-t-dark-300 w-full"},/* @__PURE__ */e.createElement(W,{value:"related-articles"},/* @__PURE__ */e.createElement(H,{className:"px-6"},"Related articles"),/* @__PURE__ */e.createElement(V,null,/* @__PURE__ */e.createElement("ul",{className:"message-article-list"},r.map(t=>/* @__PURE__ */e.createElement("li",{key:t.id,className:"grid gap-2 grid-cols-[auto_1fr] items-center justify-items-start"},
+/* @__PURE__ */e.createElement(me,{score:Math.round(100*t.score)}),
+/* @__PURE__ */e.createElement(E,{variant:"link",size:"xs",asChild:!0,className:"flex items-center gap-2 min-w-0 !justify-start w-full"},
+/* @__PURE__ */e.createElement("a",{href:t.url,target:"_blank",rel:"noopener noreferrer"},/* @__PURE__ */e.createElement("span",{className:"truncate"},t.title),/* @__PURE__ */e.createElement(n,{className:"size-4 flex-shrink-0",weight:"regular"}))))))))))))}const f=fe(t)?t.feedback:null;/* @__PURE__ */
+return e.createElement("li",{className:"relative list-none before-line--user after-line--user"},/* @__PURE__ */e.createElement(T,{className:"message-item"},/* @__PURE__ */e.createElement(B,{className:"basis-0"},/* @__PURE__ */e.createElement(m,{weight:"fill",size:24})),/* @__PURE__ */e.createElement(U,{className:"message-user-content"},pe(t)&&/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-2"},t.attachments&&t.attachments.some(e=>"image"===e.type)&&/* @__PURE__ */e.createElement(ge,{attachments:t.attachments}),!t.onlyShowAttachments&&/* @__PURE__ */e.createElement(p,{message:{content:s}}),/* @__PURE__ */e.createElement("span",{className:"message-timestamp"},u)),fe(t)&&f&&/* @__PURE__ */e.createElement(e.Fragment,null,/* @__PURE__ */e.createElement("div",{className:"message-header"},/* @__PURE__ */e.createElement("div",{className:"message-feedback-text"},"positive"===f?"Upvoted as helpful":"Downvoted as not helpful"),/* @__PURE__ */e.createElement("div",{className:"message-meta"},/* @__PURE__ */e.createElement(r,{variant:"positive"===f?"success":"destructive"},"positive"===f?"Answered":"Unable to help"))),s&&/* @__PURE__ */e.createElement("div",{className:"text-base mb-1"},s),/* @__PURE__ */e.createElement("span",{className:"message-timestamp-simple"},u)),Ee(t)&&/* @__PURE__ */e.createElement("div",{className:"message-header"},/* @__PURE__ */e.createElement("div",{className:"flex flex-col gap-2"},/* @__PURE__ */e.createElement("span",{className:"text-subtle text-sm italic"},s),/* @__PURE__ */e.createElement("span",{className:"message-timestamp-simple"},u)),/* @__PURE__ */e.createElement("div",{className:"message-meta"},/* @__PURE__ */e.createElement(r,{variant:"warning"},"Action"))))))}function ve({conversationId:s,open:r,onOpenChange:n,...l}){const[c,i]=t(),[m,o]=t(),{fetchAttributes:u}=ye();return a(()=>{u(s).then(e=>{i(e),o(function(e){const t=["id","name","email","phone"];if(0===e.length)return[];const a=e=>{const a=t.indexOf(e);return-1===a?1/0:a};return Object.keys(e[0]).sort((e,t)=>a(e)-a(t))}(e))}).catch(()=>{})},[u,s]),c?.length?/* @__PURE__ */e.createElement(z,{modal:!1,open:r,onOpenChange:n,...l},/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(D,{asChild:!0,onClick:e=>e.stopPropagation(),onKeyUp:e=>e.stopPropagation()},/* @__PURE__ */e.createElement(O,{variant:"ghost",size:"icon",className:"size-7 [&_svg]:size-6 text-dark-900","aria-label":"Open Custom attributes dialog"},
+/* @__PURE__ */e.createElement(d,{size:24})))),/* @__PURE__ */e.createElement(A,null,"Customer attributes")),/* @__PURE__ */e.createElement(F,{className:"space-y-4"},/* @__PURE__ */e.createElement(R,null,/* @__PURE__ */e.createElement(M,{className:"heading-sm m-0"},"Custom attributes"),/* @__PURE__ */e.createElement(I,{className:"sr-only"},"Custom attributes are used to store additional information about the conversation.")),m&&/* @__PURE__ */e.createElement(S,{className:"h-[calc(100vh-8rem)]"}," ",/* @__PURE__ */e.createElement(X,{className:"bg-surface","data-test-id":"attributes-table"},/* @__PURE__ */e.createElement(Y,null,/* @__PURE__ */e.createElement(Z,null,m.map(t=>/* @__PURE__ */e.createElement(ee,{key:t,className:"capitalize font-bold"},t)))),/* @__PURE__ */e.createElement(te,null,c.map(t=>/* @__PURE__ */e.createElement(Z,{key:t?.id??$(),className:"border-none"},m.map(a=>/* @__PURE__ */e.createElement(ae,{key:a,"data-title":a},"boolean"==typeof t[a]?String(t[a]):t[a]))))))))):null}const Ne=e.forwardRef(({className:t,streamName:a,dotColor:s="transparent",...r},n)=>/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement("div",{ref:n,role:"button",className:_("flex items-center gap-1 rounded-full p-0",t),tabIndex:0},
+/* @__PURE__ */e.createElement(q,{...r,className:"bg-surface rounded-full border border-dark-300 text-subtle"},/* @__PURE__ */e.createElement("span",{className:"flex items-center gap-1"},/* @__PURE__ */e.createElement(u,{size:8,weight:"bold",className:"!size-2 rounded-full",style:{backgroundColor:s},color:"transparent"===s?se[300]:"transparent"}),/* @__PURE__ */e.createElement("span",{className:"max-w-32 truncate inline-block"},a))))),/* @__PURE__ */e.createElement(A,null,a)));Ne.displayName="StreamBadge";const xe=({score:t,status:a,statusMessage:s})=>t?/* @__PURE__ */e.createElement(C,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(O,{variant:"ghost",size:"sm",className:"p-0 h-[26px]"},/* @__PURE__ */e.createElement(r,{variant:a,suffix:t},s))),/* @__PURE__ */e.createElement(A,null,/* @__PURE__ */e.createElement("p",null,"Conversation score: ",t))):/* @__PURE__ */e.createElement(r,{variant:a,suffix:t},s);function be({locale:a,value:s,question:r,timestamp:n,location:l,source:c,status:i,statusMessage:m,hasAttributes:o,onClick:d,className:u,score:p,...f}){const{getMessages:E,isLoading:g,locale:h}=ye(),[v,N]=t(null),[x,b]=t(null),w=(e,t)=>a=>{a?(N(e),t&&b(t)):(N(null),b(null))},y=null!==v,k=a||h,C=E(s),j=g(s),A=[Q(n,k),l].filter(Boolean).join(" • ");/* @__PURE__ */
+return e.createElement(W,{value:s,className:_('border border-dark-200 hover:border-dark-300 rounded-lg bg-dark-100 [&[data-state="open"]]:bg-surface [&[data-state="open"]]:border-dark-100',{"shadow-md shadow-dark-300":y},u),...f},
+/* @__PURE__ */e.createElement(H,{className:"flex-row-reverse px-4 gap-1 items-center [&[data-state=open]]:px-6",onClick:e=>{if(e.target.closest('[role="dialog"]'))return e.preventDefault(),void e.stopPropagation();d?.()}},
+/* @__PURE__ */e.createElement(T,{size:"sm",className:"flex-1 p-0 justify-between"},/* @__PURE__ */e.createElement(U,{className:"max-w-[400px]"},/* @__PURE__ */e.createElement(L,{className:"text-base text-default"},r),/* @__PURE__ */e.createElement(G,{className:"text-xs text-default flex items-center gap-1"},A,c&&/* @__PURE__ */e.createElement(Ne,{streamName:c.name,dotColor:c.color}))),/* @__PURE__ */e.createElement("div",{className:"flex items-center gap-0"},o&&/* @__PURE__ */e.createElement(ve,{conversationId:s,open:"attributes"===v,onOpenChange:w("attributes")}),i&&/* @__PURE__ */e.createElement(xe,{score:p,status:i,statusMessage:m})))),
+/* @__PURE__ */e.createElement(V,{className:"flex flex-col gap-4 text-balance px-5"},j?/* @__PURE__ */e.createElement("div",{className:"text-center text-subtle py-4"},"Loading messages..."):/* @__PURE__ */e.createElement("ul",{className:"list-none space-y-4"},C.map((t,a)=>{const s=pe(t)?t:null,r=s?.attachments?.length?s.attachments:null;return 0===a?r?/* @__PURE__ */e.createElement(he,{key:t.id,...{...t,onlyShowAttachments:!0},isFeedbackDialogOpen:"feedback"===v&&x===t.id,onFeedbackDialogChange:w("feedback",t.id)}):null:/* @__PURE__ */e.createElement(he,{key:t.id,...t,isFeedbackDialogOpen:"feedback"===v&&x===t.id,onFeedbackDialogChange:w("feedback",t.id)})}))))}const we=e.createContext(void 0);function ye(){const t=e.useContext(we);if(void 0===t)throw new Error("useConvosContext must be used within a ConvosProvider");return t}function ke({children:t,value:a}){/* @__PURE__ */
+return e.createElement(we.Provider,{value:a},t)}function Ce({convos:t,fetchMessages:a,fetchAttributes:s,fetchAnswerDiagnostics:r,onDiscard:n,onApprove:l}){const[c,i]=e.useState({}),[m,o]=e.useState({}),d=e.useRef(/* @__PURE__ */new Set),u=e.useRef({}),p=e.useCallback(e=>{d.current.has(e)||u.current[e]||(u.current[e]=!0,o(t=>({...t,[e]:!0})),a(e).then(t=>{i(a=>({...a,[e]:t})),d.current.add(e)}).catch(()=>{}).finally(()=>{delete u.current[e],o(t=>{const a={...t};return delete a[e],a})}))},[a]),f=t[0]?.locale,E=e.useMemo(()=>({fetchMessages:a,fetchAttributes:s,getMessages:e=>c[e]||[],isLoading:e=>m[e]||!1,handleFetchMessages:p,locale:f,fetchAnswerDiagnostics:e=>r(e),onDiscard:n,onApprove:l}),[a,s,c,m,p,f,r,n,l]);/* @__PURE__ */
+return e.createElement(ke,{value:E},/* @__PURE__ */e.createElement(K,{type:"single",collapsible:!0,className:"w-full space-y-2"},t.map(t=>/* @__PURE__ */e.createElement(be,{...t,key:t.value,onClick:()=>p(t.value)}))))}const je=({children:t})=>/* @__PURE__ */e.createElement("div",{className:"flex flex-col items-center justify-center h-full w-full mt-40 gap-2"},/* @__PURE__ */e.createElement(P,{className:"size-8",variant:"disabled"}),/* @__PURE__ */e.createElement("div",{className:"text-subtlest text-sm w-96 text-center leading-5"},t));export{be as Convo,Ce as Convos,ke as ConvosProvider,je as EmptyConvos,de as Feedback,he as Message,ge as MessageAttachmentImageThumbnails,oe as MessageType,r as StatusBadge,ue as isAIAnswer,Ee as isAction,fe as isFeedback,pe as isUserQuestion,ye as useConvosContext};
 //# sourceMappingURL=convos.js.map