Feature/add url to google tag manager

docs/02-app/01-building-your-application/06-optimizing/12-third-party-libraries.mdx

@@ -116,6 +116,16 @@ export default function Page() {
 ```
 
 </PagesOnly>
+#### Using a custom server URL
+
+If you have a server-side tag manager deployment, you can customize the URL by passing in a `url` parameter. The component uses `https://www.googletagamanager.com` by default.
+
+```jsx
+import { GoogleTagManager } from '@next/third-parties/google'
+
+  <GoogleTagManager gtmId="GTM-XYZ" url="https://tag-manager-server.xyz" />
+}
+```
 
 #### Sending Events
 

packages/third-parties/src/google/gtm.tsx

@@ -8,7 +8,7 @@ import type { GTMParams } from '../types/google'
 let currDataLayerName: string | undefined = undefined
 
 export function GoogleTagManager(props: GTMParams) {
-  const { gtmId, dataLayerName = 'dataLayer', auth, preview, dataLayer } = props
+  const { gtmId, dataLayerName = 'dataLayer', auth, preview, dataLayer, url } = props
 
   if (currDataLayerName === undefined) {
     currDataLayerName = dataLayerName
@@ -17,7 +17,7 @@ export function GoogleTagManager(props: GTMParams) {
   const gtmLayer = dataLayerName !== 'dataLayer' ? `&l=${dataLayerName}` : ''
   const gtmAuth = auth ? `&gtm_auth=${auth}` : ''
   const gtmPreview = preview ? `&gtm_preview=${preview}&gtm_cookies_win=x` : ''
-
+  const gtmUrl = url ? url : 'https://www.googletagmanager.com'
   useEffect(() => {
     // performance.mark is being used as a feature use signal. While it is traditionally used for performance
     // benchmarking it is low overhead and thus considered safe to use in production and it is a widely available
@@ -47,7 +47,7 @@ export function GoogleTagManager(props: GTMParams) {
       <Script
         id="_next-gtm"
         data-ntpc="GTM"
-        src={`https://www.googletagmanager.com/gtm.js?id=${gtmId}${gtmLayer}${gtmAuth}${gtmPreview}`}
+        src={`${gtmUrl}/gtm.js?id=${gtmId}${gtmLayer}${gtmAuth}${gtmPreview}`}
       />
     </>
   )

packages/third-parties/src/types/google.ts

@@ -11,6 +11,7 @@ export type GTMParams = {
   dataLayerName?: string
   auth?: string
   preview?: string
+  url?: string
 }
 
 export type GAParams = {