From 442a6e85f3fcd5102a0ea36a62627a1545e19ae9 Mon Sep 17 00:00:00 2001
From: Habib Deriv <88178645+habib-deriv@users.noreply.github.com>
Date: Mon, 27 Nov 2023 10:51:15 +0600
Subject: [PATCH] Fix gtm partytown integration (#6038)

* chore: fix gtm partytown integration

* chore: remove defer

Downloading the script asynchronously is enough
---
 gatsby-config.js |  3 ---
 gatsby-ssr.js    | 33 +++++++++++++++++++++------------
 2 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/gatsby-config.js b/gatsby-config.js
index 27319ae5805..66d97899414 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -48,9 +48,6 @@ module.exports = {
         `https://assets.customer.io/assets/track.js`,
         `https://static.deriv.com/scripts/cookie.js`,
         `https://widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js`,
-        `https://cdn.livechatinc.com/tracking.js`,
-        `https://www.google-analytics.com/analytics.js`,
-        `https://www.googletagmanager.com/gtm.js?id=${process.env.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID}`,
     ],
     plugins: [
         // [TODO] Enable this when we have a proper setup to enable caching, Otherwise it will cause one of them stop working.
diff --git a/gatsby-ssr.js b/gatsby-ssr.js
index 3d824a61786..7048a3cbbb8 100644
--- a/gatsby-ssr.js
+++ b/gatsby-ssr.js
@@ -14,29 +14,38 @@ export const onRenderBody = ({ setHeadComponents }) => {
     const gtmTrackingId = process.env.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID || ''
 
     setHeadComponents([
+        // Partytown setup
         <Partytown key="partytown" forward={['dataLayer.push']} />,
         <script
             key="partytown-vanilla-config"
-            type="text/partytown"
             dangerouslySetInnerHTML={{
                 __html: `partytown = {
-          resolveUrl(url, location) {
-            // Use a secure connection
-            if (url?.protocol === 'http:') {
-              url = new URL(url.href.replace('http', 'https'))
-            }
-            // Point to our proxied URL
-            const proxyUrl = new URL(location.origin + '/__third-party-proxy')
-            proxyUrl.searchParams.append('url', url)
-            return proxyUrl
-          }
-        }`,
+                    resolveUrl(url, location) {
+                        // Use a secure connection
+                        if (url?.protocol === 'http:') {
+                            url = new URL(url.href.replace('http', 'https'))
+                        }
+                        // Point to our proxied URL
+                        const proxyUrl = new URL(location.origin + '/__third-party-proxy')
+                        proxyUrl.searchParams.append('url', url)
+                        return proxyUrl
+                    }
+                }`,
             }}
         />,
+        
+        // GTM setup
         gtmTrackingId && (
             <script
                 key="gtm-script"
                 type="text/partytown"
+                async
+                src={`https://www.googletagmanager.com/gtm.js?id=${gtmTrackingId}`}
+            ></script>
+        ),
+        gtmTrackingId && (
+            <script
+                key="gtm-script"
                 dangerouslySetInnerHTML={{
                     __html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl+'';f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer', '${gtmTrackingId}');`,
                 }}