gatsby-core-theme 40.0.2 → 40.0.4

package/CHANGELOG.md

@@ -1,3 +1,33 @@
+## [40.0.4](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/compare/v40.0.3...v40.0.4) (2024-10-15)
+
+
+### Bug Fixes
+
+* preview feature ([e01820d](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/e01820d1a5a543dd6209c78dd3826d9b13bf3ed4))
+
+## [40.0.3](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/compare/v40.0.2...v40.0.3) (2024-10-15)
+
+
+### Bug Fixes
+
+* added tests for game.mjs ([4d3848c](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/4d3848c7a55c3bbdc2d603ce3f08ec7e665bff09))
+* admin bar ([e9f3430](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/e9f3430a9cded767cef9647baf37df9151c34be7))
+* clean up ([8a413b0](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/8a413b09fa3ab645511d4ca20a65175ba3d9cc77))
+* fix prevview ([fe5a7e8](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/fe5a7e88edda1f6fe99994e298f0c263cd79f6fb))
+* game sanitization ([502e6fd](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/502e6fd020ab3f4cc5b80e029be9d5741d6d058d))
+* premain ([c06770c](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/c06770c3064f1c49fcf1b595bfddbb97b2be97b1))
+* preview logic ([ddc883d](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/ddc883d8261484eb3c6bc4137206aefd3cc18f22))
+* sitemap changes ([1198642](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/11986422dcf9930d1a199213c49e8e7182d053d0))
+* sitemap changes ([600b0bc](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/600b0bcf8aad82f403ffa6991ca531261cb29565))
+* sitemap changes ([1dd5f66](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/1dd5f6639b3493711676f7b5b79fae001b681bc0))
+* update relations mjs ([c3c6cc8](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/c3c6cc8dd924f68ab640a63629a329755ec65be0))
+
+
+* Merge branch 'tm-4857-sitemap-changes' into 'master' ([6924cb1](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/6924cb19082dc397f22975d1a5d87064e555bc5c))
+* Merge branch 'tm-4682-previewLogic' into 'master' ([b3f573c](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/b3f573ce4153cae6a087b1b1b89b0017b900ea70))
+* Merge branch 'merge-market-values-before' into 'master' ([7feb898](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/7feb8981db130d7b18d69e4ec8d42a3716d53657))
+* Merge branch 'master' into tm-4682-previewLogic ([cd7d01f](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/commit/cd7d01f9e77158712c2a18a7deac564349eea4a6))
+
 ## [40.0.2](https://gitlab.com/g2m-gentoo/team-floyd/themes/gatsby-themes/compare/v40.0.1...v40.0.2) (2024-10-11)
 
 

package/gatsby-node.mjs

@@ -10,8 +10,8 @@ import chalk from 'chalk';
 import fs from 'fs';
 import { dirname } from 'path';
 import { fileURLToPath } from 'url';
-import { getData, getLocalData, getTranslations, getSiteSettings, getRibbons, getResponsableGamings, getToplists, getContent } from './src/helpers/api.mjs';
-
+import { getData, getLocalData, getTranslations } from './src/helpers/api.mjs';
+import { fetchSiteSettings } from './src/helpers/fetch-site-settings.mjs';
 import { generateTrackerLink } from './src/helpers/generators.mjs';
 import processor, { processSitemapPages } from './src/helpers/processor/index.mjs';
 import { pickTrackerOperatorKeys } from './src/constants/pick-keys.mjs';
@@ -37,6 +37,7 @@ let authors = null;
 let responsableGamingData = null;
 let toplistData = null;
 let contentData = null;
+let pagesData = null;
 let translationsData = null;
 let siteSettingsData = null;
 let siteGeneralData = null;
@@ -247,19 +248,6 @@ export const createPages = async ({ actions: { createPage } }, themeOptions) =>
   // create every single page
   Object.keys(processed.site_markets).forEach((siteMarket) => {
     if (!processed.pages[siteMarket]['page']) processed.pages[siteMarket]['page'] = [];
-    processed.pages[siteMarket]['page'].push({
-      meta_title: 'Preview',
-      relation_type: 'page',
-      path: 'preview',
-      template: 'default',
-      meta_robots: ['noindex', 'nofollow'],
-      sections: {
-        main: { modules: [] },
-        navigation: { modules: [] },
-        sidebar: { modules: [] },
-        footer: { modules: [] },
-      },
-    });
     let count = 0;
     Object.keys(processed.pages[siteMarket]).forEach((pageType) => {
       processed.pages[siteMarket][pageType].forEach((page) => {
@@ -270,10 +258,7 @@ export const createPages = async ({ actions: { createPage } }, themeOptions) =>
         const processedPage = page;
         processedPage.preconnect_links = preconnectLinks;
 
-        siteSchema =
-          page.path === 'preview'
-            ? (page.siteSchema = Object.values(schemaData || {})[0])
-            : schemaData[page['market_id']];
+        siteSchema = schemaData[page['market_id']];
         authors = response.authors;
 
         // siteInfo, siteSchema and authors are added to page for schemaGenerator()
@@ -328,8 +313,7 @@ export const createPages = async ({ actions: { createPage } }, themeOptions) =>
             path: `/${page.path}`,
             component: `${__dirname}/src/components/app-ssr.js`,
             context: {
-              ...contextData,
-              isPreview: page.path === 'preview',
+              ...contextData
             },
           });
         } else {
@@ -341,8 +325,7 @@ export const createPages = async ({ actions: { createPage } }, themeOptions) =>
             path: page.path.charAt(0) === '/' ? page.path : `/${page.path}`,
             component,
             context: {
-              ...contextData,
-              isPreview: page.path === 'preview',
+              ...contextData
             },
           });
         }
@@ -430,7 +413,7 @@ export const createPages = async ({ actions: { createPage } }, themeOptions) =>
 
 export const onCreatePage = async ({ page, actions }) => {
   const { createPage, deletePage } = actions;
-
+  
   if (is404Page(allMarketPrefixes, page.path)) {
     const oldPage = { ...page };
     const pathPrefix = page.path.split(`/`)[1];
@@ -463,7 +446,13 @@ export const onCreatePage = async ({ page, actions }) => {
       component: `${__dirname}/src/components/app.js`,
       context: context404,
     });
-  } else {
+  }
+  else if (page.path.includes('preview')) {
+    createPage({
+      ...page
+    });
+  }
+  else {
     createPage({
       path: page.path,
       component: `${__dirname}/src/components/app.js`,
@@ -474,21 +463,18 @@ export const onCreatePage = async ({ page, actions }) => {
 
 export const onPreBootstrap = async () => {
   // Get Data from Hercules
-  siteSettingsData = await getSiteSettings(process.env.GATSBY_SITE_NAME);
-  ribbonsData = await getRibbons(`site=${process.env.GATSBY_SITE_NAME}`);
-  const siteId = Object.keys(siteSettingsData.general)[0];
-  responsableGamingData = await getResponsableGamings(process.env.GATSBY_SITE_NAME, siteId);
-  toplistData = await getToplists(process.env.GATSBY_SITE_NAME);
-  contentData = await getContent(process.env.GATSBY_SITE_NAME);
-
-  siteGeneralData = siteSettingsData.general[siteId]
-  allMarketsData = siteSettingsData.site_markets;
-  allMarketPrefixes = Object.keys(allMarketsData).map(
-      (key) => allMarketsData[key].path_prefix
-    ).filter(item => !!item);
-  schemaData = siteSettingsData.schema;
-  templatesData = siteSettingsData.templates;
-  allMarketSectionsData = siteSettingsData.market_sections;
+ ({siteSettingsData,
+  siteGeneralData,
+  allMarketsData,
+  allMarketPrefixes,
+  schemaData,
+  templatesData,
+  allMarketSectionsData,
+  ribbonsData,
+  responsableGamingData,
+  toplistData,
+  contentData,
+  pagesData } = await fetchSiteSettings(process.env.GATSBY_SITE_NAME));
 }
 
 export const sourceNodes = async ({ actions, createNodeId, createContentDigest }) => {
@@ -533,6 +519,35 @@ export const sourceNodes = async ({ actions, createNodeId, createContentDigest }
       createNode(node)
     });
   });
+
+  // eslint-disable-next-line array-callback-return
+  Object.keys(pagesData).map((pageId) => {
+    const page = pagesData[pageId]
+    if(page && page.robot_options && page.robot_options.page_index) {
+      const pageSitemap = {
+      'path': page.path,
+      'updated_at': page.updated_at,
+      'market': page.market,
+      'language': page.language
+    }
+
+    const nodeMeta = {
+      id: createNodeId(keygen()),
+      parent: null,
+      children: [],
+      internal: {
+        type: `Sitemap`,
+        mediaType: `text/html`,
+        contentDigest: createContentDigest(pageId),
+      },
+    };
+    const node = { ...pageSitemap, ...nodeMeta}
+    createNode(node)
+    }
+    
+
+  })
+
 };
 
 export const onCreateWebpackConfig = ({ actions, stage, getConfig }) => {
@@ -566,4 +581,4 @@ export const onCreateWebpackConfig = ({ actions, stage, getConfig }) => {
       },
     },
   });
-};
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-core-theme",
-  "version": "40.0.2",
+  "version": "40.0.4",
   "description": "Gatsby Theme NPM Package",
   "author": "",
   "license": "ISC",
@@ -33,7 +33,7 @@
     "gatsby-plugin-postcss": "^6.11.0",
     "gatsby-plugin-sass": "^6.11.0",
     "gatsby-plugin-sharp": "^5.11.0",
-    "gatsby-plugin-sitemap": "^5.10.2",
+    "gatsby-plugin-sitemap": "^6.13.1",
     "gatsby-plugin-webfonts": "^2.2.1",
     "gatsby-source-filesystem": "^5.11.0",
     "gatsby-transformer-sharp": "^5.11.0",

package/src/components/app-ssr.js

@@ -2,7 +2,6 @@
 /* eslint-disable react/forbid-prop-types */
 import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import { globalHistory } from '@reach/router';
 import { graphql, useStaticQuery } from 'gatsby';
 import MainProvider from '~context/MainProvider';
 import { getCookie } from "~helpers/cookies";
@@ -26,43 +25,10 @@ const AppSSR = ({ pageContext, serverData }) => {
     }
   `);
 
-  const { isPreview } = pageContext;
-  const [previewContext, setPreviewContext] = useState({});
-  const [isLoading, setIsLoading] = useState({});
   const [isAdmin, setIsAdmin] = useState(false);
 
-  async function getData(searchParams, staticPath = null) {
-    const { getPreview } = await import('~helpers/api');
-    getPreview(
-      pageContext.siteName,
-      !staticPath ? searchParams.get('path') || '/' : staticPath,
-      pageContext
-    ).then((previewResponse) => {
-      if (previewResponse.page) {
-        // siteInfo and siteSchema are added to page for schemaGenerator()
-        previewResponse.page.siteInfo = pageContext.siteInfo;
-        previewResponse.page.siteSchema = pageContext.siteSchema;
-      }
-      setPreviewContext(previewResponse);
-      setIsLoading(false);
-    });
-  }
 
   useEffect(() => {
-    if (isPreview) {
-      setIsLoading(true);
-      const searchParams =
-        typeof window !== 'undefined' ? new URLSearchParams(window.location.search) : null;
-      if (!searchParams.get('path')) {
-        window.location = `${window.location.origin}/preview?path=/`;
-      }
-      getData(searchParams);
-      globalHistory.listen(({ location }) => {
-        setIsLoading(true);
-
-        getData(null, location.search.replace('?path=', ''));
-      });
-    }
 
     if (
       typeof window !== `undefined` &&
@@ -73,16 +39,12 @@ const AppSSR = ({ pageContext, serverData }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  if (isPreview) {
-    if (isLoading) {
-      return 'Loading...';
-    }
-  }
+
 
   return (
     <>
       <MainProvider value={{ admin: isAdmin, translations: data.translations, language: pageContext.page.language  }}  >
-        <Body pageContext={isPreview ? previewContext : pageContext} serverData={serverData} />
+        <Body pageContext={pageContext} serverData={serverData} />
       </MainProvider>
     </>
   );
@@ -122,4 +84,4 @@ export async function getServerData(props) {
   let res = '';
   res = await getAPIData(pageContext.page, url, headers);
   return res;
-}
+}

package/src/components/app.js

@@ -9,9 +9,7 @@ import Body from '~pages/body';
 import HeadData from '~organisms/head';
 
 const App = ({ pageContext }) => {
-  const { isPreview } = pageContext;
-  const [previewContext, setPreviewContext] = useState({});
-  const [isLoading, setIsLoading] = useState({});
+
   const [isAdmin, setIsAdmin] = useState(false);
 
   const data = useStaticQuery(graphql`
@@ -28,35 +26,7 @@ const App = ({ pageContext }) => {
     }
   `);
 
-  async function getData(searchParams, staticPath = null) {
-    const { getPreview } = await import('~helpers/api');
-    getPreview(
-      pageContext.siteName,
-      !staticPath ? searchParams.get('path') || '/' : staticPath,
-      searchParams.get('market_id'),
-      pageContext
-    ).then((previewResponse) => {
-      if (previewResponse.page) {
-        // siteInfo and siteSchema are added to page for schemaGenerator()
-        previewResponse.page.siteInfo = pageContext.siteInfo;
-        previewResponse.page.siteSchema = pageContext.siteSchema;
-      }
-      setPreviewContext(previewResponse);
-      setIsLoading(false);
-    });
-  }
-
   useEffect(() => {
-    if (isPreview) {
-      setIsLoading(true);
-      const searchParams =
-        typeof window !== 'undefined' ? new URLSearchParams(window.location.search) : null;
-      if (!searchParams.get('path')) {
-        window.location = `${window.location.origin}/preview?path=/`;
-      }
-      getData(searchParams);
-    }
-
     if (
       typeof window !== `undefined` &&
       getCookie("showAdminBar") === "true"
@@ -66,23 +36,18 @@ const App = ({ pageContext }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  if (isPreview) {
-    if (isLoading) {
-      return 'Loading...';
-    }
-  }
   
   return (
     <MainProvider value={{ admin: isAdmin , translations: data.translations, language: pageContext.page?.language }}>
       <div
         dir={
-          (isPreview ? previewContext.page?.language === 'ar' : pageContext.page?.language === 'ar')
+          (pageContext.page?.language === 'ar')
             ? 'rtl'
             : 'ltr'
         }
         id="container-modules"
       >
-        <Body pageContext={isPreview ? previewContext : pageContext} />
+        <Body pageContext={pageContext} />
       </div>
     </MainProvider>
   );

package/src/components/atoms/admin/bar/bar.module.scss

@@ -23,6 +23,21 @@
     }
 }
 
+
+.label {
+    @include flex-align(center, flex-start);
+
+    color: #fff;
+    font-size: 1.3rem;
+    padding: 1rem 2rem;
+    gap: .5rem;
+    font-weight: bold;
+}
+
+.labelBorder {
+    border-top: 1px solid #fff;
+}
+
 .menuList {
     @include flex-align(center, center);
 
@@ -45,4 +60,15 @@
         @include flex-align(center, flex-start);
     }
 
+}
+
+.preview {
+    background-color: #00b9eb;
+    color: #23282d;
+    font-weight: bold;
+}
+
+.previewOff {
+    background-color: #23282d;
+    color: #fff;
 }

package/src/components/atoms/admin/bar/index.js

@@ -35,7 +35,9 @@ const getRelationLinks = (page) => {
 
   return (
     <>
-      <li>|</li>
+      <li>
+        <span className={`${styles.label}`}>Relations</span>
+      </li>
       <li>
         <a
           className={styles.menuItem}
@@ -73,7 +75,7 @@ const getFooterLinks = (section) => {
 };
 
 const AdminBar = ({ page, marketSections, menu }) => {
-  const { setShowTranslationKeys } = useContext(Context) || {};
+  const { setShowTranslationKeys, preview } = useContext(Context) || {};
   const [val, setVal] = useState(false);
 
   const navSection = marketSections && marketSections.navigation;
@@ -112,45 +114,66 @@ const AdminBar = ({ page, marketSections, menu }) => {
               Show translation keys
             </label>
           </li>
+          <li>|</li>
+          <li>
+            <span className={styles.menuItem}>
+              <MdArtTrack /> Layout
+            </span>
+            <ul className={styles.subMenuList}>
+              <li>
+                <span className={`${styles.label}`}>Navigation Section</span>
+              </li>
+              <li>
+                {menuObj && (
+                  <a
+                    className={styles.menuItem}
+                    target="_blank"
+                    href={`${process.env.HERCULES_BACKEND_URL}site-menus/${menuObj.menu_id}/items`}
+                    rel="noreferrer"
+                  >
+                    <FaLayerGroup /> Edit Main Menu
+                  </a>
+                )}
+              </li>
+              <li>
+                <span className={`${styles.label} ${styles.labelBorder}`}>Footer Section</span>
+              </li>
+              {footerExtraFields && getFooterLinks(footerExtraFields)}
+            </ul>
+          </li>
+
           <li>
             <span className={styles.menuItem}>
-              <MdArtTrack /> Navigation Section
+              <FaEdit /> Page
             </span>
             <ul className={styles.subMenuList}>
-              {menuObj && (
+              <li>
                 <a
                   className={styles.menuItem}
                   target="_blank"
-                  href={`${process.env.HERCULES_BACKEND_URL}site-menus/${menuObj.menu_id}/items`}
+                  href={`${process.env.HERCULES_BACKEND_URL}site-pages/${page.id}`}
                   rel="noreferrer"
                 >
-                  <FaLayerGroup /> Edit Main Menu
+                  <FaEdit /> Edit Page
                 </a>
-              )}
+              </li>
+              {getRelationLinks(page)}
             </ul>
           </li>
-          {footerExtraFields && (
-            <li>
-              <span className={styles.menuItem}>
-                <MdArtTrack /> Footer Section
-              </span>
 
-              <ul className={styles.subMenuList}>
-                {getFooterLinks(footerExtraFields)}
-              </ul>
-            </li>
-          )}
+          {!preview && <li>|</li>}
+
           <li>
             <a
-              className={styles.menuItem}
-              target="_blank"
-              href={`${process.env.HERCULES_BACKEND_URL}site-pages/${page.id}`}
+              className={`${styles.menuItem} ${styles.preview} ${
+                !preview ? styles.previewOff : ""
+              }`}
+              href={!preview ? `/preview/?path=${page.path}&market_id=${page.market_id}` : `${page.path}`}
               rel="noreferrer"
             >
-              <FaEdit /> Edit Page
+              {preview ? "Preview Mode On" : "Preview Mode Off"}
             </a>
           </li>
-          {getRelationLinks(page)}
         </ul>
       </div>
     </div>
@@ -160,6 +183,8 @@ const AdminBar = ({ page, marketSections, menu }) => {
 AdminBar.propTypes = {
   page: PropTypes.shape({
     id: PropTypes.number,
+    market_id: PropTypes.number,
+    path: PropTypes.string,
   }),
   marketSections: PropTypes.shape({
     navigation: PropTypes.shape({}),

package/src/components/molecules/footer/index.js

@@ -47,7 +47,7 @@ const Footer = (props) => {
   const getFooterLogos = () => {
     let refactoredFooterLogos = { children: [] };
 
-    if (footerLogos === null) {
+    if (footerLogos === null || !footerLogos.children) {
       refactoredFooterLogos = {
         children: [...page?.page?.responsibleGaming],
       };

package/src/constants/pick-keys.mjs

@@ -102,7 +102,6 @@ export const pickRelationKeys = {
     'thumbnail_filename_object',
     'name',
     'iframe',
-    'markets',
     'average_rating',
     'maximum_bet',
     'volatility',

package/src/context/MainProvider.js

@@ -12,6 +12,7 @@ export default (props) => {
     <Context.Provider
       value={{
         translations: value.translations,
+        preview: value.isPreview,
         language: value.language,
         admin: value.admin,
         showTranslationKeys,

package/src/helpers/api.mjs

@@ -2,7 +2,6 @@ import axios from 'axios';
 
 import chalk from 'chalk';
 import { groupBy } from './getters.mjs';
-import processor from './processor/index.mjs';
 
 // const axios = require('axios');
 // const chalk = require('chalk');
@@ -11,36 +10,6 @@ const API_URL = process.env.GATSBY_API_URL;
 
 /* eslint no-console: ["error", { allow: ["log"] }] */
 
-export async function getPreview(siteName, page = null, marketId, themeOptions) {
-  return new Promise((resolve, reject) => {
-    axios
-      .get(
-        `${API_URL}/sites/v0.1/pages/sorted?site_name=${siteName}&path=${page}&market_id=${marketId}&preview=1&relations=1`
-      )
-      .then((response) => {
-        console.log(response);
-        const pagePreview = response.data.result.pages.preview;
-        const processed = processor.run(response.data.result, themeOptions, null, null, true);
-
-        const { path } = processed.pages[pagePreview.market].preview[0];
-
-        const pagePreviewProcessed = processed.pages[pagePreview.market][
-          pagePreview.relation_type
-          // eslint-disable-next-line no-shadow
-        ].find((page) => page.path === path);
-
-        resolve({
-          marketSections: processed.market_sections[pagePreview.market],
-          prefilledModules: processed.prefilled_market_modules[pagePreview.market],
-          page: pagePreviewProcessed,
-          allMarkets: processed.site_markets,
-          siteInfo: processed.general,
-        });
-      })
-      .catch((error) => reject(error));
-  });
-}
-
 function callAPIV2(endpointPath) {
   const headers = {
     headers: {
@@ -65,6 +34,7 @@ function callAPIV2(endpointPath) {
         resolve(response.data.result);
       })
       .catch((error) => {
+        console.log(error);
         reject(error.response.data.errors.join());
       });
   });
@@ -92,6 +62,10 @@ export async function getSiteSettings(siteName) {
   return callAPIV2(`v0.1/sites/settings/sorted-v2/${siteName}`);
 }
 
+export async function getPages(siteName) {
+  return callAPIV2(`v0.1/sites/pages/sorted-v2/${siteName}`);
+}
+
 export async function getRibbons(params) {
   return callAPIV2(`v0.1/globals/ribbons/sorted${params ? `?${params}` : ''}`);
 }
@@ -112,15 +86,16 @@ export async function getContent(siteName) {
   return callAPIV2(`v0.1/content/sorted/${siteName}`)
 }
 
-export async function getData(siteName, page = null) {
+export async function getData(siteName, page = null, marketId = null, preview = false) {
   let path = `${API_URL}/sites/v0.1/pages/sorted?site_name=${siteName}`;
-
+ 
   if (page) {
     path += `&path=${page}`;
+    if(preview) path +=`&market_id=${marketId}&preview=1`
   }
   path += '&reverse_order=1&relations=1';
   console.log(chalk.magenta('calling ') + chalk.whiteBright(path));
-
+ 
   const start = new Date();
   return new Promise((resolve, reject) => {
     axios
@@ -135,15 +110,16 @@ export async function getData(siteName, page = null) {
       });
   });
 }
-
+ 
 export async function getLocalData(fs) {
   return new Promise((resolve, reject) => {
     if (!fs.existsSync('./src/data/source/data.json')) {
       reject(new Error('Local Data file not found!'));
     }
-
+ 
     let response = fs.readFileSync('./src/data/source/data.json');
     response = JSON.parse(response);
     resolve(response.result);
   });
 }
+ 

package/src/helpers/fetch-site-settings.mjs

@@ -0,0 +1,46 @@
+/* eslint-disable import/prefer-default-export */
+import {
+  getSiteSettings,
+  getRibbons,
+  getResponsableGamings,
+  getContent,
+  getToplists,
+  getPages
+} from "./api.mjs";
+ 
+export const fetchSiteSettings = async (siteName, isPreview) => {
+  const siteSettingsData = await getSiteSettings(siteName);
+  const ribbonsData = await getRibbons(`site=${process.env.GATSBY_SITE_NAME}`);
+  const siteId = Object.keys(siteSettingsData.general)[0];
+  const responsableGamingData = await getResponsableGamings(
+    process.env.GATSBY_SITE_NAME,
+    siteId
+  );
+  const toplistData = await getToplists(process.env.GATSBY_SITE_NAME);
+  const contentData = await getContent(process.env.GATSBY_SITE_NAME);
+  const pagesData = !isPreview ? await getPages(process.env.GATSBY_SITE_NAME) : null;
+ 
+  const allMarketsData = siteSettingsData.site_markets;
+  const allMarketPrefixes = Object.keys(allMarketsData)
+    .map((key) => allMarketsData[key].path_prefix)
+    .filter((item) => !!item);
+ 
+  const schemaData = siteSettingsData.schema;
+  const templatesData = siteSettingsData.templates;
+  const allMarketSectionsData = siteSettingsData.market_sections;
+ 
+  return {
+    siteSettingsData,
+    siteGeneralData: siteSettingsData.general[siteId],
+    allMarketsData,
+    allMarketPrefixes,
+    schemaData,
+    templatesData,
+    pagesData,
+    allMarketSectionsData,
+    ribbonsData,
+    responsableGamingData,
+    toplistData,
+    contentData
+  };
+};

package/src/helpers/processor/game.mjs

@@ -0,0 +1,16 @@
+/* eslint-disable import/prefer-default-export */
+
+export function mergeMarketValues(relation, currentMarket) {
+    const marketValues =
+      (relation?.markets && relation?.markets[currentMarket]) || {};
+
+    const mergedValues = Object.keys(relation).reduce((acc, key) => {
+      acc[key] =
+        marketValues[key] !== "" && marketValues[key] !== undefined
+          ? marketValues[key]
+          : relation[key];
+      return acc;
+    }, {});
+
+    return mergedValues;
+  };

package/src/helpers/processor/game.test.js

@@ -0,0 +1,113 @@
+import { mergeMarketValues } from "./game.mjs";
+
+describe("mergeMarketValues", () => {
+  test("should return original relation values when there are no market values", () => {
+    const relation = {
+      id: 1,
+      name: "Test",
+      markets: {},
+    };
+    const result = mergeMarketValues(relation, "che_fr");
+    expect(result).toEqual({
+      id: 1,
+      name: "Test",
+      markets: {}, 
+    });
+  });
+
+  test("should merge market values and relation values", () => {
+    const relation = {
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        che_fr: {
+          description: "Market description Switzerland",
+        },
+      },
+    };
+    const result = mergeMarketValues(relation, "che_fr");
+    expect(result).toEqual({
+      id: 1,
+      name: "Test",
+      description: "Market description Switzerland",
+      markets: {
+        che_fr: {
+          description: "Market description Switzerland",
+        },
+      },
+    });
+  });
+
+  test("should return relation values when market values are empty strings", () => {
+    const relation = {
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        che_fr: {
+          description: "",
+        },
+      },
+    };
+    const result = mergeMarketValues(relation, "che_fr");
+    expect(result).toEqual({
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        che_fr: {
+          description: "",
+        },
+      },
+    });
+  });
+
+  test("should prefer market values when they are non-empty", () => {
+    const relation = {
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        che_fr: {
+          description: "Updated Switzerland description",
+        },
+      },
+    };
+    const result = mergeMarketValues(relation, "che_fr");
+    expect(result).toEqual({
+      id: 1,
+      name: "Test",
+      description: "Updated Switzerland description",
+      markets: {
+        che_fr: {
+          description: "Updated Switzerland description",
+        },
+      },
+    });
+  });
+
+  test("should return original relation if no matching market", () => {
+    const relation = {
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        UK: {
+          description: "Market description UK",
+        },
+      },
+    };
+    const result = mergeMarketValues(relation, "che_fr");
+    expect(result).toEqual({
+      id: 1,
+      name: "Test",
+      description: "Original description",
+      markets: {
+        UK: {
+          description: "Market description UK",
+        },
+      },
+    });
+  });
+});

package/src/helpers/processor/modules.mjs

@@ -133,7 +133,8 @@ export function processCardsV2(
     module.cards_selector_filters && module.cards_selector_filters.categories;
   const moduleSelectedTypes =
     module.cards_selector_filters && module.cards_selector_filters.types;
-  const { market } = pagesMappedById[pageId];
+
+  const market = pagesMappedById[pageId] ? pagesMappedById[pageId].market : '';
 
   module.items = [];
 

package/src/helpers/processor/relations.mjs

@@ -3,6 +3,7 @@ import loadash from 'lodash/index.js';
 import { updateArrayTranslations } from '../getters.mjs';
 // eslint-disable-next-line import/named
 import { sanitizeOperatorData } from './operators.mjs';
+import { mergeMarketValues } from './game.mjs';
 import { pickRelationKeys } from '../../constants/pick-keys.mjs';
 
 const { pick, cloneDeep } = loadash;
@@ -43,7 +44,8 @@ export const processRelations = (
             : [];
           transformedPages[market][pageType][index].relation.game_provider.path =
             providerPage.length > 0 ? providerPage[0].path : null;
-            page.relation = pick(page.relation, pickRelationKeys.game);
+            page.relation = pick(mergeMarketValues(page.relation, market), pickRelationKeys.game);
+            
         }
         break;
       // Add author for page from authors

package/src/helpers/server-data.js

@@ -4,15 +4,60 @@
 import loadSource from '~helpers/search-source';
 import { deparam } from '~helpers/strings';
 import { groupBy } from '~helpers/getters';
-
-export async function getAPIData(page, url) {
+import {getData} from '~helpers/api'
+import processor from "./processor/index.mjs";
+import { fetchSiteSettings } from './fetch-site-settings.mjs';
+ 
+export async function getAPIData(page, url, headers, preview) {  
+  if (preview) {
+    try {
+      const siteName = process.env.GATSBY_SITE_NAME;      
+      const params = deparam(url.split('?')[1]);
+      // eslint-disable-next-line camelcase
+      const response = await getData(siteName, params?.path, params?.market_id, true);
+       const {siteSettingsData, siteGeneralData, responsableGamingData, toplistData, contentData} = await fetchSiteSettings(siteName, true);
+       
+      const pagePreview = response.pages.preview;
+     
+      const processed = processor.run({
+        ...response,
+        siteSettingsData,
+        general: siteGeneralData,
+        prefilled_market_modules:siteSettingsData.prefilled_modules,
+        responsible_gamings: responsableGamingData,
+        toplist: toplistData,
+        content: contentData
+      },{}, null, true);
+ 
+      const { path } = processed.pages[pagePreview.market].preview[0];
+ 
+      const pagePreviewProcessed = processed.pages[pagePreview.market][
+        pagePreview.relation_type
+        // eslint-disable-next-line no-shadow
+      ].find((page) => page.path === path);
+           
+      return {
+        props: {
+          marketSections: processed.market_sections[pagePreview.market],
+          prefilledModules: processed.prefilled_market_modules[pagePreview.market],
+          page: pagePreviewProcessed,
+          allMarkets: processed.site_markets,
+          siteInfo: processed.general
+        }
+      };
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.log("Error fetching preview data:", error);
+    }
+  }
+ 
   const results = await loadSource(page.market);
   if (page.path.endsWith('/s') || page.path === 's') {
     let urlParams = null;
     if (url && url.split('?').length === 2) {
       urlParams = deparam(`${url.split('?')[1]}`);
     }
-
+ 
     const searchData = urlParams
       ? urlParams.hasOwnProperty('s')
         ? groupBy(
@@ -21,7 +66,7 @@ export async function getAPIData(page, url) {
           )
         : null
       : null;
-
+ 
     return {
       props: {
         data: searchData,
@@ -29,11 +74,11 @@ export async function getAPIData(page, url) {
       },
     };
   }
-
+ 
   const res = await fetch(`https://random-data-api.com/api/appliance/random_appliance/`);
   const data = await res.json();
-
+ 
   return {
     props: data.equipment,
   };
-}
+}

package/src/pages/preview/index.js

@@ -0,0 +1,93 @@
+/* eslint-disable react/prop-types */
+/* eslint-disable react/forbid-prop-types */
+import React, {useState, useEffect} from "react";
+import PropTypes from "prop-types";
+import { graphql, useStaticQuery } from "gatsby";
+import { getCookie } from "~helpers/cookies";
+import MainProvider from "~context/MainProvider";
+import Body from "~pages/body";
+import HeadData from "~organisms/head";
+import { getAPIData } from "~helpers/server-data";
+
+const AppSSR = ({serverData }) => {
+  const [isAdmin, setIsAdmin] = useState(false);
+
+  const data = useStaticQuery(graphql`
+    query {
+      translations: allTranslation(filter: {}) {
+        edges {
+          node {
+            key
+            language
+            value
+          }
+        }
+      }
+    }
+  `);
+
+
+  useEffect(() => {
+    if (
+      typeof window !== `undefined` &&
+      getCookie("showAdminBar") === "true"
+    ) {
+      setIsAdmin(true);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return (
+    <>
+      <MainProvider
+        value={{
+          admin: isAdmin ,
+          translations: data.translations,
+          language: serverData.page.language,
+          isPreview: true
+        }}
+      >
+        <Body
+          pageContext={serverData}
+        />
+      </MainProvider>
+    </>
+  );
+};
+
+export const Head = ({ serverData }) => (
+  <HeadData page={serverData.page} siteInfo={serverData.siteInfo} />
+);
+
+AppSSR.propTypes = {
+  pageContext: PropTypes.shape({
+    siteName: PropTypes.string,
+    isTracker: PropTypes.bool,
+    isPreview: PropTypes.bool,
+    page: PropTypes.shape({
+      id: PropTypes.number,
+      path: PropTypes.string,
+    }),
+    translations: PropTypes.object,
+    siteInfo: PropTypes.shape({
+      robots_txt: PropTypes.string,
+      site_logo: PropTypes.string,
+      site_name: PropTypes.string,
+    }),
+    siteSchema: PropTypes.shape({
+      site_name: PropTypes.string,
+    }),
+  }),
+  serverData: PropTypes.any,
+};
+
+export default AppSSR;
+
+export async function getServerData(props) {
+  // eslint-disable-next-line no-shadow
+  const { pageContext, url, headers } = props;
+  let res = "";
+  res = await getAPIData(pageContext.page, url, headers, true);
+
+  return res;
+}

package/src/components/app-preview.js

@@ -1,85 +0,0 @@
-/* eslint-disable no-unused-vars */
-import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import { globalHistory } from '@reach/router';
-
-// import Body from '~pages/body';
-// import Head from '~organisms/head';
-// import { getPreview } from '~helpers/api';
-
-const AppPreview = ({ pageContext }) => {
-  const [previewContext, setPreviewContext] = useState({});
-  const [isLoading, setIsLoading] = useState({});
-
-  async function getData(searchParams, staticPath = null) {
-    const { getPreview } = await import('~helpers/api');
-    getPreview(
-      pageContext.siteName,
-      !staticPath ? searchParams.get('path') || '/' : staticPath,
-      pageContext
-    ).then((previewResponse) => {
-      setPreviewContext(previewResponse);
-      setIsLoading(false);
-    });
-  }
-
-  useEffect(() => {
-    setIsLoading(true);
-    const searchParams =
-      typeof window !== 'undefined' ? new URLSearchParams(window.location.search) : null;
-    if (!searchParams.get('path')) {
-      window.location = `${window.location.origin}/preview?path=/`;
-    }
-
-    getData(searchParams);
-    // let { hi, bye } = await import('./say.js');
-    // getPreview(pageContext.siteName, searchParams.get('path') || '/', pageContext).then(
-    //   (previewResponse) => {
-    //     setPreviewContext(previewResponse);
-    //     setIsLoading(false);
-    //   }
-    // );
-
-    globalHistory.listen(({ location }) => {
-      setIsLoading(true);
-
-      getData(null, location.search.replace('?path=', ''));
-      // getPreview(pageContext.siteName, location.search.replace('?path=', ''), pageContext)
-      //   .then((previewResponse) => {
-      //     setPreviewContext(previewResponse);
-      //     setIsLoading(false);
-      //   })
-      //   .catch(() => {
-      //     alert('failed to load..');
-      //   });
-    });
-    // eslint-disable-next-line
-  }, [pageContext.siteName]);
-
-  if (isLoading) {
-    return 'Loading...';
-  }
-
-  return (
-    <>
-      {/* <Head page={previewContext.page} siteInfo={previewContext.siteInfo} />
-      <Body pageContext={previewContext} /> */}
-    </>
-  );
-};
-
-AppPreview.propTypes = {
-  pageContext: PropTypes.shape({
-    page: PropTypes.shape({
-      id: PropTypes.number,
-    }),
-    siteName: PropTypes.string,
-    siteInfo: PropTypes.shape({
-      robots_txt: PropTypes.string,
-      site_logo: PropTypes.string,
-      site_name: PropTypes.string,
-    }),
-  }),
-};
-
-export default AppPreview;