function MainComponent() { const [products, setProducts] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); const { data: user } = useUser(); useEffect(()=>{ fetchProducts(); }, []); const fetchProducts = async ()=>{ try { setLoading(true); const response = await fetch("/api/products/list", { method: "POST" }); if (!response.ok) { throw new Error(`Failed to fetch products: ${response.status}`); } const data = await response.json(); if (data.success) { setProducts(data.products); } else { setError(data.error || "Failed to load products"); } } catch (err) { console.error(err); setError("Could not load products"); } finally{ setLoading(false); } }; const ProductCard = ({ product })=>/*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow", __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, product.image_url && /*#__PURE__*/ React.createElement("img", { src: product.image_url, alt: product.title, className: "w-full h-48 object-cover", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-gray-800 mb-2", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, product.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm mb-3 line-clamp-3", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, product.description), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-3", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-green-600", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "$", product.price), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "by ", product.user_email)), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-gray-700", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, "Contact Method: "), /*#__PURE__*/ React.createElement("span", { className: "capitalize text-gray-600", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, product.contact_method.replace("_", " "))), /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-gray-700", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "Contact: "), /*#__PURE__*/ React.createElement("span", { className: "text-gray-600", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this }, product.contact_info)), product.contact_method === "ussd" && product.ussd_code && /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-gray-700", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, "USSD Code: "), /*#__PURE__*/ React.createElement("span", { className: "font-mono bg-gray-100 px-2 py-1 rounded text-gray-800", __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this }, product.ussd_code))))); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50", __source: { fileName: "", lineNumber: 82, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-white shadow-sm border-b", __source: { fileName: "", lineNumber: 84, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center h-16", __source: { fileName: "", lineNumber: 86, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 87, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }, "E-Commerce Store")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this }, user ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/my-products", className: "text-gray-700 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium", __source: { fileName: "", lineNumber: 96, columnNumber: 19 }, __self: this }, "My Products"), /*#__PURE__*/ React.createElement("a", { href: "/add-product", className: "bg-[#357AFF] text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 102, columnNumber: 19 }, __self: this }, "Add Product"), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "text-gray-700 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium", __source: { fileName: "", lineNumber: 108, columnNumber: 19 }, __self: this }, "Sign Out")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-gray-700 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium", __source: { fileName: "", lineNumber: 117, columnNumber: 19 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "bg-[#357AFF] text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 123, columnNumber: 19 }, __self: this }, "Sign Up")))))), /*#__PURE__*/ React.createElement("main", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8", __source: { fileName: "", lineNumber: 137, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 138, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 139, columnNumber: 11 }, __self: this }, "All Products"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 142, columnNumber: 11 }, __self: this }, "Browse and purchase products from our sellers")), loading && /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center py-12", __source: { fileName: "", lineNumber: 148, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-500", __source: { fileName: "", lineNumber: 149, columnNumber: 13 }, __self: this }, "Loading products...")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-50 border border-red-200 rounded-lg p-4 mb-6", __source: { fileName: "", lineNumber: 154, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-red-700", __source: { fileName: "", lineNumber: 155, columnNumber: 13 }, __self: this }, error)), !loading && !error && products.length === 0 && /*#__PURE__*/ React.createElement("div", { className: "text-center py-12", __source: { fileName: "", lineNumber: 160, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 mb-4", __source: { fileName: "", lineNumber: 161, columnNumber: 13 }, __self: this }, "No products available yet"), user && /*#__PURE__*/ React.createElement("a", { href: "/add-product", className: "bg-[#357AFF] text-white px-6 py-3 rounded-md font-medium hover:bg-[#2E69DE]", __source: { fileName: "", lineNumber: 163, columnNumber: 15 }, __self: this }, "Be the first to add a product!")), !loading && !error && products.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6", __source: { fileName: "", lineNumber: 174, columnNumber: 11 }, __self: this }, products.map((product)=>/*#__PURE__*/ React.createElement(ProductCard, { key: product.id, product: product, __source: { fileName: "", lineNumber: 176, columnNumber: 15 }, __self: this }))))); }