feat(saleor): Phase 2 - Product Migration

- Update ProductCard to use Saleor Product type
- Update products listing page to fetch from Saleor
- Update product detail page with Saleor integration
- Add language switching support (SR/EN)
- Add SEO metadata generation
- Implement static params generation for all product slugs
- Add availability checking based on variant quantity

src/app/products/page.tsx

@@ -1,4 +1,4 @@
-import { getProducts } from "@/lib/woocommerce";
+import { getProducts } from "@/lib/saleor";
 import Header from "@/components/layout/Header";
 import Footer from "@/components/layout/Footer";
 import ProductCard from "@/components/product/ProductCard";
@@ -8,15 +8,13 @@ export const metadata = {
   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");
+interface ProductsPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function ProductsPage({ params }: ProductsPageProps) {
+  const { locale = "sr" } = await params;
+  const products = await getProducts(locale.toUpperCase());
 
   return (
     <main className="min-h-screen pt-16 md:pt-20">
@@ -25,15 +23,22 @@ export default async function ProductsPage() {
       <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
+            {locale === "en" ? "All Products" : "Svi Proizvodi"}
           </h1>
           
-          {publishedProducts.length === 0 ? (
-            <p className="text-center text-foreground-muted">No products available</p>
+          {products.length === 0 ? (
+            <p className="text-center text-foreground-muted">
+              {locale === "en" ? "No products available" : "Nema dostupnih proizvoda"}
+            </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} />
+              {products.map((product, index) => (
+                <ProductCard 
+                  key={product.id} 
+                  product={product} 
+                  index={index}
+                  locale={locale.toUpperCase()}
+                />
               ))}
             </div>
           )}