chore: targeting for plugin

Author: bravecod

packages/plugin-session-replay-browser/package.json

@@ -41,6 +41,8 @@
   "dependencies": {
     "@amplitude/analytics-core": "^2.15.0",
     "@amplitude/session-replay-browser": "^1.25.3",
+    "@amplitude/analytics-client-common": ">=1 <3",
+    "@amplitude/analytics-types": ">=1 <3",
     "idb-keyval": "^6.2.1",
     "tslib": "^2.4.1"
   },

packages/plugin-session-replay-browser/src/constants.ts

@@ -0,0 +1,11 @@
+import { IdentifyOperation } from '@amplitude/analytics-types';
+
+export const PROPERTY_ADD_OPERATIONS = [
+  IdentifyOperation.SET,
+  IdentifyOperation.SET_ONCE,
+  IdentifyOperation.ADD,
+  IdentifyOperation.APPEND,
+  IdentifyOperation.PREPEND,
+  IdentifyOperation.POSTINSERT,
+  IdentifyOperation.POSTINSERT,
+];

packages/plugin-session-replay-browser/src/helpers.ts

@@ -0,0 +1,22 @@
+import { Event, IdentifyOperation } from '@amplitude/analytics-types';
+import { PROPERTY_ADD_OPERATIONS } from './constants';
+
+export const parseUserProperties = (event: Event) => {
+  if (!event.user_properties) {
+    return;
+  }
+  let userPropertiesObj = {};
+  const userPropertyKeys = Object.keys(event.user_properties);
+
+  userPropertyKeys.forEach((identifyKey) => {
+    if (PROPERTY_ADD_OPERATIONS.includes(identifyKey as IdentifyOperation)) {
+      const typedUserPropertiesOperation =
+        event.user_properties && (event.user_properties[identifyKey as IdentifyOperation] as Record<string, any>);
+      userPropertiesObj = {
+        ...userPropertiesObj,
+        ...typedUserPropertiesOperation,
+      };
+    }
+  });
+  return userPropertiesObj;
+};

packages/plugin-session-replay-browser/src/session-replay.ts

@@ -1,5 +1,7 @@
-import { BrowserClient, BrowserConfig, EnrichmentPlugin, Event } from '@amplitude/analytics-core';
+import { BrowserClient, BrowserConfig, EnrichmentPlugin, Event, SpecialEventType } from '@amplitude/analytics-core';
 import * as sessionReplay from '@amplitude/session-replay-browser';
+import { getAnalyticsConnector } from '@amplitude/analytics-client-common';
+import { parseUserProperties } from './helpers';
 import { SessionReplayOptions } from './typings/session-replay';
 import { VERSION } from './version';
 import { AmplitudeSessionReplay } from '@amplitude/session-replay-browser';
@@ -21,6 +23,7 @@ export class SessionReplayPlugin implements EnrichmentPlugin<BrowserClient, Brow
     init: sessionReplay.init,
     setSessionId: sessionReplay.setSessionId,
     shutdown: sessionReplay.shutdown,
+    evaluateTargetingAndCapture: sessionReplay.evaluateTargetingAndCapture,
   };
 
   constructor(options?: SessionReplayOptions) {
@@ -52,6 +55,8 @@ export class SessionReplayPlugin implements EnrichmentPlugin<BrowserClient, Brow
           };
         }
       }
+      const identityStore = getAnalyticsConnector(this.config.instanceName).identityStore;
+      const userProperties = identityStore.getIdentity().userProperties;
 
       this.srInitOptions = {
         instanceName: this.config.instanceName,
@@ -77,6 +82,7 @@ export class SessionReplayPlugin implements EnrichmentPlugin<BrowserClient, Brow
         performanceConfig: this.options.performanceConfig,
         storeType: this.options.storeType,
         experimental: this.options.experimental,
+        userProperties: userProperties,
         omitElementTags: this.options.omitElementTags,
         applyBackgroundColorToBlockedElements: this.options.applyBackgroundColorToBlockedElements,
         interactionConfig: this.options.interactionConfig,
@@ -140,6 +146,11 @@ export class SessionReplayPlugin implements EnrichmentPlugin<BrowserClient, Brow
         // Treating config.sessionId as source of truth, if the event's session id doesn't match, the
         // event is not of the current session (offline/late events). In that case, don't tag the events
         if (sessionId && sessionId === event.session_id) {
+          let userProperties;
+          if (event.event_type === SpecialEventType.IDENTIFY) {
+            userProperties = parseUserProperties(event);
+          }
+          await this.sr.evaluateTargetingAndCapture({ event, userProperties });
           const sessionRecordingProperties = this.sessionReplay.getSessionReplayProperties();
           event.event_properties = {
             ...event.event_properties,

packages/session-replay-browser/src/index.ts

@@ -1,5 +1,13 @@
 import sessionReplay from './session-replay-factory';
-export const { init, setSessionId, getSessionId, getSessionReplayProperties, flush, shutdown } = sessionReplay;
+export const {
+  init,
+  setSessionId,
+  getSessionId,
+  getSessionReplayProperties,
+  flush,
+  shutdown,
+  evaluateTargetingAndCapture,
+} = sessionReplay;
 export { SessionReplayOptions, StoreType } from './typings/session-replay';
 export { SafeLoggerProvider } from './logger';
 export { AmplitudeSessionReplay } from './typings/session-replay';