Update carousels, card hover, and IranBay branding.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-10-04 13:21:51 +03:30
commit 42aff5aee9
162 changed files with 16828 additions and 0 deletions
@@ -0,0 +1,133 @@
+import Image from "next/image";
+import Link from "next/link";
+import { notFound } from "next/navigation";
+import Header from "@/components/Header";
+import Footer from "@/components/Footer";
+import DetailBanner from "@/components/DetailBanner";
+import ArticleBody from "@/components/ArticleBody";
+import ShareLikeActions from "@/components/ShareLikeActions";
+import {
+  getAllBusinessSlugs,
+  getBusinessBlogPost,
+  getBusinessBySlug,
+} from "@/data/business";
+import styles from "./blog.module.css";
+
+export function generateStaticParams() {
+  return getAllBusinessSlugs().flatMap((slug) => {
+    const business = getBusinessBySlug(slug);
+    return (business?.posts ?? []).map((post) => ({
+      slug,
+      postSlug: post.slug,
+    }));
+  });
+}
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ slug: string; postSlug: string }>;
+}) {
+  const { slug, postSlug } = await params;
+  const data = getBusinessBlogPost(slug, postSlug);
+  if (!data) return { title: "Blog Details | IranBay" };
+  return {
+    title: `${data.post.title} | Blog Details | IranBay`,
+    description: data.post.intro,
+  };
+}
+
+export default async function BlogDetailPage({
+  params,
+}: {
+  params: Promise<{ slug: string; postSlug: string }>;
+}) {
+  const { slug, postSlug } = await params;
+  const data = getBusinessBlogPost(slug, postSlug);
+  if (!data) notFound();
+
+  const { business, post, related } = data;
+
+  return (
+    <div className={styles.page}>
+      <Header />
+      <main className={styles.shell}>
+        <DetailBanner title="Blog Details" breadcrumbs={business.breadcrumbs} />
+
+        <div className={styles.layout}>
+          <article className={styles.article}>
+            <div className={styles.meta}>
+              <span>
+                <img src="/images/icons/calendar.svg" alt="" />
+                {post.date}
+              </span>
+              <span>
+                <img src="/images/icons/user.svg" alt="" />
+                {post.author}
+              </span>
+              <span>
+                <img src="/images/icons/category.svg" alt="" />
+                {post.category}
+              </span>
+            </div>
+            <h2 className={styles.title}>{post.title}.</h2>
+            <p className={styles.intro}>{post.intro}</p>
+
+            <div className={styles.hero}>
+              <Image
+                src={post.hero}
+                alt=""
+                fill
+                className={styles.heroImg}
+                sizes="(max-width: 1100px) 100vw, 1232px"
+                priority
+              />
+            </div>
+
+            <h3 className={styles.sectionTitle}>{post.title}.</h3>
+            <ArticleBody blocks={post.body} />
+
+            <div className={styles.actions}>
+              <ShareLikeActions />
+            </div>
+          </article>
+
+          <aside className={styles.sidebar} aria-label="Related posts">
+            {related.map((item) => (
+              <Link
+                key={item.slug}
+                href={`/businesses/${business.slug}/blog/${item.slug}`}
+                className={styles.related}
+              >
+                <div className={styles.relatedMedia}>
+                  <Image
+                    src={item.image}
+                    alt=""
+                    fill
+                    className={styles.relatedImg}
+                    sizes="154px"
+                  />
+                </div>
+                <div className={styles.relatedBody}>
+                  <h3>{item.title}</h3>
+                  <p>{item.excerpt}</p>
+                  <div className={styles.relatedMeta}>
+                    <span>
+                      <img src="/images/icons/calendar.svg" alt="" />
+                      {item.date}
+                    </span>
+                    <span>
+                      <img src="/images/icons/user.svg" alt="" />
+                      {item.author}
+                    </span>
+                  </div>
+                </div>
+              </Link>
+            ))}
+          </aside>
+        </div>
+      </main>
+      <Footer />
+    </div>
+  );
+}