807a77992e
- Initialize Firebase Analytics with configuration and client-side setup - Create GoogleAnalytics component to track page views on route changes - Add analytics utility functions for tracking custom events (button clicks, form submissions, link clicks, searches) - Integrate GoogleAnalytics component into home, not-found, and marketing layouts with Suspense boundary - Add firebase dependency to package.json - Enable automatic page view tracking with pathname and search parameters
41 lines
939 B
TypeScript
41 lines
939 B
TypeScript
import { logEvent } from "firebase/analytics";
|
|
import { analytics } from "./firebase";
|
|
|
|
// Custom event tracking functions
|
|
export const trackEvent = (
|
|
eventName: string,
|
|
eventParams?: Record<string, any>
|
|
) => {
|
|
if (analytics) {
|
|
logEvent(analytics, eventName, eventParams);
|
|
}
|
|
};
|
|
|
|
// Common event trackers
|
|
export const trackButtonClick = (buttonName: string, location?: string) => {
|
|
trackEvent("button_click", {
|
|
button_name: buttonName,
|
|
location: location || "unknown",
|
|
});
|
|
};
|
|
|
|
export const trackFormSubmit = (formName: string, success: boolean) => {
|
|
trackEvent("form_submit", {
|
|
form_name: formName,
|
|
success,
|
|
});
|
|
};
|
|
|
|
export const trackLinkClick = (linkUrl: string, linkText?: string) => {
|
|
trackEvent("link_click", {
|
|
link_url: linkUrl,
|
|
link_text: linkText || "unknown",
|
|
});
|
|
};
|
|
|
|
export const trackSearch = (searchTerm: string) => {
|
|
trackEvent("search", {
|
|
search_term: searchTerm,
|
|
});
|
|
};
|