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/portfolios/[slug]/page.tsx

@@ -0,0 +1,54 @@
+import { notFound } from "next/navigation";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { PortfolioDetailView } from "@/components/PortfolioDetail";
+import { portfoliosFallback } from "@/data/portfolios";
+import { getPortfolio } from "@/lib/meshkee";
+
+type PageProps = {
+  params: Promise<{ slug: string }>;
+};
+
+export async function generateStaticParams() {
+  return portfoliosFallback.map((item) => ({ slug: item.slug }));
+}
+
+export async function generateMetadata({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getPortfolio(slug);
+  if (!item) {
+    return { title: "پروژه | رسام تجارت هواران" };
+  }
+  return {
+    title: `${item.title} | رسام تجارت هواران`,
+    description:
+      item.description ||
+      `نمونه کار ${item.title} — شرکت رسام تجارت هواران`,
+  };
+}
+
+export default async function PortfolioDetailPage({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getPortfolio(slug);
+  if (!item) notFound();
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={item.title}
+          titleEn={item.titleEn || "PROJECT DETAILS"}
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "پروژه ها", href: "/portfolios" },
+            { label: "جزئیات نمونه کار", href: `/portfolios/${item.slug}` },
+          ]}
+        />
+        <PortfolioDetailView item={item} />
+      </main>
+      <Footer />
+    </>
+  );
+}