function Navigation1({ isAuthenticated = false }) { const [isOpen, setIsOpen] = useState(false); const { data: user } = useUser(); return /*#__PURE__*/ React.createElement("nav", { className: "fixed top-0 z-50 w-full bg-white shadow-md", __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex h-16 items-center justify-between", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center", __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/logo.png", alt: "Black Diamond Tech logo", className: "h-8 w-auto", __source: { fileName: "", lineNumber: 11, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 16, columnNumber: 15 }, __self: this }, "Black Diamond Tech"))), /*#__PURE__*/ React.createElement("div", { className: "hidden md:block", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "ml-10 flex items-center space-x-4", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "/services", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, "Services"), /*#__PURE__*/ React.createElement("a", { href: "/shop", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 42, columnNumber: 15 }, __self: this }, "Shop"), user ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/profile", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 50, columnNumber: 19 }, __self: this }, "Profile"), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "rounded-md bg-[#357AFF] px-4 py-2 text-white hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 56, columnNumber: 19 }, __self: this }, "Logout")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "rounded-md px-3 py-2 text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "rounded-md bg-[#357AFF] px-4 py-2 text-white hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 71, columnNumber: 19 }, __self: this }, "Sign Up")))), /*#__PURE__*/ React.createElement("div", { className: "md:hidden", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsOpen(!isOpen), className: "inline-flex items-center justify-center rounded-md p-2 text-gray-700 hover:bg-gray-100 hover:text-gray-900", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${isOpen ? 'fa-times' : 'fa-bars'} text-xl`, __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }))))), isOpen && /*#__PURE__*/ React.createElement("div", { className: "md:hidden", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-1 px-2 pb-3 pt-2", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "/services", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this }, "Services"), /*#__PURE__*/ React.createElement("a", { href: "/shop", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 114, columnNumber: 13 }, __self: this }, "Shop"), user ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/profile", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 122, columnNumber: 17 }, __self: this }, "Profile"), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "block rounded-md px-3 py-2 text-base font-medium text-white bg-[#357AFF] hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 128, columnNumber: 17 }, __self: this }, "Logout")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "block rounded-md px-3 py-2 text-base text-gray-700 hover:bg-gray-100", __source: { fileName: "", lineNumber: 137, columnNumber: 17 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "block rounded-md px-3 py-2 text-base font-medium text-white bg-[#357AFF] hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 143, columnNumber: 17 }, __self: this }, "Sign Up"))))); } function Navigation1Story() { return /*#__PURE__*/ React.createElement("div", { className: "h-screen bg-gray-100", __source: { fileName: "", lineNumber: 160, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Navigation1, { __source: { fileName: "", lineNumber: 161, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "pt-16", __source: { fileName: "", lineNumber: 162, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 163, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-white p-8 shadow-md", __source: { fileName: "", lineNumber: 164, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 165, columnNumber: 13 }, __self: this }, "Content Below Navigation"), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-gray-600", __source: { fileName: "", lineNumber: 168, columnNumber: 13 }, __self: this }, "This demonstrates how the sticky navigation works with content below."))))); } function Footer() { return /*#__PURE__*/ React.createElement("footer", { className: "bg-white shadow-md mt-auto", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-12", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-4 gap-8", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/logo.png", alt: "Black Diamond Tech logo", className: "h-8 w-auto", __source: { fileName: "", lineNumber: 8, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 13, columnNumber: 15 }, __self: this }, "Black Diamond Tech")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "Empowering digital transformation through innovative solutions.")), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-gray-900", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, "Quick Links"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 26, columnNumber: 17 }, __self: this }, "Home")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/about", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 31, columnNumber: 17 }, __self: this }, "About")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 35, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/services", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, "Services")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/shop", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 41, columnNumber: 17 }, __self: this }, "Shop")))), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-gray-900", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "flex items-center text-gray-600", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt w-5", __source: { fileName: "", lineNumber: 52, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 53, columnNumber: 17 }, __self: this }, "123 Tech Street, Digital City")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center text-gray-600", __source: { fileName: "", lineNumber: 55, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-phone w-5", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, "+1 (555) 123-4567")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center text-gray-600", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-envelope w-5", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "info@blackdiamondtech.com")))), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-gray-900", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }, "Follow Us"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://twitter.com", target: "_blank", rel: "noopener noreferrer", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-twitter text-2xl", __source: { fileName: "", lineNumber: 75, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "https://facebook.com", target: "_blank", rel: "noopener noreferrer", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-facebook text-2xl", __source: { fileName: "", lineNumber: 83, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "https://linkedin.com", target: "_blank", rel: "noopener noreferrer", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-linkedin text-2xl", __source: { fileName: "", lineNumber: 91, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "https://instagram.com", target: "_blank", rel: "noopener noreferrer", className: "text-gray-600 hover:text-[#357AFF]", __source: { fileName: "", lineNumber: 93, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-instagram text-2xl", __source: { fileName: "", lineNumber: 99, columnNumber: 17 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 border-t border-gray-200 pt-8", __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-center text-gray-600", __source: { fileName: "", lineNumber: 106, columnNumber: 11 }, __self: this }, "© ", new Date().getFullYear(), " Black Diamond Tech. All rights reserved.")))); } function FooterStory() { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col", __source: { fileName: "", lineNumber: 117, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-grow p-4", __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto", __source: { fileName: "", lineNumber: 119, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-gray-900 mb-4", __source: { fileName: "", lineNumber: 120, columnNumber: 11 }, __self: this }, "Main Content Area"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 123, columnNumber: 11 }, __self: this }, "This is where the main content of the page would go. The footer will always appear at the bottom of the page."))), /*#__PURE__*/ React.createElement(Footer, { __source: { fileName: "", lineNumber: 129, columnNumber: 7 }, __self: this })); } function MainComponent() { const [products, setProducts] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); const [currentPage, setCurrentPage] = useState(1); const [filter, setFilter] = useState('all'); const [searchQuery, setSearchQuery] = useState(''); const productsPerPage = 12; useEffect(()=>{ const fetchProducts = async ()=>{ try { const response = await fetch(`/api/products?page=${currentPage}&filter=${filter}&search=${searchQuery}`); if (!response.ok) { throw new Error(`Error fetching products: ${response.status}`); } const data = await response.json(); setProducts(data); setLoading(false); } catch (err) { console.error('Error fetching products:', err); setError('Unable to load products. Please try again later.'); setLoading(false); } }; fetchProducts(); }, [ currentPage, filter, searchQuery ]); return /*#__PURE__*/ React.createElement("div", { className: "flex min-h-screen flex-col", __source: { fileName: "", lineNumber: 31, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Navigation1, { __source: { fileName: "", lineNumber: 32, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("main", { className: "flex-grow px-4 pt-24 pb-12", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Shop"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-lg text-gray-600", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, "Browse our collection of products and services")), /*#__PURE__*/ React.createElement("div", { className: "mb-8 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Search products...", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), className: "w-full rounded-lg border border-gray-200 px-4 py-2 pr-10 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 45, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-search absolute right-3 top-1/2 -translate-y-1/2 text-gray-400", __source: { fileName: "", lineNumber: 52, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("select", { value: filter, onChange: (e)=>setFilter(e.target.value), className: "rounded-lg border border-gray-200 px-4 py-2 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "all", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this }, "All Products"), /*#__PURE__*/ React.createElement("option", { value: "digital", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, "Digital Products"), /*#__PURE__*/ React.createElement("option", { value: "physical", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "Physical Products"), /*#__PURE__*/ React.createElement("option", { value: "services", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "Services")))), loading ? /*#__PURE__*/ React.createElement("div", { className: "flex h-64 items-center justify-center", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin text-4xl text-[#357AFF]", __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-gray-600", __source: { fileName: "", lineNumber: 71, columnNumber: 17 }, __self: this }, "Loading products..."))) : error ? /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-red-50 p-4 text-center text-red-500", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }, error) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, products.map((product)=>/*#__PURE__*/ React.createElement("div", { key: product.id, className: "overflow-hidden rounded-lg bg-white shadow-lg transition-transform hover:scale-[1.02]", __source: { fileName: "", lineNumber: 82, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative pb-[100%]", __source: { fileName: "", lineNumber: 86, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: product.image, alt: `Product image of ${product.name}`, className: "absolute h-full w-full object-cover", __source: { fileName: "", lineNumber: 87, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 93, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-gray-900", __source: { fileName: "", lineNumber: 94, columnNumber: 23 }, __self: this }, product.name), /*#__PURE__*/ React.createElement("p", { className: "mt-1 text-sm text-gray-500", __source: { fileName: "", lineNumber: 97, columnNumber: 23 }, __self: this }, product.category), /*#__PURE__*/ React.createElement("div", { className: "mt-4 flex items-center justify-between", __source: { fileName: "", lineNumber: 100, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-[#357AFF]", __source: { fileName: "", lineNumber: 101, columnNumber: 25 }, __self: this }, "$", product.price), /*#__PURE__*/ React.createElement("button", { className: "rounded-lg bg-[#357AFF] px-4 py-2 text-white transition-colors hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 104, columnNumber: 25 }, __self: this }, "Add to Cart")))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex justify-center gap-2", __source: { fileName: "", lineNumber: 113, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setCurrentPage(currentPage - 1), disabled: currentPage === 1, className: "rounded-lg border border-gray-200 px-4 py-2 text-gray-600 transition-colors hover:bg-gray-50 disabled:opacity-50", __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-left mr-2", __source: { fileName: "", lineNumber: 119, columnNumber: 19 }, __self: this }), "Previous"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setCurrentPage(currentPage + 1), disabled: products.length < productsPerPage, className: "rounded-lg border border-gray-200 px-4 py-2 text-gray-600 transition-colors hover:bg-gray-50 disabled:opacity-50", __source: { fileName: "", lineNumber: 122, columnNumber: 17 }, __self: this }, "Next", /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-right ml-2", __source: { fileName: "", lineNumber: 128, columnNumber: 19 }, __self: this })))))), /*#__PURE__*/ React.createElement(Footer, { __source: { fileName: "", lineNumber: 135, columnNumber: 7 }, __self: this })); }