function MainComponent() { const [message, setMessage] = React.useState(''); const [response, setResponse] = React.useState(''); const [isLoading, setIsLoading] = React.useState(false); const sendMessage = async ()=>{ setIsLoading(true); const res = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { "role": "user", "content": message } ], system_prompt: 'Explain this content' }) }); const data = await res.json(); setResponse(data.choices[0].message.content); setIsLoading(false); }; const handleNewChat = ()=>{ setMessage(''); setResponse(''); }; const handleDownloadResponse = ()=>{ const element = document.createElement("a"); const file = new Blob([ response ], { type: 'text/plain' }); element.href = URL.createObjectURL(file); element.download = "ChatGPT-Response.txt"; document.body.appendChild(element); element.click(); }; return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center flex-col pt-[200px] pb-[200px]", __source: { fileName: "", lineNumber: 43, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold mb-5", __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }, "CHAT_GPT 4.0無料体験版"), /*#__PURE__*/ React.createElement("input", { className: "border p-4 mb-4 w-full max-w-4xl mx-12 my-4", placeholder: "CHAT_GPTに質問", value: message, onChange: (e)=>setMessage(e.target.value), name: "chat-box", __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: sendMessage, className: "flex items-center justify-center bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-paper-plane mr-2", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }), "送信"), isLoading ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, "読み込み中...") : /*#__PURE__*/ React.createElement("div", { className: "border p-4 mt-4 w-full max-w-4xl mx-12 my-4 break-words", __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, response), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 63, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleDownloadResponse, className: "bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded mr-2", __source: { fileName: "", lineNumber: 64, columnNumber: 9 }, __self: this }, "回答をダウンロード"), /*#__PURE__*/ React.createElement("button", { onClick: handleNewChat, className: "bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }, "NEW CHAT"))); }