function MainComponent() { const [searchParams, setSearchParams] = useState({ query: "", location: "", business_status: "ALL", verified: false, minRating: 0, limit: 20 }); const [results, setResults] = useState([]); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [sortConfig, setSortConfig] = useState({ key: null, direction: 'asc' }); const [page, setPage] = useState(1); const [exportLoading, setExportLoading] = useState(false); const [exportError, setExportError] = useState(null); const resultsPerPage = 10; useEffect(()=>{ if (exportError) { const timer = setTimeout(()=>setExportError(null), 5000); return ()=>clearTimeout(timer); } }, [ exportError ]); const handleSearch = async (e)=>{ e?.preventDefault(); setLoading(true); setError(null); try { const statusQuery = searchParams.business_status === 'ALL' ? '' : `&business_status=${searchParams.business_status}`; const queryString = `query=${encodeURIComponent(searchParams.query + " " + searchParams.location)}&verified=${searchParams.verified}&limit=${searchParams.limit}${statusQuery}`; const response = await fetch(`/integrations/local-business-data/search?${queryString}`); if (!response.ok) { throw new Error('Failed to fetch results'); } const data = await response.json(); if (data.status === "OK") { const filteredResults = data.data.filter((business)=>business.rating >= searchParams.minRating); setResults(filteredResults); } else { throw new Error('Invalid response from API'); } } catch (err) { setError('Failed to fetch business data. Please try again.'); console.error(err); } finally{ setLoading(false); } }; const copyToClipboard = (text)=>{ navigator.clipboard.writeText(text); }; const formatHours = (hours)=>{ if (!hours) return "Not Available"; try { if (typeof hours === 'string') { const parsed = JSON.parse(hours); return Object.entries(parsed).map(([day, time])=>`${day}: ${time}`).join("; "); } if (typeof hours === 'object') { return Object.entries(hours).map(([day, time])=>`${day}: ${time}`).join("; "); } return "Not Available"; } catch { return "Not Available"; } }; const formatPhoneNumber = (phone)=>{ if (!phone) return "Not Available"; return phone.replace(/[^\d]/g, "").replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3"); }; const exportToCSV = ()=>{ if (results.length === 0) { setExportError("No data to export! Please perform a search first."); return; } try { setExportLoading(true); const headers = [ "Business Name", "Contact Number", "Website URL", "Full Address", "Rating (Out of 5)", "Total Reviews", "Business Status", "Business Category", "Operating Hours", "Website Status", "Is Verified", "Last Updated" ]; const csvContent = results.map((business)=>[ business.name || "Not Available", formatPhoneNumber(business.phone_number), business.website || "Not Available", business.full_address || "Not Available", `${business.rating?.toFixed(1) || "0"} out of 5`, `${business.review_count || "0"} reviews`, business.business_status === "OPEN" ? "Currently Open" : business.business_status === "CLOSED_TEMPORARILY" ? "Temporarily Closed" : "Permanently Closed", business.type || "Not Available", formatHours(business.working_hours), business.website ? "Active Website" : "No Website", business.verified ? "Verified Business" : "Unverified", new Date().toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' }) ]); const BOM = "\uFEFF"; const csvString = BOM + [ headers.join(','), ...csvContent.map((row)=>row.map((cell)=>`"${(cell || '').toString().replace(/"/g, '""')}"`).join(',')) ].join('\n'); const blob = new Blob([ csvString ], { type: 'text/csv;charset=utf-8;' }); const link = document.createElement('a'); const url = URL.createObjectURL(blob); link.setAttribute('href', url); link.setAttribute('download', `business_leads_${new Date().toISOString().slice(0, 10)}.csv`); link.style.visibility = 'hidden'; document.body.appendChild(link); link.click(); document.body.removeChild(link); URL.revokeObjectURL(url); } catch (error) { console.error('Export error:', error); setExportError('There was an error exporting the data. Please try again.'); } finally{ setExportLoading(false); } }; const sortResults = (key)=>{ setSortConfig({ key, direction: sortConfig.key === key && sortConfig.direction === 'asc' ? 'desc' : 'asc' }); }; const sortedResults = [ ...results ].sort((a, b)=>{ if (!sortConfig.key) return 0; const aValue = a[sortConfig.key]; const bValue = b[sortConfig.key]; if (aValue < bValue) return sortConfig.direction === 'asc' ? -1 : 1; if (aValue > bValue) return sortConfig.direction === 'asc' ? 1 : -1; return 0; }); const paginatedResults = sortedResults.slice((page - 1) * resultsPerPage, page * resultsPerPage); const totalPages = Math.ceil(results.length / resultsPerPage); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-indigo-900 via-blue-900 to-indigo-800 py-8 px-4 md:px-8 relative", __source: { fileName: "", lineNumber: 179, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAiIGhlaWdodD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImdyaWQiIHg9IjAiIHk9IjAiIHdpZHRoPSI2MCIgaGVpZ2h0PSI2MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTSAxMCAwIEwgMCAwIDAgMTAiIGZpbGw9Im5vbmUiIHN0cm9rZT0icmdiYSgyNTUsMjU1LDI1NSwwLjEpIiBzdHJva2Utd2lkdGg9IjEiLz48L3BhdHRlcm4+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JpZCkiLz48L3N2Zz4=')] opacity-20", __source: { fileName: "", lineNumber: 180, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto relative", __source: { fileName: "", lineNumber: 181, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-white mb-8 font-roboto flex items-center gap-3", __source: { fileName: "", lineNumber: 182, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search text-blue-300", __source: { fileName: "", lineNumber: 183, columnNumber: 3 }, __self: this }), "Lead Scraper"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSearch, className: "backdrop-blur-xl bg-white/20 rounded-xl shadow-2xl p-6 mb-8 border border-white/20 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 186, columnNumber: 1 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 187, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 188, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Business type (e.g., Restaurants)", className: "w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-white/50 focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all", value: searchParams.query, onChange: (e)=>setSearchParams({ ...searchParams, query: e.target.value }), __source: { fileName: "", lineNumber: 189, columnNumber: 7 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 197, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Location (e.g., San Francisco, CA)", className: "w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-white/50 focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all", value: searchParams.location, onChange: (e)=>setSearchParams({ ...searchParams, location: e.target.value }), __source: { fileName: "", lineNumber: 198, columnNumber: 7 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 206, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "w-full px-4 py-2 bg-gray-800/90 backdrop-blur-xl border border-white/20 rounded-lg text-white focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all [&>option]:bg-gray-800 hover:bg-gray-700/90", value: searchParams.business_status, onChange: (e)=>setSearchParams({ ...searchParams, business_status: e.target.value }), __source: { fileName: "", lineNumber: 207, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "ALL", __source: { fileName: "", lineNumber: 212, columnNumber: 9 }, __self: this }, "All Businesses"), /*#__PURE__*/ React.createElement("option", { value: "OPEN", __source: { fileName: "", lineNumber: 213, columnNumber: 9 }, __self: this }, "Open"), /*#__PURE__*/ React.createElement("option", { value: "CLOSED_TEMPORARILY", __source: { fileName: "", lineNumber: 214, columnNumber: 9 }, __self: this }, "Temporarily Closed"), /*#__PURE__*/ React.createElement("option", { value: "CLOSED_PERMANENTLY", __source: { fileName: "", lineNumber: 215, columnNumber: 9 }, __self: this }, "Permanently Closed"))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 218, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "w-full px-4 py-2 bg-gray-800/90 backdrop-blur-xl border border-white/20 rounded-lg text-white focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all [&>option]:bg-gray-800 hover:bg-gray-700/90", value: searchParams.limit, onChange: (e)=>setSearchParams({ ...searchParams, limit: Number(e.target.value) }), __source: { fileName: "", lineNumber: 219, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "20", __source: { fileName: "", lineNumber: 224, columnNumber: 9 }, __self: this }, "20 results"), /*#__PURE__*/ React.createElement("option", { value: "50", __source: { fileName: "", lineNumber: 225, columnNumber: 9 }, __self: this }, "50 results"), /*#__PURE__*/ React.createElement("option", { value: "100", __source: { fileName: "", lineNumber: 226, columnNumber: 9 }, __self: this }, "100 results"), /*#__PURE__*/ React.createElement("option", { value: "500", __source: { fileName: "", lineNumber: 227, columnNumber: 9 }, __self: this }, "500 results")))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap items-center gap-4 mt-6", __source: { fileName: "", lineNumber: 232, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 233, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", id: "verified", checked: searchParams.verified, onChange: (e)=>setSearchParams({ ...searchParams, verified: e.target.checked }), className: "rounded border-white/20 bg-gray-800/90 text-blue-500 focus:ring-blue-400 cursor-pointer", __source: { fileName: "", lineNumber: 234, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "verified", className: "text-white cursor-pointer hover:text-blue-300 transition-colors", __source: { fileName: "", lineNumber: 241, columnNumber: 7 }, __self: this }, "Verified businesses only")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 244, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-white", __source: { fileName: "", lineNumber: 245, columnNumber: 7 }, __self: this }, "Min Rating:"), /*#__PURE__*/ React.createElement("select", { value: searchParams.minRating, onChange: (e)=>setSearchParams({ ...searchParams, minRating: Number(e.target.value) }), className: "px-3 py-1 bg-gray-800/90 backdrop-blur-xl border border-white/20 rounded-lg text-white focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all [&>option]:bg-gray-800 hover:bg-gray-700/90", __source: { fileName: "", lineNumber: 246, columnNumber: 7 }, __self: this }, [ 0, 1, 2, 3, 4 ].map((rating)=>/*#__PURE__*/ React.createElement("option", { key: rating, value: rating, __source: { fileName: "", lineNumber: 252, columnNumber: 11 }, __self: this }, rating, "+ stars")))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "ml-auto px-6 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-all duration-200 focus:ring-2 focus:ring-blue-400 focus:ring-offset-2 focus:ring-offset-transparent disabled:opacity-50 disabled:hover:bg-blue-500", disabled: loading, __source: { fileName: "", lineNumber: 257, columnNumber: 5 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin", __source: { fileName: "", lineNumber: 263, columnNumber: 9 }, __self: this }) : /*#__PURE__*/ React.createElement("span", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 265, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search", __source: { fileName: "", lineNumber: 266, columnNumber: 11 }, __self: this }), "Search")))), error && /*#__PURE__*/ React.createElement("div", { className: "backdrop-blur-xl bg-red-500/20 text-white p-4 rounded-xl mb-8 border border-red-500/20 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 275, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 276, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-circle text-red-300", __source: { fileName: "", lineNumber: 277, columnNumber: 5 }, __self: this }), error)), results.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "backdrop-blur-xl bg-white/30 rounded-xl shadow-2xl p-6 border border-white/20", __source: { fileName: "", lineNumber: 284, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 285, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 286, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-white flex items-center gap-2", __source: { fileName: "", lineNumber: 287, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-list-ul text-blue-300", __source: { fileName: "", lineNumber: 288, columnNumber: 7 }, __self: this }), "Found ", results.length, " results"), /*#__PURE__*/ React.createElement("button", { onClick: exportToCSV, disabled: results.length === 0 || exportLoading, className: `px-6 py-2.5 ${results.length === 0 ? 'bg-gray-400' : 'bg-gradient-to-r from-green-500 to-emerald-600 hover:from-green-600 hover:to-emerald-700'} text-white rounded-lg flex items-center gap-2 shadow-lg transition-all duration-200 disabled:opacity-50`, __source: { fileName: "", lineNumber: 291, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${exportLoading ? 'fa-spinner fa-spin' : 'fa-download'}`, __source: { fileName: "", lineNumber: 298, columnNumber: 7 }, __self: this }), exportLoading ? 'Exporting...' : 'Export to CSV')), exportError && /*#__PURE__*/ React.createElement("div", { className: "text-red-300 text-sm flex items-center gap-2 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 303, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-circle", __source: { fileName: "", lineNumber: 304, columnNumber: 7 }, __self: this }), exportError)), /*#__PURE__*/ React.createElement("div", { className: "overflow-x-auto rounded-lg", __source: { fileName: "", lineNumber: 310, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "w-full", __source: { fileName: "", lineNumber: 311, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 312, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "bg-white/10", __source: { fileName: "", lineNumber: 313, columnNumber: 3 }, __self: this }, [ "name", "phone_number", "website", "full_address", "rating", "business_status", "type" ].map((key)=>/*#__PURE__*/ React.createElement("th", { key: key, className: "px-4 py-3 text-left text-sm font-semibold text-white cursor-pointer hover:bg-white/20 transition-colors duration-200", onClick: ()=>sortResults(key), __source: { fileName: "", lineNumber: 315, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 320, columnNumber: 9 }, __self: this }, key.replace(/_/g, ' ').charAt(0).toUpperCase() + key.slice(1).replace(/_/g, ' '), sortConfig.key === key && /*#__PURE__*/ React.createElement("i", { className: `fas fa-sort-${sortConfig.direction === 'asc' ? 'up' : 'down'} text-blue-300`, __source: { fileName: "", lineNumber: 323, columnNumber: 13 }, __self: this })))))), /*#__PURE__*/ React.createElement("tbody", { className: "divide-y divide-white/10", __source: { fileName: "", lineNumber: 330, columnNumber: 17 }, __self: this }, paginatedResults.map((business, index)=>/*#__PURE__*/ React.createElement("tr", { key: business.business_id, className: "hover:bg-white/10 transition-colors duration-200", __source: { fileName: "", lineNumber: 332, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 333, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 334, columnNumber: 9 }, __self: this }, business.name, /*#__PURE__*/ React.createElement("button", { onClick: ()=>copyToClipboard(business.name), className: "text-white/50 hover:text-white transition-colors duration-200", __source: { fileName: "", lineNumber: 336, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 340, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 344, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 345, columnNumber: 9 }, __self: this }, business.phone_number || 'N/A', business.phone_number && /*#__PURE__*/ React.createElement("button", { onClick: ()=>copyToClipboard(business.phone_number), className: "text-white/50 hover:text-white transition-colors duration-200", __source: { fileName: "", lineNumber: 348, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 352, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 357, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 358, columnNumber: 9 }, __self: this }, business.website ? /*#__PURE__*/ React.createElement("a", { href: business.website, target: "_blank", rel: "noopener noreferrer", className: "text-blue-300 hover:text-blue-200 truncate max-w-[200px] transition-colors duration-200", __source: { fileName: "", lineNumber: 360, columnNumber: 13 }, __self: this }, business.website) : 'N/A', business.website && /*#__PURE__*/ React.createElement("button", { onClick: ()=>copyToClipboard(business.website), className: "text-white/50 hover:text-white transition-colors duration-200", __source: { fileName: "", lineNumber: 370, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 374, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 379, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 380, columnNumber: 9 }, __self: this }, business.full_address, /*#__PURE__*/ React.createElement("button", { onClick: ()=>copyToClipboard(business.full_address), className: "text-white/50 hover:text-white transition-colors duration-200", __source: { fileName: "", lineNumber: 382, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 386, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 390, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-1", __source: { fileName: "", lineNumber: 391, columnNumber: 9 }, __self: this }, business.rating, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star text-yellow-400", __source: { fileName: "", lineNumber: 393, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-white/70", __source: { fileName: "", lineNumber: 394, columnNumber: 11 }, __self: this }, "(", business.review_count, ")"))), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3", __source: { fileName: "", lineNumber: 397, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `px-3 py-1 rounded-full text-xs font-medium ${business.business_status === 'OPEN' ? 'bg-green-500/20 text-green-300 border border-green-500/30' : business.business_status === 'CLOSED_TEMPORARILY' ? 'bg-yellow-500/20 text-yellow-300 border border-yellow-500/30' : 'bg-red-500/20 text-red-300 border border-red-500/30'}`, __source: { fileName: "", lineNumber: 398, columnNumber: 9 }, __self: this }, business.business_status === 'OPEN' ? 'Open' : business.business_status === 'CLOSED_TEMPORARILY' ? 'Temporarily Closed' : 'Permanently Closed')), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-3 text-white", __source: { fileName: "", lineNumber: 408, columnNumber: 7 }, __self: this }, business.type)))))), totalPages > 1 && /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mt-6", __source: { fileName: "", lineNumber: 416, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setPage(page - 1), disabled: page === 1, className: "px-4 py-2 bg-white/10 text-white rounded-lg hover:bg-white/20 disabled:opacity-50 disabled:hover:bg-white/10 transition-all duration-200", __source: { fileName: "", lineNumber: 417, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-left mr-2", __source: { fileName: "", lineNumber: 422, columnNumber: 5 }, __self: this }), "Previous"), /*#__PURE__*/ React.createElement("span", { className: "text-white", __source: { fileName: "", lineNumber: 425, columnNumber: 3 }, __self: this }, "Page ", page, " of ", totalPages), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setPage(page + 1), disabled: page === totalPages, className: "px-4 py-2 bg-white/10 text-white rounded-lg hover:bg-white/20 disabled:opacity-50 disabled:hover:bg-white/10 transition-all duration-200", __source: { fileName: "", lineNumber: 428, columnNumber: 3 }, __self: this }, "Next", /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-right ml-2", __source: { fileName: "", lineNumber: 434, columnNumber: 5 }, __self: this }))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 441, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } @keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } } `)); }