AddToCart, Purchase

elbwalker · Feb 20, 2025 · d52fc43 · d52fc43
1 parent 3062c06
commit d52fc43
Show file tree

Hide file tree

Showing 6 changed files with 110 additions and 69 deletions.
diff --git a/packages/destinations/web/google-ga4/src/index.test.ts b/packages/destinations/web/google-ga4/src/index.test.ts
@@ -1,5 +1,5 @@
 import type { DestinationGoogleGA4 } from '.';
-import { getEvent, isObject } from '@elbwalker/utils';
+import { getEvent } from '@elbwalker/utils';
 import { elb, Walkerjs } from '@elbwalker/walker.js';
 import { events, mapping } from '../examples';
 

diff --git a/packages/destinations/web/meta-pixel/examples/events.ts b/packages/destinations/web/meta-pixel/examples/events.ts
@@ -0,0 +1,40 @@
+import type { WalkerOS } from '@elbwalker/types';
+import { getEvent } from '@elbwalker/utils';
+
+export function Purchase(custom: WalkerOS.AnyObject = {}) {
+  const event = getEvent('order complete');
+  const product1 = event.nested[0].data;
+  const product2 = event.nested[1].data;
+
+  return [
+    'track',
+    'Purchase',
+    {
+      value: event.data.total,
+      currency: 'EUR',
+      contents: [
+        { id: product1.id, quantity: 1 },
+        { id: product2.id, quantity: 1 },
+      ],
+      content_type: 'product',
+      num_items: 2,
+      ...custom,
+    },
+  ];
+}
+
+export function AddToCart(custom: WalkerOS.AnyObject = {}) {
+  const event = getEvent('product add');
+
+  return [
+    'track',
+    'AddToCart',
+    {
+      currency: 'EUR',
+      value: event.data.price,
+      contents: [{ id: event.data.id, quantity: 1 }],
+      content_type: 'product',
+      ...custom,
+    },
+  ];
+}
diff --git a/packages/destinations/web/meta-pixel/examples/index.ts b/packages/destinations/web/meta-pixel/examples/index.ts
@@ -0,0 +1,2 @@
+export * as events from './events';
+export * as mapping from './mapping';
diff --git a/packages/destinations/web/meta-pixel/examples/mapping.ts b/packages/destinations/web/meta-pixel/examples/mapping.ts
@@ -0,0 +1,59 @@
+import type { Mapping, WalkerOS } from '@elbwalker/types';
+import type { DestinationMetaPixel } from '../src';
+import { isObject } from '@elbwalker/utils';
+
+export const Purchase: DestinationMetaPixel.EventConfig = {
+  name: 'Purchase',
+  data: {
+    map: {
+      value: 'data.total',
+      currency: { value: 'EUR' },
+      contents: {
+        loop: [
+          'nested',
+          {
+            condition: (entity) =>
+              isObject(entity) && entity.type === 'product',
+            map: {
+              id: 'data.id',
+              quantity: { key: 'data.quantity', value: 1 },
+            },
+          },
+        ],
+      },
+      content_type: { value: 'product' },
+      num_items: {
+        fn: (event) =>
+          (event as WalkerOS.Event).nested.filter(
+            (item) => item.type === 'product',
+          ).length,
+      },
+    },
+  },
+};
+
+export const AddToCart: DestinationMetaPixel.EventConfig = {
+  name: 'AddToCart',
+  data: {
+    map: {
+      value: 'data.price',
+      currency: { value: 'EUR' },
+      contents: {
+        set: [
+          {
+            map: {
+              id: 'data.id',
+              quantity: { key: 'data.quantity', value: 1 },
+            },
+          },
+        ],
+      },
+      content_type: { value: 'product' },
+    },
+  },
+};
+
+export const config = {
+  order: { complete: Purchase },
+  product: { add: AddToCart },
+} satisfies Mapping.Config;
diff --git a/packages/destinations/web/meta-pixel/src/index.test.ts b/packages/destinations/web/meta-pixel/src/index.test.ts
@@ -2,6 +2,7 @@ import type { DestinationMetaPixel } from '.';
 import type { DestinationWeb } from '@elbwalker/walker.js';
 import { elb, Walkerjs } from '@elbwalker/walker.js';
 import { getEvent } from '@elbwalker/utils';
+import { events, mapping } from '../examples';
 
 describe('Destination Meta Pixel', () => {
   const w = window;
@@ -106,88 +107,24 @@ describe('Destination Meta Pixel', () => {
 
     const config: DestinationWeb.Config = {
       custom: { pixelId },
-      mapping: {
-        order: {
-          complete: {
-            name: 'Purchase',
-            data: {
-              map: {
-                currency: { value: 'EUR' },
-                value: 'data.total',
-                contents: {
-                  loop: [
-                    'nested',
-                    {
-                      condition: (entity) => entity.type === 'product',
-                      map: {
-                        id: 'data.id',
-                        quantity: { key: 'data.quantity', value: 1 },
-                      },
-                    },
-                  ],
-                },
-                content_type: { value: 'product' },
-              },
-            },
-          },
-        },
-      },
+      mapping: mapping.config,
     };
 
     elb('walker destination', destination, config);
 
     elb(event);
-    expect(mockFn).toHaveBeenCalledWith(
-      'track',
-      'Purchase',
-      expect.objectContaining({
-        contents: [
-          { id: 'ers', quantity: 1 },
-          { id: 'cc', quantity: 1 },
-        ],
-        currency: 'EUR',
-        value: 555,
-      }),
-    );
+    expect(mockFn).toHaveBeenCalledWith(...events.Purchase());
   });
 
   test('event AddToCart', () => {
     const event = getEvent('product add');
 
     elb('walker destination', destination, {
       custom: { pixelId },
-      mapping: {
-        product: {
-          add: {
-            name: 'AddToCart',
-            data: {
-              map: {
-                currency: { value: 'EUR' },
-                value: 'data.price',
-                content_ids: {
-                  fn: (event) =>
-                    [event].map(
-                      (product) => product.data!.id || product.data!.name,
-                    ),
-                },
-                content_type: { value: 'product' },
-              },
-            },
-          },
-        },
-      },
+      mapping: mapping.config,
     });
 
     elb(event);
-    expect(mockFn).toHaveBeenCalledWith(
-      'track',
-      'AddToCart',
-      expect.objectContaining({
-        content_ids: [event.data.id],
-        content_type: 'product',
-        currency: 'EUR',
-        value: event.data.price,
-      }),
-    );
+    expect(mockFn).toHaveBeenCalledWith(...events.AddToCart());
   });
 });
diff --git a/packages/destinations/web/meta-pixel/src/types/index.ts b/packages/destinations/web/meta-pixel/src/types/index.ts
@@ -1,3 +1,4 @@
+import type { Mapping } from '@elbwalker/types';
 import type { DestinationWeb } from '@elbwalker/walker.js';
 
 declare global {
@@ -22,6 +23,8 @@ export interface CustomEvent {
   trackCustom?: string; // Name of a custom event to track
 }
 
+export type EventConfig = Mapping.EventConfig<CustomEvent>;
+
 export type StandardEventNames =
   | 'PageView'
   | 'AddPaymentInfo'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export * as events from './events';
		export * as mapping from './mapping';