Create Glassmond storefront with Meshkee integration

Build the RTL Next.js experience with live catalog, journal, customer interactions, and SEO-ready canonical routes. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-26 00:08:00 +03:30
commit 98fde02322
66 changed files with 8280 additions and 0 deletions
@@ -0,0 +1,119 @@
+import type { Metadata } from "next";
+import Image from "next/image";
+import Link from "next/link";
+import { CalendarDays, UserRound } from "lucide-react";
+import { notFound, redirect } from "next/navigation";
+import { CommentsPanel } from "@/components/entity-comments";
+import {
+  blogUrl,
+  formatPersianDate,
+  getBlogById,
+  getBlogs,
+  getComments,
+  plainText,
+  sanitizeCmsContent,
+  slugifyFa,
+} from "@/lib/meshkee";
+
+type BlogDetailProps = {
+  params: Promise<{ id: string; slug: string }>;
+};
+
+export async function generateStaticParams() {
+  const data = await getBlogs({ pageSize: 50 }).catch(() => ({ items: [] }));
+  return data.items.map((blog) => ({ id: blog.id, slug: slugifyFa(blog.title) }));
+}
+
+export async function generateMetadata({ params }: BlogDetailProps): Promise<Metadata> {
+  const { id } = await params;
+  const data = await getBlogById(id).catch(() => null);
+  if (!data) return { title: "مقاله یافت نشد", robots: { index: false } };
+
+  const { blog } = data;
+  const description =
+    plainText(blog.abstract || blog.mainTextHtml).slice(0, 155) ||
+    `مطالعه مقاله ${blog.title} در مجله گلسموند.`;
+  const canonical = blogUrl(blog);
+
+  return {
+    title: blog.title,
+    description,
+    alternates: { canonical },
+    openGraph: {
+      title: blog.title,
+      description,
+      type: "article",
+      publishedTime: blog.publishedAt,
+      url: canonical,
+      images: blog.titleImageUrl ? [blog.titleImageUrl] : [],
+    },
+  };
+}
+
+export default async function BlogDetailPage({ params }: BlogDetailProps) {
+  const { id, slug } = await params;
+  const data = await getBlogById(id).catch(() => null);
+  if (!data) notFound();
+
+  const { blog } = data;
+  const canonical = blogUrl(blog);
+  const expectedSlug = canonical.split("/").at(-1) || "";
+  let currentSlug = slug;
+  try {
+    currentSlug = decodeURIComponent(slug);
+  } catch {
+    currentSlug = slug;
+  }
+  if (currentSlug !== expectedSlug) redirect(encodeURI(canonical));
+
+  const comments = await getComments("blog", blog.id);
+  const content = sanitizeCmsContent(blog.mainTextHtml, blog.title);
+  const authorName = [blog.author?.firstName, blog.author?.lastName].filter(Boolean).join(" ");
+
+  return (
+    <article className="blog-detail">
+      <header className="blog-detail-header">
+        <div className="container">
+          <nav className="detail-breadcrumbs light" aria-label="مسیر صفحه">
+            <Link href="/">صفحه اصلی</Link>
+            <span>/</span>
+            <Link href="/blog">مجله</Link>
+            <span>/</span>
+            <b>{blog.title}</b>
+          </nav>
+          <span className="page-hero-label">GLASSMOND JOURNAL</span>
+          <h1>{blog.title}</h1>
+          <div className="blog-meta">
+            <span><CalendarDays />{formatPersianDate(blog.publishedAt)}</span>
+            {authorName && <span><UserRound />{authorName}</span>}
+          </div>
+        </div>
+      </header>
+
+      <div className="container blog-detail-image">
+        <Image
+          src={blog.titleImageUrl || "/images/articles/decorative-mirrors.jpg"}
+          alt={blog.title}
+          fill
+          sizes="(max-width: 900px) 100vw, 1100px"
+          priority
+        />
+      </div>
+
+      <div className="container blog-content-wrap">
+        {blog.abstract && <p className="blog-lead">{blog.abstract}</p>}
+        <div className="cms-content" dangerouslySetInnerHTML={{ __html: content }} />
+      </div>
+
+      <section className="blog-comments">
+        <div className="container">
+          <div className="section-heading align-start">
+            <span className="english-title">COMMENTS</span>
+            <h2>دیدگاه‌ها</h2>
+          </div>
+          <CommentsPanel entityType="blog" entityId={blog.id} comments={comments.items} />
+        </div>
+      </section>
+    </article>
+  );
+}