diff --git a/client/components/vendor/FeatureBase.vue b/client/components/vendor/FeatureBase.vue index 61ec67d1..54a156be 100644 --- a/client/components/vendor/FeatureBase.vue +++ b/client/components/vendor/FeatureBase.vue @@ -54,7 +54,7 @@ const setupForUser = () => { } onMounted(() => { - if (import.meta.server) return + if (import.meta.server || !user.value) return // Setup base if ( @@ -66,7 +66,6 @@ onMounted(() => { } } - if (!user.value) return loadScript() try { setupForUser() diff --git a/client/gtm.js b/client/gtm.js index c838cef6..8dce6517 100644 --- a/client/gtm.js +++ b/client/gtm.js @@ -1,5 +1,6 @@ export default { id: process.env.NUXT_PUBLIC_GTM_CODE, // Your GTM single container ID, array of container ids ['GTM-xxxxxx', 'GTM-yyyyyy'] or array of objects [{id: 'GTM-xxxxxx', queryParams: { gtm_auth: 'abc123', gtm_preview: 'env-4', gtm_cookies_win: 'x'}}, {id: 'GTM-yyyyyy', queryParams: {gtm_auth: 'abc234', gtm_preview: 'env-5', gtm_cookies_win: 'x'}}], // Your GTM single container ID or array of container ids ['GTM-xxxxxx', 'GTM-yyyyyy'] debug: false, // Whether or not display console logs debugs (optional) - devtools: false, // (optional) + devtools: false, // (optional), + enabled: false, // Disabled by default, will be enabled conditionally by our plugin } diff --git a/client/package-lock.json b/client/package-lock.json index d093ec70..b648ab91 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -8,6 +8,7 @@ "hasInstallScript": true, "dependencies": { "@codemirror/lang-html": "^6.4.9", + "@gtm-support/vue-gtm": "^3.1.0", "@iconify-json/material-symbols": "^1.2.4", "@nuxt/ui": "^2.19.2", "@pinia/nuxt": "^0.11.0", @@ -1448,26 +1449,24 @@ "license": "MIT" }, "node_modules/@gtm-support/core": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@gtm-support/core/-/core-2.3.1.tgz", - "integrity": "sha512-eD0hndQjhgKm5f/7IA9fZYujmHiVMY+fnYv4mdZSmz5XJQlS4TiTmpdZx2l7I2A9rI9J6Ysz8LpXYYNo/Xq4LQ==", - "dev": true, + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@gtm-support/core/-/core-3.0.1.tgz", + "integrity": "sha512-SctcoqvvAbGAgZzOb7DZ4wjbZF3ZS7Las3qIEByv6g7mzPf4E9LpRXcQzjmywYLcUx2jys7PWJAa3s5slvj/0w==", "license": "MIT" }, "node_modules/@gtm-support/vue-gtm": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@gtm-support/vue-gtm/-/vue-gtm-2.2.0.tgz", - "integrity": "sha512-7nhBTRkTG0mD+7r7JvNalJz++YwszZk0oP1HIY6fCgz6wNKxT6LuiXCqdPrZmNPe/WbPIKuqxGZN5s+i6NZqow==", - "dev": true, + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@gtm-support/vue-gtm/-/vue-gtm-3.1.0.tgz", + "integrity": "sha512-kGUnCI+Z5lBeCKd7rzgU7UoFU8Q0EkJfh17SgeyAyx8cLdISqeq54BNJKZrME3WXersoigLZVJ1GLs0buYD3lA==", "license": "MIT", "dependencies": { - "@gtm-support/core": "^2.0.0" + "@gtm-support/core": "^3.0.1" }, "optionalDependencies": { - "vue-router": ">= 4.1.0 < 5.0.0" + "vue-router": ">= 4.4.1 < 5.0.0" }, "peerDependencies": { - "vue": ">= 3.2.0 < 4.0.0" + "vue": ">= 3.2.26 < 4.0.0" }, "peerDependenciesMeta": { "vue-router": { @@ -9117,6 +9116,34 @@ "nuxt": "^3.0.0" } }, + "node_modules/@zadigetvoltaire/nuxt-gtm/node_modules/@gtm-support/core": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/@gtm-support/core/-/core-2.3.1.tgz", + "integrity": "sha512-eD0hndQjhgKm5f/7IA9fZYujmHiVMY+fnYv4mdZSmz5XJQlS4TiTmpdZx2l7I2A9rI9J6Ysz8LpXYYNo/Xq4LQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/@zadigetvoltaire/nuxt-gtm/node_modules/@gtm-support/vue-gtm": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/@gtm-support/vue-gtm/-/vue-gtm-2.2.0.tgz", + "integrity": "sha512-7nhBTRkTG0mD+7r7JvNalJz++YwszZk0oP1HIY6fCgz6wNKxT6LuiXCqdPrZmNPe/WbPIKuqxGZN5s+i6NZqow==", + "dev": true, + "license": "MIT", + "dependencies": { + "@gtm-support/core": "^2.0.0" + }, + "optionalDependencies": { + "vue-router": ">= 4.1.0 < 5.0.0" + }, + "peerDependencies": { + "vue": ">= 3.2.0 < 4.0.0" + }, + "peerDependenciesMeta": { + "vue-router": { + "optional": true + } + } + }, "node_modules/@zadigetvoltaire/nuxt-gtm/node_modules/sirv": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz", diff --git a/client/plugins/gtm.client.js b/client/plugins/gtm.client.js new file mode 100644 index 00000000..d2c8c338 --- /dev/null +++ b/client/plugins/gtm.client.js @@ -0,0 +1,31 @@ +import gtmConfig from '../gtm' + +export default defineNuxtPlugin(() => { + const route = useRoute() + const isIframe = useIsIframe() + const isPublicFormPage = route.name === 'forms-slug' + + // Only enable GTM if not in a form page (for respondents) and not in an iframe + if (!isPublicFormPage && !isIframe && process.env.NUXT_PUBLIC_GTM_CODE) { + // Initialize GTM manually only when needed + const gtm = useGtm() + + // Override the enabled setting to true for this session + gtmConfig.enabled = true + + // Watch for route changes to track page views + watch(() => route.fullPath, () => { + if (!route.name || route.name !== 'forms-slug') { + gtm.trackView(route.name, route.fullPath) + } + }, { immediate: true }) + + return { + provide: { + gtm + } + } + } + + return {} +}) \ No newline at end of file