fix: bundle UI improvements - remove QTY selector, filter bundles from similar products
Some checks failed
Build and Deploy / build (push) Has been cancelled
Some checks failed
Build and Deploy / build (push) Has been cancelled
This commit is contained in:
@@ -88,9 +88,10 @@ export default async function ProductPage({ params }: ProductPageProps) {
|
|||||||
let relatedProducts: Product[] = [];
|
let relatedProducts: Product[] = [];
|
||||||
let bundleProducts: Product[] = [];
|
let bundleProducts: Product[] = [];
|
||||||
try {
|
try {
|
||||||
const allProducts = await getProducts(saleorLocale, 8);
|
const allProducts = await getProducts(saleorLocale, 50);
|
||||||
relatedProducts = allProducts
|
relatedProducts = allProducts
|
||||||
.filter((p: Product) => p.id !== product.id)
|
.filter((p: Product) => p.id !== product.id)
|
||||||
|
.filter((p) => !p.name.includes("2x Set") && !p.name.includes("3x Set"))
|
||||||
.slice(0, 4);
|
.slice(0, 4);
|
||||||
} catch (e) {}
|
} catch (e) {}
|
||||||
|
|
||||||
@@ -100,10 +101,9 @@ export default async function ProductPage({ params }: ProductPageProps) {
|
|||||||
const bundleAttr = p.attributes?.find(
|
const bundleAttr = p.attributes?.find(
|
||||||
(attr) => attr.attribute.slug === "bundle-items"
|
(attr) => attr.attribute.slug === "bundle-items"
|
||||||
);
|
);
|
||||||
if (!bundleAttr) return false;
|
if (!bundleAttr || bundleAttr.values.length === 0) return false;
|
||||||
return bundleAttr.values.some((val) => {
|
return bundleAttr.values.some((val) => {
|
||||||
const baseIdPart = product.id.replace("UHJvZHVjdDo", "");
|
return val.name === product.name || p.name.includes(product.name.split(" - ")[0]);
|
||||||
return val.slug.includes(baseIdPart);
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
} catch (e) {}
|
} catch (e) {}
|
||||||
|
|||||||
@@ -27,7 +27,11 @@ export default async function ProductsPage({ params }: ProductsPageProps) {
|
|||||||
setRequestLocale(validLocale);
|
setRequestLocale(validLocale);
|
||||||
const t = await getTranslations("Products");
|
const t = await getTranslations("Products");
|
||||||
const saleorLocale = getSaleorLocale(validLocale as Locale);
|
const saleorLocale = getSaleorLocale(validLocale as Locale);
|
||||||
const products = await getProducts(saleorLocale);
|
const allProducts = await getProducts(saleorLocale);
|
||||||
|
|
||||||
|
const products = allProducts.filter((product) => {
|
||||||
|
return !product.name.includes("2x Set") && !product.name.includes("3x Set");
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|||||||
@@ -354,28 +354,6 @@ export default function ProductDetail({ product, relatedProducts, bundleProducts
|
|||||||
)
|
)
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="flex items-center gap-4 mb-8">
|
|
||||||
<span className="text-sm uppercase tracking-[0.1em] font-medium w-16">
|
|
||||||
{t("qty")}
|
|
||||||
</span>
|
|
||||||
<div className="flex items-center border-2 border-[#1a1a1a]">
|
|
||||||
<button
|
|
||||||
onClick={() => setQuantity(Math.max(1, quantity - 1))}
|
|
||||||
className="w-12 h-12 flex items-center justify-center hover:bg-[#f8f9fa] transition-colors"
|
|
||||||
disabled={quantity <= 1}
|
|
||||||
>
|
|
||||||
<Minus className="w-4 h-4" />
|
|
||||||
</button>
|
|
||||||
<span className="w-14 text-center text-base font-medium">{quantity}</span>
|
|
||||||
<button
|
|
||||||
onClick={() => setQuantity(quantity + 1)}
|
|
||||||
className="w-12 h-12 flex items-center justify-center hover:bg-[#f8f9fa] transition-colors"
|
|
||||||
>
|
|
||||||
<Plus className="w-4 h-4" />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{isAvailable ? (
|
{isAvailable ? (
|
||||||
<button
|
<button
|
||||||
onClick={handleAddToCart}
|
onClick={handleAddToCart}
|
||||||
|
|||||||
Reference in New Issue
Block a user