gatsby-core-theme 3.0.0 → 4.0.0

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

@@ -33,6 +33,7 @@ const Navigation = ({
   },
   sticky = true,
   template,
+  children,
   customStyles,
 }) => {
   const navRef = useRef(React.createRef());
@@ -69,7 +70,12 @@ const Navigation = ({
             to="/"
             onClick={onClickHandler}
           >
-            <img alt="logo" src={logo} width={logoWidth} height={logoHeight} />
+            <img
+              alt={process.env.GATSBY_SITE_NAME}
+              src={logo}
+              width={logoWidth}
+              height={logoHeight}
+            />
           </Link>
           {showMenu && (
             <>
@@ -85,6 +91,7 @@ const Navigation = ({
           )}
         </NavigationProvider>
       </nav>
+      {children}
     </ConditionalWrapper>
   );
 };
@@ -110,6 +117,7 @@ Navigation.propTypes = {
   searchIcon: PropTypes.string,
   hasSearch: PropTypes.bool,
   menu: PropTypes.string,
+  children: PropTypes.node,
   options: PropTypes.shape({
     mobile: PropTypes.shape({
       animation: PropTypes.string,

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

@@ -11,7 +11,6 @@ import styles from './search.module.scss';
 
 const SearchForm = ({ className, searchIcon, iconWidth = 24, iconHeight = 24 }) => {
   const { showSearch, setShowSearch, setShowMenu, showMenu } = useContext(NavigationContext);
-
   const Search = showSearch ? loadable(() => import('~molecules/search')) : <></>;
   const Operator = showSearch ? (
     loadable(() => import('~atoms/search/autocomplete/operator'))

package/src/components/organisms/toplist/list/index.js

@@ -88,7 +88,7 @@ List.propTypes = {
     one_liner: PropTypes.string,
   }),
   CustomRow: PropTypes.func,
-  hasLoadMoreButton: PropTypes.bool,
+  hasLoadMoreButton: PropTypes.string,
   initItemsCount: PropTypes.string,
   loadItemsCount: PropTypes.string,
   pageTemplate: PropTypes.string,

package/src/components/organisms/toplist/list/list.test.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { render, cleanup, fireEvent } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { getListToplistItem } from '~tests/factories/modules/toplist.factory';
+
+import List from '.';
+
+describe('List', () => {
+  test('render list with Load more', () => {
+    const { container, getByText } = render(
+      <List
+        toplist={{ items: getListToplistItem(15) }}
+        loadItemsCount="5"
+        initItemsCount="5"
+        hasLoadMoreButton="1"
+      />
+    );
+    expect(getByText('Load More')).toBeTruthy();
+    const button = container.querySelector('button');
+    fireEvent.click(button);
+  });
+
+  test('render list without Load more', () => {
+    const { container } = render(<List toplist={{ items: getListToplistItem(5) }} />);
+    expect(container.querySelector('button')).toBeFalsy();
+  });
+});
+afterEach(() => {
+  cleanup();
+});

package/src/components/pages/body/index.js

@@ -1,7 +1,7 @@
+/* eslint-disable no-useless-concat */
 /* eslint-disable no-restricted-globals */
 import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
-import loadable from '@loadable/component';
 import { getSection } from '~helpers/getters';
 import Header from '~molecules/header';
 import Main from '~molecules/main';
@@ -18,7 +18,6 @@ function Body({ pageContext, children }) {
   const main = getBodySection('main');
   const navigation = getBodySection('navigation');
   const footer = getBodySection('footer');
-  const sidebar = getBodySection('sidebar');
 
   useEffect(() => {
     if (!process.env.CANARY_TOKEN) {
@@ -26,8 +25,9 @@ function Body({ pageContext, children }) {
     }
 
     if (
-      !document.domain.includes(process.env.GATSBY_SITE_NAME) ||
-      !document.domain.includes(`www.${process.env.GATSBY_SITE_NAME}`)
+      document.domain !== `prelive.${process.env.GATSBY_SITE_NAME}` ||
+      document.domain !== process.env.GATSBY_SITE_NAME ||
+      document.domain !== `www.${process.env.GATSBY_SITE_NAME}`
     ) {
       const l = location.href;
       const r = document.referrer;
@@ -38,14 +38,12 @@ function Body({ pageContext, children }) {
     }
   }, []);
 
-  const Sidebar = sidebar ? loadable(() => import(`~molecules/sidebar`)) : null;
   return (
     <>
       {navigation && <Navigation template={template} section={navigation} />}
       {!is404 && <Header section={pageContext} />}
       {main && !children && <Main section={main} pageContext={pageContext} />}
       {children && <main>{children}</main>}
-      {Sidebar && <Sidebar section={sidebar} />}
       <ScrollToTop />
       <Footer template={template} section={footer} />
       <CookieConsent />

package/src/components/pages/tracker/index.js

@@ -83,7 +83,7 @@ const Tracker = ({
       </video>
     );
   } else if (bgImage) {
-    background = <LazyImage className={styles.background} src={bgImage} />;
+    background = <LazyImage className={styles.background} src={bgImage} alt="background image" />;
   }
 
   return (

package/src/constants/settings.js

@@ -6,8 +6,8 @@ export default {
   },
   keep_page_extra_fields: {
     operator: {
-      'Irishluck.ie': true, // needed for card background image
       'norskespilleautomater.com': true, // needed for inoperative / placeholder fields
+      'Irishluck.ie': true, // needed for card background image
       'playcasino.co.za': true,
     },
     article: {

package/src/helpers/getters.js

@@ -126,12 +126,7 @@ export function getPageImage(page) {
       return page.relation.thumbnail_filename;
     }
   }
-  if (page.type === 'article') {
-    if (page.banner) {
-      return imagePrettyUrl(page.banner);
-    }
-  }
-  if (['operator', 'software_provider'].includes(page.type) && page.relation.logo) {
+  if (page.type === 'software_provider' && page.relation.logo) {
     return imagePrettyUrl(page.relation.logo);
   }
   if (page.banner) {

package/src/helpers/getters.test.js

@@ -20,9 +20,7 @@ describe('Getters Helper', () => {
 
   test('getPageTitle()', () => {
     window.location.search = 's=hello';
-    expect(Getters.getPageTitle({ path: 's' })).toEqual(
-      'You searched for hello - norskespilleautomater.com'
-    );
+    expect(Getters.getPageTitle({ path: 's' })).toEqual('You searched for hello - Irishluck.ie');
   });
 
   test('getExtraField()', () => {

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

@@ -1,4 +1,4 @@
-import { groupBy, removeDuplicates } from './common';
+import { groupBy, removeDuplicates, clonePageForCards } from './common';
 import getPageDataList from '~tests/factories/pages/list.factory';
 
 describe('Common Helper', () => {
@@ -18,4 +18,10 @@ describe('Common Helper', () => {
     const filtered = removeDuplicates(array, 'id');
     expect(filtered).toHaveLength(2);
   });
+
+  test('ClonePageForCards', () => {
+    const data = getPageDataList(2);
+    const result = clonePageForCards(data, 'comparison_table');
+    expect(result?.relation?.bonus?.deposit_methods).toBeFalsy();
+  });
 });

package/src/helpers/processor/index.js

@@ -55,7 +55,7 @@ export function processSitemapPages(pages, markets) {
   return pageListByMarket;
 }
 
-function transform(response) {
+export function transform(response) {
   const transformed = {};
   Object.keys(response.site_markets).forEach((siteMarket) => {
     const language = siteMarket.split('_')[1];
@@ -74,7 +74,7 @@ function transform(response) {
   return transformed;
 }
 
-function processSections(sections, skipPost = false) {
+export function processSections(sections, skipPost = false) {
   Object.keys(sections).forEach((sectionKey) => {
     if (skipPost && sectionKey.includes('post_main')) {
       return;
@@ -96,7 +96,6 @@ function processSections(sections, skipPost = false) {
       });
     }
   });
-
   return sections;
 }
 

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

@@ -0,0 +1,21 @@
+import { transform, processExtraFields } from './index';
+import pages from '~tests/factories/pages/pages.factory.js';
+
+describe('Index Processor', () => {
+  test('Transform', () => {
+    const results = transform(pages);
+    expect(results?.za_en?.page).toBeTruthy();
+  });
+
+  test('processExtraFields', () => {
+    const extraFields = {
+      logos: { value: 339, type: 'default' },
+    };
+    processExtraFields(extraFields);
+    expect(extraFields?.logos).toBe(339);
+  });
+  test('processExtraFields null', () => {
+    const result = processExtraFields(false);
+    expect(result).toBeFalsy();
+  });
+});

package/src/helpers/schema.js

@@ -233,7 +233,7 @@ export function templateSchemas(page, pageImage) {
         page.siteInfo?.site_name ||
         process.env.GATSBY_SITE_NAME,
       logo:
-        `${process.env.IMAGE_CDN_URL}/${page.siteInfo?.site_logo}` ||
+        (page.siteInfo?.site_logo && `${process.env.IMAGE_CDN_URL}/${page.siteInfo.site_logo}`) ||
         page.featured_image_object?.url ||
         pageImage,
     },

package/src/helpers/schema.test.js

@@ -99,12 +99,12 @@ describe('Schema Helper', () => {
     expect(json.author.foundingDate).toEqual('01/02/03');
     if (isIL || isNSA) {
       expect(json.author.publishingPrinciples).toEqual(
-        isIL
-          ? 'https://www.irishluck.ie/editorial-principles'
-          : 'https://www.norskespilleautomater.com/om-oss/prinsipper'
+        isNSA
+          ? 'https://www.norskespilleautomater.com/om-oss/prinsipper'
+          : 'https://www.irishluck.ie/editorial-principles'
       );
     } else {
-      expect(json.author.publishingPrinciples).toEqual(undefined);
+      expect(json.author.publishingPrinciples).toEqual(null);
     }
 
     expect(Object.prototype.toString.call(json.author.logo)).toEqual('[object Object]');

package/src/hooks/gatsby-img/index.js

@@ -6,7 +6,7 @@ import { GatsbyImage } from 'gatsby-plugin-image';
 export const PureImage = ({
   filename,
   className = '',
-  alt = '',
+  alt = 'missing alt',
   height = '100%',
   width = '100%',
   data,

package/src/hooks/lazy-image/index.js

@@ -10,7 +10,7 @@ export default function LazyImage({
   style = {},
   className,
   src = '#',
-  alt = '',
+  alt = 'missing alt',
   defaultImg,
   loading = 'lazy',
 }) {

package/src/hooks/lazy-image/lazy-image.test.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import LazyImage from '.';
+
+describe('LazyImage function', () => {
+  test('LazyImage defaultImg', () => {
+    const { container } = render(
+      <LazyImage
+        src={null}
+        defaultImg={<img src="https://cdn.irishluck.ie/jackpot-village-logo-9.png" alt="test" />}
+      />
+    );
+    expect(container.querySelector('img')).toBeTruthy();
+    expect(container.querySelector('img')).toHaveAttribute(
+      'src',
+      'https://cdn.irishluck.ie/jackpot-village-logo-9.png'
+    );
+  });
+
+  test('LazyImage mock function inisNativeImageLazyLoadingSupported', () => {
+    // eslint-disable-next-line global-require
+    const func = require('../../helpers/device-detect');
+    func.isNativeImageLazyLoadingSupported = jest.fn(() => true);
+    const { container } = render(
+      <LazyImage src="https://cdn.irishluck.ie/jackpot-village-logo-9.png" />
+    );
+    expect(container.querySelector('img')).toBeTruthy();
+    expect(container.querySelector('img')).toHaveAttribute(
+      'src',
+      'https://cdn.irishluck.ie/jackpot-village-logo-9.png'
+    );
+    expect(container.querySelector('img')).toHaveAttribute('loading', 'lazy');
+  });
+});
+
+afterEach(() => {
+  cleanup();
+});

package/src/hooks/lazy-picture/index.js

@@ -11,7 +11,7 @@ export default function LazyPicture({
   offset = 200,
   style = {},
   className,
-  alt = '',
+  alt = 'missing alt',
   webp = '',
   mobileSrc = '',
   desktopSrc = '',

package/src/hooks/link/link.test.js

@@ -1,5 +1,7 @@
+/* eslint-disable jsx-a11y/anchor-is-valid */
+/* eslint-disable no-unused-expressions */
 import React from 'react';
-import { render, cleanup } from '@testing-library/react';
+import { render, cleanup, fireEvent } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 import Link from '.';
 
@@ -32,6 +34,45 @@ describe('Link Component', () => {
     );
     expect(getByText('Test Content').closest('a').classList.contains('test-gtm')).toBe(true);
   });
+  test('with window.location.pathname: /preview', () => {
+    delete global.window.location;
+    global.window = Object.create(window);
+    global.window.location = {
+      pathname: '/preview',
+    };
+
+    const { container } = render(
+      <Link to="test/link">
+        <span>Just Test</span>
+      </Link>
+    );
+
+    expect(container.querySelectorAll('a')).toHaveLength(1);
+    expect(container.querySelectorAll('a')[0]).toHaveAttribute('href', 'test/link');
+    const ahref = container.querySelector('a');
+    // eslint-disable-next-line no-lone-blocks
+    {
+      ahref && fireEvent.click(ahref);
+    }
+  });
+
+  test('Without to false ', () => {
+    const { getByText } = render(
+      <Link to="">
+        <span>Just Test</span>
+      </Link>
+    );
+    expect(getByText('Just Test')).toBeTruthy();
+  });
+
+  test('Without to ', () => {
+    const { getByText } = render(
+      <Link to="">
+        <span>Just Test 2</span>
+      </Link>
+    );
+    expect(getByText('Just Test 2')).toBeTruthy();
+  });
 });
 afterEach(() => {
   cleanup();

package/src/hooks/tabs/tab/tab.test.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+
+import Tab from './tab';
+
+describe('Tab component', () => {
+  test(' activeTab and tabId have not same props', () => {
+    const { container, getByText } = render(<Tab label="test" activeTab="2" tabId="3" />);
+    expect(getByText('test')).toBeTruthy();
+    expect(container.querySelectorAll('li')).toHaveLength(1);
+    expect(container.querySelectorAll('button')).toHaveLength(1);
+  });
+
+  test('activeTab and  tabId have same props', () => {
+    const { container, getByText } = render(<Tab label="test2" activeTab="2" tabId="2" />);
+    expect(getByText('test2'));
+    expect(container.querySelector('button')).toHaveAttribute(
+      'class',
+      ' active  tabs-menu-gtm btn-cta'
+    );
+    expect(container.querySelectorAll('li')).toHaveLength(1);
+    expect(container.querySelectorAll('button')).toHaveLength(1);
+  });
+
+  test('activeTab and  tabId have same props and active class name', () => {
+    const { container, getByText } = render(
+      <Tab label="test3" activeTab="2" tabId="2" activeTabClass="activeTabClassTest" />
+    );
+    expect(getByText('test3'));
+    expect(container.querySelector('button')).toHaveAttribute(
+      'class',
+      ' activeTabClassTest  tabs-menu-gtm btn-cta'
+    );
+    expect(container.querySelectorAll('li')).toHaveLength(1);
+    expect(container.querySelectorAll('button')).toHaveLength(1);
+  });
+});
+
+afterEach(() => {
+  cleanup();
+});

package/src/styles/utils/variables/_main.scss

@@ -9,7 +9,7 @@
   --secondary-text-color: var(--color-4);
   --heading-base-color: var(--color-12);
   --text-link-color: var(--color-13);
-  --full-star-fill-color: #fba62f;  
+  --full-star-fill-color: #fba62f;
   --full-star-border-color: #fba62f;
   --halfFull-star-fill-color: #fba62f;
   --halfEmpty-star-fill-color: white;
@@ -85,6 +85,8 @@
   --second-table-background: var(--color-17);
   --secondary-module-background: var(--color-42);
 
+  --pagination-with-midpoints-color: #ccc;
+
   // HTML Sitemap
   --template-name-icon-background: #ff893f;
   --page-number-background: #393939;

package/tests/envVars.js

@@ -1,4 +1,4 @@
-process.env.GATSBY_SITE_NAME = 'norskespilleautomater.com';
+process.env.GATSBY_SITE_NAME = 'Irishluck.ie';
 process.env.GATSBY_SITE_URL = 'http://urltest.com/';
 process.env.IMAGE_CDN_URL = 'https://cdn.images.com';
 process.env.TRACKER_LINK_FORMAT_MAIN = '[no],[visit],short_name';

package/tests/factories/modules/content.factory.js

@@ -1,11 +1,14 @@
 /**
  * @description Factory to retrieve data related to content (Main, Sidebar and Body) those contents can be everywhere
  */
-
-export function getSingleContentData(module_title_tag = 'h2', contentIndex = 1) {
+export function getSingleContentData(
+  module_title_tag = 'h2',
+  contentIndex = 1,
+  moduleTitle = 'Test Content '
+) {
   const contentData = {
     module_title_tag,
-    module_title: `Test Content ${contentIndex}`,
+    module_title: `${moduleTitle} ${contentIndex}`,
     value: `<p><i>Hello</i> I am content ${contentIndex}</p><img src="#" alt="test image">`,
   };
 

package/tests/factories/modules/modules.factory.js

@@ -0,0 +1,152 @@
+/* eslint-disable no-console */
+import { getListContentData } from '~tests/factories/modules/content.factory';
+// import { sampleGameCards } from '~tests/factories/modules/card.factory.js';
+import { getSpotlightItems } from '~tests/factories/modules/spotlights.factory.js';
+import { multiToplistData } from '~tests/factories/modules/toplist.factory.js';
+
+const BonusProps = {
+  value: {
+    review_link: 'https://www.irishluck.ie/leovegas-casino/',
+    rating: '4.8',
+    status: 'active',
+    logo_url: 'image-38.png',
+    url: 'https://www.leovegas.com',
+    short_name: 'leovegas',
+    name: 'LeoVegas Casino',
+  },
+  type: 'Bonus',
+  module_value_id: 245478,
+  name: 'bonus',
+};
+
+const archivesProp = {
+  items: [
+    {
+      title: 'title 1',
+      content: 'content 1',
+      label: 'label-1',
+      primary_action: '/primary_action',
+      secondary_action: '/secondary_action',
+    },
+    {
+      title: 'title 2',
+      content: 'content 2',
+      label: 'label-2',
+      primary_action: '/primary_action',
+      secondary_action: '/secondary_action',
+    },
+    {
+      title: 'title 3',
+      content: 'content 3',
+      label: 'label-3',
+      primary_action: '/primary_action',
+      secondary_action: '/secondary_action',
+    },
+  ],
+};
+
+const ProsAndCons = {
+  pros: ['TestPro'],
+  cons: ['TestCons'],
+  module_value_id: 245475,
+  name: 'pros_and_cons',
+  anchored: 0,
+  anchor_label: null,
+  anchor_slug: null,
+  module_title: null,
+  module_title_tag: null,
+  background_color: null,
+  style: null,
+  style_id: null,
+  see_more_link: {
+    type: 'page',
+    value: null,
+    title: null,
+  },
+};
+
+const accordionProps = {
+  items: [
+    {
+      title: 'Test Test',
+      content: '<p>This is just a jest</p>',
+    },
+  ],
+  module_value_id: 245476,
+  name: 'accordion',
+  anchored: 0,
+  anchor_label: null,
+  anchor_slug: null,
+  module_title: null,
+  module_title_tag: null,
+  background_color: null,
+  style: null,
+  style_id: null,
+  see_more_link: {
+    type: 'page',
+    value: null,
+    title: null,
+  },
+};
+
+const anchorProps = {
+  name: 'anchor',
+  module_title: 'Page Contents',
+  module_title_tag: 'h2',
+  items: [
+    {
+      label: 'Game Selection',
+      type: 'module',
+      slug: 'game-selection',
+    },
+  ],
+  module_value_id: 91620,
+};
+
+const imageProps = {
+  value: 'jumanji-slot-thumbnail.jpg',
+  value_object: {
+    width: '576',
+    height: '576',
+    url: 'https://assets-srv.s3.eu-west-1.amazonaws.com/jumanji-slot-thumbnail.jpg',
+    filename: 'jumanji-slot-thumbnail.jpg',
+  },
+  title: 'Tets',
+  alignment: 'align_left',
+  alt: null,
+  module_value_id: 245479,
+  name: 'image',
+  anchored: 0,
+  anchor_label: null,
+  anchor_slug: null,
+  module_title: null,
+  module_title_tag: null,
+  background_color: null,
+  style: null,
+  style_id: null,
+  see_more_link: {
+    type: 'page',
+    value: null,
+    title: null,
+  },
+};
+
+// eslint-disable-next-line import/prefer-default-export
+export function objectsHolder(elm) {
+  if (!elm || elm == null || undefined) {
+    return null;
+  }
+  const data = {
+    content: getListContentData(3),
+    top_list: multiToplistData,
+    archive: archivesProp,
+    counter: [],
+    pros_and_cons: ProsAndCons,
+    accordion: accordionProps,
+    anchor: anchorProps,
+    bonus: BonusProps,
+    image: imageProps,
+    spotlights: getSpotlightItems(2),
+  };
+  return data[elm];
+}