fixed /product page

src/pages/newsletter.astro

@@ -7,7 +7,10 @@ import Header from "@components/Header.astro";
 import Footer from "@components/Footer.astro";
 import Layout from "@layouts/Layout.astro";
 import Breadcrumbs from "@components/Breadcrumbs.astro";
-import { BlocksRenderer } from "@strapi/blocks-react-renderer";
+import {
+  BlocksRenderer,
+  type BlocksContent,
+} from "@strapi/blocks-react-renderer";
 import Hr from "@components/Hr.astro";
 import HeroImage from "@components/HeroImage.astro";
 
@@ -16,14 +19,14 @@ const page = pages.find(page => page.data.slug === "newsletter")?.data;
 const stores = await getCollection("stores");
 const store = stores?.find(
   store => store.data.slug === markketplace.STORE_SLUG
-)?.data;
+);
 ---
 
 <Layout
   title={page?.SEO?.metaTitle || "Newsletter"}
   description={page?.SEO?.metaDescription || ""}
 >
-  <Header store={store} />
+  <Header activeNav="pages" store={store} />
   <Breadcrumbs />
   <main id="main-content" class="relative overflow-hidden px-4 py-16">
     {/* Background decoration */}
@@ -50,7 +53,11 @@ const store = stores?.find(
       <section
         class="rounded-2xl bg-white bg-opacity-90 p-8 shadow-xl backdrop-blur-sm dark:bg-gray-800 dark:bg-opacity-90"
       >
-        <Subscribe storeId={store?.id} storeName={store?.name} client:load />
+        <Subscribe
+          storeId={store?.data?.id}
+          storeName={store?.data?.name}
+          client:load
+        />
         <p class="mt-4 text-center text-sm text-gray-500 dark:text-gray-400">
           Join our newsletter to get the latest updates and exclusive offers.
         </p>

src/pages/products/index.astro

@@ -0,0 +1,99 @@
+---
+import type { CollectionEntry } from "astro:content";
+import Layout from "@layouts/Layout.astro";
+import Main from "@layouts/Main.astro";
+import Header from "@components/Header.astro";
+import Footer from "@components/Footer.astro";
+import Pagination from "@components/Pagination.astro";
+import Card from "@components/Card";
+import { SITE } from "@config";
+import HeroImage from "@components/HeroImage.astro";
+import Hr from "@components/Hr.astro";
+
+export interface Props {
+  currentPage: number;
+  totalPages: number;
+  stores: CollectionEntry<"stores">[];
+}
+
+import { getCollection } from "astro:content";
+import type Store from "../interfaces/Store";
+import { slugifyStr } from "@utils/slugify";
+import { markketplace } from "@config";
+
+const stores = await getCollection("stores");
+const store = stores.find(
+  (store: Store) => store.data.slug === markketplace.STORE_SLUG
+);
+
+const products = await getCollection("products");
+
+console.log({ products });
+
+const { currentPage, totalPages } = Astro.props;
+---
+
+<Layout
+  title={`Posts | ${SITE.title}`}
+  meta={{
+    title: "Products",
+    description: "Physical & Digital offers from our collective",
+  }}
+>
+  <Header activeNav="pages" store={store} />
+  <main id="main-content">
+    <section id="about" class="mb-10 max-w-3xl prose-img:border-0">
+      {
+        store?.data?.SEO?.socialImage && (
+          <HeroImage
+            image={store?.data?.SEO?.socialImage}
+            title={store?.data?.title}
+          />
+        )
+      }
+      <h1 class="text-2xl tracking-wider sm:text-3xl">
+        {store?.data?.title}
+      </h1>
+      <p>{store?.data.Description}</p>
+    </section>
+    <Hr />
+  </main>
+  <Main
+    pageTitle="Products"
+    pageDesc="Some products from artists in this markkët instance"
+  >
+    <ul class="-mx-4 flex flex-wrap">
+      {
+        products.map(({ data }) => (
+          <Card
+            href={`/store/${data.slug || slugifyStr(data.title)}`}
+            tags={[]}
+            frontmatter={{
+              author: "x",
+              title: data.Name || data.SEO?.metaTitle || "---",
+              pubDatetime: new Date(data.createdAt),
+              modDatetime: new Date(data.updatedAt),
+              description: data.SEO?.metaDescription || data.Description || "",
+              SEO: {
+                ...data.SEO,
+                metaTitle: data.SEO?.metaTitle || data.title || "Store",
+                socialImage: {
+                  url: data.SEO?.socialImage?.url || data.Thumbnail?.url,
+                },
+              },
+            }}
+          />
+        ))
+      }
+    </ul>
+  </Main>
+
+  <Pagination
+    {currentPage}
+    {totalPages}
+    prevUrl={`/blog${currentPage - 1 !== 1 ? "/" + (currentPage - 1) : ""}/`}
+    nextUrl={`/blog/${currentPage + 1}/`}
+  />
+
+  <Footer noMarginTop={totalPages > 1} activeNav="x" />
+</Layout>