// Analytics utilities for Umami with Performance Tracking declare global { interface Window { umami?: { track: (event: string, data?: Record) => void; }; } } export interface PerformanceMetric { name: string; value: number; url: string; timestamp: number; userAgent?: string; } export interface WebVitalsMetric { name: 'CLS' | 'FID' | 'FCP' | 'LCP' | 'TTFB'; value: number; delta: number; id: string; url: string; } // Track custom events to Umami export const trackEvent = (event: string, data?: Record) => { if (typeof window !== 'undefined' && window.umami) { window.umami.track(event, { ...data, timestamp: Date.now(), url: window.location.pathname, }); } }; // Track performance metrics export const trackPerformance = (metric: PerformanceMetric) => { trackEvent('performance', { metric: metric.name, value: Math.round(metric.value), url: metric.url, userAgent: metric.userAgent, }); }; // Track Web Vitals export const trackWebVitals = (metric: WebVitalsMetric) => { trackEvent('web-vitals', { name: metric.name, value: Math.round(metric.value), delta: Math.round(metric.delta), id: metric.id, url: metric.url, }); }; // Track page load performance export const trackPageLoad = () => { if (typeof window === 'undefined') return; const navigation = performance.getEntriesByType('navigation')[0] as PerformanceNavigationTiming; if (navigation) { trackPerformance({ name: 'page-load', value: navigation.loadEventEnd - navigation.fetchStart, url: window.location.pathname, timestamp: Date.now(), userAgent: navigator.userAgent, }); // Track individual timing phases trackEvent('page-timing', { dns: Math.round(navigation.domainLookupEnd - navigation.domainLookupStart), tcp: Math.round(navigation.connectEnd - navigation.connectStart), request: Math.round(navigation.responseStart - navigation.requestStart), response: Math.round(navigation.responseEnd - navigation.responseStart), dom: Math.round(navigation.domContentLoadedEventEnd - navigation.responseEnd), load: Math.round(navigation.loadEventEnd - navigation.domContentLoadedEventEnd), url: window.location.pathname, }); } }; // Track API response times export const trackApiCall = (endpoint: string, duration: number, status: number) => { trackEvent('api-call', { endpoint, duration: Math.round(duration), status, url: window.location.pathname, }); }; // Track user interactions export const trackInteraction = (action: string, element?: string) => { trackEvent('interaction', { action, element, url: window.location.pathname, }); }; // Track errors export const trackError = (error: string, context?: string) => { trackEvent('error', { error, context, url: window.location.pathname, }); };