src/applications/ezr/hooks/useBrowserMonitoring.jsx
import { useEffect, useMemo } from 'react';
import { useSelector } from 'react-redux';
import { datadogRum } from '@datadog/browser-rum';
import environment from '@department-of-veterans-affairs/platform-utilities/environment';
import { makeSelectFeatureToggles } from '../utils/selectors/feature-toggles';
const initializeRealUserMonitoring = () => {
// Prevent RUM from re-initializing the SDK OR running on local/CI environments.
if (
!environment.BASE_URL.includes('localhost') &&
!window.DD_RUM?.getInitConfiguration()
) {
datadogRum.init({
applicationId: 'd6b6178d-eef9-4252-baae-896432d38d45',
clientToken: 'pub8ee92ee6af5b712950a32c81d2ee4351',
site: 'ddog-gov.com',
service: '10-10ezr',
env: environment.vspEnvironment(),
sampleRate: 100,
sessionReplaySampleRate: 100,
trackInteractions: true,
trackFrustrations: true,
trackResources: true,
trackLongTasks: true,
defaultPrivacyLevel: 'mask',
});
// If sessionReplaySampleRate > 0, we need to manually start the recording
datadogRum.startSessionReplayRecording();
}
};
const useBrowserMonitoring = () => {
// Retrieve feature flag values to control behavior
const selectFeatureToggles = useMemo(makeSelectFeatureToggles, []);
const featureToggles = useSelector(selectFeatureToggles);
const { isBrowserMonitoringEnabled, isLoadingFeatureFlags } = featureToggles;
useEffect(
() => {
if (isLoadingFeatureFlags) return;
if (isBrowserMonitoringEnabled) {
initializeRealUserMonitoring();
} else {
delete window.DD_RUM;
}
},
[isBrowserMonitoringEnabled, isLoadingFeatureFlags],
);
};
export { useBrowserMonitoring };