Build Havaran storefront with Meshkee-backed blogs and portfolios.

Clone product, solution, and company pages from the original site and wire articles/projects to the Meshkee Website API with pagination and media from the backend CDN.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/app/articles/[slug]/page.tsx

@@ -0,0 +1,52 @@
+import { notFound } from "next/navigation";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { ArticleDetailView } from "@/components/ArticleDetail";
+import { articlesFallback } from "@/data/articles";
+import { getBlog } from "@/lib/meshkee";
+
+type PageProps = {
+  params: Promise<{ slug: string }>;
+};
+
+export async function generateStaticParams() {
+  return articlesFallback.map((item) => ({ slug: item.slug }));
+}
+
+export async function generateMetadata({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getBlog(slug);
+  if (!item) {
+    return { title: "مقاله | رسام تجارت هواران" };
+  }
+  return {
+    title: `${item.title} | رسام تجارت هواران`,
+    description: item.excerpt || item.title,
+  };
+}
+
+export default async function ArticleDetailPage({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getBlog(slug);
+  if (!item) notFound();
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={item.title}
+          titleEn="ARTICLE"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "مقالات", href: "/articles" },
+            { label: "جزئیات مقاله", href: `/articles/${item.slug}` },
+          ]}
+        />
+        <ArticleDetailView item={item} />
+      </main>
+      <Footer />
+    </>
+  );
+}