fix gg tag (#6702)
This commit is contained in:
parent
d5110de67b
commit
df145d63a9
@ -20,6 +20,7 @@
|
|||||||
content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, interactive-widget=resizes-visual"
|
content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, interactive-widget=resizes-visual"
|
||||||
/>
|
/>
|
||||||
<title>Jan</title>
|
<title>Jan</title>
|
||||||
|
<!-- INJECT_GOOGLE_ANALYTICS -->
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
|
|||||||
@ -2,6 +2,18 @@
|
|||||||
* Google Analytics utility functions
|
* Google Analytics utility functions
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Track page views for SPA navigation
|
||||||
|
*/
|
||||||
|
export const pageview = (path: string) => {
|
||||||
|
if (!window.gtag) return
|
||||||
|
|
||||||
|
window.gtag('event', 'page_view', {
|
||||||
|
page_location: window.location.href,
|
||||||
|
page_path: path,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Track custom events with Google Analytics
|
* Track custom events with Google Analytics
|
||||||
*/
|
*/
|
||||||
@ -9,9 +21,7 @@ export function trackEvent(
|
|||||||
eventName: string,
|
eventName: string,
|
||||||
parameters?: Record<string, unknown>
|
parameters?: Record<string, unknown>
|
||||||
) {
|
) {
|
||||||
if (!window.gtag) {
|
if (!window.gtag) return
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
window.gtag('event', eventName, parameters)
|
window.gtag('event', eventName, parameters)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,60 +1,21 @@
|
|||||||
import { useEffect } from 'react'
|
import { useEffect } from 'react'
|
||||||
import { useLocation } from '@tanstack/react-router'
|
import { useLocation } from '@tanstack/react-router'
|
||||||
|
import { pageview } from '@/lib/analytics'
|
||||||
|
|
||||||
|
|
||||||
export function GoogleAnalyticsProvider() {
|
export function GoogleAnalyticsProvider() {
|
||||||
const location = useLocation()
|
const location = useLocation()
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
// Check if GA ID is properly configured
|
|
||||||
if (!GA_MEASUREMENT_ID || GA_MEASUREMENT_ID === 'G-XXXXXXXXXX') {
|
|
||||||
console.warn(
|
|
||||||
'Google Analytics not initialized: Invalid GA_MEASUREMENT_ID'
|
|
||||||
)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load Google Analytics script
|
|
||||||
const script = document.createElement('script')
|
|
||||||
script.async = true
|
|
||||||
script.src = `https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}`
|
|
||||||
|
|
||||||
// Handle loading errors
|
|
||||||
script.onerror = () => {
|
|
||||||
console.warn('Failed to load Google Analytics script')
|
|
||||||
}
|
|
||||||
|
|
||||||
document.head.appendChild(script)
|
|
||||||
|
|
||||||
// Initialize gtag
|
|
||||||
window.dataLayer = window.dataLayer || []
|
|
||||||
window.gtag = function (...args: unknown[]) {
|
|
||||||
window.dataLayer?.push(args)
|
|
||||||
}
|
|
||||||
window.gtag('js', new Date())
|
|
||||||
window.gtag('config', GA_MEASUREMENT_ID, {
|
|
||||||
send_page_view: false, // We'll manually track page views
|
|
||||||
})
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
// Cleanup: Remove script on unmount
|
|
||||||
if (script.parentNode) {
|
|
||||||
script.parentNode.removeChild(script)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
// Track page views on route change
|
// Track page views on route change
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!window.gtag) {
|
// Skip if GA is not configured
|
||||||
|
if (!GA_MEASUREMENT_ID) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
window.gtag('event', 'page_view', {
|
// Track page view with current path
|
||||||
page_path: location.pathname + location.search,
|
const path = location.pathname + (window.location.search || '')
|
||||||
page_location: window.location.href,
|
pageview(path)
|
||||||
page_title: document.title,
|
|
||||||
})
|
|
||||||
}, [location])
|
}, [location])
|
||||||
|
|
||||||
return null
|
return null
|
||||||
|
|||||||
@ -71,7 +71,9 @@ function Index() {
|
|||||||
return (
|
return (
|
||||||
<div className="flex h-full flex-col justify-center pb-[calc(env(safe-area-inset-bottom)+env(safe-area-inset-top))]">
|
<div className="flex h-full flex-col justify-center pb-[calc(env(safe-area-inset-bottom)+env(safe-area-inset-top))]">
|
||||||
<HeaderPage>
|
<HeaderPage>
|
||||||
|
<div className="flex items-center justify-between w-full pr-2">
|
||||||
{PlatformFeatures[PlatformFeature.ASSISTANTS] && <DropdownAssistant />}
|
{PlatformFeatures[PlatformFeature.ASSISTANTS] && <DropdownAssistant />}
|
||||||
|
</div>
|
||||||
</HeaderPage>
|
</HeaderPage>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
import { defineConfig, loadEnv } from 'vite'
|
import { defineConfig, loadEnv, Plugin } from 'vite'
|
||||||
import react from '@vitejs/plugin-react'
|
import react from '@vitejs/plugin-react'
|
||||||
import tailwindcss from '@tailwindcss/vite'
|
import tailwindcss from '@tailwindcss/vite'
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
@ -7,6 +7,41 @@ import { nodePolyfills } from 'vite-plugin-node-polyfills'
|
|||||||
import packageJson from './package.json'
|
import packageJson from './package.json'
|
||||||
const host = process.env.TAURI_DEV_HOST
|
const host = process.env.TAURI_DEV_HOST
|
||||||
|
|
||||||
|
// Plugin to inject GA scripts in HTML
|
||||||
|
function injectGoogleAnalytics(gaMeasurementId?: string): Plugin {
|
||||||
|
return {
|
||||||
|
name: 'inject-google-analytics',
|
||||||
|
transformIndexHtml(html) {
|
||||||
|
// Only inject GA scripts if GA_MEASUREMENT_ID is set
|
||||||
|
if (!gaMeasurementId) {
|
||||||
|
// Remove placeholder if no GA ID
|
||||||
|
return html.replace(/\s*<!-- INJECT_GOOGLE_ANALYTICS -->\n?/g, '')
|
||||||
|
}
|
||||||
|
|
||||||
|
const gaScripts = `<!-- Google Analytics -->
|
||||||
|
<script async src="https://www.googletagmanager.com/gtag/js?id=${gaMeasurementId}"></script>
|
||||||
|
<script>
|
||||||
|
window.dataLayer = window.dataLayer || [];
|
||||||
|
function gtag(){ dataLayer.push(arguments); }
|
||||||
|
gtag('consent','default',{
|
||||||
|
ad_storage:'denied',
|
||||||
|
analytics_storage:'denied',
|
||||||
|
ad_user_data:'denied',
|
||||||
|
ad_personalization:'denied',
|
||||||
|
wait_for_update:500
|
||||||
|
});
|
||||||
|
gtag('js', new Date());
|
||||||
|
gtag('config', '${gaMeasurementId}', {
|
||||||
|
debug_mode: (location.hostname === 'localhost'),
|
||||||
|
send_page_view: false
|
||||||
|
});
|
||||||
|
</script>`
|
||||||
|
|
||||||
|
return html.replace('<!-- INJECT_GOOGLE_ANALYTICS -->', gaScripts)
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// https://vite.dev/config/
|
// https://vite.dev/config/
|
||||||
export default defineConfig(({ mode }) => {
|
export default defineConfig(({ mode }) => {
|
||||||
// Load env file based on `mode` in the current working directory.
|
// Load env file based on `mode` in the current working directory.
|
||||||
@ -24,6 +59,7 @@ export default defineConfig(({ mode }) => {
|
|||||||
nodePolyfills({
|
nodePolyfills({
|
||||||
include: ['path'],
|
include: ['path'],
|
||||||
}),
|
}),
|
||||||
|
injectGoogleAnalytics(env.GA_MEASUREMENT_ID),
|
||||||
],
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
|
|||||||
@ -1,9 +1,46 @@
|
|||||||
import { defineConfig } from 'vite'
|
import { defineConfig, Plugin } from 'vite'
|
||||||
import react from '@vitejs/plugin-react'
|
import react from '@vitejs/plugin-react'
|
||||||
import tailwindcss from '@tailwindcss/vite'
|
import tailwindcss from '@tailwindcss/vite'
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
import { TanStackRouterVite } from '@tanstack/router-plugin/vite'
|
import { TanStackRouterVite } from '@tanstack/router-plugin/vite'
|
||||||
|
|
||||||
|
// Plugin to inject GA scripts in HTML
|
||||||
|
function injectGoogleAnalytics(): Plugin {
|
||||||
|
return {
|
||||||
|
name: 'inject-google-analytics',
|
||||||
|
transformIndexHtml(html) {
|
||||||
|
const gaMeasurementId = process.env.GA_MEASUREMENT_ID
|
||||||
|
|
||||||
|
// Only inject GA scripts if GA_MEASUREMENT_ID is set
|
||||||
|
if (!gaMeasurementId) {
|
||||||
|
// Remove placeholder if no GA ID
|
||||||
|
return html.replace(/\s*<!-- INJECT_GOOGLE_ANALYTICS -->\n?/g, '')
|
||||||
|
}
|
||||||
|
|
||||||
|
const gaScripts = `<!-- Google Analytics -->
|
||||||
|
<script async src="https://www.googletagmanager.com/gtag/js?id=${gaMeasurementId}"></script>
|
||||||
|
<script>
|
||||||
|
window.dataLayer = window.dataLayer || [];
|
||||||
|
function gtag(){ dataLayer.push(arguments); }
|
||||||
|
gtag('consent','default',{
|
||||||
|
ad_storage:'denied',
|
||||||
|
analytics_storage:'denied',
|
||||||
|
ad_user_data:'denied',
|
||||||
|
ad_personalization:'denied',
|
||||||
|
wait_for_update:500
|
||||||
|
});
|
||||||
|
gtag('js', new Date());
|
||||||
|
gtag('config', '${gaMeasurementId}', {
|
||||||
|
debug_mode: (location.hostname === 'localhost'),
|
||||||
|
send_page_view: false
|
||||||
|
});
|
||||||
|
</script>`
|
||||||
|
|
||||||
|
return html.replace('<!-- INJECT_GOOGLE_ANALYTICS -->', gaScripts)
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [
|
plugins: [
|
||||||
TanStackRouterVite({
|
TanStackRouterVite({
|
||||||
@ -13,6 +50,7 @@ export default defineConfig({
|
|||||||
}),
|
}),
|
||||||
react(),
|
react(),
|
||||||
tailwindcss(),
|
tailwindcss(),
|
||||||
|
injectGoogleAnalytics(),
|
||||||
],
|
],
|
||||||
build: {
|
build: {
|
||||||
outDir: './dist-web',
|
outDir: './dist-web',
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user