meshkee-websites/brb-store
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Polish storefront SEO, specials, and homepage UX.

Browse Source 
Publish Meshkee sitemap-config, map product-source specials without variants, restore hero autoplay, and tighten page heroes, product images, and section order.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Alireza Hassani
2026-08-22 21:48:00 +03:30
co-authored by Cursor
parent 11d0ba64ed
commit 24b5649abd
22 changed files with 735 additions and 298 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/products/[id]/page.tsx
+83 -17
View File
@@ -8,45 +8,108 @@ import { fetchComments } from "@/lib/comments";
import { formatPrice } from "@/lib/format";
import {
brandName,
fetchCatalogProductBySlug,
fetchCatalogProductByTitle,
fetchStoreItemByProduct,
fetchStoreVariant,
galleryUrls,
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 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({
params,
}: {
params: Promise<{ id: string }>;
}): Promise<Metadata> {
const { id } = await params;
const variant = await fetchStoreVariant(id);
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: variant ? variantTitle(variant) : "محصول",
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;
}
export default async function ProductDetailsPage({ params }: { params: Promise<{ id: string }> }) {
const { id } = await params;
const variant = await fetchStoreVariant(id);
if (!variant) notFound();
const { variant, catalog, productId } = await resolveProduct(id);
if (!variant && !catalog) notFound();
const [catalog, storeItem, comments] = await Promise.all([
fetchCatalogProductByTitle(variant.productNameFa || variant.productTitle, variant.productId),
variant.productId ? fetchStoreItemByProduct(variant.productId) : Promise.resolve({ storeItem: undefined }),
variant.productId ? fetchComments("product", variant.productId) : Promise.resolve([]),
]);
const comments = productId ? await fetchComments("product", productId) : [];
const sibling =
productId && variant
? await fetchStoreItemByProduct(productId)
: { storeItem: undefined };
const images = galleryUrls(catalog, variant.productImage);
const price = variant.discountedPrice ?? variant.price;
const oldPrice = variant.discountedPrice != null ? variant.price : null;
const title = catalog?.nameFa || variantTitle(variant);
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 = storeItem.storeItem?.variants ?? [];
const inStock = variant.stockQuantity == null || variant.stockQuantity > 0;
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">
@@ -67,8 +130,11 @@ export default async function ProductDetailsPage({ params }: { params: Promise<{
<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 ? (
{variant?.label && variant.label !== title ? (
<p className="mt-2 text-[13px] text-muted">{variant.label}</p>
) : null}
@@ -95,7 +161,7 @@ export default async function ProductDetailsPage({ params }: { params: Promise<{
<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"}`}
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>
app/products/page.tsx
+63 -54
View File
@@ -1,10 +1,16 @@
import type { Metadata } from "next";
import Link from "next/link";
import { Container } from "@/components/Container";
import { PageHero } from "@/components/layout/PageHero";
import { ProductCard } from "@/components/ui/ProductCard";
import { fetchStoreItems, variantToProduct } from "@/lib/store";
import { getNavCategories } from "@/lib/categories";
import { faDigits } from "@/lib/format";
import {
catalogProductToCard,
fetchCatalogProducts,
fetchStoreItems,
variantToProduct,
} from "@/lib/store";
export const revalidate = 60;
@@ -22,67 +28,70 @@ export default async function ProductsPage({
const page = Math.max(1, Number(params.page) || 1);
const categoryId = params.categoryId;
const q = params.q?.trim();
const [result, nav] = await Promise.all([
fetchStoreItems({ page, pageSize: 20, categoryId, name: q && q.length > 2 ? q : undefined }),
const name = q && q.length > 2 ? q : undefined;
const [storeResult, catalogResult, nav] = await Promise.all([
fetchStoreItems({ page, pageSize: 20, categoryId, name }),
fetchCatalogProducts({ page, pageSize: 20, categoryId, name }),
getNavCategories(),
]);
const products = result.items.map(variantToProduct);
const pageCount = Math.max(1, Math.ceil((result.total || products.length) / (result.pageSize || 20)));
const fromStore = storeResult.items.map(variantToProduct);
const products = fromStore.length ? fromStore : catalogResult.items.map(catalogProductToCard);
const total = fromStore.length ? storeResult.total : catalogResult.total;
const pageSize = fromStore.length ? storeResult.pageSize : catalogResult.pageSize;
const pageCount = Math.max(1, Math.ceil((total || products.length) / (pageSize || 20)));
const categoryTitle = nav
.flatMap((item) => [item, ...item.children.map((child) => ({ ...child, children: [] as never[] }))])
.find((item) => item.id === categoryId)?.title;
const heroTitle = categoryTitle || (q ? `جستجو: ${q}` : "محصولات");
return (
<section className="py-10 sm:py-14">
<Container>
<div className="mb-6">
<p className="text-[13px] text-muted">
<Link href="/" className="hover:text-brand">
خانه
</Link>
<span className="mx-2">/</span>
محصولات
</p>
<h1 className="mt-2 text-[22px] font-extrabold text-ink">
{categoryTitle || (q ? `جستجو: ${q}` : "همه محصولات")}
</h1>
{result.total ? <p className="mt-1 text-[13px] text-muted">{faDigits(result.total)} کالا</p> : null}
</div>
<>
<PageHero
kicker="Products"
title={heroTitle}
image="/images/lifestyle/franco-debartolo-AXC2vD7y_ho-unsplash.jpg"
/>
<section className="py-10 sm:py-14">
<Container>
{total ? <p className="mb-6 text-[13px] text-muted">{faDigits(total)} کالا</p> : null}
{products.length === 0 ? (
<div className="rounded-2xl border border-line bg-white px-6 py-16 text-center">
<p className="text-[15px] font-bold text-ink">محصولی برای نمایش وجود ندارد</p>
<p className="mt-2 text-[13px] text-muted">به‌زودی موجودی فروشگاه از پنل Meshkee اینجا دیده می‌شود.</p>
</div>
) : (
<div className="grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
{products.map((product) => (
<ProductCard key={product.id} product={product} />
))}
</div>
)}
{products.length === 0 ? (
<div className="rounded-2xl border border-line bg-white px-6 py-16 text-center">
<p className="text-[15px] font-bold text-ink">محصولی برای نمایش وجود ندارد</p>
<p className="mt-2 text-[13px] text-muted">به‌زودی موجودی فروشگاه از پنل Meshkee اینجا دیده می‌شود.</p>
</div>
) : (
<div className="grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
{products.map((product) => (
<ProductCard key={product.id} product={product} />
))}
</div>
)}
{pageCount > 1 ? (
<div className="mt-8 flex justify-center gap-2">
{Array.from({ length: pageCount }, (_, index) => {
const number = index + 1;
const query = new URLSearchParams();
if (categoryId) query.set("categoryId", categoryId);
if (q) query.set("q", q);
query.set("page", String(number));
return (
<Link
key={number}
href={`/products?${query.toString()}`}
className={`grid size-10 place-items-center rounded-xl text-[13px] ${number === page ? "bg-brand text-white" : "border border-line bg-white text-ink"}`}
>
{faDigits(number)}
</Link>
);
})}
</div>
) : null}
</Container>
</section>
{pageCount > 1 ? (
<div className="mt-8 flex justify-center gap-2">
{Array.from({ length: pageCount }, (_, index) => {
const number = index + 1;
const query = new URLSearchParams();
if (categoryId) query.set("categoryId", categoryId);
if (q) query.set("q", q);
query.set("page", String(number));
return (
<Link
key={number}
href={`/products?${query.toString()}`}
className={`grid size-10 place-items-center rounded-xl text-[13px] ${number === page ? "bg-brand text-white" : "border border-line bg-white text-ink"}`}
>
{faDigits(number)}
</Link>
);
})}
</div>
) : null}
</Container>
</section>
</>
);
}