Merge pull request #384 from Secreto31126/product-carousel

Product carousel support
Secreto31126 · Oct 21, 2024 · 58e4d3d · 58e4d3d
2 parents bf78987 + dce26e6
commit 58e4d3d
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 3 deletions.
diff --git a/EXAMPLES/README.md b/EXAMPLES/README.md
@@ -53,5 +53,6 @@ the most basic methods or features.
     -   [Complex template with Single-Product Message](template.md#complex-template-with-single-product-message)
     -   [Complex template with Multi-Product Message](template.md#complex-template-with-multi-product-message)
     -   [Complex template with Carousel](template.md#complex-template-with-carousel)
+    -   [Complex template with Product Carousel](template.md#complex-template-with-product-carousel)
     -   [Complex template with Limited-Time Offer](template.md#complex-template-with-limited-time-offer)
     -   [OTP prefab template](template.md#otp-prefab-template)
diff --git a/EXAMPLES/template.md b/EXAMPLES/template.md
@@ -206,11 +206,39 @@ const template_carousel_message = new Template(
     new BodyComponent(new BodyParameter("PROMO10")),
     new CarouselComponent(
         new CarouselCard(
-            new Image(image),
+            new Image("image_url"),
             new URLComponent("?code=PROMO10&product=1")
         ),
         new CarouselCard(
-            new Image(image),
+            new Image("image_url"),
+            new URLComponent("?code=PROMO10&product=2")
+        )
+    )
+);
+```
+
+## Complex template with Product Carousel
+
+```ts
+import {
+    Template,
+    BodyComponent,
+    CarouselComponent,
+    CarouselCard,
+    CatalogProduct
+} from "whatsapp-api-js/messages";
+
+const template_product_carousel_message = new Template(
+    "template_name",
+    "en",
+    new BodyComponent(new BodyParameter("PROMO10")),
+    new CarouselComponent(
+        new CarouselCard(
+            new CatalogProduct("product_id_1", "catalog_id"),
+            new URLComponent("?code=PROMO10&product=1")
+        ),
+        new CarouselCard(
+            new CatalogProduct("product_id_2", "catalog_id"),
             new URLComponent("?code=PROMO10&product=2")
         )
     )

diff --git a/src/messages/template.ts b/src/messages/template.ts
@@ -910,7 +910,7 @@ export class CarouselCard implements ClientBuildableMessageComponent {
      * @param components - The other components for the card
      */
     constructor(
-        header: Image | Video,
+        header: Image | Video | CatalogProduct,
         ...components: (BodyComponent | ButtonComponent)[]
     ) {
         const tmp = new Template(