From d224536c11eac823a3ac98ea2a9e2cc1dc8c3f71 Mon Sep 17 00:00:00 2001 From: Yukai Huang Date: Wed, 29 Nov 2023 12:29:01 +0800 Subject: [PATCH] feat: integrate react-gtm-module --- package.json | 1 + pages/_app.js | 9 +++++++++ pages/_document.js | 19 +++++++++++++++++++ yarn.lock | 5 +++++ 4 files changed, 34 insertions(+) diff --git a/package.json b/package.json index 310b0f4..273e377 100644 --- a/package.json +++ b/package.json @@ -57,6 +57,7 @@ "prop-types": "^15.7.2", "react": "^17.0.1", "react-dom": "^17.0.1", + "react-gtm-module": "^2.0.11", "sass": "^1.26.11", "shorthash": "^0.0.2", "simple-react-lightbox": "3.6.6", diff --git a/pages/_app.js b/pages/_app.js index 3dea636..652a91c 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -3,6 +3,7 @@ import Router from 'next/router' import SimpleReactLightbox from 'simple-react-lightbox' import { ThemeProvider } from 'next-themes' import { appWithTranslation } from 'next-i18next' +import TagManager from 'react-gtm-module' import nextI18NextConfig from '../next-i18next.config' import Header from 'components/Header' @@ -22,6 +23,14 @@ Router.events.on( (url) => process.env.NODE_ENV === 'production' && pageview(url) ) +const tagManagerArgs = { + gtmId: process.env.NEXT_PUBLIC_GTM_ID, +} + +if (tagManagerArgs.gtmId) { + TagManager.initialize(tagManagerArgs) +} + function MyApp({ Component, pageProps, router }) { return ( <> diff --git a/pages/_document.js b/pages/_document.js index c1c7b63..cc8ef8c 100644 --- a/pages/_document.js +++ b/pages/_document.js @@ -4,6 +4,7 @@ import { NEXT_PUBLIC_GA_TRACKING_ID } from 'lib/constants' class MyDocument extends Document { render() { const isProduction = process.env.NODE_ENV === 'production' + const isGTMEnabled = process.env.NEXT_PUBLIC_GTM_ID && isProduction return ( @@ -48,8 +49,26 @@ class MyDocument extends Document { /> )} + {isGTMEnabled && ( + + )} + {isGTMEnabled && ( + + )}
diff --git a/yarn.lock b/yarn.lock index 41d2984..b905f07 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3570,6 +3570,11 @@ react-dom@^17.0.1: object-assign "^4.1.1" scheduler "^0.20.2" +react-gtm-module@^2.0.11: + version "2.0.11" + resolved "https://registry.yarnpkg.com/react-gtm-module/-/react-gtm-module-2.0.11.tgz#14484dac8257acd93614e347c32da9c5ac524206" + integrity sha512-8gyj4TTxeP7eEyc2QKawEuQoAZdjKvMY4pgWfycGmqGByhs17fR+zEBs0JUDq4US/l+vbTl+6zvUIx27iDo/Vw== + react-i18next@^11.16.2: version "11.17.2" resolved "https://registry.npmjs.org/react-i18next/-/react-i18next-11.17.2.tgz"