feat(analytics): integrate Google Analytics 4 with GDPR compliance
Prepared the application for Google Analytics 4 tracking with full GDPR/RODO compliance. GA only loads after user explicitly accepts cookies. Features: - Automatic page view tracking on route changes - Custom event tracking for key user actions - Privacy-first: GA loads only after cookie consent - Easy configuration via environment variable - Comprehensive tracking utilities for common events Implementation: - Created analytics.js with GA initialization and event tracking functions - Created usePageTracking hook for automatic page view tracking - Integrated GA into App.jsx with AnalyticsWrapper component - Updated CookieConsent to initialize GA after user consent - Added VITE_GA_MEASUREMENT_ID to .env.example Custom events tracked: - login, sign_up (authentication) - match_request, match_accepted (matching) - webrtc_connection, file_transfer (WebRTC) - event_join, recording_suggestion (events/recording) - search (search functionality) Setup: 1. Add VITE_GA_MEASUREMENT_ID=G-XXXXXXXXXX to .env 2. Restart frontend container 3. GA will auto-load after user accepts cookies Documentation: - Created comprehensive setup guide in docs/GOOGLE_ANALYTICS_SETUP.md - Includes troubleshooting, debugging tips, and usage examples
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { Cookie, X } from 'lucide-react';
|
||||
import { initGA } from '../../utils/analytics';
|
||||
|
||||
/**
|
||||
* GDPR/RODO compliant cookie consent banner
|
||||
@@ -20,6 +21,12 @@ const CookieConsent = () => {
|
||||
const handleAccept = () => {
|
||||
localStorage.setItem('cookieConsent', 'accepted');
|
||||
setIsVisible(false);
|
||||
|
||||
// Initialize Google Analytics after consent
|
||||
const measurementId = import.meta.env.VITE_GA_MEASUREMENT_ID;
|
||||
if (measurementId) {
|
||||
setTimeout(() => initGA(measurementId), 500);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDecline = () => {
|
||||
|
||||
Reference in New Issue
Block a user