feat: add bundle feature with 2x/3x set options

- Created BundleSelector component for selecting bundle options
- Updated ProductDetail to show bundle options
- Added bundle translations for all 4 locales
- Added GraphQL query for bundle products
- Updated TypeScript types for attributes
- Saleor backend: created bundle products for all base products

src/app/[locale]/products/[slug]/page.tsx

@@ -1,4 +1,4 @@
-import { getProductBySlug, getProducts, getLocalizedProduct } from "@/lib/saleor";
+import { getProductBySlug, getProducts, getLocalizedProduct, getBundleProducts } from "@/lib/saleor";
 import { getTranslations, setRequestLocale } from "next-intl/server";
 import Header from "@/components/layout/Header";
 import Footer from "@/components/layout/Footer";
@@ -86,6 +86,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
   }
 
   let relatedProducts: Product[] = [];
+  let bundleProducts: Product[] = [];
   try {
     const allProducts = await getProducts(saleorLocale, 8);
     relatedProducts = allProducts
@@ -93,6 +94,20 @@ export default async function ProductPage({ params }: ProductPageProps) {
       .slice(0, 4);
   } catch (e) {}
 
+  try {
+    const allBundleProducts = await getBundleProducts(saleorLocale, 50);
+    bundleProducts = allBundleProducts.filter((p) => {
+      const bundleAttr = p.attributes?.find(
+        (attr) => attr.attribute.slug === "bundle-items"
+      );
+      if (!bundleAttr) return false;
+      return bundleAttr.values.some((val) => {
+        const baseIdPart = product.id.replace("UHJvZHVjdDo", "");
+        return val.slug.includes(baseIdPart);
+      });
+    });
+  } catch (e) {}
+
   return (
     <>
       <Header locale={locale} />
@@ -100,6 +115,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
         <ProductDetail
           product={product}
           relatedProducts={relatedProducts}
+          bundleProducts={bundleProducts}
           locale={locale}
         />
       </main>