function MainComponent({ url, onScrape, scrapedResult, progress }) { const [inputUrl, setInputUrl] = React.useState(url || ''); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#121212] p-6", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg rounded-lg bg-[#1F2937] shadow-lg", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-8", __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-roboto text-white", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, "ウェブサイト模倣サービス"), /*#__PURE__*/ React.createElement("div", { className: "mt-4 space-y-6", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "url", className: "block text-sm font-roboto text-[#F9FAFB]", __source: { fileName: "", lineNumber: 11, columnNumber: 15 }, __self: this }, "スクレイピング対象のURL:"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "url", id: "url", value: inputUrl, onChange: (e)=>setInputUrl(e.target.value), className: "w-full mt-1 px-3 py-2 bg-[#333333] border border-gray-600 rounded-md shadow-sm text-white focus:outline-none focus:border-[#6366F1]", __source: { fileName: "", lineNumber: 12, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>onScrape(inputUrl), className: "w-full py-3 px-4 bg-[#6366F1] rounded-md font-medium font-roboto text-white hover:bg-[#4f46e5]", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "実行"), /*#__PURE__*/ React.createElement("div", { className: "text-white font-roboto", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, progress && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 16, columnNumber: 28 }, __self: this }, "進行状況: ", progress, "%")), scrapedResult && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-[#2D2D2D] rounded-md text-white font-roboto", __source: { fileName: "", lineNumber: 19, columnNumber: 15 }, __self: this }, scrapedResult))))); } function StoryComponent() { const [scrapedResult, setScrapedResult] = React.useState(''); const [progress, setProgress] = React.useState(''); const handleScrapeSubmission = async (url)=>{ if (!url) return; let progressInterval = setInterval(()=>setProgress((oldProgress)=>Math.min(100, oldProgress + Math.floor(Math.random() * 10 + 1))), 500); fetch('/integrations/google-gemini/', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { "role": "user", "content": "Could you provide an imitation result of an interview article with an owner of a public bath or hot spring facility? The key point to imitate is the arrangement of contents." } ] }) }).then((res)=>res.json()).then((data)=>{ clearInterval(progressInterval); setProgress(''); setScrapedResult(data.choices[0].message.content); }).catch((error)=>{ clearInterval(progressInterval); setProgress(''); console.error('Error:', error); }); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 65, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { url: "", onScrape: handleScrapeSubmission, scrapedResult: scrapedResult, progress: progress, __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this })); }