47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
import { getProducts } from "@/lib/woocommerce";
|
|
import Header from "@/components/layout/Header";
|
|
import Footer from "@/components/layout/Footer";
|
|
import ProductCard from "@/components/product/ProductCard";
|
|
|
|
export const metadata = {
|
|
title: "Products - ManoonOils",
|
|
description: "Browse our collection of premium natural oils for hair and skin care.",
|
|
};
|
|
|
|
export default async function ProductsPage() {
|
|
let products: any[] = [];
|
|
try {
|
|
products = await getProducts();
|
|
} catch (e) {
|
|
console.log('Failed to fetch products during build');
|
|
}
|
|
|
|
const publishedProducts = products.filter((p) => p.status === "publish");
|
|
|
|
return (
|
|
<main className="min-h-screen pt-16 md:pt-20">
|
|
<Header />
|
|
|
|
<section className="py-20 px-4">
|
|
<div className="max-w-7xl mx-auto">
|
|
<h1 className="text-4xl md:text-5xl font-serif text-center mb-16">
|
|
All Products
|
|
</h1>
|
|
|
|
{publishedProducts.length === 0 ? (
|
|
<p className="text-center text-foreground-muted">No products available</p>
|
|
) : (
|
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
|
|
{publishedProducts.map((product, index) => (
|
|
<ProductCard key={product.id} product={product} index={index} />
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</section>
|
|
|
|
<Footer />
|
|
</main>
|
|
);
|
|
}
|