Update src/app/shop/page.tsx

src/app/shop/page.tsx

@@ -1,76 +1,34 @@
 "use client";
 
 import { Suspense } from "react";
-import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import ProductCatalog from "@/components/ecommerce/productCatalog/ProductCatalog";
-import { useProductCatalog } from "@/hooks/useProductCatalog";
 
 function ShopPageContent() {
-    const {
-        products,
-        isLoading,
-        search,
-        setSearch,
-        filters,
-    } = useProductCatalog({ basePath: "/shop" });
-
     const themeProviderProps = {
-        defaultButtonVariant: "expand-hover" as const,
+        defaultButtonVariant: "expand-hover",        defaultTextAnimation: "background-highlight",        borderRadius: "pill",        contentWidth: "compact",        sizing: "largeSmallSizeLargeTitles",        background: "circleGradient",        cardStyle: "gradient-radial",        primaryButtonStyle: "double-inset",        secondaryButtonStyle: "layered",        headingFontWeight: "light"
-        defaultTextAnimation: "background-highlight" as const,
-        borderRadius: "pill" as const,
-        contentWidth: "compact" as const,
-        sizing: "largeSmallSizeLargeTitles" as const,
-        background: "circleGradient" as const,
-        cardStyle: "gradient-radial" as const,
-        primaryButtonStyle: "double-inset" as const,
-        secondaryButtonStyle: "layered" as const,
-        headingFontWeight: "light" as const
     };
 
     const navbarProps = {
-        brandName: "No song",
+        brandName: "No song",        navItems: [
-        navItems: [
             { name: "Home", id: "/" },
-            { name: "Shop", id: "/shop" }
+            { name: "Products", id: "/#products-section" },
-        ],
+            { name: "About", id: "/#about-section" },
-        button: { text: "Cart", onClick: () => console.log("Cart button clicked") }
+            { name: "Contact", id: "/#contact-section" },
+        ]
     };
 
-    if (isLoading) {
-        return (
-            <ThemeProvider {...themeProviderProps}>
-                <ReactLenis root>
-                    <div id="navbar" data-section="navbar">
-                        <NavbarStyleApple {...navbarProps} />
-                    </div>
-                    <main className="min-h-screen flex items-center justify-center pt-20">
-                        <p className="text-foreground">Loading products...</p>
-                    </main>
-                </ReactLenis>
-            </ThemeProvider>
-        );
-    }
-
     return (
         <ThemeProvider {...themeProviderProps}>
-            <ReactLenis root>
+            <div id="nav" data-section="nav">
-                <div id="navbar" data-section="navbar">
+                <NavbarStyleApple {...navbarProps} />
-                    <NavbarStyleApple {...navbarProps} />
+            </div>
+            <main className="flex flex-col items-center justify-center min-h-screen py-20 px-4">
+                <div className="text-center">
+                    <h1 className="text-4xl font-bold">Shop</h1>
+                    <p className="mt-4 text-lg text-foreground/80">Our collection of premium instruments will be available here soon.</p>
                 </div>
-                <div id="product-catalog" data-section="product-catalog">
+            </main>
-                    <ProductCatalog
-                        layout="page"
-                        products={products}
-                        searchValue={search}
-                        onSearchChange={setSearch}
-                        searchPlaceholder="Search products..."
-                        filters={filters}
-                        emptyMessage="No products found"
-                    />
-                </div>
-            </ReactLenis>
         </ThemeProvider>
     );
 }