react-analytics-tracker
Version:
react-analytics-tracker is a React component for tracking user interactions and events on your web application. This component captures click and view events, collects various data points, and reports them to a specified endpoint.
81 lines (80 loc) • 2.4 kB
TypeScript
import React, { Component } from "react";
interface NetworkConnectionInfo {
rtt?: number;
type?: string;
saveData?: boolean;
downLink?: number;
effectiveType?: string;
isOnline: boolean;
}
interface EventCollection {
data: string;
event: string;
element: string;
component: string;
timestamp: number;
failedCount?: number | undefined;
[key: string]: any;
}
interface AnalyticsPayload {
appName?: string;
appVersion?: string;
referrer: string;
url: string;
pathname: string;
hostname: string;
title: string;
screen: string;
language: string;
utmSource: string;
utmMedium: string;
utmCampaign: string;
utmTerm: string;
utmContent: string;
sessionId: string;
network: NetworkConnectionInfo;
events: Array<EventCollection>;
[key: string]: any;
}
interface TrackData {
eventData: string | null;
elementName: string | null;
componentName: string | null;
}
export interface AnalyticsTrackerProps {
appName: string;
appVersion: string;
heartBeatInterval?: number;
customPayload?: Record<string, any>;
reportingEndpoint?: string;
onReport?: (payload: AnalyticsPayload) => void;
customProperties?: Record<string, any>;
}
export declare class AnalyticsTracker extends Component<AnalyticsTrackerProps> {
private heartBeatInterval;
private sessionId;
private eventCollections;
private observer;
private mutationObserver;
private handleVisibilityChange;
private firebaseEndpoint;
private reportingEndpoint;
constructor(props: AnalyticsTrackerProps);
private generateSessionId;
private getCookieValue;
private constructPayload;
report(callback?: () => void): Promise<void>;
private storeEventsInSession;
getNetworkConnection(): any;
getNetworkConnectionInfo(): NetworkConnectionInfo;
private trackEvent;
trackCustomEvent(eventName: string, data: TrackData, isToReportImmediately?: boolean): void;
handleClick: (this: any, ...args: any[]) => void;
handleTriggerEvent: (this: any, ...args: any[]) => void;
handleIntersect: (entries: IntersectionObserverEntry[]) => void;
observeNewComponents: (mutationsList: MutationRecord[]) => void;
componentDidMount(): void;
componentWillUnmount(): void;
render(): React.JSX.Element;
}
export { AnalyticsPayload };