41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { useAnalyticsEvent } from "./useAnalyticsEvent";
|
|
import { AnalyticsEvent } from "../interface";
|
|
import { EVENT_NAMES, EVENT_PROPERTY_KEYS } from "../constants";
|
|
import { ScreenState } from "../screen/BaseScreen";
|
|
|
|
const useScreenLoadTime = (
|
|
screenName: string | null,
|
|
screenState: ScreenState | null | undefined,
|
|
) => {
|
|
const [startTime, setStartTime] = useState<number | null>(null);
|
|
const { sendAsAnalyticsEvent } = useAnalyticsEvent();
|
|
|
|
useEffect(() => {
|
|
if (screenState === ScreenState.LOADING && startTime === null) {
|
|
setStartTime(performance.now());
|
|
} else if (
|
|
(screenState === ScreenState.LOADED ||
|
|
screenState === ScreenState.ERROR) &&
|
|
startTime !== null
|
|
) {
|
|
const endTime = performance.now();
|
|
const loadTime = ((endTime - startTime) / 1000).toFixed(3) + "s";
|
|
if (screenName) {
|
|
const analyticsEvent: AnalyticsEvent = {
|
|
name: EVENT_NAMES.SCREEN_LOAD_TIME,
|
|
properties: {
|
|
[EVENT_PROPERTY_KEYS.SCREEN_NAME]: screenName,
|
|
[EVENT_PROPERTY_KEYS.LOAD_TIME]: loadTime,
|
|
},
|
|
};
|
|
|
|
sendAsAnalyticsEvent(analyticsEvent);
|
|
}
|
|
setStartTime(null);
|
|
}
|
|
}, [screenState]);
|
|
};
|
|
|
|
export default useScreenLoadTime;
|