shop page

ch3lla · Feb 24, 2024 · fd392d6 · fd392d6
1 parent 3035fd5
commit fd392d6
Showing 1 changed file with 31 additions and 0 deletions.
diff --git a/frontend/src/pages/Shop/Shop.js b/frontend/src/pages/Shop/Shop.js
@@ -0,0 +1,31 @@
+import React, { useState } from "react";
+import Breadcrumbs from "../../components/pageProps/Breadcrumbs";
+import Pagination from "../../components/pageProps/shopPage/Pagination";
+import ProductBanner from "../../components/pageProps/shopPage/ProductBanner";
+import ShopSideNav from "../../components/pageProps/shopPage/ShopSideNav";
+
+const Shop = () => {
+  const [itemsPerPage, setItemsPerPage] = useState(12);
+  const itemsPerPageFromBanner = (itemsPerPage) => {
+    setItemsPerPage(itemsPerPage);
+  };
+
+  return (
+    <div className="max-w-container mx-auto px-4">
+      <Breadcrumbs title="Products" />
+      {/* ================= Products Start here =================== */}
+      <div className="w-full h-full flex pb-20 gap-10">
+        <div className="w-[20%] lgl:w-[25%] hidden mdl:inline-flex h-full">
+          <ShopSideNav />
+        </div>
+        <div className="w-full mdl:w-[80%] lgl:w-[75%] h-full flex flex-col gap-10">
+          <ProductBanner itemsPerPageFromBanner={itemsPerPageFromBanner} />
+          <Pagination itemsPerPage={itemsPerPage} />
+        </div>
+      </div>
+      {/* ================= Products End here ===================== */}
+    </div>
+  );
+};
+
+export default Shop;