Connect storefront to backend catalog, search, and home slots.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-27 18:30:52 +03:30
parent 2f857f1a90
commit 0074ab6629
106 changed files with 5920 additions and 81 deletions
@@ -0,0 +1,77 @@
+import SiteHeader from "@/components/home/SiteHeader";
+import SiteFooter from "@/components/home/SiteFooter";
+import LeatherBanner from "@/components/home/LeatherBanner";
+import PartnerCta from "@/components/home/PartnerCta";
+import ProductListHero from "@/components/products/ProductListHero";
+import ProductFilters from "@/components/products/ProductFilters";
+import ProductGrid from "@/components/products/ProductGrid";
+import ProductPagination from "@/components/products/ProductPagination";
+import { LIST_PAGE_META } from "@/data/products";
+import { mapHomeSlots } from "@/lib/map-home-slots";
+import { fetchPublicWebsiteSlots } from "@/lib/website-slots";
+import { getStorefrontProducts } from "@/lib/products-api";
+import {
+  fetchPublicCategories,
+  mapCategoriesToMegaTabs,
+} from "@/lib/categories-api";
+
+type PageProps = {
+  searchParams: Promise<{ q?: string; cat?: string }>;
+};
+
+export default async function ProductsPage({ searchParams }: PageProps) {
+  const params = await searchParams;
+  const [slotItems, products, apiCategories] = await Promise.all([
+    fetchPublicWebsiteSlots(),
+    getStorefrontProducts({
+      name: params.q,
+      categoryId: params.cat,
+    }),
+    fetchPublicCategories(),
+  ]);
+  const home = mapHomeSlots(slotItems);
+  const megaTabs = mapCategoriesToMegaTabs(
+    apiCategories,
+    home.megaTabs.map((t) => ({ image: t.image })),
+  );
+
+  return (
+    <main className="home-page min-h-dvh bg-white text-ink">
+      <div className="relative">
+        <SiteHeader megaTabs={megaTabs.length ? megaTabs : home.megaTabs} />
+        <ProductListHero
+          titleFa={params.q ? `جستجو: ${params.q}` : LIST_PAGE_META.titleFa}
+          titleEn={params.q ? "Search results" : LIST_PAGE_META.titleEn}
+          heroImage={home.heroSlides[0]?.image || LIST_PAGE_META.heroImage}
+          breadcrumbs={
+            params.q
+              ? [
+                  { label: "خانه", href: "/" },
+                  { label: "محصولات", href: "/products" },
+                  { label: "جستجو" },
+                ]
+              : LIST_PAGE_META.breadcrumbs
+          }
+        />
+      </div>
+
+      <div className="mt-6 space-y-6 sm:mt-8 lg:mt-[60px]">
+        <ProductFilters />
+        <div className="space-y-3 sm:space-y-4">
+          <ProductGrid products={products} />
+          <ProductPagination />
+        </div>
+      </div>
+
+      <LeatherBanner
+        image={home.leather.image}
+        nameFa={home.leather.nameFa}
+        nameEn={home.leather.nameEn}
+        linkText={home.leather.linkText}
+        link={home.leather.link}
+      />
+      <PartnerCta />
+      <SiteFooter paymentBadges={home.paymentBadges} />
+    </main>
+  );
+}