Mayuran/hot jar js test

.github/workflows/beta.yml

@@ -23,6 +23,7 @@ env:
     GATSBY_RUDDERSTACK_STAGING_KEY: ${{ secrets.GATSBY_RUDDERSTACK_STAGING_KEY }}
     GATSBY_RUDDERSTACK_PRODUCTION_KEY: ${{ secrets.GATSBY_RUDDERSTACK_PRODUCTION_KEY }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
 
 jobs:
     release-beta:

.github/workflows/generate-preview-link.yml

@@ -130,6 +130,8 @@ jobs:
                   GATSBY_STRAPI_TOKEN: ${{ secrets.GATSBY_STRAPI_TOKEN }}
                   GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
                   GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+                  GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
+
               run: npm run build
 
             - name: Publish to Cloudflare Pages

.github/workflows/production.yml

@@ -20,6 +20,7 @@ env:
     GATSBY_RUDDERSTACK_PRODUCTION_KEY: ${{ secrets.GATSBY_RUDDERSTACK_PRODUCTION_KEY }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
     GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
 
 jobs:
     release-production:
@@ -52,7 +53,7 @@ jobs:
             - run: npm run test
             - run: npm run build
             - run: echo $GIT_TAG_NAME > public/version.txt
-            
+
             - name: Remove Storybook
               uses: JesseTG/[email protected]
               with:

.github/workflows/staging.yml

@@ -25,6 +25,8 @@ env:
     GATSBY_STRAPI_TOKEN: ${{ secrets.GATSBY_STRAPI_TOKEN }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
     GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
+
 jobs:
     release-staging:
         timeout-minutes: 30

gatsby-ssr.js

@@ -12,6 +12,7 @@ export const wrapPageElement = WrapPagesWithLocaleContext
 
 export const onRenderBody = ({ setHeadComponents }) => {
     const gtmTrackingId = process.env.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID || ''
+    const hotjarId = process.env.GATSBY_HOTJAR_ID || ''
 
     setHeadComponents([
         // Partytown setup
@@ -51,5 +52,25 @@ export const onRenderBody = ({ setHeadComponents }) => {
                 }}
             />
         ),
+
+        // Hotjar setup
+        hotjarId && (
+            <script
+                key="hotjar-script"
+                type="text/partytown"
+                dangerouslySetInnerHTML={{
+                    __html: `(function(h,o,t,j,a,r){
+                h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+                h._hjSettings={hjid:'${hotjarId}',hjsv:'7'};
+                a=o.getElementsByTagName('head')[0];
+                setTimeout(function(){
+                    r=o.createElement('script');r.async=1;
+                    r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+                    a.appendChild(r);
+                }, 3000);
+            })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');`,
+                }}
+            />
+        ),
     ])
-}
+}