Use Meshkee {id}/{fa-slug} detail URLs for products and blogs.

Resolve pages via by-id APIs, slugify Farsi titles for public paths, and redirect legacy slug-only URLs to the canonical form.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Alireza Hassani
2026-08-22 23:52:45 +03:30
co-authored by Cursor
parent 24b5649abd
commit 0cb9aa57e2
14 changed files with 426 additions and 307 deletions
+5 -1
View File
@@ -2,7 +2,11 @@
- Do NOT ship public/sitemap.xml or public/robots.txt (nginx proxies both to Meshkee API).
- Publish GET /meshkee/sitemap-config.json generated at build time from app routes.
- Include public static routes automatically; exclude auth/checkout/cart/admin paths.
- Omit templates unless this site uses non-default detail URLs.
- Canonical detail URLs (Meshkee defaults — omit templates unless customized):
- Product: /products/{id}/{nameFaSlug} → GET /tenants/{domain}/products/by-id/{id}
- Blog: /blog/{id}/{titleSlug} → GET /tenants/{domain}/blogs/by-id/{id}
- Portfolio: /portfolios/{id}/{titleFaSlug} → GET /tenants/{domain}/portfolios/by-id/{id}
- Slugify: Farsi letters kept, spaces → -, strip other punctuation. Do not use legacy DB slug in public URLs.
- After deploy: business dashboard → Website → Settings → Sync sitemap config (optional for CMS URLs; needed for static pages).
### On-page SEO (every public page)
+8 -6
View File
@@ -40,11 +40,10 @@ This site is **catalog-only** (no shopping cart). Login / user icon goes to the
| Path | Source |
| --- | --- |
| `/` | Homepage + static image slots + store specials + latest blogs |
| `/products` | Store items (`GET /tenants/{domain}/store-items`) |
| `/products?categoryId=` | Same, filtered |
| `/products/[variantId]` | Store item variant + product description/gallery + comments |
| `/blog` | `GET /tenants/{domain}/blogs` (falls back to `lib/data.ts` `blogPosts`) |
| `/blog/[slug]` | Blog details + comments |
| `/products` | Catalog / store items list |
| `/products/[id]/[slug]` | Product detail via `GET .../products/by-id/{id}` |
| `/blog` | Blog list |
| `/blog/[id]/[slug]` | Blog detail via `GET .../blogs/by-id/{id}` |
| `/about` | About us |
| `/contact` | Contact us |
| `/meshkee/static-image-slots` | Slot catalog for the dashboard Refresh button |
@@ -97,7 +96,10 @@ Products list/search: prefer store-items; if empty, fall back to `GET /products`
- Do **not** ship `public/sitemap.xml` or `public/robots.txt` (nginx proxies to Meshkee API).
- Build generates `lib/sitemap-config.generated.json` (`npm run generate:sitemap-config` / `prebuild`); served at `GET /meshkee/sitemap-config.json`.
- After deploy: business dashboard → Website → Settings → Sync sitemap config.
- Templates omitted (defaults `/products/{slug}`, `/blog/{slug}` match this site).
- Detail URLs (Meshkee defaults — omit `templates` unless customized):
- Product: `/products/{id}/{nameFaSlug}` — slugify `nameFa` (Farsi kept, spaces → `-`); resolve with `products/by-id/{id}`. Never use legacy DB slug in public URLs.
- Blog: `/blog/{id}/{titleSlug}` — `blogs/by-id/{id}`.
- Legacy `/products/{slug}` and `/blog/{slug}` redirect to the canonical `{id}/{slug}` form.
- Every public page has unique title/description; product/blog prefer CMS fields.
## Original business data (do not invent replacements)
+1 -1
View File
@@ -36,7 +36,7 @@ export async function GET(request: Request) {
return Response.json({
items: (catalogData.items ?? []).map((item) => ({
id: item.slug || item.id,
id: item.id,
productId: item.id,
productNameFa: item.nameFa,
productTitle: item.title,
+99
View File
@@ -0,0 +1,99 @@
import type { Metadata } from "next";
import Link from "next/link";
import { notFound, redirect } from "next/navigation";
import { Container } from "@/components/Container";
import { PageHero } from "@/components/layout/PageHero";
import { ProductTabs } from "@/components/product/ProductTabs";
import { Placeholder } from "@/components/Placeholder";
import { blogHref, blogImage, blogTitleSlug, fetchBlogById } from "@/lib/blog";
import { fetchComments } from "@/lib/comments";
import { getBlogPost } from "@/lib/data";
import { formatFaDate } from "@/lib/format";
export const revalidate = 60;
export async function generateMetadata({
params,
}: {
params: Promise<{ id: string; slug: string }>;
}): Promise<Metadata> {
const { id } = await params;
const apiPost = await fetchBlogById(id);
if (apiPost) return { title: apiPost.title, description: apiPost.abstract ?? undefined };
const local = getBlogPost(id);
if (!local) return { title: "مقاله" };
return { title: local.title, description: local.excerpt };
}
export default async function BlogPostPage({
params,
}: {
params: Promise<{ id: string; slug: string }>;
}) {
const { id, slug } = await params;
const apiPost = await fetchBlogById(id);
if (apiPost) {
const canonical = blogTitleSlug(apiPost.title);
if (decodeURIComponent(slug) !== canonical) {
redirect(blogHref(apiPost));
}
const comments = await fetchComments("blog", apiPost.id);
return (
<>
<PageHero kicker="Blog" title={apiPost.title} image={blogImage(apiPost)} />
<section className="py-16 sm:py-24">
<Container className="max-w-3xl">
<p className="text-[13px] text-muted">
{formatFaDate(apiPost.publishedAt || apiPost.createdAt)}
</p>
{apiPost.abstract ? <p className="mt-6 text-[16px] leading-9 text-muted">{apiPost.abstract}</p> : null}
{apiPost.mainTextHtml ? (
<div
className="rich-text mt-8 text-[16px] leading-9 text-muted"
dangerouslySetInnerHTML={{ __html: apiPost.mainTextHtml }}
/>
) : null}
<ProductTabs showDescription={false} comments={comments} />
<Link href="/blog" className="mt-10 inline-flex items-center gap-3 text-[14px] font-bold text-brand">
بازگشت به مقالات
<span className="h-px w-10 bg-brand" />
</Link>
</Container>
</section>
</>
);
}
const post = getBlogPost(id);
if (!post) notFound();
const canonical = blogTitleSlug(post.title);
if (decodeURIComponent(slug) !== canonical) {
redirect(blogHref({ id: post.slug, title: post.title }));
}
return (
<>
<PageHero kicker="Blog" title={post.title} image={post.image} />
<section className="py-16 sm:py-24">
<Container className="max-w-3xl">
<p className="text-[13px] text-muted">{post.date}</p>
<div className="mt-8 space-y-5 text-[16px] leading-9 text-muted">
{post.body.map((paragraph) => (
<p key={paragraph}>{paragraph}</p>
))}
</div>
<div className="mt-8 overflow-hidden rounded-2xl">
<Placeholder src={post.image} alt={post.title} className="aspect-[16/9] w-full object-cover" />
</div>
<Link href="/blog" className="mt-10 inline-flex items-center gap-3 text-[14px] font-bold text-brand">
بازگشت به مقالات
<span className="h-px w-10 bg-brand" />
</Link>
</Container>
</section>
</>
);
}
+9 -76
View File
@@ -1,89 +1,22 @@
import type { Metadata } from "next";
import Link from "next/link";
import { notFound } from "next/navigation";
import { Container } from "@/components/Container";
import { PageHero } from "@/components/layout/PageHero";
import { ProductTabs } from "@/components/product/ProductTabs";
import { Placeholder } from "@/components/Placeholder";
import { blogImage, fetchBlog } from "@/lib/blog";
import { fetchComments } from "@/lib/comments";
import { notFound, redirect } from "next/navigation";
import { blogHref, fetchBlogBySlug } from "@/lib/blog";
import { getBlogPost } from "@/lib/data";
import { formatFaDate } from "@/lib/format";
export const revalidate = 60;
export async function generateMetadata({
params,
}: {
params: Promise<{ slug: string }>;
}): Promise<Metadata> {
const { slug } = await params;
const apiPost = await fetchBlog(slug);
if (apiPost) return { title: apiPost.title, description: apiPost.abstract ?? undefined };
const local = getBlogPost(slug);
if (!local) return { title: "مقاله" };
return { title: local.title, description: local.excerpt };
}
export default async function BlogPostPage({
/** Legacy `/blog/{slug}` → canonical `/blog/{id}/{titleSlug}`. */
export default async function LegacyBlogRedirect({
params,
}: {
params: Promise<{ slug: string }>;
}) {
const { slug } = await params;
const apiPost = await fetchBlog(slug);
if (apiPost) {
const comments = await fetchComments("blog", apiPost.id);
return (
<>
<PageHero kicker="Blog" title={apiPost.title} image={blogImage(apiPost)} />
<section className="py-16 sm:py-24">
<Container className="max-w-3xl">
<p className="text-[13px] text-muted">
{formatFaDate(apiPost.publishedAt || apiPost.createdAt)}
</p>
{apiPost.abstract ? <p className="mt-6 text-[16px] leading-9 text-muted">{apiPost.abstract}</p> : null}
{apiPost.mainTextHtml ? (
<div
className="rich-text mt-8 text-[16px] leading-9 text-muted"
dangerouslySetInnerHTML={{ __html: apiPost.mainTextHtml }}
/>
) : null}
<ProductTabs showDescription={false} comments={comments} />
<Link href="/blog" className="mt-10 inline-flex items-center gap-3 text-[14px] font-bold text-brand">
بازگشت به مقالات
<span className="h-px w-10 bg-brand" />
</Link>
</Container>
</section>
</>
);
}
const apiPost = await fetchBlogBySlug(slug);
if (apiPost) redirect(blogHref(apiPost));
const post = getBlogPost(slug);
if (!post) notFound();
const local = getBlogPost(slug);
if (local) redirect(blogHref({ id: local.slug, title: local.title }));
return (
<>
<PageHero kicker="Blog" title={post.title} image={post.image} />
<section className="py-16 sm:py-24">
<Container className="max-w-3xl">
<p className="text-[13px] text-muted">{post.date}</p>
<div className="mt-8 space-y-5 text-[16px] leading-9 text-muted">
{post.body.map((paragraph) => (
<p key={paragraph}>{paragraph}</p>
))}
</div>
<div className="mt-8 overflow-hidden rounded-2xl">
<Placeholder src={post.image} alt={post.title} className="aspect-[16/9] w-full object-cover" />
</div>
<Link href="/blog" className="mt-10 inline-flex items-center gap-3 text-[14px] font-bold text-brand">
بازگشت به مقالات
<span className="h-px w-10 bg-brand" />
</Link>
</Container>
</section>
</>
);
notFound();
}
+1 -1
View File
@@ -80,7 +80,7 @@ export default async function BlogPage({
{blogPosts.map((post) => (
<Link
key={post.slug}
href={`/blog/${post.slug}`}
href={blogHref({ id: post.slug, title: post.title })}
className="group block rounded-2xl border border-line bg-white p-3"
>
<div className="overflow-hidden rounded-xl">
+183
View File
@@ -0,0 +1,183 @@
import type { Metadata } from "next";
import Link from "next/link";
import { notFound, redirect } from "next/navigation";
import { Container } from "@/components/Container";
import { ProductGallery } from "@/components/product/ProductGallery";
import { ProductTabs } from "@/components/product/ProductTabs";
import { fetchComments } from "@/lib/comments";
import { formatPrice } from "@/lib/format";
import {
brandName,
catalogTitle,
fetchCatalogProductById,
fetchStoreItemByProduct,
galleryUrls,
productHref,
productNameSlug,
variantTitle,
type CatalogProduct,
type StoreVariant,
} from "@/lib/store";
export const revalidate = 60;
async function resolveProduct(id: string): Promise<{
variant: StoreVariant | null;
catalog: CatalogProduct | null;
productId?: string;
}> {
const catalog = await fetchCatalogProductById(id);
if (catalog) {
const store = await fetchStoreItemByProduct(String(catalog.id));
const firstVariant = store.storeItem?.variants?.[0] ?? null;
return {
variant: firstVariant,
catalog,
productId: String(catalog.id),
};
}
const store = await fetchStoreItemByProduct(id);
const firstVariant = store.storeItem?.variants?.[0];
if (firstVariant) {
const linked = await fetchCatalogProductById(id);
return {
variant: { ...firstVariant, productId: id },
catalog: linked,
productId: id,
};
}
return { variant: null, catalog: null };
}
function stripHtml(html?: string | null) {
if (!html?.trim()) return undefined;
const text = html
.replace(/<[^>]+>/g, " ")
.replace(/\s+/g, " ")
.trim();
return text.slice(0, 180) || undefined;
}
export async function generateMetadata({
params,
}: {
params: Promise<{ id: string; slug: string }>;
}): Promise<Metadata> {
const { id } = await params;
const resolved = await resolveProduct(id);
const title =
(resolved.catalog ? catalogTitle(resolved.catalog) : null) ||
(resolved.variant ? variantTitle(resolved.variant) : null);
const description =
resolved.catalog?.summary?.trim() ||
stripHtml(resolved.catalog?.descriptionHtml) ||
undefined;
return {
title: title || "محصول",
description,
};
}
export default async function ProductDetailsPage({
params,
}: {
params: Promise<{ id: string; slug: string }>;
}) {
const { id, slug } = await params;
const { variant, catalog, productId } = await resolveProduct(id);
if (!variant && !catalog) notFound();
const title =
(catalog ? catalogTitle(catalog) : null) || (variant ? variantTitle(variant) : "محصول");
const canonicalSlug = productNameSlug(title);
if (decodeURIComponent(slug) !== canonicalSlug) {
redirect(productHref(productId || id, title));
}
const comments = productId ? await fetchComments("product", productId) : [];
const sibling = productId ? await fetchStoreItemByProduct(productId) : { storeItem: undefined };
const images = galleryUrls(catalog, variant?.productImage || catalog?.image || catalog?.thumbnailUrl);
const price = variant?.discountedPrice ?? variant?.price ?? catalog?.store?.minPrice ?? null;
const oldPrice = variant?.discountedPrice != null ? variant.price : null;
const brand = brandName(catalog);
const variants = sibling.storeItem?.variants ?? [];
const inStock =
variant != null
? variant.stockQuantity == null || variant.stockQuantity > 0
: catalog?.store?.inStock !== false;
return (
<section className="py-10 sm:py-14">
<Container>
<p className="text-[13px] text-muted">
<Link href="/" className="hover:text-brand">
خانه
</Link>
<span className="mx-2">/</span>
<Link href="/products" className="hover:text-brand">
محصولات
</Link>
<span className="mx-2">/</span>
{title}
</p>
<div className="mt-5 grid gap-8 lg:grid-cols-[0.9fr_1.1fr]">
<ProductGallery images={images} alt={title} />
<div>
{brand ? <p className="text-[13px] font-medium text-brand">{brand}</p> : null}
{catalog?.categoryNameFa ? (
<p className="mt-1 text-[12px] text-muted">{catalog.categoryNameFa}</p>
) : null}
<h1 className="mt-2 text-[22px] font-extrabold leading-9 text-ink">{title}</h1>
{variant?.label && variant.label !== title ? (
<p className="mt-2 text-[13px] text-muted">{variant.label}</p>
) : null}
<div className="mt-5 flex items-end gap-3">
{oldPrice ? <p className="text-[13px] text-muted line-through">{formatPrice(oldPrice)} تومان</p> : null}
<p className="text-[22px] font-bold text-ink">
{price != null ? (
<>
{formatPrice(price)}
<span className="mr-1 text-[13px] font-medium text-muted">تومان</span>
</>
) : (
<span className="text-[16px] font-medium text-muted">برای قیمت تماس بگیرید</span>
)}
</p>
</div>
<p className={`mt-2 text-[13px] ${inStock ? "text-emerald-600" : "text-brand"}`}>
{inStock ? "موجود در فروشگاه" : "ناموجود"}
</p>
{variants.length > 1 ? (
<div className="mt-5 flex flex-wrap gap-2">
{variants.map((item) => (
<Link
key={item.id}
href={productHref(productId || id, variantTitle(item))}
className={`rounded-lg border px-3 py-1.5 text-[12px] ${item.id === variant?.id ? "border-brand bg-paper text-ink" : "border-line bg-white text-muted"}`}
>
{item.label || variantTitle(item)}
</Link>
))}
</div>
) : null}
<Link
href="/contact"
className="mt-6 inline-flex h-12 items-center justify-center rounded-xl bg-brand px-6 text-[14px] font-bold text-white hover:bg-brand-dark"
>
استعلام و سفارش
</Link>
</div>
</div>
<ProductTabs descriptionHtml={catalog?.descriptionHtml || catalog?.summary} comments={comments} />
</Container>
</section>
);
}
+12 -171
View File
@@ -1,185 +1,26 @@
import type { Metadata } from "next";
import Link from "next/link";
import { notFound } from "next/navigation";
import { Container } from "@/components/Container";
import { ProductGallery } from "@/components/product/ProductGallery";
import { ProductTabs } from "@/components/product/ProductTabs";
import { fetchComments } from "@/lib/comments";
import { formatPrice } from "@/lib/format";
import { notFound, redirect } from "next/navigation";
import {
brandName,
catalogTitle,
fetchCatalogProductById,
fetchCatalogProductBySlug,
fetchCatalogProductByTitle,
fetchStoreItemByProduct,
fetchStoreVariant,
galleryUrls,
variantTitle,
type CatalogProduct,
type StoreVariant,
productHref,
} from "@/lib/store";
export const revalidate = 60;
async function resolveProduct(id: string): Promise<{
variant: StoreVariant | null;
catalog: CatalogProduct | null;
productId?: string;
}> {
const variant = await fetchStoreVariant(id);
if (variant) {
const catalog = await fetchCatalogProductByTitle(
variant.productNameFa || variant.productTitle,
variant.productId,
);
return { variant, catalog, productId: variant.productId };
}
const bySlug = await fetchCatalogProductBySlug(id);
if (bySlug) {
return { variant: null, catalog: bySlug, productId: bySlug.id };
}
const byProduct = await fetchStoreItemByProduct(id);
const firstVariant = byProduct.storeItem?.variants?.[0];
if (firstVariant) {
const catalog = await fetchCatalogProductByTitle(
firstVariant.productNameFa || firstVariant.productTitle,
id,
);
return {
variant: {
...firstVariant,
productId: id,
},
catalog,
productId: id,
};
}
return { variant: null, catalog: null };
}
export async function generateMetadata({
/** Legacy `/products/{id-or-slug}` → canonical `/products/{id}/{nameFaSlug}`. */
export default async function LegacyProductRedirect({
params,
}: {
params: Promise<{ id: string }>;
}): Promise<Metadata> {
}) {
const { id } = await params;
const resolved = await resolveProduct(id);
const title =
resolved.catalog?.nameFa ||
resolved.catalog?.title ||
(resolved.variant ? variantTitle(resolved.variant) : null);
const description =
resolved.catalog?.summary?.trim() ||
stripHtml(resolved.catalog?.descriptionHtml) ||
undefined;
return {
title: title || "محصول",
description,
};
}
function stripHtml(html?: string | null) {
if (!html?.trim()) return undefined;
const text = html
.replace(/<[^>]+>/g, " ")
.replace(/\s+/g, " ")
.trim();
return text.slice(0, 180) || undefined;
}
const byId = await fetchCatalogProductById(id);
if (byId) redirect(productHref(byId));
export default async function ProductDetailsPage({ params }: { params: Promise<{ id: string }> }) {
const { id } = await params;
const { variant, catalog, productId } = await resolveProduct(id);
if (!variant && !catalog) notFound();
const bySlug = await fetchCatalogProductBySlug(id);
if (bySlug) redirect(productHref(bySlug));
const comments = productId ? await fetchComments("product", productId) : [];
const sibling =
productId && variant
? await fetchStoreItemByProduct(productId)
: { storeItem: undefined };
const images = galleryUrls(catalog, variant?.productImage || catalog?.image || catalog?.thumbnailUrl);
const price = variant?.discountedPrice ?? variant?.price ?? catalog?.store?.minPrice ?? null;
const oldPrice = variant?.discountedPrice != null ? variant.price : null;
const title = catalog?.nameFa || catalog?.title || (variant ? variantTitle(variant) : "محصول");
const brand = brandName(catalog);
const variants = sibling.storeItem?.variants ?? [];
const inStock =
variant != null
? variant.stockQuantity == null || variant.stockQuantity > 0
: catalog?.store?.inStock !== false;
return (
<section className="py-10 sm:py-14">
<Container>
<p className="text-[13px] text-muted">
<Link href="/" className="hover:text-brand">
خانه
</Link>
<span className="mx-2">/</span>
<Link href="/products" className="hover:text-brand">
محصولات
</Link>
<span className="mx-2">/</span>
{title}
</p>
<div className="mt-5 grid gap-8 lg:grid-cols-[0.9fr_1.1fr]">
<ProductGallery images={images} alt={title} />
<div>
{brand ? <p className="text-[13px] font-medium text-brand">{brand}</p> : null}
{catalog?.categoryNameFa ? (
<p className="mt-1 text-[12px] text-muted">{catalog.categoryNameFa}</p>
) : null}
<h1 className="mt-2 text-[22px] font-extrabold leading-9 text-ink">{title}</h1>
{variant?.label && variant.label !== title ? (
<p className="mt-2 text-[13px] text-muted">{variant.label}</p>
) : null}
<div className="mt-5 flex items-end gap-3">
{oldPrice ? <p className="text-[13px] text-muted line-through">{formatPrice(oldPrice)} تومان</p> : null}
<p className="text-[22px] font-bold text-ink">
{price != null ? (
<>
{formatPrice(price)}
<span className="mr-1 text-[13px] font-medium text-muted">تومان</span>
</>
) : (
<span className="text-[16px] font-medium text-muted">برای قیمت تماس بگیرید</span>
)}
</p>
</div>
<p className={`mt-2 text-[13px] ${inStock ? "text-emerald-600" : "text-brand"}`}>
{inStock ? "موجود در فروشگاه" : "ناموجود"}
</p>
{variants.length > 1 ? (
<div className="mt-5 flex flex-wrap gap-2">
{variants.map((item) => (
<Link
key={item.id}
href={`/products/${encodeURIComponent(item.id)}`}
className={`rounded-lg border px-3 py-1.5 text-[12px] ${item.id === variant?.id ? "border-brand bg-paper text-ink" : "border-line bg-white text-muted"}`}
>
{item.label || variantTitle(item)}
</Link>
))}
</div>
) : null}
<Link
href="/contact"
className="mt-6 inline-flex h-12 items-center justify-center rounded-xl bg-brand px-6 text-[14px] font-bold text-white hover:bg-brand-dark"
>
استعلام و سفارش
</Link>
</div>
</div>
<ProductTabs descriptionHtml={catalog?.descriptionHtml || catalog?.summary} comments={comments} />
</Container>
</section>
);
notFound();
}
+1 -1
View File
@@ -101,7 +101,7 @@ export function BlogCarousel({
key={post.slug}
className="w-[min(85vw,340px)] shrink-0 snap-start rounded-2xl border border-line bg-white p-3"
>
<Link href={`/blog/${post.slug}`} className="group block">
<Link href={blogHref({ id: post.slug, title: post.title })} className="group block">
<div className="overflow-hidden rounded-xl">
<Placeholder
src={post.image}
+5 -2
View File
@@ -6,7 +6,7 @@ import { useRouter } from "next/navigation";
import { Search } from "lucide-react";
import { Placeholder } from "@/components/Placeholder";
import { formatPrice } from "@/lib/format";
import { variantTitle, type StoreVariant } from "@/lib/store";
import { productHref, variantTitle, type StoreVariant } from "@/lib/store";
export function InstantSearch({ compact = false, className = "" }: { compact?: boolean; className?: string }) {
const router = useRouter();
@@ -88,7 +88,10 @@ export function InstantSearch({ compact = false, className = "" }: { compact?: b
return (
<li key={item.id}>
<Link
href={`/products/${encodeURIComponent(item.id)}`}
href={productHref(
item.productId || item.id,
item.productNameFa || item.productTitle || item.label,
)}
className="flex items-center gap-3 px-3 py-2 hover:bg-paper"
onClick={() => setOpen(false)}
>
+2 -1
View File
@@ -3,9 +3,10 @@ import { ArrowUpLeft } from "lucide-react";
import { Placeholder } from "@/components/Placeholder";
import { faDigits, formatPrice } from "@/lib/format";
import type { Product } from "@/lib/data";
import { productHref } from "@/lib/store";
export function ProductCard({ product }: { product: Product }) {
const href = product.href ?? `/products/${encodeURIComponent(product.id)}`;
const href = product.href ?? productHref(product.id, product.title);
return (
<article className="group flex h-full flex-col rounded-2xl border border-line bg-white p-3">
+17 -3
View File
@@ -1,4 +1,5 @@
import { meshkeeGet, tenantPath } from "@/lib/meshkee";
import { detailPath, slugifyForUrl } from "@/lib/seo-slug";
export type BlogPost = {
id: string;
@@ -32,7 +33,16 @@ export async function fetchBlogs(params: { page?: number; pageSize?: number } =
});
}
export async function fetchBlog(slug: string) {
export async function fetchBlogById(id: string) {
const data = await meshkeeGet<{ blog?: BlogPost }>(
tenantPath(`/blogs/by-id/${encodeURIComponent(id)}`),
{},
);
return data.blog ?? null;
}
/** @deprecated Prefer fetchBlogById for public detail pages. */
export async function fetchBlogBySlug(slug: string) {
const data = await meshkeeGet<{ blog?: BlogPost }>(tenantPath(`/blogs/${encodeURIComponent(slug)}`), {});
return data.blog ?? null;
}
@@ -41,6 +51,10 @@ export function blogImage(post: BlogPost) {
return post.titleImageUrl || "/placeholders/blog.svg";
}
export function blogHref(post: BlogPost) {
return `/blog/${encodeURIComponent(post.slug)}`;
export function blogHref(post: Pick<BlogPost, "id" | "title">) {
return detailPath("/blog", post.id, post.title);
}
export function blogTitleSlug(title: string) {
return slugifyForUrl(title);
}
+20
View File
@@ -0,0 +1,20 @@
/**
* Build a URL path segment from a title (Persian / Arabic / Latin).
* Keeps letters and digits; spaces → hyphens; strips other punctuation.
*/
export function slugifyForUrl(value: string, fallback = "item"): string {
const slug = value
.trim()
.normalize("NFC")
.replace(/\s+/g, "-")
.replace(/[^\u0600-\u06FF\u0750-\u077F\u08A0-\u08FF\uFB50-\uFDFF\uFE70-\uFEFFa-zA-Z0-9-]+/g, "")
.replace(/-+/g, "-")
.replace(/^-|-$/g, "");
return slug || fallback;
}
export function detailPath(base: string, id: string | number, title: string) {
const slug = slugifyForUrl(title);
return `${base}/${encodeURIComponent(String(id))}/${encodeURIComponent(slug)}`;
}
+62 -43
View File
@@ -1,5 +1,6 @@
import type { Product } from "@/lib/data";
import { meshkeeGet, tenantPath } from "@/lib/meshkee";
import { detailPath, slugifyForUrl } from "@/lib/seo-slug";
export type StoreVariant = {
id: string;
@@ -85,17 +86,45 @@ function inStock(quantity?: number | null) {
return quantity == null || quantity > 0;
}
export function brandName(product?: CatalogProduct | null) {
const brand = product?.brand;
if (!brand) return "";
if (typeof brand === "string") return brand;
return brand.nameFa || brand.name || "";
}
export function variantTitle(variant: StoreVariant) {
return variant.productNameFa?.trim() || variant.productTitle?.trim() || variant.label?.trim() || "محصول";
}
export function catalogTitle(product: Pick<CatalogProduct, "nameFa" | "title" | "id">) {
return product.nameFa?.trim() || product.title?.trim() || String(product.id);
}
/** Public product URL: /products/{id}/{nameFaSlug} — never use legacy DB slug. */
export function productHref(
productOrId: string | number | Pick<CatalogProduct, "id" | "nameFa" | "title">,
title?: string | null,
) {
if (typeof productOrId === "object") {
return detailPath("/products", productOrId.id, catalogTitle(productOrId));
}
return detailPath("/products", productOrId, title?.trim() || String(productOrId));
}
export function productNameSlug(title: string) {
return slugifyForUrl(title);
}
export function variantToProduct(variant: StoreVariant): Product {
const price = asNumber(variant.discountedPrice) ?? asNumber(variant.price);
const oldPrice = asNumber(variant.discountedPrice) != null ? asNumber(variant.price) ?? undefined : undefined;
const productId = variant.productId ?? variant.id;
const title = variantTitle(variant);
return {
id: String(variant.id),
href: `/products/${encodeURIComponent(String(variant.id))}`,
title: variantTitle(variant),
id: String(productId),
href: productHref(productId, title),
title,
brand: variant.selections?.map((item) => item.value).filter(Boolean).join(" / ") || variant.label || "",
price: price ?? undefined,
oldPrice,
@@ -105,7 +134,7 @@ export function variantToProduct(variant: StoreVariant): Product {
};
}
export function specialItemToProduct(item: StoreSpecialProduct, slug?: string | null): Product | null {
export function specialItemToProduct(item: StoreSpecialProduct): Product | null {
if (item.isActive === false) return null;
const variant = item.variants?.[0];
@@ -124,13 +153,9 @@ export function specialItemToProduct(item: StoreSpecialProduct, slug?: string |
if (!title && !item.productImage) return null;
const id = String(item.productId ?? item.id);
const href = slug
? `/products/${encodeURIComponent(slug)}`
: `/products?q=${encodeURIComponent(title || id)}`;
return {
id,
href,
href: productHref(id, title || id),
title: title || "محصول",
brand: "",
image: item.productImage || PLACEHOLDER,
@@ -186,19 +211,9 @@ export async function fetchSpecialProducts(key: string) {
.filter((item) => item.isActive !== false)
.sort((a, b) => (a.sortOrder ?? 0) - (b.sortOrder ?? 0));
const products = (
await Promise.all(
rawItems.map(async (item) => {
if (item.variants?.[0]) return specialItemToProduct(item);
const catalog = await fetchCatalogProductByTitle(
item.productNameFa || item.productTitle,
item.productId,
);
return specialItemToProduct(item, catalog?.slug);
}),
)
).filter((item): item is Product => Boolean(item));
const products = rawItems
.map((item) => specialItemToProduct(item))
.filter((item): item is Product => Boolean(item));
return { special, products };
}
@@ -238,8 +253,8 @@ export function catalogProductToCard(product: CatalogProduct): Product {
const price = asNumber(product.store?.minPrice);
return {
id: String(product.id),
href: product.slug ? `/products/${encodeURIComponent(product.slug)}` : `/products?q=${encodeURIComponent(product.nameFa || product.title || product.id)}`,
title: product.nameFa?.trim() || product.title?.trim() || "محصول",
href: productHref(product),
title: catalogTitle(product),
brand: brandName(product) || product.categoryNameFa || "",
price: price ?? undefined,
image: product.thumbnailUrl || product.image || product.thumbnail || PLACEHOLDER,
@@ -247,21 +262,32 @@ export function catalogProductToCard(product: CatalogProduct): Product {
};
}
export async function fetchCatalogProductByTitle(title?: string | null, productId?: string | null) {
if (!title?.trim() && !productId) return null;
const query = title?.trim() || String(productId);
const data = await meshkeeGet<Paged<CatalogProduct>>(
tenantPath(`/products?name=${encodeURIComponent(query)}&pageSize=12`),
{ items: [], total: 0, page: 1, pageSize: 12 },
export async function fetchCatalogProductById(productId: string) {
const data = await meshkeeGet<{ product?: CatalogProduct }>(
tenantPath(`/products/by-id/${encodeURIComponent(productId)}`),
{},
);
const match =
data.items.find((item) => String(item.id) === String(productId)) ??
data.items[0] ??
null;
if (!match?.slug) return match;
return fetchCatalogProductBySlug(match.slug);
return data.product ?? null;
}
export async function fetchCatalogProductByTitle(title?: string | null, productId?: string | null) {
if (productId) {
const byId = await fetchCatalogProductById(String(productId));
if (byId) return byId;
}
if (!title?.trim()) return null;
const data = await meshkeeGet<Paged<CatalogProduct>>(
tenantPath(`/products?name=${encodeURIComponent(title.trim())}&pageSize=12`),
{ items: [], total: 0, page: 1, pageSize: 12 },
);
return (
data.items.find((item) => String(item.id) === String(productId)) ??
data.items[0] ??
null
);
}
/** @deprecated Prefer fetchCatalogProductById for public detail pages. */
export async function fetchCatalogProductBySlug(slug: string) {
const data = await meshkeeGet<{ product?: CatalogProduct }>(
tenantPath(`/products/${encodeURIComponent(slug)}`),
@@ -269,10 +295,3 @@ export async function fetchCatalogProductBySlug(slug: string) {
);
return data.product ?? null;
}
export function brandName(product?: CatalogProduct | null) {
const brand = product?.brand;
if (!brand) return "";
if (typeof brand === "string") return brand;
return brand.nameFa || brand.name || "";
}