@customerio/cdp-analytics-browser 0.0.1 → 0.0.2

package/src/generated/version.ts

@@ -1,2 +1,2 @@
 // This file is generated.
-export const version = '0.0.1'
+export const version = '0.0.2'

package/src/plugins/customerio/batched-dispatcher.ts

@@ -43,10 +43,7 @@ function chunks(batch: object[]): Array<object[]> {
   return result
 }
 
-export default function batch(
-  apiHost: string,
-  config?: BatchingDispatchConfig
-) {
+export default function batch(remote: string, config?: BatchingDispatchConfig) {
   let buffer: object[] = []
   let pageUnloaded = false
 
@@ -60,7 +57,7 @@ export default function batch(
 
     const writeKey = (batch[0] as CustomerioEvent)?.writeKey
 
-    return fetch(`https://${apiHost}/b`, {
+    return fetch(`${remote}/b`, {
       keepalive: pageUnloaded,
       headers: {
         'Content-Type': 'text/plain',

package/src/plugins/customerio/index.ts

@@ -78,7 +78,7 @@ export function customerio(
   const deliveryStrategy = settings?.deliveryStrategy
   const client =
     deliveryStrategy?.strategy === 'batching'
-      ? batch(apiHost, deliveryStrategy.config)
+      ? batch(remote, deliveryStrategy.config)
       : standard(deliveryStrategy?.config as StandardDispatcherConfig)
 
   async function send(ctx: Context): Promise<Context> {
@@ -130,6 +130,7 @@ export function customerio(
     page: send,
     alias: send,
     group: send,
+    screen: send,
   }
 
   // Buffer may already have items if they were previously stored in localStorage.

package/src/plugins/in-app-plugin/events.ts

@@ -0,0 +1,33 @@
+export enum InAppEvents {
+    MessageOpened = 'in-app:message-opened',
+    MessageDismissed =  'in-app:message-dismissed',
+    MessageError = 'in-app:message-error',
+    MessageAction = 'in-app:message-action'
+}
+
+export const allEvents:string[] = Object.values(InAppEvents);
+
+export enum SemanticEvents {
+    JourneyMetric = 'Report Delivery Event',
+    Opened = 'opened',
+    Clicked = 'clicked',
+}
+
+export function newEvent(type:string, detail:any): CustomEvent {
+    return new CustomEvent(type, { detail })
+}
+
+export function gistToCIO(gistEvent:string): string {
+    switch (gistEvent) {
+        case 'messageShown':
+            return InAppEvents.MessageOpened;
+        case 'messageDismissed':
+            return InAppEvents.MessageDismissed;
+        case 'messageError':
+            return InAppEvents.MessageError;
+        case 'messageAction':
+            return InAppEvents.MessageAction;
+        default:
+            return "";
+    }
+}

package/src/plugins/in-app-plugin/index.ts

@@ -0,0 +1,156 @@
+import { Analytics } from '../../core/analytics'
+import { Context } from '../../core/context'
+import { Plugin } from '../../core/plugin'
+
+import { InAppEvents, SemanticEvents, newEvent, allEvents, gistToCIO } from './events'
+import Gist from 'customerio-gist-web'
+
+export { InAppEvents }
+
+export type InAppPluginSettings = {
+    siteId: string | undefined
+    events: EventListenerOrEventListenerObject | null | undefined
+
+    _env: string | undefined
+    _logging: boolean | undefined
+}
+
+export function InAppPlugin(
+    settings: InAppPluginSettings,
+  ): Plugin {
+
+    let _analytics: Analytics;
+    let _gistLoaded:boolean = false;
+    let _pluginLoaded:boolean = false;
+    const _eventTarget:EventTarget = new EventTarget();
+
+    function attachListeners() {
+        if(!_gistLoaded || _pluginLoaded)
+            return;
+
+        _analytics.on('reset', reset);
+
+        if(settings.events) {
+            allEvents.forEach((event) => {
+                _eventTarget.addEventListener(event, settings?.events as EventListenerOrEventListenerObject);
+            });
+            ['messageShown', 'messageDismissed', 'messageError'].forEach((event) => {
+                Gist.events.on(event, (message: any) => {
+                    _eventTarget.dispatchEvent(newEvent(gistToCIO(event), { 
+                        messageId: message.messageId,
+                        deliveryId: message.properties?.gist?.campaignId,
+                    }));
+                });
+            });
+        }
+
+        Gist.events.on('messageShown', (message: any) => {
+            const deliveryId:string = message?.properties?.gist?.campaignId;
+            if (typeof deliveryId != 'undefined' && deliveryId != '') {
+                _analytics.track(SemanticEvents.JourneyMetric, {
+                    'deliveryId': deliveryId,
+                    'metric': SemanticEvents.Opened,
+                });
+            }
+        });
+
+        Gist.events.on('messageAction', (params: any) => {
+            const deliveryId:string = params?.message?.properties?.gist?.campaignId;
+            if (params.action != 'gist://close' && typeof deliveryId != 'undefined' && deliveryId != '') {
+                _analytics.track(SemanticEvents.JourneyMetric, {
+                    'deliveryId': deliveryId,
+                    'metric': SemanticEvents.Clicked,
+                    'actionName': params.name,
+                    'actionValue': params.action,
+                });
+            }
+            settings.events && _eventTarget.dispatchEvent(newEvent(InAppEvents.MessageAction, {
+                messageId: params.message.messageId,
+                deliveryId: deliveryId,
+                action: params.action,
+                name: params.name,
+                actionName: params.name,
+                actionValue: params.action,
+                message:{
+                    dismiss: function() {
+                        Gist.dismissMessage(params?.message?.instanceId);
+                    }
+                }
+             }));
+        });
+    }
+
+    async function page(ctx: Context): Promise<Context> {
+        if(!_pluginLoaded)
+            return ctx;
+
+        const page:string = ctx.event?.properties?.name ?? ctx.event?.properties?.url;
+        if(typeof page === 'string' && page.length > 0) {
+            Gist.setCurrentRoute(page);
+        }
+
+        return ctx;
+    }
+
+    async function reset(ctx: Context): Promise<Context> {
+        await Gist.clearUserToken();
+        return ctx;
+    }
+    
+    async function syncUserToken(ctx: Context): Promise<Context> {
+        if(!_gistLoaded)
+            return ctx;
+
+        const user = _analytics.user().id();
+        if (typeof user === 'string' && user.length > 0) {
+            await Gist.setUserToken(user);
+        } else {
+            await Gist.clearUserToken();
+        }
+        return ctx;
+    }
+
+    const customerio: Plugin = {
+        name: 'Customer.io In-App Plugin',
+        type: 'before',
+        version: '0.0.1',
+        isLoaded: (): boolean => _pluginLoaded,
+        load: async (ctx: Context, instance: Analytics) => {
+            _analytics = instance;
+
+            if(settings.siteId == null || settings.siteId == "") {
+                _error("siteId is required. Can't initialize.")
+                return ctx;
+            }
+
+            await Gist.setup({
+                siteId: settings.siteId, 
+                env: settings._env? settings._env : "prod",
+                logging: settings._logging,
+            });
+            _gistLoaded = true;
+
+            await syncUserToken(ctx);
+            attachListeners();
+
+            _pluginLoaded = true;
+
+            return Promise.resolve();
+        },
+        identify: syncUserToken,
+        page: page,
+        unload: async () => {
+            if(settings.events) {
+                allEvents.forEach((event) => {
+                    _eventTarget.removeEventListener(event, settings?.events as EventListenerOrEventListenerObject);
+                });
+            }
+        },
+    }
+
+  return customerio;
+}
+
+function _error(msg: string) {
+    console.error(`[Customer.io In-App Plugin] ${msg}`)
+}