function MainComponent() { const [text, setText] = React.useState(''); const [result, setResult] = React.useState('投稿しようと思う文章を判定します！'); const [loading, setLoading] = React.useState(false); const [copied, setCopied] = React.useState(false); const checkText = async ()=>{ if (!text.trim()) { setResult('投稿内容を入力してください'); return; } setResult('チェック中…'); setLoading(true); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: text } ], system_prompt: 'Is this content appropriate for posting on social media without causing any problems?' }) }); const data = await response.json(); setResult(data.choices[0].message.content); setLoading(false); }; const handleCopy = ()=>{ navigator.clipboard.writeText(text).then(()=>{ setCopied(true); setTimeout(()=>setCopied(false), 2000); }); }; const clearText = ()=>{ setText(''); setResult('投稿しようと思う文章を判定します！'); }; const handleChange = (e)=>setText(e.target.value); const isError = result.includes('迷惑') || result.includes('犯罪') || result.includes('不適切') || result.includes('暴力') || result.includes('不快') || result.includes('違反') || result.includes('マナーに反する') || result.includes('配慮に欠ける'); return /*#__PURE__*/ React.createElement("div", { className: "px-2.5", __source: { fileName: "", lineNumber: 44, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this }, "SNS投稿内容チェック"), /*#__PURE__*/ React.createElement("textarea", { name: "snsContent", className: "w-full mt-4 p-2.5 rounded-lg border-2 border-gray-300 resize-none", maxLength: "100", placeholder: "ここに投稿内容を入力", rows: "5", value: text, onChange: handleChange, disabled: loading, __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between mt-4 items-center", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fa-solid fa-circle-check text-blue-500 ml-[20%] cursor-pointer ${loading ? 'opacity-50' : ''}`, onClick: !loading ? checkText : null, title: "チェック", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: `fa-solid fa-copy text-green-500 cursor-pointer ${loading ? 'opacity-50' : ''}`, onClick: !loading ? handleCopy : null, title: "コピー", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: `fa-solid fa-eraser text-red-500 mr-[20%] cursor-pointer ${loading ? 'opacity-50' : ''}`, onClick: !loading ? clearText : null, title: "クリア", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center mt-4 w-full rounded-lg p-2.5 bg-gray-100", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fa-solid ${loading ? 'fa-spinner fa-spin' : isError ? 'fa-fire' : 'fa-robot'} mr-2 text-lg`, __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, copied ? 'コピーできました！' : result)), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this }, ` @keyframes errorIndicator { 0% { transform: scale(1); } 50% { transform: scale(1.2); } 100% { transform: scale(1); } } .fa-fire { color: red; animation: errorIndicator 5s infinite; } `)); }