How to edit custom events in the webEngage

Introduction

This document will help you understand how to edit custom events in the webEngage.

You can see the list of events sent to webEngage here

Steps

1. Add this filter in the eventsHelper.js file in the your-theme/helpers/eventsHelper.js file.
2. Add the following code in the updateWebEngageEvents function.

import { appmaker } from '@appmaker-xyz/core';

function updateWebEngageEvents(){
    appmaker.addFilter(
    'webengageEventData',
    'custom-events',
    ({ eventName, params, eventObject }) => {
      switch (eventName) {
        case 'Added to Wishlist':
            console.log('params', params); // params is an object object which contains the sending event attributes of the event.
            console.log('eventObject', eventObject); // eventObject is an object that contains whole data for the event.
            // example of updating the event params object using the eventObject
            params.Title = eventObject?.product_name?.value;
            eventName = 'Add to Wishlist'; // changing the event name
            break;
        case 'Added to Cart':
            eventName = 'Add to Cart'; // example of updating the event name
            params.Title = eventObject?.product_name?.value;
            break;
        default:
          break;
        }   
        // sending the updated params and eventName
        return {
          eventName,
          params,
        };
    },
    );
}
export { updateWebEngageEvents }

3. call this updateWebEngageEvents function in the your-theme/index.js file activate.

import { updateWebEngageEvents } from './eventsHelper';

// inside the activate function
updateWebEngageEvents();