gatsby-core-theme 44.10.11 → 44.10.12-beta.1

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [44.10.12-beta.1](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/compare/v44.10.11...v44.10.12-beta.1) (2025-12-24)
+
+
+### Bug Fixes
+
+* fix error ([2339ad7](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/2339ad741f0c581fd71ed63e8d894d7b1340f18d))
+* inp optimization ([df31d2c](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/df31d2c071c5496c57a7b7db6a2da69e74ebda8b))
+* test partytown ([c7cd7c9](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/c7cd7c9a910c8b2d05fbd3b566add043bb824651))
+
+
+* Merge remote-tracking branch 'origin/EN-279-INP-optimization' into beta ([b477a63](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/b477a635e85b47f4c43043d366da4c8bd613e251))
+* Merge remote-tracking branch 'origin/master' into beta ([924dd7b](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/924dd7b43084d71fe89f549a6d47caf17ad5fec8))
+* Merge branch 'partytown-test' into 'beta' ([c2f1784](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/c2f1784e77b298c77a8dfe6f4c6e029c2aa09f4f))
+
 ## [44.10.11](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/compare/v44.10.10...v44.10.11) (2025-12-24)
 
 

package/gatsby-browser.js

@@ -16,148 +16,6 @@ require('./src/styles/base/_reset.scss');
 require('./src/styles/base/_spacing.scss');
 require('./src/styles/layouts/_grid.scss');
 
-function initGTM() {
-  if (window.loadGTM === false || window.gtmDidInit || process.env.DISABLE_GTM === 'true') {
-    return false;
-  }
-
-  window.gtmDidInit = true; // flag to ensure script does not get added to DOM more than once.
-  const trackingLink = `https://www.googletagmanager.com/gtm.js?id=${process.env.GA_TRACKING_ID}`;
-
-  const script = document.createElement('script');
-  script.type = 'text/javascript';
-  script.async = true;
-  script.src = trackingLink;
-
-  script.onload = () => {
-    // eslint-disable-next-line no-undef
-    dataLayer.push({
-      // ensure PageViews are always tracked
-      event: 'gtm.js',
-      'gtm.start': new Date().getTime(),
-      'gtm.uniqueEventId': 0,
-    });
-  };
-  document.head.appendChild(script);
-
-  const noscript = document.createElement('noscript');
-  const iframe = document.createElement('iframe');
-  iframe.src = trackingLink;
-  iframe.style.display = 'none';
-  iframe.style.visibility = 'hidden';
-  iframe.height = 0;
-  iframe.width = 0;
-  noscript.innerHTML += iframe.outerHTML;
-  document.body.appendChild(noscript);
-}
-
-function optinMonster() {
-  const script = document.createElement('script');
-  script.id = 'optin-monstr';
-  script.setAttribute('data-user', process.env.OPTINMONSTR_USER);
-  script.setAttribute('data-account', process.env.OPTINMONSTR_ACC);
-  script.src = 'https://a.omappapi.com/app/js/api.min.js';
-  script.async = true;
-  document.head.appendChild(script);
-}
-
-
-const loadFacebookPixel = () => {
-  !(function (f, b, e, v, n, t, s) {
-    // eslint-disable-next-line no-multi-assign
-    if (f.fbq) return;
-    n = f.fbq = function () {
-      n.callMethod
-        ? // eslint-disable-next-line prefer-spread, prefer-rest-params
-          n.callMethod.apply(n, arguments)
-        : n.queue.push(arguments);
-    };
-    if (!f._fbq) f._fbq = n;
-    n.push = n;
-    n.loaded = !0;
-    n.version = '2.0';
-    n.queue = [];
-    t = b.createElement(e);
-    t.async = !0;
-    t.id = 'pixel-code';
-    t.src = v;
-    s = b.getElementsByTagName(e)[0];
-    s.parentNode.insertBefore(t, s);
-  })(window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js');
-};
-
-const microsoftAdvertising = () => {
-  (function (w, d, t, r, u) {
-    var f, n, i;
-    (w[u] = w[u] || []),
-      (f = function () {
-        var o = { ti: '187106455', enableAutoSpaTracking: true };
-        (o.q = w[u]), (w[u] = new UET(o)), w[u].push('pageLoad');
-      }),
-      (n = d.createElement(t)),
-      (n.src = r),
-      (n.async = 1),
-      (n.id = 'microsoft-code'),
-      (n.onload = n.onreadystatechange =
-        function () {
-          var s = this.readyState;
-          (s && s !== 'loaded' && s !== 'complete') ||
-            (f(), (n.onload = n.onreadystatechange = null));
-        }),
-      (i = d.getElementsByTagName(t)[0]),
-      i.parentNode.insertBefore(n, i);
-  })(window, document, 'script', '//bat.bing.com/bat.js', 'uetq');
-};
-
-const piguard = () =>{
-  if (window.loadGTM === false) {
-    return false;
-  }
-
-  const script = document.createElement('script');
-  script.id = 'piguard';
-  script.src = `https://pg.${process.env.GATSBY_SITE_NAME}/analytics.js?tid=PP-${process.env.PIGUARD_ID}`;
-  script.async = true;
-  document.head.appendChild(script);
-}
-
-function scrollEvent(event) {
-  initGTM();
-
-  if (!document.getElementById('piguard') && process.env.ENABLE_PIGUARD === 'true') {
-    piguard();
-  }
-
-  if (process.env.ENABLE_MICROSOFT === 'true' && !document.getElementById('microsoft-code'))
-    microsoftAdvertising();
-
-  if (process.env.ENABLE_OPTINMONSTR === 'true' && !document.getElementById('optin-monstr'))
-    optinMonster();
-  if (process.env.ENABLE_PIXEL === 'true' && !document.getElementById('pixel-code')) {
-    if (
-      typeof window !== 'undefined' &&
-      window.location.pathname !== process.env.PAGE_EXCLUDE_PIXEL
-    ) {
-      loadFacebookPixel();
-
-      fbq('init', process.env.PIXEL_ID);
-
-      // Initialize and track the PageView event
-      fbq('track', 'PageView');
-    }
-  }
-
-  if (event) {
-    event.currentTarget.removeEventListener(event.type, scrollEvent); // remove the event listener that got triggered
-  }
-}
-
-exports.onClientEntry = () => {
-  if (process.env.PPC === 'true') {
-    scrollEvent(null);
-  } else {
-    document.addEventListener('scroll', scrollEvent, { passive: true });
-    document.addEventListener('mousemove', scrollEvent, { passive: true });
-    document.addEventListener('touchstart', scrollEvent, { passive: true });
-  }
-};
+// Note: GTM, Facebook Pixel, Microsoft Advertising, OptinMonster, and Piguard
+// are now loaded via Partytown in gatsby-ssr.js for better performance.
+// They run in a web worker instead of the main thread.

package/gatsby-node.mjs

@@ -9,8 +9,9 @@
 import loadash from "lodash/index.js";
 import chalk from "chalk";
 import fs from "fs";
-import { dirname } from "path";
+import nodePath, { dirname } from "path";
 import { fileURLToPath } from "url";
+import { copyLibFiles } from "@qwik.dev/partytown/utils";
 import keygen from "./src/helpers/keygen.mjs";
 import { getTranslations } from "./src/services/api.mjs";
 import { fetchSiteSettings } from "./src/services/fetch.mjs";
@@ -357,6 +358,10 @@ export const onCreatePage = async ({ page, actions }) => {
 };
 
 export const onPreBootstrap = async (options, themeOptions) => {
+  // Copy Partytown library files to static directory
+  console.log(chalk.magenta("info") + chalk.whiteBright(" copying Partytown library files"));
+  await copyLibFiles(nodePath.join(__dirname, "static", "~partytown"));
+
   // Get Data from Hercules
   ({
     siteSettingsData,

package/gatsby-ssr.js

@@ -0,0 +1,142 @@
+/* eslint-disable import/prefer-default-export */
+/* eslint-disable react/jsx-filename-extension */
+import React from "react";
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { Partytown } from "@qwik.dev/partytown/react";
+
+export const onRenderBody = ({ setHeadComponents, setPreBodyComponents }) => {
+  const gaTrackingId = process.env.GA_TRACKING_ID;
+  const enableGTM = process.env.DISABLE_GTM !== "true";
+  const enablePixel = process.env.ENABLE_PIXEL === "true";
+  const pixelId = process.env.PIXEL_ID;
+  const enableMicrosoft = process.env.ENABLE_MICROSOFT === "true";
+  const enableOptinMonster = process.env.ENABLE_OPTINMONSTR === "true";
+  const optinMonsterUser = process.env.OPTINMONSTR_USER;
+  const optinMonsterAcc = process.env.OPTINMONSTR_ACC;
+  const enablePiguard = process.env.ENABLE_PIGUARD === "true";
+  const piguardId = process.env.PIGUARD_ID;
+  const siteName = process.env.GATSBY_SITE_NAME;
+
+  // Configure Partytown with forwarding for all analytics
+  const forwardConfig = ["dataLayer.push"];
+
+  if (enablePixel) {
+    forwardConfig.push("fbq");
+  }
+
+  if (enableMicrosoft) {
+    forwardConfig.push("uetq.push");
+  }
+
+  const headComponents = [
+    <Partytown
+      key="partytown"
+      debug={process.env.NODE_ENV === "development"}
+      forward={forwardConfig}
+    />,
+  ];
+
+  // Add Google Tag Manager script with Partytown
+  if (enableGTM && gaTrackingId) {
+    headComponents.push(
+      <script
+        key="gtm-init"
+        type="text/partytown"
+        dangerouslySetInnerHTML={{
+          __html: `
+            window.dataLayer = window.dataLayer || [];
+            window.dataLayer.push({
+              'gtm.start': new Date().getTime(),
+              event: 'gtm.js'
+            });
+          `,
+        }}
+      />,
+      <script
+        key="gtm"
+        type="text/partytown"
+        src={`https://www.googletagmanager.com/gtm.js?id=${gaTrackingId}`}
+      />
+    );
+  }
+
+  // Add Facebook Pixel script with Partytown
+  if (enablePixel && pixelId) {
+    headComponents.push(
+      <script
+        key="fb-pixel"
+        type="text/partytown"
+        dangerouslySetInnerHTML={{
+          __html: `
+            !function(f,b,e,v,n,t,s)
+            {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
+            n.callMethod.apply(n,arguments):n.queue.push(arguments)};
+            if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
+            n.queue=[];t=b.createElement(e);t.async=!0;
+            t.src=v;s=b.getElementsByTagName(e)[0];
+            s.parentNode.insertBefore(t,s)}(window, document,'script',
+            'https://connect.facebook.net/en_US/fbevents.js');
+            fbq('init', '${pixelId}');
+            fbq('track', 'PageView');
+          `,
+        }}
+      />
+    );
+  }
+
+  // Add Microsoft Advertising (UET) script with Partytown
+  if (enableMicrosoft) {
+    headComponents.push(
+      <script
+        key="microsoft-uet"
+        type="text/partytown"
+        dangerouslySetInnerHTML={{
+          __html: `
+            (function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"187106455",enableAutoSpaTracking:true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
+          `,
+        }}
+      />
+    );
+  }
+
+  // Add OptinMonster script with Partytown
+  if (enableOptinMonster && optinMonsterUser && optinMonsterAcc) {
+    headComponents.push(
+      <script
+        key="optinmonster"
+        type="text/partytown"
+        data-user={optinMonsterUser}
+        data-account={optinMonsterAcc}
+        src="https://a.omappapi.com/app/js/api.min.js"
+      />
+    );
+  }
+
+  // Add Piguard script with Partytown
+  if (enablePiguard && piguardId && siteName) {
+    headComponents.push(
+      <script
+        key="piguard"
+        type="text/partytown"
+        src={`https://pg.${siteName}/analytics.js?tid=PP-${piguardId}`}
+      />
+    );
+  }
+
+  setHeadComponents(headComponents);
+
+  // Add GTM noscript fallback to body
+  if (enableGTM && gaTrackingId) {
+    setPreBodyComponents([
+      <noscript
+        key="gtm-noscript"
+        dangerouslySetInnerHTML={{
+          __html: `
+            <iframe src="https://www.googletagmanager.com/ns.html?id=${gaTrackingId}" height="0" width="0"
+                style="display:none;visibility:hidden"></iframe>
+          `,
+        }}
+      />,
+    ]);
+  }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-core-theme",
-  "version": "44.10.11",
+  "version": "44.10.12-beta.1",
   "description": "Gatsby Theme NPM Package",
   "author": "",
   "license": "ISC",
@@ -18,6 +18,7 @@
     "build-storybook": "cross-env STORYBOOK_IMAGE_CDN_URL=https://cdn.irishluck.ie STORYBOOK_GATSBY_SITE_NAME=norskespilleautomater.com STORYBOOK_TRACKER_LINK_FORMAT_NON_MAIN=[no],[visit],short_name STORYBOOK_TRACKER_LINK_FORMAT_MAIN=[no],[visit],short_name build-storybook"
   },
   "dependencies": {
+    "@qwik.dev/partytown": "^0.11.2",
     "@reach/router": "^1.3.3",
     "@gigmedia/enigma-utils": "^1.20.0",
     "@react-icons/all-files": "^4.1.0",

package/src/components/organisms/navigation/navigationContext.js

@@ -1,16 +1,40 @@
-import React, { useState, createContext } from 'react';
+import React, { useState, createContext, startTransition } from 'react';
+import PropTypes from 'prop-types';
 
 export const NavigationContext = createContext(false);
 
-const NavigationProvider = (props) => {
+const NavigationProvider = ({ children }) => {
   const [showMenu, setShowMenu] = useState(false);
   const [showSearch, setShowSearch] = useState(false);
 
+  const setShowMenuTransition = (value) => {
+    startTransition(() => {
+      setShowMenu(value);
+    });
+  };
+
+  const setShowSearchTransition = (value) => {
+    startTransition(() => {
+      setShowSearch(value);
+    });
+  };
+
   return (
-    <NavigationContext.Provider value={{ showMenu, setShowMenu, showSearch, setShowSearch }}>
-      {props.children}
+    <NavigationContext.Provider
+      value={{
+        showMenu,
+        setShowMenu: setShowMenuTransition,
+        showSearch,
+        setShowSearch: setShowSearchTransition,
+      }}
+    >
+      {children}
     </NavigationContext.Provider>
   );
 };
 
 export default NavigationProvider;
+
+NavigationProvider.propTypes = {
+  children: PropTypes.node.isRequired,
+};

package/src/components/organisms/search/index.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-unused-expressions */
 /* eslint-disable no-console */
 /* eslint-disable react-hooks/rules-of-hooks */
-import React, { useRef, useState, useEffect } from "react";
+import React, { useRef, useState, useEffect, startTransition } from "react";
 import PropTypes from "prop-types";
 import { BiSearchAlt } from "@react-icons/all-files/bi/BiSearchAlt";
 import { IoIosArrowForward } from "@react-icons/all-files/io/IoIosArrowForward";
@@ -34,6 +34,7 @@ const SearchForm = ({
   const topSearches =
     pageContext?.marketSections?.top_searches?.modules?.[0]?.items;
   const [localSearch, setLocalSearch] = useState(false);
+  const [showVariableComponent, setShowVariableComponent] = useState(false);
 
   const loadedCounts = {
     page: loadAutoComplete,
@@ -63,14 +64,25 @@ const SearchForm = ({
   const searchFormRef = useRef();
 
   const handleOnSearchIconClick = () => {
-    setLocalSearch(!localSearch);
-    toggleScroll("search");
+      setLocalSearch(!localSearch);
+      toggleScroll("search");
+      
+      // Defer VariableComponent rendering to reduce processing duration on first click
+      // This allows the overlay to appear immediately, then render the heavy component
+      if (!localSearch) {
+        startTransition(() => {
+          setShowVariableComponent(true);
+        });
+      } else {
+        setShowVariableComponent(false);
+      }
   };
 
   const handleOverlayClickClose = (event) => {
     if (event.target.classList.contains(styles.searchForm)) {
       toggleScroll("search");
       setLocalSearch(false);
+      setShowVariableComponent(false);
     }
   };
 
@@ -126,6 +138,7 @@ const SearchForm = ({
         !searchFormRef.current.contains(event.target)
       ) {
         setLocalSearch(false);
+        setShowVariableComponent(false);
         toggleScroll("search");
       }
     };
@@ -275,7 +288,7 @@ const SearchForm = ({
                 )}
               </div>
             )}
-            {(showRecommendedCasinos || showTopSearches) && (!filteredData || filteredData.length === 0) && !autoCompleteLoading && (
+            {(showRecommendedCasinos || showTopSearches) && (!filteredData || filteredData.length === 0) && !autoCompleteLoading && showVariableComponent && (
               <VariableComponent
                 recommendedCasinos={recommendedCasinos}
                 topSearches={topSearches}