function MainComponent() { const [links, setLinks] = React.useState([]); const [statusMessage, setStatusMessage] = React.useState(''); const [checking, setChecking] = React.useState(false); const [activeTab, setActiveTab] = React.useState('check'); const handleSubmitCheck = async (event)=>{ event.preventDefault(); setChecking(true); const link = event.target.link.value; const response = await fetch('/integrations/web-scraping/post', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ url: link, getText: true }) }); const result = await response.json(); setLinks([ ...links, { url: link, status: result.status, description: result.description } ]); setStatusMessage(`Status: ${result.status}, Description: ${result.description}`); setChecking(false); }; const handleSubmitReport = async (event)=>{ event.preventDefault(); const reportLink = event.target.report_link.value; await fetch('/api/reportLink', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ link: reportLink }) }); setStatusMessage('Link reported successfully.'); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 flex flex-col", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-grow p-4 flex justify-center", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, activeTab === 'check' && /*#__PURE__*/ React.createElement("div", { className: "max-w-md w-full bg-white rounded-lg shadow-lg overflow-hidden", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold mb-4 font-sans", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, "Check Link Safety"), /*#__PURE__*/ React.createElement("form", { className: "mb-6", onSubmit: handleSubmitCheck, __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "url", name: "link", placeholder: "Enter link to check", className: "w-full p-2 border border-gray-300 rounded mt-2", __source: { fileName: "", lineNumber: 45, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 text-white py-2 rounded mt-4 font-sans", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, checking ? "Checking..." : "Check Link")), /*#__PURE__*/ React.createElement("div", { className: "w-full bg-gray-200 rounded-full", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `bg-blue-500 text-xs leading-none py-1 text-center text-white ${checking ? 'w-full animate-pulse' : 'w-0'}`, __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold font-sans", __source: { fileName: "", lineNumber: 67, columnNumber: 17 }, __self: this }, "Checked Links"), /*#__PURE__*/ React.createElement("ul", { className: "mt-2", __source: { fileName: "", lineNumber: 68, columnNumber: 17 }, __self: this }, links.map((link, index)=>{ const statusClasses = `font-sans ${link.status === 'Safe' ? 'text-green-600' : 'text-red-600'}`; return /*#__PURE__*/ React.createElement("li", { key: index, className: "p-2 border-b border-gray-200 flex flex-col", __source: { fileName: "", lineNumber: 74, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-sans", __source: { fileName: "", lineNumber: 78, columnNumber: 25 }, __self: this }, link.url), /*#__PURE__*/ React.createElement("span", { className: statusClasses, __source: { fileName: "", lineNumber: 79, columnNumber: 25 }, __self: this }, link.status), /*#__PURE__*/ React.createElement("span", { className: "font-sans text-gray-500", __source: { fileName: "", lineNumber: 80, columnNumber: 25 }, __self: this }, link.description)); }))), statusMessage && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-2 bg-green-100 text-green-700 rounded font-sans", __source: { fileName: "", lineNumber: 87, columnNumber: 17 }, __self: this }, statusMessage))), activeTab === 'report' && /*#__PURE__*/ React.createElement("div", { className: "max-w-md w-full bg-white rounded-lg shadow-lg overflow-hidden", __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold mb-4 font-sans", __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, "Report Link"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmitReport, __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "url", name: "report_link", placeholder: "Enter link to report", className: "w-full p-2 border border-gray-300 rounded mt-2", __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-red-500 text-white py-2 rounded mt-4 font-sans", __source: { fileName: "", lineNumber: 106, columnNumber: 17 }, __self: this }, "Report Link")), statusMessage && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-2 bg-green-100 text-green-700 rounded font-sans", __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, statusMessage))), activeTab === 'history' && /*#__PURE__*/ React.createElement("div", { className: "max-w-md w-full bg-white rounded-lg shadow-lg overflow-hidden", __source: { fileName: "", lineNumber: 123, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 124, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold mb-4 font-sans", __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }, "Checked Links History"), /*#__PURE__*/ React.createElement("ul", { className: "mt-2", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, links.map((link, index)=>{ const statusClasses = `font-sans ${link.status === 'Safe' ? 'text-green-600' : 'text-red-600'}`; return /*#__PURE__*/ React.createElement("li", { key: index, className: "p-2 border-b border-gray-200 flex flex-col", __source: { fileName: "", lineNumber: 132, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-sans", __source: { fileName: "", lineNumber: 136, columnNumber: 23 }, __self: this }, link.url), /*#__PURE__*/ React.createElement("span", { className: statusClasses, __source: { fileName: "", lineNumber: 137, columnNumber: 23 }, __self: this }, link.status), /*#__PURE__*/ React.createElement("span", { className: "font-sans text-gray-500", __source: { fileName: "", lineNumber: 138, columnNumber: 23 }, __self: this }, link.description)); }))))), /*#__PURE__*/ React.createElement("nav", { className: "w-full bg-white shadow-lg", __source: { fileName: "", lineNumber: 148, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-around", __source: { fileName: "", lineNumber: 149, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `py-2 px-4 ${activeTab === 'check' ? 'bg-blue-500 text-white' : 'bg-white text-blue-500'}`, onClick: ()=>setActiveTab('check'), __source: { fileName: "", lineNumber: 150, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search", __source: { fileName: "", lineNumber: 154, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: `py-2 px-4 ${activeTab === 'report' ? 'bg-red-500 text-white' : 'bg-white text-red-500'}`, onClick: ()=>setActiveTab('report'), __source: { fileName: "", lineNumber: 156, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-flag", __source: { fileName: "", lineNumber: 160, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: `py-2 px-4 ${activeTab === 'history' ? 'bg-gray-500 text-white' : 'bg-white text-gray-500'}`, onClick: ()=>setActiveTab('history'), __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-history", __source: { fileName: "", lineNumber: 166, columnNumber: 13 }, __self: this }))))); }