function MainComponent() { const [userInput, setUserInput] = React.useState(""); const [chatHistory, setChatHistory] = React.useState([]); const [isLoading, setIsLoading] = React.useState(false); const [conversationContext, setConversationContext] = React.useState(""); const handleInputChange = (e)=>{ setUserInput(e.target.value); }; const handleSubmit = async (e)=>{ e.preventDefault(); if (!userInput.trim()) return; setIsLoading(true); const newUserMessage = { role: "user", content: userInput }; setChatHistory((prev)=>[ ...prev, newUserMessage ]); try { const candidatesResponse = await fetch("/api/db/2024-39", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: "SELECT * FROM `akitakata_mayor_election_2024`" }) }); const candidatesData = await candidatesResponse.json(); const conversationHistoryResponse = await fetch("/api/db/2024-187", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: "SELECT * FROM `conversation_history` ORDER BY `serial_number` DESC LIMIT 5" }) }); const conversationHistoryData = await conversationHistoryResponse.json(); const systemMessage = { role: "system", content: `安芸高田市長選挙2024の候補者情報について回答してください。候補者の名前の後には「候補」とつけてください。回答は読みやすいように改行を入れてください。以下は候補者の情報です：\n${JSON.stringify(candidatesData)}\n\n過去の会話履歴：\n${JSON.stringify(conversationHistoryData)}\n\n前回の質問：${conversationContext}` }; const response = await fetch("/integrations/anthropic-claude-sonnet-3-5/", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ systemMessage, newUserMessage ] }) }); const data = await response.json(); const assistantResponse = data.choices[0].message.content; setChatHistory((prev)=>[ ...prev, { role: "assistant", content: assistantResponse } ]); const now = new Date().toISOString(); const serialNumberResponse = await fetch("/api/db/2024-187", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: "SELECT MAX(`serial_number`) as max_serial FROM `conversation_history`" }) }); const serialNumberData = await serialNumberResponse.json(); const newSerialNumber = (serialNumberData[0].max_serial || 0) + 1; await fetch("/api/db/2024-187", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: "INSERT INTO `conversation_history` (`timestamp`, `serial_number`, `user_question`, `assistant_response`) VALUES (?, ?, ?, ?)", values: [ now, newSerialNumber, userInput, assistantResponse ] }) }); setConversationContext(userInput); setUserInput(""); } catch (error) { console.error("Error:", error); } finally{ setIsLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-gradient-to-r from-blue-100 to-purple-100", __source: { fileName: "", lineNumber: 96, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between p-4 bg-gradient-to-r from-blue-100 to-purple-100 shadow-md h-[63px]", __source: { fileName: "", lineNumber: 97, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-indigo-800 font-noto-sans text-[15px]", __source: { fileName: "", lineNumber: 98, columnNumber: 9 }, __self: this }, "AIボートマッチ丨安芸高田市長選挙2024"), /*#__PURE__*/ React.createElement("a", { href: "https://demotech.jp/", target: "_blank", rel: "noopener noreferrer", className: "text-[16px] text-indigo-600 hover:text-indigo-800 transition duration-300 ease-in-out font-noto-sans", __source: { fileName: "", lineNumber: 101, columnNumber: 9 }, __self: this }, "一般社団法人デモテク")), /*#__PURE__*/ React.createElement("div", { className: "flex-grow overflow-y-auto p-4", __source: { fileName: "", lineNumber: 110, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-4", __source: { fileName: "", lineNumber: 111, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mx-2", __source: { fileName: "", lineNumber: 112, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://fujimoto-etsushi.com", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 113, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/233524db-1045-4a2f-a036-30801c61f019/-/format/auto/", alt: "藤本えつし候補のウェブサイトへのリンク", className: "w-16 h-16 object-cover rounded-full", __source: { fileName: "", lineNumber: 114, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-xs mt-1", __source: { fileName: "", lineNumber: 116, columnNumber: 13 }, __self: this }, "藤本えつし候補")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mx-2", __source: { fileName: "", lineNumber: 118, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://akatsuseiichiro.wixsite.com/website", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/37670d7d-8b68-4f30-a744-357e02ec4356/-/format/auto/", alt: "あかつ誠一郎候補のウェブサイトへのリンク", className: "w-16 h-16 object-cover rounded-full", __source: { fileName: "", lineNumber: 120, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-xs mt-1", __source: { fileName: "", lineNumber: 122, columnNumber: 13 }, __self: this }, "あかつ誠一郎候補")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mx-2", __source: { fileName: "", lineNumber: 124, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://shosokumataka.hp.peraichi.com/kouenkai/", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/2ab176c3-8b10-426f-8d41-0b1e65da7c74/-/format/auto/", alt: "くまたか昌三候補のウェブサイトへのリンク", className: "w-16 h-16 object-cover rounded-full", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-xs mt-1", __source: { fileName: "", lineNumber: 128, columnNumber: 13 }, __self: this }, "くまたか昌三候補")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mx-2", __source: { fileName: "", lineNumber: 130, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://moritani2023.jimdofree.com/", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/aa199cfa-cf96-4079-99f8-7722a8aa17fe/-/format/auto/", alt: "森谷まさあき候補のウェブサイトへのリンク", className: "w-16 h-16 object-cover rounded-full", __source: { fileName: "", lineNumber: 132, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-xs mt-1", __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }, "森谷まさあき候補"))), chatHistory.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `mb-4 ${message.role === "user" ? "text-right" : "text-left"}`, __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `inline-block p-3 rounded-lg ${message.role === "user" ? "bg-indigo-500 text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 144, columnNumber: 13 }, __self: this }, message.content.split("\n").map((line, i)=>/*#__PURE__*/ React.createElement("p", { key: i, className: "mb-1 last:mb-0 text-lg", __source: { fileName: "", lineNumber: 152, columnNumber: 17 }, __self: this }, line)))))), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "p-4 bg-gradient-to-r from-blue-100 to-purple-100", __source: { fileName: "", lineNumber: 160, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 164, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 165, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "userInput", value: userInput, onChange: handleInputChange, className: "flex-grow p-3 border-2 border-indigo-300 rounded-l-lg focus:outline-none focus:border-indigo-500 text-lg font-noto-sans", placeholder: "質問を入力してください...", disabled: isLoading, __source: { fileName: "", lineNumber: 166, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-indigo-500 text-white p-3 rounded-r-lg hover:bg-indigo-600 transition duration-300 ease-in-out", disabled: isLoading, __source: { fileName: "", lineNumber: 175, columnNumber: 13 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin text-xl", __source: { fileName: "", lineNumber: 181, columnNumber: 17 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane text-xl", __source: { fileName: "", lineNumber: 183, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("p", { className: "text-[10px] text-gray-500 mt-1", __source: { fileName: "", lineNumber: 187, columnNumber: 11 }, __self: this }, "回答は必ずしも正しいとは限りません。重要な情報は確認するようにしてください。")))); }