function MainComponent() { const [messages, setMessages] = React.useState([]); const [inputValue, setInputValue] = React.useState(""); const [isLoading, setIsLoading] = React.useState(false); const sendMessage = async ()=>{ if (!inputValue.trim()) return; const userMessage = { role: "user", content: inputValue }; setIsLoading(true); setMessages((prevMessages)=>[ ...prevMessages, userMessage ]); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ ...messages, userMessage ], system_prompt: 'Masterizing sales' }) }); const { result, status } = await response.json(); if (status) { setMessages((prevMessages)=>[ ...prevMessages, { role: "assistant", content: result } ]); } setIsLoading(false); } catch (error) { setIsLoading(false); setMessages((prevMessages)=>[ ...prevMessages, { role: "system", content: "Failed to send message. Please try again." } ]); } }; const handleMessageChange = (event)=>setInputValue(event.target.value); const handleMessageSubmit = (event)=>{ event.preventDefault(); sendMessage(); setInputValue(""); }; return /*#__PURE__*/ React.createElement("section", { className: "flex flex-col h-screen", __source: { fileName: "", lineNumber: 45, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex-none text-center p-4 bg-white shadow font-roboto text-2xl text-[#121212]", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, "Masterizando as Vendas Internas"), /*#__PURE__*/ React.createElement("main", { className: "flex-1 overflow-y-auto", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 p-4 gap-4", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow p-4 font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full h-[200px]", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("video", { controls: true, className: "w-full h-full rounded", poster: "/static/images/course-thumbnail.jpg", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("source", { src: "/static/videos/introduction.mp4", type: "video/mp4", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }), "Your browser does not support the video tag.")), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold my-2", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "Introdução ao curso"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, 'Assista ao vídeo de apresentação do curso "Masterizando as Vendas Internas".')), /*#__PURE__*/ React.createElement("form", { onSubmit: handleMessageSubmit, className: "col-span-1 md:col-span-2 lg:col-span-1 bg-white rounded-lg shadow p-4 font-roboto", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "user_message", className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "Inscreva-se ou faça uma pergunta"), /*#__PURE__*/ React.createElement("div", { className: "my-4", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "user_message", placeholder: "Digite seu e-mail ou mensagem...", className: "w-full p-2 border-2 border-gray-300 rounded-lg", value: inputValue, onChange: handleMessageChange, __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-blue-600 text-white rounded-lg", disabled: isLoading, __source: { fileName: "", lineNumber: 76, columnNumber: 15 }, __self: this }, "Enviar")), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, isLoading && /*#__PURE__*/ React.createElement("p", { className: "text-center text-blue-500", __source: { fileName: "", lineNumber: 85, columnNumber: 29 }, __self: this }, "Enviando..."), messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `p-3 my-2 rounded-lg text-white text-sm ${message.role === "user" ? "bg-blue-500" : message.role === "assistant" ? "bg-green-500" : "bg-red-500"}`, __source: { fileName: "", lineNumber: 87, columnNumber: 17 }, __self: this }, message.content))))))); }