noibu-react-native 0.1.3 → 0.2.1

package/dist/sessionRecorder/nativeSessionRecorderSubscription.d.ts

@@ -0,0 +1,64 @@
+/**
+ * The level of logging to show in the device logcat stream.
+ */
+export declare enum LogLevel {
+    Verbose = "Verbose",
+    Debug = "Debug",
+    Info = "Info",
+    Warning = "Warning",
+    Error = "Error",
+    None = "None"
+}
+/**
+ * The configuration that will be used to customize the session recording behaviour.
+ *
+ * @param userId        [OPTIONAL default = null] A custom identifier for the current user. If passed as null, the user id
+ *                      will be auto generated. The user id in general is sticky across sessions.
+ *                      The provided user id must follow these conditions:
+ *                          1. Cannot be an empty string.
+ *                          2. Should be base36 and smaller than "1Z141Z4".
+ * @param logLevel      [OPTIONAL default = LogLevel.None] The level of logging to show in the device logcat stream.
+ * @param allowMeteredNetworkUsage  [OPTIONAL default = false] Allows uploading session data to the servers on device metered network.
+ * @param enableWebViewCapture    [OPTIONAL default = true] Allows Noibu - Session recorder to capture the web views DOM content.
+ * @param allowedDomains    [OPTIONAL default = ["*"]] The whitelisted domains to allow Noibu - Session recorder to capture their DOM content.
+ *                          If it contains "*" as an element, all domains will be captured.
+ * @param disableOnLowEndDevices [OPTIONAL default = false] Disable Noibu - Session recorder on low-end devices.
+ * @param maximumDailyNetworkUsageInMB [OPTIONAL default = null] Maximum daily network usage for Noibu - Session recorder (null = No limit). When the limit is reached, Noibu - Session recorder will turn on lean mode.
+ */
+export interface SessionRecorderConfig {
+    userId?: string | null;
+    logLevel?: LogLevel;
+    allowMeteredNetworkUsage?: boolean;
+    enableWebViewCapture?: boolean;
+    allowedDomains?: string[];
+    disableOnLowEndDevices?: boolean;
+    maximumDailyNetworkUsageInMB?: number;
+}
+/**
+ * Initializes the Noibu - Session recording SDK if the API level is supported.
+ * param projectId     [REQUIRED] The session recording project id to send data to.
+ * param config   [OPTIONAL] The sessionreplay config, if not provided default values are used.
+ */
+export declare function initialize(projectId: string, config?: SessionRecorderConfig): void;
+/**
+ * Sets a custom user id that can be used to identify the user. It has less
+ * restrictions than the userId parameter. You can pass any string and
+ * you can filter on it on the dashboard side. If you need the most efficient
+ * filtering on the dashboard, use the userId parameter if possible.
+ * <p>
+ * Note: custom user id cannot be null or empty, or consists only of whitespaces.
+ * </p>
+ * @param customUserId   The custom user id to set.
+ */
+export declare function setCustomUserId(customUserId: string): void;
+/**
+ * Sets a custom session id that can be used to identify the session.
+ * <p>
+ * Note: custom session id cannot be null or empty, or consists only of whitespaces.
+ * </p>
+ * @param customSessionId   The custom session id to set.
+ */
+export declare function setCustomSessionId(customSessionId: string): void;
+export type RecorderEvent = import('./types').RecorderEvent;
+export type UnsubscribeFn = import('./types').UnsubscribeFn;
+export declare function subscribeToNativeEvent(callback: (event: RecorderEvent) => void): UnsubscribeFn;

package/dist/sessionRecorder/nativeSessionRecorderSubscription.js

@@ -0,0 +1,58 @@
+import { NativeEventEmitter, Platform, NativeModules } from 'react-native';
+import { noibuLog } from '../utils/log.js';
+
+const LINKING_ERROR = `The package 'noibu-session-replay' doesn't seem to be linked. Make sure: \n\n` +
+    // Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) + TODO: add back when iOS is supported.
+    '- You rebuilt the app after installing the package\n' +
+    '- You are not using Expo Go\n';
+const { NativeSessionRecorder } = NativeModules;
+let nativeModuleEmitter;
+const SupportedPlatforms = ['android'];
+/**
+ * The level of logging to show in the device logcat stream.
+ */
+// eslint-disable-next-line no-shadow
+var LogLevel;
+(function (LogLevel) {
+    LogLevel["Verbose"] = "Verbose";
+    LogLevel["Debug"] = "Debug";
+    LogLevel["Info"] = "Info";
+    LogLevel["Warning"] = "Warning";
+    LogLevel["Error"] = "Error";
+    LogLevel["None"] = "None";
+})(LogLevel || (LogLevel = {}));
+/**
+ * Initializes the Noibu - Session recording SDK if the API level is supported.
+ * param projectId     [REQUIRED] The session recording project id to send data to.
+ * param config   [OPTIONAL] The sessionreplay config, if not provided default values are used.
+ */
+function initialize(projectId, config) {
+    if (!(typeof config === 'object' || typeof config === 'undefined')) {
+        throw Error('Invalid session recording initialization arguments. Please check the docs for assitance.');
+    }
+    nativeModuleEmitter = new NativeEventEmitter(NativeSessionRecorder);
+    // applying default values
+    const { userId = null, logLevel = LogLevel.None, allowMeteredNetworkUsage = false, enableWebViewCapture = true, allowedDomains = ['*'], disableOnLowEndDevices = false, maximumDailyNetworkUsageInMB = null, } = config ?? {};
+    if (!SupportedPlatforms.includes(Platform.OS)) {
+        noibuLog(`Noibu - Session recording supports ${SupportedPlatforms.join(', ')} only for now.`);
+        return;
+    }
+    if (NativeSessionRecorder === null) {
+        noibuLog('Noibu - Session recording did not initialize properly.', LINKING_ERROR);
+        return;
+    }
+    // We use two parameters because the react method parameters do not accept nullable primitive types.
+    const enableDailyNetworkUsageLimit = maximumDailyNetworkUsageInMB != null;
+    const refinedMaximumDailyNetworkUsageInMB = maximumDailyNetworkUsageInMB ?? 0;
+    NativeSessionRecorder.initialize(projectId, userId, logLevel, allowMeteredNetworkUsage, enableWebViewCapture, allowedDomains, disableOnLowEndDevices, enableDailyNetworkUsageLimit, refinedMaximumDailyNetworkUsageInMB);
+}
+function subscribeToNativeEvent(callback) {
+    if (!nativeModuleEmitter) {
+        throw new Error('You have to initialize Noibu Session Recorder first');
+    }
+    nativeModuleEmitter.addListener('noibuRecordingEvent', callback);
+    // return () => subscription.remove();
+    return () => { };
+}
+
+export { LogLevel, initialize, subscribeToNativeEvent };

package/dist/sessionRecorder/sessionRecorder.d.ts

@@ -0,0 +1,60 @@
+import { RecorderEvent } from './nativeSessionRecorderSubscription';
+/** Singleton class to record user sessions */
+export default class SessionRecorder {
+    private static instance;
+    private eventBuffer;
+    private vfCounter;
+    private didSetupRecorder;
+    private isVideoLengthNegativeInvalid;
+    private lastFragPostTimestamp;
+    private pauseTimeout;
+    private lastRecordedTimestamp;
+    private firstRecordedTimestamp;
+    private recordStopper;
+    private freezingEvents;
+    /**
+     * Creates an instance of the session recorder
+     */
+    constructor();
+    /**
+     * Setups the SessionRecorder instance for usage
+     */
+    static getInstance(): SessionRecorder;
+    /** Sets up the page hide handler to try to push remaining video events */
+    setupUnloadHandler(): void;
+    /** Sets up the post metrics handler to potentially log a debug message */
+    setupPostMetricsHandler(): void;
+    /**
+     * Starts recording the user session
+     */
+    recordUserSession(): Promise<void>;
+    /**
+     * handleNewRRwebEvent will process each upcoming.
+     * rrweb event. It will make sure that the current buffer
+     * is updated with the latest events and post the contents
+     * of the buffer if it exceeds max size
+     */
+    handleRecorderEvent(recorderEvent: RecorderEvent): Promise<void>;
+    /**
+     * Compress event
+     */
+    private pack;
+    private static compress;
+    /** builds a log message with debug info
+     */
+    buildDebugMessage(eventName: string, totalVideoTime: number, sessionLength: number): string;
+    /**
+     * handleFragPost communicates with the Metroplex socket
+     * to post video fragments when needed. It also handles
+     * necessary management of the buffer and it's related
+     * variables
+     */
+    handleFragPost(): Promise<void>;
+    /**
+     * unfreeze forcefully resumes recording events in case it was frozen
+     * waiting for user events
+     */
+    unfreeze(): Promise<void>;
+    /** stops recording */
+    private freeze;
+}

package/dist/sessionRecorder/sessionRecorder.js

@@ -0,0 +1,287 @@
+import { strToU8, zlibSync, strFromU8 } from 'fflate';
+import { LogLevel, initialize, subscribeToNativeEvent } from './nativeSessionRecorderSubscription.js';
+import StoredMetrics from '../api/storedMetrics.js';
+import ClientConfig from '../api/clientConfig.js';
+import { stringifyJSON } from '../utils/function.js';
+import { SEVERITY, POST_METRICS_EVENT_NAME, MAX_TIME_FOR_RECORDER_USER_EVENTS, MAX_RECORDER_EVENT_BUFFER, MAX_TIME_FOR_UNSENT_DATA_MILLIS, VIDEO_FRAG_ATT_NAME, PV_SEQ_ATT_NAME, LENGTH_ATT_NAME, CSS_URLS_ATT_NAME, VIDEO_METROPLEX_TYPE, PAGE_VISIT_VID_FRAG_ATT_NAME } from '../constants.js';
+import MetroplexSocket from '../api/metroplexSocket.js';
+import { addSafeEventListener } from '../utils/eventlistener.js';
+import { noibuLog } from '../utils/log.js';
+
+/** Singleton class to record user sessions */
+class SessionRecorder {
+    static instance;
+    eventBuffer;
+    vfCounter;
+    didSetupRecorder;
+    isVideoLengthNegativeInvalid;
+    lastFragPostTimestamp;
+    pauseTimeout;
+    lastRecordedTimestamp;
+    firstRecordedTimestamp;
+    recordStopper;
+    freezingEvents = false;
+    /**
+     * Creates an instance of the session recorder
+     */
+    constructor() {
+        this.eventBuffer = [];
+        this.vfCounter = 0;
+        this.didSetupRecorder = false;
+        this.recordStopper = null;
+        this.firstRecordedTimestamp = null;
+        this.lastRecordedTimestamp = null;
+        this.isVideoLengthNegativeInvalid = false;
+        this.lastFragPostTimestamp = Date.now();
+        this.pauseTimeout = null;
+        this.setupUnloadHandler();
+        this.setupPostMetricsHandler();
+    }
+    /**
+     * Setups the SessionRecorder instance for usage
+     */
+    static getInstance() {
+        if (!this.instance) {
+            const nativeSessionRecorderConfig = {
+                logLevel: LogLevel.Verbose,
+            };
+            initialize('abc1234', nativeSessionRecorderConfig);
+            this.instance = new SessionRecorder();
+            // todo handle RN clicks
+            addSafeEventListener(window, 'click', () => {
+                this.instance.handleFragPost();
+            });
+        }
+        return this.instance;
+    }
+    /** Sets up the page hide handler to try to push remaining video events */
+    setupUnloadHandler() {
+        // todo handle React Native app background / foreground events
+        ['pagehide', 'visibilitychange'].forEach(evt => addSafeEventListener(window, evt, () => {
+            // pagehide handler
+            if (evt === 'pagehide') {
+                this.handleFragPost();
+            }
+        }));
+    }
+    /** Sets up the post metrics handler to potentially log a debug message */
+    setupPostMetricsHandler() {
+        addSafeEventListener(window, POST_METRICS_EVENT_NAME, (e) => {
+            // Get the event name that triggered postMetrics from the custom event
+            const eventName = e.detail;
+            // Calculate the total expected video length
+            const totalVideoTime = this.lastRecordedTimestamp === null ||
+                this.firstRecordedTimestamp === null
+                ? 0
+                : this.lastRecordedTimestamp - this.firstRecordedTimestamp;
+            const sessionLength = MetroplexSocket.getInstance().sessionLength
+                ? MetroplexSocket.getInstance().sessionLength
+                : 0;
+            // If there is a large retry message queue, log a debug message.
+            if (MetroplexSocket.getInstance().retryMessageQueue.length > 100) {
+                // if client was disabled (due to inactive or otherwise) enable briefly so the
+                // debug message gets through
+                const clientDisabled = ClientConfig.getInstance().isClientDisabled;
+                ClientConfig.getInstance().isClientDisabled = false;
+                ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient({
+                    eventName,
+                    totalVideoTime,
+                    sessionLength,
+                }, clientDisabled, SEVERITY.warn);
+            }
+        });
+    }
+    /**
+     * Starts recording the user session
+     */
+    async recordUserSession() {
+        // check if inactive before starting any recording
+        noibuLog('recordUserSession');
+        if ((await MetroplexSocket.getInstance().closeIfInactive()) ||
+            StoredMetrics.getInstance().didCutVideo) {
+            return;
+        }
+        // making sure we are not attempting to call this method
+        // multiple times.
+        if (this.didSetupRecorder) {
+            return;
+        }
+        StoredMetrics.getInstance().setDidStartVideo();
+        this.recordStopper = subscribeToNativeEvent(this.handleRecorderEvent.bind(this));
+        this.didSetupRecorder = true;
+    }
+    /**
+     * handleNewRRwebEvent will process each upcoming.
+     * rrweb event. It will make sure that the current buffer
+     * is updated with the latest events and post the contents
+     * of the buffer if it exceeds max size
+     */
+    async handleRecorderEvent(recorderEvent) {
+        const timestamp = Date.now();
+        // check if inactive before any processing
+        if ((await MetroplexSocket.getInstance().closeIfInactive()) ||
+            StoredMetrics.getInstance().didCutVideo) {
+            this.freeze();
+            return;
+        }
+        // determine if timeout should be extended based on event/source type
+        // event type 3 is an incremental snapshot
+        // event data source 0 is a mutation (all other data sources are user events)
+        if (this.pauseTimeout) {
+            // received a user event, extend the timeout
+            clearTimeout(this.pauseTimeout);
+            this.freezingEvents = false;
+        }
+        this.pauseTimeout = setTimeout(() => {
+            // stop recording page mutations after 2s of inactivity
+            // otherwise sites with many mutations will hit max video size
+            // in a short amount of time without any user events
+            this.freezingEvents = true;
+            // freezePage stops emitting events until the next user event is received
+            this.freeze();
+        }, MAX_TIME_FOR_RECORDER_USER_EVENTS);
+        // Set the first recorded timestamp if it hasn't been set yet.
+        // We usually only want this to be set once as the first recorded timestamp
+        // should not change.
+        if (!this.firstRecordedTimestamp) {
+            this.firstRecordedTimestamp = timestamp;
+        }
+        // Set the last recorded timestamp if it hasn't been set yet or a newly received rrweb
+        // event has a more recent timestamp than the last recorded timestamp.
+        if (!this.lastRecordedTimestamp || timestamp > this.lastRecordedTimestamp) {
+            this.lastRecordedTimestamp = timestamp;
+        }
+        // Checks if we've gone back in time for some reason.
+        // If we have, adjust our data accordingly to ensure we don't mess up
+        // the metrics 'exp_vid_len' data.
+        // If we don't adjust for time, we assume that the expected video length is
+        // the difference between the first recorded timestamp and the last recorded timestamp.
+        if (this.firstRecordedTimestamp &&
+            timestamp < this.firstRecordedTimestamp) {
+            ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient(`Detected time rewind. Client has been disabled.`, true, SEVERITY.error, true);
+            return;
+        }
+        const packedEvent = await this.pack(recorderEvent.message);
+        // Buffer the event for sending to metroplex
+        this.eventBuffer.push(packedEvent);
+        // Check if the event was a click or a double click. This is true if the root type is
+        // incremental snapshot (3) and the data source is mouse interaction data (2).
+        // Finally, we capture a click (2) or double click (4) event.
+        // todo if there are clicks, call StoredMetrics.getInstance().addVideoClick(); for each click
+        const now = Date.now();
+        const delta = now - this.lastFragPostTimestamp;
+        if (this.eventBuffer.length >= MAX_RECORDER_EVENT_BUFFER ||
+            delta > MAX_TIME_FOR_UNSENT_DATA_MILLIS) {
+            this.handleFragPost();
+        }
+    }
+    /**
+     * Compress event
+     */
+    async pack(recorderEvent) {
+        // return JSON.stringify(recorderEvent);
+        return SessionRecorder.compress(recorderEvent);
+    }
+    static compress(snapshot) {
+        const uncompressedString = stringifyJSON(snapshot);
+        const uncompressedData = strToU8(uncompressedString);
+        const compressedData = zlibSync(uncompressedData, { level: 1 });
+        const compressedString = strFromU8(compressedData, true);
+        return compressedString;
+    }
+    /** builds a log message with debug info
+     */
+    buildDebugMessage(eventName, totalVideoTime, sessionLength) {
+        return JSON.stringify({ eventName, totalVideoTime, sessionLength });
+    }
+    /**
+     * handleFragPost communicates with the Metroplex socket
+     * to post video fragments when needed. It also handles
+     * necessary management of the buffer and it's related
+     * variables
+     */
+    async handleFragPost() {
+        // check if inactive before any processing
+        if (await MetroplexSocket.getInstance().closeIfInactive()) {
+            return;
+        }
+        if (!this.didSetupRecorder) {
+            return;
+        }
+        if (this.eventBuffer.length === 0) {
+            return;
+        }
+        try {
+            let totalVideoTime = 0;
+            // checking if we have those values set in the first place
+            if (this.firstRecordedTimestamp &&
+                this.lastRecordedTimestamp &&
+                !this.isVideoLengthNegativeInvalid) {
+                totalVideoTime =
+                    this.lastRecordedTimestamp - this.firstRecordedTimestamp;
+            }
+            // In the past we have seen the video LengthMS field to be negative
+            // and bigger than the long limit of scala. Which is less than the
+            // safe integer limit of js.
+            if (!this.isVideoLengthNegativeInvalid &&
+                (totalVideoTime < 0 || totalVideoTime >= Number.MAX_SAFE_INTEGER)) {
+                // we log an error to know if this is still happening
+                ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient(`video lengthMS is invalid: ${totalVideoTime}, ` +
+                    `start time: ${this.firstRecordedTimestamp}, ` +
+                    `end time: ${this.lastRecordedTimestamp}`, false, SEVERITY.error);
+                this.isVideoLengthNegativeInvalid = true;
+                totalVideoTime = 0;
+            }
+            this.vfCounter += 1;
+            const videoFragment = MetroplexSocket.getInstance().addEndTimeToPayload({
+                // single string for the video content. This gets converted to bytes
+                // when being sent to metroplex which we will then unmarshall into
+                // a struct to parse it's inner urls
+                // If stringifying this event buffer takes too long consider using a service worker
+                [VIDEO_FRAG_ATT_NAME]: stringifyJSON(this.eventBuffer),
+                // Send the sequence number but don't send the expected length since that is sent as
+                // part of the last stored metrics data
+                [PV_SEQ_ATT_NAME]: this.vfCounter,
+                [LENGTH_ATT_NAME]: totalVideoTime,
+                [CSS_URLS_ATT_NAME]: [],
+            }, false);
+            StoredMetrics.getInstance().addVideoFragData(this.vfCounter, totalVideoTime);
+            // constructing a client message that metroplex knows how to handle.
+            await MetroplexSocket.getInstance().sendMessage(VIDEO_METROPLEX_TYPE, {
+                [PAGE_VISIT_VID_FRAG_ATT_NAME]: videoFragment,
+            });
+            this.lastFragPostTimestamp = Date.now();
+        }
+        catch (err) {
+            // letting collect know we are closing the rrweb listener
+            ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient(`video frag socket closed with err: ${err.message}`, false, SEVERITY.error);
+            // if we detect an error in the frag posting, we stop recording
+            // the video
+            this.freeze();
+        }
+        this.eventBuffer = [];
+    }
+    /**
+     * unfreeze forcefully resumes recording events in case it was frozen
+     * waiting for user events
+     */
+    async unfreeze() {
+        if (this.freezingEvents) {
+            this.didSetupRecorder = false;
+            await this.recordUserSession();
+        }
+    }
+    /** stops recording */
+    freeze() {
+        if (this.recordStopper) {
+            try {
+                this.recordStopper();
+            }
+            catch (e) {
+                ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient(`Error during handleFragPost in recordStopper: ${e}`, false, SEVERITY.error);
+            }
+        }
+    }
+}
+
+export { SessionRecorder as default };

package/dist/sessionRecorder/types.d.ts

@@ -0,0 +1,91 @@
+type Color = {
+    a: number;
+    b: number;
+    r: number;
+    g: number;
+};
+type Paint = {
+    strokeJoin: number;
+    strokeWidth: number;
+    strokeCap: number;
+    color: Color;
+    dither: boolean;
+    blendMode: number;
+    style: number;
+    antiAlias: boolean;
+    strokeMiter: number;
+};
+type Rect = {
+    top: number;
+    left: number;
+    bottom: number;
+    right: number;
+};
+type Command = {
+    name?: string;
+    id?: number;
+    type: string;
+    isClipRectSource?: boolean;
+    rect?: Rect;
+    paintIndex?: number;
+    op?: number;
+    antiAlias?: boolean;
+    matrix?: number[];
+};
+type ViewNode = {
+    viewX: number;
+    visible: boolean;
+    processedText$delegate: {
+        _value: any;
+        initializer: any;
+    };
+    viewY: number;
+    viewWidth: number;
+    clickable: boolean;
+    viewHeight: number;
+    isMasked: boolean;
+    type: string;
+    renderNodeId: number;
+    isWebView: boolean;
+    ignoreClicks: boolean;
+    children: ViewNode[];
+    width: number;
+    x: number;
+    y: number;
+    id: number;
+    text: string;
+    height: number;
+    backgroundColor?: number;
+};
+type ViewHierarchy = {
+    root: ViewNode;
+    visibleFragments: any[];
+    timestamp: number;
+};
+type SubPicture = {
+    subPictures: any[];
+    images: any[];
+    screenWidth: number;
+    textBlobs: any[];
+    density: number;
+    vertices: any[];
+    screenHeight: number;
+    activityName: string;
+    paints: Paint[];
+    typefaces: any[];
+    viewHierarchy: ViewHierarchy;
+    paths: any[];
+    activityHashCode: number;
+    commands: Command[];
+    timestamp: number;
+};
+export type RecorderEvent = {
+    message: NativeFrames;
+};
+export type NativeFrames = {
+    p: (number | boolean | SubPicture)[][];
+    a: (number[] | (number | string[] | string | string[])[])[];
+    e: (string | number)[];
+};
+export type UnsubscribeFn = () => void;
+export {};

package/dist/types/StoredPageVisit.types.d.ts

@@ -0,0 +1,54 @@
+import { BROWSER_ID_ATT_NAME, COLLECT_VER_ATT_NAME, CONN_COUNT_ATT_NAME, CSS_URLS_ATT_NAME, END_AT_ATT_NAME, IS_LAST_ATT_NAME, LANG_ATT_NAME, LENGTH_ATT_NAME, METROPLEX_SOCKET_INSTANCE_ID_ATT_NAME, ON_URL_ATT_NAME, PAGE_GROUPS_ATT_NAME, PAGE_TITLE_ATT_NAME, PAGE_VISIT_INFORMATION_ATT_NAME, PAGE_VISIT_PART_ATT_NAME, PAGE_VISIT_VID_FRAG_ATT_NAME, PV_EVENTS_ATT_NAME, PV_EXP_PART_COUNTER_ATT_NAME, PV_EXP_VF_SEQ_ATT_NAME, PV_ID_ATT_NAME, PV_PART_COUNTER_ATT_NAME, PV_SEQ_ATT_NAME, REF_URL_ATT_NAME, SCRIPT_ID_ATT_NAME, SCRIPT_INSTANCE_ID_ATT_NAME, SEQ_NUM_ATT_NAME, SOCKET_INSTANCE_ID_ATT_NAME, STARTED_AT_ATT_NAME, VIDEO_FRAG_ATT_NAME, VIDEO_METROPLEX_TYPE } from '../constants';
+export interface PageVisitPart {
+    [PV_PART_COUNTER_ATT_NAME]: number;
+    [END_AT_ATT_NAME]: number;
+    [PV_EXP_VF_SEQ_ATT_NAME]?: number;
+    [PV_EXP_PART_COUNTER_ATT_NAME]?: number;
+    [PV_EVENTS_ATT_NAME]: Array<any>;
+    [SEQ_NUM_ATT_NAME]: number;
+}
+export interface PageVisitInfo {
+    [BROWSER_ID_ATT_NAME]: string;
+    [PV_ID_ATT_NAME]: string;
+    [VIDEO_METROPLEX_TYPE]: number;
+    [SCRIPT_ID_ATT_NAME]: string;
+    [SCRIPT_INSTANCE_ID_ATT_NAME]: string;
+    [METROPLEX_SOCKET_INSTANCE_ID_ATT_NAME]: string;
+    [SOCKET_INSTANCE_ID_ATT_NAME]: string;
+    [PV_SEQ_ATT_NAME]: number;
+    [IS_LAST_ATT_NAME]: boolean;
+    [CONN_COUNT_ATT_NAME]: number;
+    [ON_URL_ATT_NAME]: string;
+    [PAGE_GROUPS_ATT_NAME]: Array<string>;
+    [PAGE_TITLE_ATT_NAME]: string;
+    [REF_URL_ATT_NAME]: string;
+    [STARTED_AT_ATT_NAME]: string;
+    [COLLECT_VER_ATT_NAME]: number;
+    [LANG_ATT_NAME]?: string;
+}
+export interface PageVisitPartsBase {
+    pageVisitInfo: PageVisitInfo;
+    pageVisitFrags: Array<PageVisitPart>;
+}
+export interface PageVisitPartsForStorage extends PageVisitPartsBase {
+    timestamp?: Date;
+}
+export interface PageVisitPartsFromStorage extends PageVisitPartsBase {
+    timestamp?: string;
+}
+export interface VideoFrag {
+    [VIDEO_FRAG_ATT_NAME]: string;
+    [PV_SEQ_ATT_NAME]: number;
+    [END_AT_ATT_NAME]: number;
+    [LENGTH_ATT_NAME]: number;
+    [SEQ_NUM_ATT_NAME]: number;
+    [CSS_URLS_ATT_NAME]: string[];
+}
+export interface VideoMetroplexMessage {
+    [PAGE_VISIT_VID_FRAG_ATT_NAME]: VideoFrag;
+}
+export interface CompletePageVisitParts {
+    [PAGE_VISIT_VID_FRAG_ATT_NAME]: Array<VideoFrag>;
+    [PAGE_VISIT_INFORMATION_ATT_NAME]: PageVisitInfo;
+    [PAGE_VISIT_PART_ATT_NAME]: Array<PageVisitPart>;
+}

package/dist/types/globals.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react-native" />
 declare global {
     const METROPLEX_BASE_SOCKET_URL: string;
     const BETA_METROPLEX_BASE_SOCKET_URL: string;

package/dist/utils/date.d.ts

@@ -0,0 +1,6 @@
+/** Checks to see if the necessary Date functions that we use have been overwritten */
+export function isDateOverwritten(): boolean;
+/** Timestamp wrapper to properly handle timestamps
+ * @param  {} timestamp
+ */
+export function timestampWrapper(timestamp: any): any;

package/dist/utils/eventlistener.d.ts

@@ -0,0 +1,8 @@
+/** addSafeEventListener will add an event listener for the specified event
+ * but will catch and log any errors encountered
+ * @param  {} object to attach the listener to
+ * @param  {} event to listen to
+ * @param  {} callback function to call
+ * @param  {} [capture] additional arguments
+ */
+export function addSafeEventListener(object: any, event: any, callback: any, capture?: any): void;

package/dist/utils/eventlistener.js

@@ -6,9 +6,9 @@ import ClientConfig from '../api/clientConfig.js';
  * @param  {} object to attach the listener to
  * @param  {} event to listen to
  * @param  {} callback function to call
- * @param  {} capture additional arguments
+ * @param  {} [capture] additional arguments
  */
-function addSafeEventListener(object, event, callback, capture) {
+function addSafeEventListener(object, event, callback, capture = false) {
   if (!object || !event || !callback) {
     // nothing to do if these don't exist
     return;

package/dist/utils/function.d.ts

@@ -76,3 +76,7 @@ export declare function maskTextInput(text: string): string;
  * where type is not actually a type but an object.
  */
 export declare function isInstanceOf(instance: unknown, type: unknown): boolean;
+/**
+ * To grab the video recorder type based on the device we run the app on.
+ */
+export declare function getVideoRecorderType(): Promise<string>;