@graphcommerce/googletagmanager 2.0.10 → 2.1.0-canary.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 2.1.0-canary.1
|
|
4
|
+
|
|
5
|
+
## 2.1.0-canary.0
|
|
6
|
+
|
|
7
|
+
### Minor Changes
|
|
8
|
+
|
|
9
|
+
- [#1733](https://github.com/graphcommerce-org/graphcommerce/pull/1733) [`85afcf4d0`](https://github.com/graphcommerce-org/graphcommerce/commit/85afcf4d011701f4b80e59e2b2b52a2e1f99a655) - Google Tagmanager now uses the new plugin system ([@paales](https://github.com/paales))
|
|
10
|
+
|
|
11
|
+
- [#1733](https://github.com/graphcommerce-org/graphcommerce/pull/1733) [`fc9de1160`](https://github.com/graphcommerce-org/graphcommerce/commit/fc9de1160714cb909a9d0cb6fc0c068422f35310) - GoogleTagManagerScript is now added with a plugin ([@paales](https://github.com/paales))
|
|
12
|
+
|
|
3
13
|
## 2.0.10
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
|
@@ -1,17 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/** @deprecated Not needed anymore, please use the GoogleTagManagerScript component in your _app. */
|
|
3
2
|
export function GoogleTagManagerNoScript() {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
return (
|
|
7
|
-
<noscript>
|
|
8
|
-
{/* eslint-disable-next-line jsx-a11y/iframe-has-title */}
|
|
9
|
-
<iframe
|
|
10
|
-
src={`https://www.googletagmanager.com/ns.html?id=${process.env.NEXT_PUBLIC_GTM_ID}`}
|
|
11
|
-
height='0'
|
|
12
|
-
width='0'
|
|
13
|
-
style={{ display: 'none', visibility: 'hidden' }}
|
|
14
|
-
/>
|
|
15
|
-
</noscript>
|
|
16
|
-
)
|
|
3
|
+
return null
|
|
17
4
|
}
|
|
@@ -5,9 +5,6 @@ import { useEffect } from 'react'
|
|
|
5
5
|
export function GoogleTagManagerScript() {
|
|
6
6
|
const id = process.env.NEXT_PUBLIC_GTM_ID
|
|
7
7
|
|
|
8
|
-
if (process.env.NODE_ENV !== 'production' && !id)
|
|
9
|
-
console.warn('[@graphcommerce/googletagmanager]: NEXT_PUBLIC_GTM_ID not found')
|
|
10
|
-
|
|
11
8
|
const router = useRouter()
|
|
12
9
|
|
|
13
10
|
useEffect(() => {
|
|
@@ -26,12 +23,23 @@ export function GoogleTagManagerScript() {
|
|
|
26
23
|
if (!id) return null
|
|
27
24
|
|
|
28
25
|
return (
|
|
29
|
-
|
|
26
|
+
<>
|
|
27
|
+
<Script id={`gtm-${id}`} strategy='afterInteractive'>{`
|
|
30
28
|
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
|
|
31
29
|
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
|
|
32
30
|
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
|
|
33
31
|
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
|
|
34
32
|
})(window,document,'script','dataLayer', '${id}');
|
|
35
33
|
`}</Script>
|
|
34
|
+
<noscript>
|
|
35
|
+
{/* eslint-disable-next-line jsx-a11y/iframe-has-title */}
|
|
36
|
+
<iframe
|
|
37
|
+
src={`https://www.googletagmanager.com/ns.html?id=${process.env.NEXT_PUBLIC_GTM_ID}`}
|
|
38
|
+
height='0'
|
|
39
|
+
width='0'
|
|
40
|
+
style={{ display: 'none', visibility: 'hidden' }}
|
|
41
|
+
/>
|
|
42
|
+
</noscript>
|
|
43
|
+
</>
|
|
36
44
|
)
|
|
37
45
|
}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@graphcommerce/googletagmanager",
|
|
3
3
|
"homepage": "https://www.graphcommerce.org/",
|
|
4
4
|
"repository": "github:graphcommerce-org/graphcommerce",
|
|
5
|
-
"version": "2.0.
|
|
5
|
+
"version": "2.1.0-canary.1",
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"prettier": "@graphcommerce/prettier-config-pwa",
|
|
8
8
|
"eslintConfig": {
|
|
@@ -18,6 +18,9 @@
|
|
|
18
18
|
"@playwright/test": "^1.21.1",
|
|
19
19
|
"@types/gapi.client.tagmanager": "^2.0.2"
|
|
20
20
|
},
|
|
21
|
+
"dependencies": {
|
|
22
|
+
"@graphcommerce/magento-product": "4.14.0-canary.5"
|
|
23
|
+
},
|
|
21
24
|
"peerDependencies": {
|
|
22
25
|
"next": "^12.1.2",
|
|
23
26
|
"react": "^18.0.0",
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import type { PagesProps } from '@graphcommerce/framer-next-pages'
|
|
2
|
+
import type { PluginProps } from '@graphcommerce/next-config'
|
|
3
|
+
import { GoogleTagManagerScript } from '../components/GoogleTagManagerScript'
|
|
4
|
+
|
|
5
|
+
export const component = 'FramerNextPages'
|
|
6
|
+
export const exported = '@graphcommerce/framer-next-pages'
|
|
7
|
+
|
|
8
|
+
let warned = false
|
|
9
|
+
|
|
10
|
+
function GtagFramerNextPages(props: PluginProps<PagesProps>) {
|
|
11
|
+
const { Prev } = props
|
|
12
|
+
|
|
13
|
+
if (process.env.NEXT_PUBLIC_GTM_ID) {
|
|
14
|
+
return (
|
|
15
|
+
<>
|
|
16
|
+
<GoogleTagManagerScript />
|
|
17
|
+
<Prev {...props} />
|
|
18
|
+
</>
|
|
19
|
+
)
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
23
|
+
if (!warned) {
|
|
24
|
+
console.info('[@graphcommerce/googletagmanager]: process.env.NEXT_PUBLIC_GTM_ID not found')
|
|
25
|
+
warned = true
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
return <Prev {...props} />
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export const Plugin = GtagFramerNextPages
|