- app/components/product/ProductDescription.tsx: new below-fold section with a "توضیحات محصول" heading, whitespace-pre-line so multi-line seller copy (Instagram scrapes, victorwear WooCommerce imports) renders with its bullet-list line breaks preserved. Renders on both mobile and desktop; nothing shown when the product has no description. - app/components/product/ProductInfo.tsx: removed the collapsed single-<p> mobile description; the new section replaces it. - app/components/product/ProductDetailView.tsx: pricingOf now hides the discount when discount_price >= price (was only hiding when equal), so a stale row where the discount price accidentally matches or exceeds the base can never render as a fake promo. Mounts ProductDescription just above the mobile Contact button and reviews. - app/components/product/index.ts: export ProductDescription. - src/api/types/models/index.ts: ProductCategory now carries readonly parentId / parentName so the two-step category picker can build the parent→sub tree from a flat category list without an extra fetch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
33 lines
1.2 KiB
TypeScript
33 lines
1.2 KiB
TypeScript
import discountRed from "~/assets/icons/product/discount-red.svg";
|
|
import { ProductDetail } from "src/api/types";
|
|
|
|
interface ProductInfoProps {
|
|
product: ProductDetail;
|
|
productDiscountPercent: number;
|
|
}
|
|
|
|
export const ProductInfo = ({
|
|
product,
|
|
productDiscountPercent,
|
|
}: ProductInfoProps) => (
|
|
<div className="flex flex-col gap-2 mt-8 px-4 lg:mt-2">
|
|
<div className="flex gap-3 items-center">
|
|
{productDiscountPercent && productDiscountPercent > 0 ? (
|
|
<div className="flex gap-[2px] items-center">
|
|
<p className="text-B14 font-bold text-RED mt-1">
|
|
{productDiscountPercent || "0"}
|
|
</p>
|
|
<img src={discountRed} alt="discount-red" className="w-6 h-6" />
|
|
</div>
|
|
) : null}
|
|
{productDiscountPercent && productDiscountPercent > 0 ? (
|
|
<div className="w-[6px] h-[6px] rounded-full bg-BLACK" />
|
|
) : null}
|
|
<p className="text-B18 lg:text-[26px] font-bold">{product.title}</p>
|
|
</div>
|
|
{/* Description moved into the dedicated ProductDescription section below
|
|
the buy actions so multi-line seller copy renders with line breaks and
|
|
appears on desktop too. */}
|
|
</div>
|
|
);
|