feat(analytics): Add Firebase Analytics integration with page tracking
- 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
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
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,
|
||||
});
|
||||
};
|
||||
@@ -0,0 +1,25 @@
|
||||
import { Analytics, getAnalytics } from "firebase/analytics";
|
||||
import { getApps, initializeApp } from "firebase/app";
|
||||
|
||||
const firebaseConfig = {
|
||||
apiKey: "AIzaSyCTjdsk2jE34IfnvSKP1JMTIf_Abd7tbt0",
|
||||
authDomain: "opplens-270d1.firebaseapp.com",
|
||||
projectId: "opplens-270d1",
|
||||
storageBucket: "opplens-270d1.firebasestorage.app",
|
||||
messagingSenderId: "6923326255",
|
||||
appId: "1:6923326255:web:cb4f630d92a286daed87da",
|
||||
measurementId: "G-TMLH6BM963",
|
||||
};
|
||||
|
||||
// Initialize Firebase
|
||||
const app =
|
||||
getApps().length === 0 ? initializeApp(firebaseConfig) : getApps()[0];
|
||||
|
||||
let analytics: Analytics | null = null;
|
||||
|
||||
// Initialize Analytics only on client side
|
||||
if (typeof window !== "undefined") {
|
||||
analytics = getAnalytics(app);
|
||||
}
|
||||
|
||||
export { analytics, app };
|
||||
Reference in New Issue
Block a user