function MainComponent() { const [response, setResponse] = React.useState(""); const [loading, setLoading] = React.useState(false); const handleSubmit = (e)=>{ e.preventDefault(); const formData = new FormData(e.target); const userMessage = formData.get("content"); setLoading(true); fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: userMessage } ], system_prompt: "Explain this content" }) }).then((res)=>res.json()).then((data)=>{ setResponse(data.choices[0].message.content); setLoading(false); }).catch(()=>{ setResponse("エラーが発生しました。もう一度お試しください。"); setLoading(false); }); }; return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 py-8", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-2", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, "ホームページ"), /*#__PURE__*/ React.createElement("p", { className: "text-lg", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, "ChatGPT API によって生成されています")), /*#__PURE__*/ React.createElement("main", { __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { id: "chatgpt-form", className: "flex flex-col items-center", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { name: "content", className: "w-full md:w-1/2 p-4 mb-4 border rounded", rows: "5", placeholder: "質問やメッセージを入力してください", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "送信")), /*#__PURE__*/ React.createElement("div", { id: "chatgpt-response", className: "mt-8 p-4 border rounded bg-gray-50", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "読み込み中...") : /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this }, response || "ここに返事が表示されます...")))); }