@envive-ai/react-widgets-v3 0.3.9 → 0.3.11

package/dist/debug/reportIssue.cjs

@@ -0,0 +1,528 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_index = require('../node_modules/@spiffy-ai/commerce-api-client/dist/index.cjs');
+const require_IconCloseVariant = require('../packages/icons/dist/IconCloseVariant.cjs');
+const require_GenericSelect = require('./GenericSelect.cjs');
+const require_chatEmbed = require('./chatEmbed.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let jotai = require("jotai");
+let __envive_ai_react_hooks_atoms_chat = require("@envive-ai/react-hooks/atoms/chat");
+let __envive_ai_react_hooks_application_models = require("@envive-ai/react-hooks/application/models");
+let __envive_ai_react_hooks_atoms_app = require("@envive-ai/react-hooks/atoms/app");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let __envive_ai_react_hooks_application_commerce_api = require("@envive-ai/react-hooks/application/commerce-api");
+__envive_ai_react_hooks_application_commerce_api = require_rolldown_runtime.__toESM(__envive_ai_react_hooks_application_commerce_api);
+let __envive_ai_react_hooks_atoms_envive_enviveConfig = require("@envive-ai/react-hooks/atoms/envive/enviveConfig");
+let __envive_ai_react_hooks_application_utils = require("@envive-ai/react-hooks/application/utils");
+
+//#region src/debug/reportIssue.tsx
+var import_dist = require_index.default;
+const messageContent = (m) => {
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Text) return m.metadata.content;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Product) return `PRODUCT ID: ${m.metadata?.id}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Review) return `REVIEW: by ${m.metadata?.reviewer}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Page) return `PAGE: ${m.metadata?.url}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Separator) return `SEPARATOR`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.QueryTyped) return `QUERY TYPED: ${m.metadata?.content}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.SuggestionClicked) return `SUGGESTION CLICKED`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Search) return `SEARCH: ${m.metadata?.searchTerm}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.ProductSearch) return `PRODUCT SEARCH: ${m.metadata?.generatedQuery} (${m.metadata?.productCount} products)`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.ProductSearchFilter) return `PRODUCT SEARCH FILTER: ${m.metadata?.filterName}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Form) return `FORM: ${m.metadata?.formType}`;
+	if (m.type === __envive_ai_react_hooks_application_models.MessageType.Order) return `ORDER: ${m.metadata?.orderId}`;
+	throw new Error(`Unsupported message type: ${m.type}`);
+};
+const ReportHeader = ({ onClose }) => {
+	const userId = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_app.userIdAtom);
+	const handleCopyClick = (0, react.useCallback)(async () => {
+		try {
+			await navigator.clipboard.writeText(userId);
+		} catch (err) {
+			console.error("Failed to copy to clipboard:", err);
+		}
+	}, [userId]);
+	const headerTitleClassnames = (0, classnames.default)({
+		"envive-tw-text-[24px]": true,
+		"md:envive-tw-text-[30px]": true,
+		"envive-tw-mb-[12px]": true,
+		"envive-tw-color-[#161844]": true,
+		"envive-tw-leading-[1.33]": true,
+		"md:envive-tw-leading-[1.2]": true,
+		"envive-tw-font-bold": true
+	});
+	const headerLinkClassnames = (0, classnames.default)({
+		"envive-tw-underline": true,
+		"envive-tw-text-[#3C57AA]": true,
+		"hover:envive-tw-text-[#3C57AA]": true
+	});
+	const headerDescriptionClassnames = (0, classnames.default)({
+		"envive-tw-text-[16px]": true,
+		"envive-tw-text-normal": true,
+		"envive-tw-font-medium": true,
+		"envive-tw-max-w-[70ch]": true,
+		"envive-tw-text-[#161844]": true
+	});
+	const userIdClassnames = (0, classnames.default)({
+		"envive-tw-text-xs": true,
+		"envive-tw-text-gray-500": true,
+		"envive-tw-font-semibold": true
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "envive-tw-pb-0 envive-tw-mb-[24px] envive-tw-flex envive-tw-w-full envive-tw-flex-row envive-tw-items-start envive-tw-justify-between envive-tw-gap-3 envive-tw-px-[24px] envive-tw-pt-[24px]",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "envive-tw-flex envive-tw-w-full envive-tw-flex-col envive-tw-items-stretch envive-tw-gap-3",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-row envive-tw-items-start envive-tw-justify-between envive-tw-gap-3",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "envive-tw-max-w-[100%]",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+						className: headerTitleClassnames,
+						children: "Give us feedback on this message"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+						className: headerDescriptionClassnames,
+						children: [
+							"For UI bugs and Feature Ideas, please use",
+							" ",
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+								href: "https://spiffy-ai.notion.site/19fe47c0828780b1a6cfd0ac4373cebe",
+								target: "_blank",
+								rel: "noopener noreferrer",
+								className: headerLinkClassnames,
+								children: "this form"
+							}),
+							"."
+						]
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "envive-tw-flex envive-tw-flex-col envive-tw-items-end envive-tw-gap-3",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "envive-tw-flex envive-tw-flex-row envive-tw-items-center envive-tw-gap-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+							className: userIdClassnames,
+							children: [
+								"User Id: ",
+								userId.slice(0, 4),
+								"..."
+							]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							onClick: handleCopyClick,
+							"aria-label": "Copy chat ID",
+							className: "envive-tw-rounded-base envive-tw-border envive-tw-border-gray-300 envive-tw-px-2 envive-tw-py-0.5 envive-tw-text-xs envive-tw-font-bold hover:envive-tw-bg-gray-50",
+							children: "Copy"
+						})]
+					})
+				})]
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "envive-tw-p-0 envive-tw-h-[16px] envive-tw-w-[16px]",
+			onClick: onClose,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_IconCloseVariant.IconCloseVariant_default, {})
+		})]
+	});
+};
+const ReportFormFields = ({ priority, setPriority, reportedBy, onReportedByChanging, reason, onDescriptionChanging, turnInfo, setTurnInfo, lastMessagesText, lastSuggestionsText }) => {
+	const requiredFieldClassnames = (0, classnames.default)({
+		"envive-tw-text-[#008000]": true,
+		"envive-tw-text-xs": true,
+		"envive-tw-font-normal": true,
+		"envive-tw-italic": true
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+		onSubmit: (e) => {
+			e.preventDefault();
+		},
+		className: "envive-tw-pt-0 envive-tw-flex envive-tw-flex-col envive-tw-gap-[24px] envive-tw-px-[24px] envive-tw-pb-[8px]",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-2",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "envive-tw-flex envive-tw-flex-row envive-tw-items-center envive-tw-gap-3",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						id: "priority-label",
+						className: "envive-tw-mb-0 envive-tw-flex envive-tw-shrink-0 envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+						children: "Priority"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_GenericSelect.GenericSelect, {
+						type: "priority",
+						selectedKey: priority,
+						onSelect: (key) => {
+							setPriority(key);
+						},
+						"aria-labelledby": "priority-label"
+					})]
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					id: "email-label",
+					className: "envive-tw-flex envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+					children: ["Your Email", /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: requiredFieldClassnames,
+						children: "* Required so we can follow up with you"
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					className: "envive-tw-rounded-md envive-tw-w-full envive-tw-border envive-tw-border-gray-300 envive-tw-px-3 envive-tw-py-2 envive-tw-text-sm",
+					placeholder: "Email address",
+					value: reportedBy,
+					type: "email",
+					onChange: onReportedByChanging,
+					"aria-labelledby": "email-label"
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-[0]",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					id: "chat-history-label",
+					className: "envive-tw-flex envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+					children: "Chat History"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "envive-tw-rounded-md envive-tw-h-[250px] envive-tw-w-full envive-tw-overflow-auto envive-tw-border envive-tw-border-[#D9D9D9] envive-tw-p-2",
+					"aria-labelledby": "chat-history-label",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_chatEmbed.default, {})
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					id: "description-label",
+					className: "envive-tw-flex envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+					children: ["What is the problem with this message?", /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: requiredFieldClassnames,
+						children: "* Required to train the model and generate the correct message"
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+					className: "envive-tw-rounded-md envive-tw-w-full envive-tw-border envive-tw-border-gray-300 envive-tw-px-3 envive-tw-py-2 envive-tw-text-sm",
+					placeholder: "Please describe the issue",
+					value: reason,
+					onChange: onDescriptionChanging,
+					"aria-labelledby": "description-label"
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					id: "message-correction-label",
+					className: "envive-tw-flex envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+					children: ["What should the message have said?", /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "envive-tw-text-xs envive-tw-font-normal envive-tw-italic envive-tw-text-gray-500",
+						children: "Creating an alternative message will ensure the AI sounds the way you want."
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+					className: "envive-tw-rounded-md envive-tw-w-full envive-tw-border envive-tw-border-gray-300 envive-tw-px-3 envive-tw-py-2 envive-tw-text-sm",
+					placeholder: "Alternative phrasing of the message",
+					value: turnInfo.message_correction ?? lastMessagesText,
+					onChange: (e) => setTurnInfo(e, "message_correction"),
+					rows: 10,
+					"aria-labelledby": "message-correction-label"
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "envive-tw-flex envive-tw-flex-col envive-tw-gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					id: "suggested-responses-label",
+					className: "envive-tw-flex envive-tw-items-center envive-tw-gap-2 envive-tw-text-[12px] envive-tw-font-bold envive-tw-text-[#161844]",
+					children: "What should the suggested responses for the user be?"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+					className: "envive-tw-rounded-md envive-tw-w-full envive-tw-border envive-tw-border-gray-300 envive-tw-px-3 envive-tw-py-2 envive-tw-text-sm",
+					placeholder: "Alternative suggested responses",
+					value: turnInfo.suggestions_correction ?? lastSuggestionsText,
+					onChange: (e) => setTurnInfo(e, "suggestions_correction"),
+					rows: 6,
+					"aria-labelledby": "suggested-responses-label"
+				})]
+			})
+		]
+	});
+};
+const ReportFooter = ({ isReporting, errorMessage, reportedByIsInvalid, isReasonInvalid, onReportSession, onClose }) => {
+	const sendFeedbackButtonClassnames = (0, classnames.default)({
+		"envive-tw-flex": true,
+		"envive-tw-w-full": true,
+		"sm:envive-tw-w-[180px]": true,
+		"envive-tw-h-10": true,
+		"envive-tw-py-2.5": true,
+		"envive-tw-px-6": true,
+		"envive-tw-justify-center": true,
+		"envive-tw-items-center": true,
+		"envive-tw-gap-2": true,
+		"envive-tw-rounded-full": true,
+		"envive-tw-border": true,
+		"envive-tw-border-[#3C57AA]": true,
+		"envive-tw-bg-[#3C57AA]": true,
+		"envive-tw-text-white": true,
+		"hover:envive-tw-bg-[#2B4A8A]": true,
+		"disabled:envive-tw-opacity-50": true,
+		"disabled:envive-tw-cursor-not-allowed": true
+	});
+	const cancelButtonClassnames = (0, classnames.default)({
+		"envive-tw-flex": true,
+		"envive-tw-w-full": true,
+		"sm:envive-tw-w-[171px]": true,
+		"envive-tw-h-10": true,
+		"envive-tw-py-2.5": true,
+		"envive-tw-px-6": true,
+		"envive-tw-justify-center": true,
+		"envive-tw-items-center": true,
+		"envive-tw-gap-2": true,
+		"envive-tw-rounded-full": true,
+		"envive-tw-border": true,
+		"envive-tw-border-[#3C57AA]": true,
+		"envive-tw-text-[#3C57AA]": true,
+		"envive-tw-text-center": true,
+		"envive-tw-text-base": true,
+		"envive-tw-font-medium": true,
+		"envive-tw-bg-[#EDF2F7]": true,
+		"hover:envive-tw-bg-[#F5F5F5]": true,
+		"disabled:envive-tw-opacity-50": true,
+		"disabled:envive-tw-cursor-not-allowed": true
+	});
+	const buttonFooterClassnames = (0, classnames.default)({
+		"envive-tw-flex": true,
+		"envive-tw-items-start": true,
+		"envive-tw-gap-6": true,
+		"envive-tw-justify-start": true,
+		"envive-tw-p-0": true,
+		"envive-tw-shadow-none": true,
+		"envive-tw-flex-0": true,
+		"envive-tw-flex-auto": true,
+		"envive-tw-flex-col": true,
+		"sm:envive-tw-flex-row": true,
+		"envive-tw-w-full": true,
+		"envive-tw-bottom-0": true,
+		"envive-tw-z-[1]": true
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, classnames.default)({
+			"envive-tw-bg-[#FFFFFF70]": true,
+			"envive-tw-py-[24px]": true,
+			"envive-tw-sticky": true,
+			"envive-tw-bottom-0": true,
+			"envive-tw-w-full": true,
+			"envive-tw-px-[24px]": true,
+			"envive-tw-border-t": true,
+			"envive-tw-border-[#EBEBEB]": true
+		}),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: buttonFooterClassnames,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					disabled: isReporting || reportedByIsInvalid || isReasonInvalid,
+					onClick: onReportSession,
+					className: sendFeedbackButtonClassnames,
+					children: isReporting ? "Sending..." : "Send Feedback"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					disabled: isReporting,
+					onClick: onClose,
+					className: cancelButtonClassnames,
+					children: "Cancel"
+				}),
+				errorMessage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "envive-tw-text-xs envive-tw-font-normal envive-tw-italic envive-tw-text-red-500",
+					children: errorMessage
+				})
+			]
+		})
+	});
+};
+const Drawer = ({ isOpen, onClose, children, width = "md:envive-tw-w-[80%] lg:envive-tw-w-[67%]" }) => {
+	if (!isOpen) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "envive-tw-fixed envive-tw-right-[0] envive-tw-top-[0] envive-tw-z-[9999] envive-tw-flex envive-tw-w-full envive-tw-flex-row envive-tw-justify-end",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "envive-tw-bg envive-tw-flex-grow envive-tw-bg-black/40",
+			onClick: onClose
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: `envive-tw-w-full ${width} envive-tw-h-screen`,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "envive-tw-min-h-0 envive-tw-px-0 envive-tw-relative envive-tw-flex envive-tw-h-screen envive-tw-w-full envive-tw-flex-col envive-tw-border envive-tw-border-solid envive-tw-border-[#0000ff] envive-tw-bg-white",
+				children
+			})
+		})]
+	});
+};
+const ReportIssue = () => {
+	const { messages, suggestions, userEvents } = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_chat.chatAtom);
+	const lastMessages = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_chat.lastAssistantMessageAtom);
+	const [lastMessagesText, setLastMessagesText] = (0, react.useState)("");
+	const [lastSuggestionsText, setLastSuggestionsText] = (0, react.useState)("");
+	const [lastSuggestions, setLastSuggestions] = (0, react.useState)([]);
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [turnInfo, setTurnInfo] = (0, react.useState)({});
+	const reportType = import_dist.ReportSessionRequestReportTypeEnum.Turn;
+	const [isReasonInvalid, setIsReasonInvalid] = (0, react.useState)(true);
+	const [reason, setReason] = (0, react.useState)("");
+	const [reportedBy, setReportedBy] = (0, react.useState)("");
+	const [reportedByIsInvalid, setReportedByIsInvalid] = (0, react.useState)(true);
+	const [isReporting, setIsReporting] = (0, react.useState)(false);
+	const [errorMessage, setErrorMessage] = (0, react.useState)("");
+	const [priority, setPriority] = (0, react.useState)(import_dist.ReportSessionRequestReportPriorityEnum.NoPriority);
+	const userId = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_app.userIdAtom);
+	const orgShortName = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_envive_enviveConfig.orgShortNameAtom);
+	const lastUserEvent = userEvents && userEvents.length > 0 ? userEvents[userEvents.length - 1] : void 0;
+	const onOpen = (0, react.useCallback)(() => setIsOpen(true), []);
+	const onClose = (0, react.useCallback)(() => setIsOpen(false), []);
+	(0, react.useEffect)(() => {
+		if (messages) {
+			const currentMessages = messages.length > 0 ? messages[messages.length - 1] : [];
+			if (currentMessages.length > 0 && lastUserEvent) setTurnInfo((prev) => ({
+				...prev,
+				turn_idx: currentMessages.length - 1
+			}));
+		}
+	}, [messages]);
+	(0, react.useEffect)(() => {
+		if (suggestions) setLastSuggestions(suggestions);
+		else setLastSuggestions([]);
+	}, [suggestions]);
+	(0, react.useEffect)(() => {
+		if (lastUserEvent) setTurnInfo((prev) => ({
+			...prev,
+			prev_user_event: {
+				id: lastUserEvent.eventId,
+				category: lastUserEvent.category
+			}
+		}));
+		else setTurnInfo((prev) => ({
+			...prev,
+			prev_user_event: void 0
+		}));
+	}, [lastUserEvent]);
+	(0, react.useEffect)(() => {
+		if (lastMessages) {
+			setLastMessagesText(lastMessages.filter((m) => m.type !== __envive_ai_react_hooks_application_models.MessageType.Separator).map((m) => messageContent(m)).join("\n\n"));
+			setTurnInfo((prev) => ({
+				...prev,
+				messages: lastMessages.map((m) => ({
+					id: m.id,
+					content: messageContent(m)
+				}))
+			}));
+		}
+	}, [lastMessages]);
+	(0, react.useEffect)(() => {
+		if (lastSuggestions) {
+			const sortedSuggestions = [...lastSuggestions.filter((s) => s.is_answer), ...lastSuggestions.filter((s) => !s.is_answer)];
+			setLastSuggestionsText(`- ${sortedSuggestions.map((s) => s.content).join("\n- ")}`);
+			setTurnInfo((prev) => ({
+				...prev,
+				suggestions: sortedSuggestions.map((s) => ({
+					id: s.id,
+					content: s.content
+				}))
+			}));
+		}
+	}, [lastSuggestions]);
+	const reportSession = (0, react.useCallback)(async () => {
+		try {
+			setIsReporting(true);
+			setErrorMessage("");
+			const request = {
+				user_id: userId,
+				reported_by: reportedBy,
+				org_short_name: orgShortName,
+				report_priority: priority,
+				reason,
+				turn_info: turnInfo,
+				report_type: reportType
+			};
+			console.info("Submitting report", request);
+			await __envive_ai_react_hooks_application_commerce_api.default.reportSession(request);
+			onClose();
+		} catch (error) {
+			console.error("Error sending report", error);
+			setErrorMessage("There was an error sending the report. Please try again or contact Envive Support.");
+		} finally {
+			setIsReporting(false);
+		}
+	}, [
+		userId,
+		reportedBy,
+		orgShortName,
+		priority,
+		reason,
+		turnInfo,
+		reportType,
+		onClose
+	]);
+	const onReportedByChanging = (0, react.useCallback)((e) => {
+		const reportedByValue = e.target.value;
+		const isEmail = (0, __envive_ai_react_hooks_application_utils.validateEmail)(reportedByValue);
+		setReportedByIsInvalid(!reportedByValue || !isEmail);
+		setReportedBy(reportedByValue);
+	}, []);
+	const onDescriptionChanging = (0, react.useCallback)((e) => {
+		const descriptionValue = e.target.value;
+		setIsReasonInvalid(__envive_ai_react_hooks_application_utils.StringUtils.isNullOrEmpty(descriptionValue));
+		setReason(descriptionValue);
+	}, []);
+	const handlePriorityChange = (0, react.useCallback)((key) => {
+		setPriority(key);
+	}, []);
+	const handleTurnInfoChange = (0, react.useCallback)((e, field) => {
+		setTurnInfo((prev) => ({
+			...prev,
+			[field]: e.target.value
+		}));
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "envive-tw-mx-[16px] envive-tw-block envive-tw-h-[24px] envive-tw-w-full",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			onClick: (e) => {
+				e.preventDefault();
+				onOpen();
+			},
+			className: (0, classnames.default)({
+				"envive-tw-underline": true,
+				"envive-tw-text-inherit": true,
+				"envive-tw-text-[12px]": true,
+				"envive-tw-cursor-pointer": true,
+				"envive-tw-bg-transparent": true,
+				"envive-tw-border-none": true,
+				"envive-tw-p-0": true,
+				"envive-tw-m-0": true,
+				"envive-tw-inline": true,
+				"envive-tw-z-[9999]": true
+			}),
+			children: "Give us feedback"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Drawer, {
+			isOpen,
+			onClose,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReportHeader, { onClose }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "envive-tw-min-h-0 envive-tw-p-0 envive-tw-flex envive-tw-flex-[1_1_auto] envive-tw-flex-col envive-tw-overflow-y-auto",
+					children: lastMessages && lastSuggestions && lastMessages.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReportFormFields, {
+						priority,
+						setPriority: handlePriorityChange,
+						reportedBy,
+						onReportedByChanging,
+						reason,
+						onDescriptionChanging,
+						turnInfo,
+						setTurnInfo: handleTurnInfoChange,
+						lastMessagesText,
+						lastSuggestionsText
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReportFooter, {
+					isReporting,
+					errorMessage,
+					reportedByIsInvalid,
+					isReasonInvalid,
+					onReportSession: reportSession,
+					onClose
+				})
+			]
+		})]
+	});
+};
+
+//#endregion
+exports.ReportIssue = ReportIssue;