function MainComponent() { const [url, setUrl] = React.useState(''); const [data, setData] = React.useState(null); const [summary, setSummary] = React.useState(''); const [isFetching, setIsFetching] = React.useState(false); const [isSummarizing, setIsSummarizing] = React.useState(false); const [errorMessage, setErrorMessage] = React.useState(''); const handleUrlChange = (e)=>setUrl(e.target.value); const fetchArticleContent = async ()=>{ setIsFetching(true); try { const response = await fetch('/integrations/web-scraping/post', { method: 'POST', body: JSON.stringify({ url: url, getText: true }), headers: { 'Content-Type': 'application/json' } }); const data = await response.text(); setData(data); summarizeArticle(data); } catch (error) { setErrorMessage('Error fetching article content'); } finally{ setIsFetching(false); } }; const summarizeArticle = async (articleContent)=>{ setIsSummarizing(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { "role": "user", "content": articleContent } ], system_prompt: 'Summarize this content in 200 characters' }), headers: { 'Content-Type': 'application/json' } }); const json = await response.json(); const summaryContent = json.choices[0].message.content || 'Unable to generate summary'; setSummary(summaryContent); } catch (error) { setErrorMessage('Error summarizing article'); } finally{ setIsSummarizing(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f0f4f8] font-roboto", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto pt-8", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-center text-3xl font-bold text-[#333] mb-8", __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, "ファイル追加・編集のお知らせ"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "form-input text-base border rounded-lg w-[300px] sm:w-[400px] px-4 py-2", type: "url", placeholder: "Enter website URL", value: url, onChange: handleUrlChange, name: "url", __source: { fileName: "", lineNumber: 59, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "ml-2 text-white bg-[#007bff] hover:bg-[#0069d9] font-bold py-2 px-4 rounded-lg", onClick: fetchArticleContent, disabled: isFetching, __source: { fileName: "", lineNumber: 60, columnNumber: 21 }, __self: this }, "Fetch")), isFetching && /*#__PURE__*/ React.createElement("p", { className: "text-center", __source: { fileName: "", lineNumber: 64, columnNumber: 32 }, __self: this }, "Fetching article content..."), isSummarizing && /*#__PURE__*/ React.createElement("p", { className: "text-center", __source: { fileName: "", lineNumber: 65, columnNumber: 35 }, __self: this }, "Summarizing article..."), errorMessage && /*#__PURE__*/ React.createElement("p", { className: "text-red-500 text-center", __source: { fileName: "", lineNumber: 66, columnNumber: 34 }, __self: this }, errorMessage), summary && /*#__PURE__*/ React.createElement("div", { className: "p-4 mt-4 bg-white rounded-lg shadow-md", __source: { fileName: "", lineNumber: 67, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold", __source: { fileName: "", lineNumber: 67, columnNumber: 85 }, __self: this }, "Summary"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 67, columnNumber: 127 }, __self: this }, summary)))); }