Update src/app/products/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -44,7 +44,7 @@ export default function LandingPage() {
       background={{ variant: "rotated-rays-animated" }}
       title="Science-Based Nutrition for Sustainable Livestock"
       description="Inovit delivers innovative feed additive solutions designed to improve animal health, optimize feed efficiency, and empower the future of farming."
-      buttons={[{ text: "Explore Our Products", href: "#products" }]}
+      buttons={[{ text: "Explore Our Products", href: "/products" }]}
       carouselItems={[
         { id: "h1", imageSrc: "http://img.b2bpic.net/free-photo/long-shot-herd-sheep-eating-grass-pasture_23-2148214286.jpg", imageAlt: "sustainable farming livestock field" },
         { id: "h2", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-feeding-sheep_23-2149535200.jpg", imageAlt: "organic animal feed texture" },
@@ -89,12 +89,12 @@ export default function LandingPage() {
       gridVariant="four-items-2x2-equal-grid"
       useInvertedBackground={false}
       products={[
-        { id: "p1", brand: "Inovit", name: "Soybean Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/wooden-spoon-full-raw-buckwheat-marble-surface_114579-25380.jpg" },
-        { id: "p2", brand: "Inovit", name: "Corn Gluten Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/barley-grains-out-bowl-marble-surface_114579-47809.jpg" },
-        { id: "p3", brand: "Inovit", name: "Meat & Bone Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/spices-market-morocco_23-2148129885.jpg" },
-        { id: "p4", brand: "Inovit", name: "Sugar Beet Pulp", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/fresh-harvested-red-radish-plastic-crate-supermarket_23-2148209755.jpg" },
-        { id: "p5", brand: "Inovit", name: "Wheat Bran", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/buckwheat-seeds-isolated-grey_114579-24770.jpg" },
-        { id: "p6", brand: "Inovit", name: "Fish Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/common-food-allergens-people_23-2149870515.jpg" }
+        { id: "p1", brand: "Inovit", name: "Soybean Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/wooden-spoon-full-raw-buckwheat-marble-surface_114579-25380.jpg?_wi=1" },
+        { id: "p2", brand: "Inovit", name: "Corn Gluten Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/barley-grains-out-bowl-marble-surface_114579-47809.jpg?_wi=1" },
+        { id: "p3", brand: "Inovit", name: "Meat & Bone Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/spices-market-morocco_23-2148129885.jpg?_wi=1" },
+        { id: "p4", brand: "Inovit", name: "Sugar Beet Pulp", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/fresh-harvested-red-radish-plastic-crate-supermarket_23-2148209755.jpg?_wi=1" },
+        { id: "p5", brand: "Inovit", name: "Wheat Bran", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/buckwheat-seeds-isolated-grey_114579-24770.jpg?_wi=1" },
+        { id: "p6", brand: "Inovit", name: "Fish Meal", price: "High Quality", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/common-food-allergens-people_23-2149870515.jpg?_wi=1" }
       ]}
       title="Quality Raw Materials"
       description="Premium soybean meal, corn products, and protein sources for balanced farm nutrition."
@@ -169,9 +169,9 @@ export default function LandingPage() {
         },
         {
           title: "Products",          items: [
-            { label: "Poultry Additives", href: "#products" },
-            { label: "Ruminant Additives", href: "#products" },
-            { label: "Aquaculture", href: "#products" },
+            { label: "Poultry Additives", href: "/products" },
+            { label: "Ruminant Additives", href: "/products" },
+            { label: "Aquaculture", href: "/products" },
           ],
         },
         {
@@ -188,4 +188,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/products/page.tsx

@@ -0,0 +1,50 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ProductCatalog from "@/components/ecommerce/productCatalog/ProductCatalog";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import { useState } from "react";
+
+export default function ProductsPage() {
+  const [search, setSearch] = useState("");
+
+  const products = [
+    { id: "p1", brand: "Inovit", name: "Soybean Meal", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/wooden-spoon-full-raw-buckwheat-marble-surface_114579-25380.jpg?_wi=2" },
+    { id: "p2", brand: "Inovit", name: "Corn Gluten Meal", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/barley-grains-out-bowl-marble-surface_114579-47809.jpg?_wi=2" },
+    { id: "p3", brand: "Inovit", name: "Meat & Bone Meal", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/spices-market-morocco_23-2148129885.jpg?_wi=2" },
+    { id: "p4", brand: "Inovit", name: "Sugar Beet Pulp", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fresh-harvested-red-radish-plastic-crate-supermarket_23-2148209755.jpg?_wi=2" },
+    { id: "p5", brand: "Inovit", name: "Wheat Bran", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/buckwheat-seeds-isolated-grey_114579-24770.jpg?_wi=2" },
+    { id: "p6", brand: "Inovit", name: "Fish Meal", price: "High Quality", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/common-food-allergens-people_23-2149870515.jpg?_wi=2" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="noiseDiagonalGradient"
+        cardStyle="solid"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
+    >
+      <NavbarStyleCentered
+        navItems={[
+            { name: "Home", id: "/" },
+            { name: "Products", id: "/products" },
+        ]}
+        brandName="Inovit"
+      />
+      <div className="pt-32 pb-20">
+        <ProductCatalog 
+            layout="page"
+            products={products.filter(p => p.name.toLowerCase().includes(search.toLowerCase()))}
+            searchValue={search}
+            onSearchChange={setSearch}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}