function NovaBotHeader({ bgColor, textColor, text }) { return /*#__PURE__*/ React.createElement("header", { className: `${bgColor} ${textColor} p-4 text-center font-roboto`, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, text); } function NovaBotHeaderStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NovaBotHeader, { bgColor: "bg-indigo-500", textColor: "text-white", text: "NOVA bot", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this })); } function NovaBotHeader2() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NovaBotHeader, { bgColor: "bg-purple-500", textColor: "text-white", text: "NOVA bot", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this })); } function NovaBotHeader2Story() { return /*#__PURE__*/ React.createElement("div", { className: "text-lg font-bold text-center", style: { fontSize: '24pt' }, __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NovaBotHeader2, { __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this })); } function ReloadChatButton({ onReload }) { return /*#__PURE__*/ React.createElement("button", { className: "p-4 text-white bg-[#F87171]", onClick: onReload, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, "Reload Chat"); } function ReloadChatButtonStory() { const handleReload = ()=>console.log("Chat reloaded"); return /*#__PURE__*/ React.createElement("div", { className: "flex justify-end", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ReloadChatButton, { onReload: handleReload, __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this })); } function MainComponent() { const [messages, setMessages] = React.useState([]); const inputRef = React.useRef(null); React.useEffect(()=>{ fetch('/api/db/chatapp', { method: 'POST', body: JSON.stringify({ query: 'SELECT `id`, `role`, `content`, `timestamp`, `avatar` FROM `chat_messages` ORDER BY `id` ASC' }) }).then((response)=>response.json()).then((data)=>{ setMessages(data); }); const saveInformation = async (url, lang)=>{ const result = await fetch('/integrations/web-scraping/post', { method: 'POST', body: JSON.stringify({ url, getText: true }) }); const content = await result.text(); fetch('/api/db/novadatabase', { method: 'POST', body: JSON.stringify({ query: 'INSERT INTO `site_information` (`content`) VALUES (?)', values: [ content ] }) }); }; saveInformation('https://mlfinfo.jp/ja/bl21/', 'Japanese'); saveInformation('https://mlfinfo.jp/en/bl21/', 'English'); }, []); const sendMessage = (e)=>{ e.preventDefault(); const userMessage = inputRef.current.value; if (!userMessage.trim()) return; fetch('/integrations/anthropic-claude-sonnet/', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: userMessage } ] }) }).then((response)=>response.json()).then((data)=>{ const assistantResponse = data.choices[0].message.content; const temporaryMessages = [ ...messages, { role: 'user', content: userMessage, timestamp: new Date().toISOString(), avatar: 'profiles/user.jpg' }, { role: 'assistant', content: assistantResponse, timestamp: new Date().toISOString(), avatar: 'profiles/bot.jpg' } ]; setMessages(temporaryMessages); fetch('/api/db/chatapp', { method: 'POST', body: JSON.stringify({ query: 'INSERT INTO `chat_messages` (`role`, `content`, `timestamp`, `avatar`) VALUES (?, ?, ?, ?), (?, ?, ?, ?)', values: [ 'user', userMessage, new Date().toISOString(), 'profiles/user.jpg', 'assistant', assistantResponse, new Date().toISOString(), 'profiles/bot.jpg' ] }) }); inputRef.current.value = ''; }); }; const handleReload = ()=>{ setMessages([]); fetch('/api/db/chatapp', { method: 'POST', body: JSON.stringify({ query: 'DELETE FROM `chat_messages`' }) }); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col", __source: { fileName: "", lineNumber: 87, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NovaBotHeader, { bgColor: "bg-purple-500", textColor: "text-white", text: "NOVA bot", __source: { fileName: "", lineNumber: 88, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-auto p-4 space-y-4", __source: { fileName: "", lineNumber: 89, columnNumber: 7 }, __self: this }, messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `flex ${message.role === 'assistant' ? 'justify-end' : 'justify-start'}`, __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `relative flex items-center ${message.role === 'assistant' ? 'flex-row-reverse' : ''}`, __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: message.avatar, alt: `${message.role} profile icon`, className: "w-8 h-8 rounded-full", __source: { fileName: "", lineNumber: 93, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `ml-2 p-2 rounded-lg ${message.role === 'assistant' ? 'bg-[#D1D5DB]' : 'bg-[#818CF8] text-white'}`, __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 95, columnNumber: 17 }, __self: this }, message.content)))))), /*#__PURE__*/ React.createElement("form", { className: "flex items-center p-4 bg-white border-t", onSubmit: sendMessage, __source: { fileName: "", lineNumber: 101, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { ref: inputRef, className: "flex-1 p-2 border rounded", placeholder: "Type a message", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "ml-2 text-xl", __source: { fileName: "", lineNumber: 103, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-paper-plane", "aria-hidden": "true", __source: { fileName: "", lineNumber: 104, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement(ReloadChatButton, { onReload: handleReload, __source: { fileName: "", lineNumber: 107, columnNumber: 7 }, __self: this })); }