frontend/hooks/useMatomo.ts (view raw)
1import {useEffect} from 'react';
2import useSettings from './useSettings';
3
4const useMatomo = () => {
5 const settings = useSettings();
6
7 useEffect(() => {
8 if (settings) {
9 const {matomo_script_url} = settings;
10 if (matomo_script_url && typeof window !== 'undefined')
11 loadMatomo(matomo_script_url);
12 }
13 }, [settings]);
14};
15
16const loadMatomo = (matomoScriptUrl: string) => {
17 const _mtm = (window._mtm = window._mtm || []);
18 _mtm.push({'mtm.startTime': new Date().getTime(), event: 'mtm.Start'});
19 const element = document.createElement('script');
20 const script = document.getElementsByTagName('script')[0];
21 element.async = true;
22 element.src = matomoScriptUrl;
23 script.parentNode.insertBefore(element, script);
24};
25
26export default process.env.NODE_ENV === 'production' ? useMatomo : () => {};