Add Meshkee product catalog navigation and details

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-26 19:42:35 +03:30
parent 00126e5777
commit 34ce4f6925
13 changed files with 1499 additions and 97 deletions
@@ -0,0 +1,69 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import ProductCard from "../components/ProductCard";
+import { InteriorFooter, InteriorHeader } from "../components/InteriorShell";
+import { fetchLatestProducts } from "../lib/meshkee";
+
+export const dynamic = "force-dynamic";
+
+export const metadata: Metadata = {
+  title: "ماشین‌آلات صنعت سیم و کابل | سامان اندیش",
+  description:
+    "جدیدترین ماشین‌آلات و تجهیزات خطوط تولید سیم و کابل سامان اندیش را مشاهده کنید و برای انتخاب، ارزیابی فنی و استعلام قیمت با کارشناسان ما در ارتباط باشید.",
+  alternates: {
+    canonical: "/products",
+  },
+};
+
+export default async function ProductsPage() {
+  const products = await fetchLatestProducts(24).catch(() => []);
+
+  return (
+    <main>
+      <InteriorHeader active="products" />
+
+      <section
+        className="inner-hero product-list-hero"
+        style={{ backgroundImage: 'url("/assets/i8SsUDDMLv.jpg")' }}
+      >
+        <div className="inner-hero__shade" />
+        <div className="container inner-hero__content">
+          <span>INDUSTRIAL MACHINERY</span>
+          <h1>ماشین‌آلات سیم و کابل</h1>
+          <p>جدیدترین تجهیزات موجود برای خطوط تولید صنعتی</p>
+          <div>
+            <Link href="/">صفحه اصلی</Link>
+            <i>/</i>
+            <strong>ماشین‌آلات</strong>
+          </div>
+        </div>
+      </section>
+
+      <section className="product-listing">
+        <div className="container">
+          <div className="product-listing__heading">
+            <div>
+              <span>NEWEST PRODUCTS</span>
+              <h2>جدیدترین ماشین‌آلات</h2>
+            </div>
+            <p>{products.length} محصول اخیر</p>
+          </div>
+
+          {products.length ? (
+            <div className="product-grid">
+              {products.map((product) => (
+                <ProductCard key={product.id} product={product} />
+              ))}
+            </div>
+          ) : (
+            <div className="products-empty">
+              در حال حاضر محصولی برای نمایش در دسترس نیست.
+            </div>
+          )}
+        </div>
+      </section>
+
+      <InteriorFooter />
+    </main>
+  );
+}