function MainComponent() { const [message, setMessage] = React.useState(''); const [response, setResponse] = React.useState(''); const [loading, setLoading] = React.useState(false); const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); const body = JSON.stringify({ messages: [ { role: 'user', content: message } ] }); try { const res = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body }); const data = await res.json(); const reply = data.choices[0].message.content; setResponse(reply); } catch (error) { setResponse('エラーが発生しました。もう一度お試しください。'); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center bg-[#f0f0f0] min-h-screen p-4", __source: { fileName: "", lineNumber: 37, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "text-center py-6", __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-sans text-[#333]", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, "足湯リラクゼーション"), /*#__PURE__*/ React.createElement("p", { className: "text-lg font-sans text-[#666]", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, "心身のリフレッシュに最高の足湯体験を")), /*#__PURE__*/ React.createElement("main", { className: "flex flex-col items-center w-full max-w-[800px] bg-white shadow-lg rounded-lg p-6", __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-[600px]", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "message", className: "block text-[#333] font-medium mb-2 font-sans", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "質問を聞いてください:"), /*#__PURE__*/ React.createElement("textarea", { name: "message", id: "message", rows: "4", className: "w-full p-2 border border-[#ccc] rounded focus:border-[#007BFF] outline-none font-sans", value: message, onChange: (e)=>setMessage(e.target.value), __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 w-full bg-[#007BFF] text-white py-2 rounded font-sans hover:bg-[#0056b3]", disabled: loading, __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, loading ? '読み込んでいます...' : '送信')), /*#__PURE__*/ React.createElement("div", { className: "response mt-6 w-full max-w-[600px] p-4 bg-[#f7f7f7] border border-[#ccc] rounded", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#333] font-sans", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, response || 'ここにチャットGPTの返答が表示されます')))); }