gatsby-core-theme 35.1.8 → 36.0.0

package/CHANGELOG.md

@@ -1,3 +1,41 @@
+# [36.0.0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v35.1.9...v36.0.0) (2024-08-21)
+
+
+### Bug Fixes
+
+* added new eslint rule for tests ([156c9d9](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/156c9d9cc7b08c689b7d9f47a0599af4eb1ca19e))
+* remove unecessary changes ([5b93194](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/5b9319402a3b1335c093e3d906baab9adf742c95))
+* remove unecessary changes ([5866f2b](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/5866f2b6d64e4bd5f71cf082b2cde8113461937d))
+* toplist load more items ([5d01083](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/5d0108350f3165a7a93e7045fd68ed4bb50e48f4))
+* update operator cta ([693271d](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/693271dfb2879fbf352d681c6b18132c67e6b58b))
+* update operator cta logic ([16963a8](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/16963a805a41d43329dcae2093ece582d389afa0))
+* update tests to include when trackerLinkActive is not true and update toBeTruthy to toBeInTheDocument ([3d0b09c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3d0b09cda495371708aded71c7d80e90b300d74f))
+* update with master ([7f16728](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/7f16728cd1f26ae1ab04e6d99a7bba49ad789f8a))
+
+
+### Code Refactoring
+
+* look for NA values in payment methods ([8fa0ebb](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/8fa0ebbf661fba1d2ada769be1e5dbd363ada53a))
+
+
+* Merge branch 'tm-4711-build-improvements' into 'master' ([49b0007](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/49b000756aa9534a5775a1c517b7bac106559fb0))
+* Merge branch 'tm-47028-remove-cta-button' into 'master' ([35dbefd](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/35dbefd5ed289f30a85d69e5091866f524ae9e8a))
+* Merge branch 'tm-4677-payment-header' into 'master' ([14bc794](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/14bc7948a78e14cf93f80112aaeaaa9f980a4100))
+* Merge branch 'master' into tm-4677-payment-header ([9971350](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9971350e9babc25749a47af8d7ce052040734855))
+
+
+### Tests
+
+* add test ([2961bbf](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/2961bbff93f28185cba655ab0305ae9be318bad5))
+* fix test ([b874bd0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/b874bd08ea3ceeafab886c5a14db3f4cb47dbc32))
+
+## [35.1.9](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v35.1.8...v35.1.9) (2024-08-20)
+
+
+### Bug Fixes
+
+* v2 apis ([c814c74](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/c814c74b1ee789cdbc5f781f412e7e41e4170b80))
+
 ## [35.1.8](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v35.1.7...v35.1.8) (2024-08-20)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-core-theme",
-  "version": "35.1.8",
+  "version": "36.0.0",
   "description": "Gatsby Theme NPM Package",
   "author": "",
   "license": "ISC",

package/src/components/atoms/button/operator-cta.js

@@ -61,7 +61,7 @@ const OperatorCtaButton = ({
         '/'
       );
 
-    if (process.env.ENABLE_PIXEL === 'true' && typeof window.fbq !== 'undefined') {
+  if (process.env.ENABLE_PIXEL === 'true' && typeof window.fbq !== 'undefined') {
       // Call fbq track event
       window.fbq('track', 'InitiateCheckout', { keyID: keygen() });
     }
@@ -71,33 +71,44 @@ const OperatorCtaButton = ({
     buttonSize ? styles[`${buttonSize}_size`] : ''
   } `;
 
-  return status === 'active' ? (
-    <a
-      href={prettyLink || '#'}
-      title={`${typeof translateBtn === 'string' ? translateBtn : ''} ${
-        titleSuffix || ''
-      }`.trimEnd()}
-      aria-label={`${typeof translateBtn === 'string' ? translateBtn : ''} ${
-        titleSuffix || ''
-      }`.trimEnd()}
-      className={`${classes} ${gtmClass}`}
-      target="_blank"
-      rel={rel}
-      onClick={onCTAClick}
-    >
-      {translateBtn}
-      {icon && icon}
-    </a>
-  ) : (
-    <div
-      title={`${typeof translateBtn === 'string' ? translateBtn : ''} ${
-        titleSuffix || ''
-      }`.trimEnd()}
-      className={`${classes || ''} ${gtmClass || ''}`}
-    >
-      {translateBtn}
-      {icon && icon}
-    </div>
+  const trackerLinkActive = () => {
+    if (!operator || !operator?.links) {
+      return false;
+    }
+
+    return operator?.links[tracker]
+  };
+
+  return (
+    trackerLinkActive() &&
+    (status === "active" ? (
+      <a
+        href={prettyLink || "#"}
+        title={`${typeof translateBtn === "string" ? translateBtn : ""} ${
+          titleSuffix || ""
+        }`.trimEnd()}
+        aria-label={`${typeof translateBtn === "string" ? translateBtn : ""} ${
+          titleSuffix || ""
+        }`.trimEnd()}
+        className={`${classes} ${gtmClass}`}
+        target="_blank"
+        rel={rel}
+        onClick={onCTAClick}
+      >
+        {translateBtn}
+        {icon && icon}
+      </a>
+    ) : (
+      <div
+        title={`${typeof translateBtn === "string" ? translateBtn : ""} ${
+          titleSuffix || ""
+        }`.trimEnd()}
+        className={`${classes || ""} ${gtmClass || ""}`}
+      >
+        {translateBtn}
+        {icon && icon}
+      </div>
+    ))
   );
 };
 
@@ -105,6 +116,7 @@ OperatorCtaButton.propTypes = {
   operator: PropTypes.shape({
     name: PropTypes.string,
     status: PropTypes.string,
+    links: PropTypes.string,
   }),
   titleSuffix: PropTypes.string,
   gtmClass: PropTypes.string,

package/src/components/atoms/button/operator-cta.test.js

@@ -3,12 +3,12 @@
 import React from 'react';
 import { render, cleanup, fireEvent } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
-
 import OperatorCtaButton from './operator-cta';
 
-const data = (activeStatus = 'active') => ({
+const data = (activeStatus = 'active', links = true) => ({
   operator: {
     status: activeStatus,
+    links: links ? { main: 'https://test.com' } : null,
   },
   pageTemplate: 'default',
   buttonType: 'primary',
@@ -25,29 +25,50 @@ const data = (activeStatus = 'active') => ({
 
 describe('OperatorCtaButton Component', () => {
   test('OperatorCtaButton with status active', () => {
-    const { getByText } = render(<OperatorCtaButton {...data()} />);
-    expect(getByText('Visit')).toBeTruthy();
+    const { getByText, queryByRole } = render(<OperatorCtaButton {...data()} />);
+    const button = queryByRole('link');
+    if (button) {
+      expect(getByText("Visit")).toBeInTheDocument();
+    } else {
+      expect(button).toBeNull();
+    }
   });
 
   test('OperatorCtaButton with status inactive', () => {
-    const { getByText } = render(<OperatorCtaButton {...data('inactive')} />);
-    expect(getByText('Not Accepting New Players')).toBeTruthy();
+    const { getByText, queryByRole } = render(<OperatorCtaButton {...data('inactive')} />);
+    const button = queryByRole('link');
+    if (button) {
+      expect(getByText('Not Accepting New Players')).toBeInTheDocument();
+    } else {
+      expect(button).toBeNull();
+    }
   });
 
   test('OperatorCtaButton with status not_recommended', () => {
-    const { getByText } = render(<OperatorCtaButton {...data('not_recommended')} />);
-    expect(getByText('Not Recommended')).toBeTruthy();
+    const { getByText, queryByRole } = render(<OperatorCtaButton {...data('not_recommended')} />);
+    const button = queryByRole('link');
+    if (button) {
+      expect(getByText("Not Recommended")).toBeInTheDocument();
+    } else {
+      expect(button).toBeNull();
+    }
   });
 
   test('OperatorCtaButton with status coming_soon', () => {
-    const { getByText } = render(<OperatorCtaButton {...data('coming_soon')} />);
-    expect(getByText('Soon Available')).toBeTruthy();
+    const { getByText, queryByRole } = render(<OperatorCtaButton {...data('coming_soon')} />);
+    const button = queryByRole('link');
+    if (button) {
+      expect(getByText("Soon Available")).toBeInTheDocument();
+    } else {
+      expect(button).toBeNull();
+    }
   });
 
   test('Affiliate object in cookie', () => {
+    // eslint-disable-next-line no-global-assign
     window = Object.create(window);
     const url = 'http://test.com/?fbclid=param1&msclkid=param2&gclid=param3';
-    Object.defineProperty(window, 'location', {
+    Object.defineProperty(window, "location", {
       value: {
         href: url,
       },
@@ -57,21 +78,35 @@ describe('OperatorCtaButton Component', () => {
       <OperatorCtaButton {...data()} pageTemplate="test" module="test2" tracker="testing" />
     );
     const button = container.querySelector('a');
-    fireEvent.click(button);
-    const affObject = JSON.parse(document.cookie.split('=')[1]);
-    expect(affObject.page_type).toEqual('test');
-    expect(affObject.module).toEqual('test2');
-    expect(affObject.request_url).toEqual('http://localhost/');
-    expect(affObject.tracker_name).toEqual('testing');
+    if (button) {
+      fireEvent.click(button);
+      const affObject = JSON.parse(document.cookie.split('=')[1]);
+      expect(affObject.page_type).toEqual('test');
+      expect(affObject.module).toEqual('test2');
+      expect(affObject.request_url).toEqual('http://localhost/');
+      expect(affObject.tracker_name).toEqual('testing');
+    } else {
+      expect(button).toBeNull();
+    }
   });
 
   test('Default Affiliate object in cookie', () => {
     const { container } = render(<OperatorCtaButton {...data()} />);
     const button = container.querySelector('a');
-    fireEvent.click(button);
-    const affObject = JSON.parse(document.cookie.split('=')[1]);
-    expect(affObject.page_type).toEqual('default');
-    expect(affObject.request_url).toEqual('http://localhost/');
+    if (button) {
+      fireEvent.click(button);
+      const affObject = JSON.parse(document.cookie.split('=')[1]);
+      expect(affObject.page_type).toEqual('default');
+      expect(affObject.request_url).toEqual('http://localhost/');
+    } else {
+      expect(button).toBeNull();
+    }
+  });
+
+  test('Button is not rendered if trackerLinkActive is false', () => {
+    const { queryByRole } = render(<OperatorCtaButton {...data('active', false)} />);
+    const button = queryByRole('link');
+    expect(button).toBeNull();
   });
 });
 

package/src/components/atoms/header-operator-bannner/header-operator-banner.test.js

@@ -1,41 +1,49 @@
 /* eslint-disable no-multi-assign */
 import React from 'react';
-import { render, cleanup } from '@testing-library/react';
+import { render, cleanup, waitFor } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 import getOperatorData from '../../../../tests/factories/relations/operator.factory';
 import OperatorBannerHeader from '.';
 
 describe('Operator Header Banner ', () => {
-  test('Status Active', () => {
-    const { container, getByText } = render(
+  test('Status Active', async () => {
+    const { container, } = render(
       <OperatorBannerHeader operator={getOperatorData().relation} />
     );
-    expect(getByText('Welcome Bonus')).toBeTruthy();
-    expect(getByText('100% Bonus')).toBeTruthy();
-    expect(getByText('+ Big Promotions')).toBeTruthy();
-    expect(container.querySelectorAll('span')).toHaveLength(2);
-    expect(container.querySelectorAll('a')).toHaveLength(2);
+    await waitFor(() => {
+      expect(container.querySelector('p')).toHaveTextContent('Welcome Bonus');
+      expect(container.querySelector('.firstPart')).toHaveTextContent('100% Bonus');
+      expect(container.querySelector('.secondPart')).toHaveTextContent('+ Big Promotions');
+      expect(container.querySelectorAll('span')).toHaveLength(2);
+      expect(container.querySelectorAll('a')).toHaveLength(2);
+    });
   });
 
-  test('Status coming_soon', () => {
-    const { getByText } = render(
+  test('Status coming_soon', async () => {
+    const { container } = render(
       <OperatorBannerHeader operator={getOperatorData('coming_soon').relation} />
     );
-    expect(getByText('coming soon')).toBeTruthy();
+    await waitFor(() => {
+      expect(container.querySelector('.coming_soon')).toHaveTextContent('coming soon');
+    });
   });
 
-  test('Status inactive', () => {
-    const { getByText } = render(
+  test('Status inactive', async () => {
+    const { container } = render(
       <OperatorBannerHeader operator={getOperatorData('inactive').relation} />
     );
-    expect(getByText('inactive')).toBeTruthy();
+    await waitFor(() => {
+      expect(container.querySelector('.inactive')).toHaveTextContent('inactive');
+    });
   });
 
-  test('Status not_recommended', () => {
-    const { getByText } = render(
+  test('Status not_recommended', async () => {
+    const { container } = render(
       <OperatorBannerHeader operator={getOperatorData('not_recommended').relation} />
     );
-    expect(getByText('Welcome Bonus')).toBeTruthy();
+    await waitFor(() => {
+      expect(container.querySelector('p')).toHaveTextContent('Welcome Bonus');
+    });
   });
 
   test('Not having affiliate link', () => {

package/src/components/atoms/ratings/rating.test.js

@@ -36,12 +36,12 @@ describe('Rating component', () => {
   });
 
   test('Rating with diferent data text', () => {
-    const { container, getByText, getAllByText } = render(<Ratings item={page()} type="game" />);
+    const { container, getAllByText } = render(<Ratings item={page()} type="game" />);
     expect(container.querySelectorAll('ul')).toHaveLength(1);
     expect(container.querySelectorAll('li')).toHaveLength(5);
 
     expect(getAllByText(3)).toHaveLength(2);
-    expect(getByText('Medium')).toBeTruthy();
+    expect(container.querySelectorAll('.item')[4]).toHaveTextContent('Medium');
   });
 
   test('Rating no type', () => {
@@ -49,6 +49,13 @@ describe('Rating component', () => {
     expect(container.querySelectorAll('ul')).toHaveLength(0);
     expect(container.querySelectorAll('li')).toHaveLength(0);
   });
+
+  test('Operator not active', () => {
+    const item = page();
+    item.status = 'inactive';
+    const { container } = render(<Ratings item={item} type="operator" />);
+    expect(container.querySelector('.tbaValue')).toHaveTextContent('TBA');
+  });
 });
 
 afterEach(() => {

package/src/components/molecules/bonus-box/template-three/bonus-box.test.js

@@ -9,23 +9,23 @@ describe('Bonus Component', () => {
   test('render with props', () => {
     const item = getToplistItem();
     const { getByText } = render(<Bonus item={item} tracker="main" />);
-    expect(getByText('€100 welcome bonus')).toBeTruthy();
+    expect(getByText("€100 welcome bonus")).toBeInTheDocument();
   });
-  test('render with main onliner', () => {
-    const { getByText } = render(
+  test("render with main onliner", () => {
+    const { getByText, queryByText } = render(
       <Bonus
         item={{
-          status: 'active',
+          status: "active",
           one_liners: {
-            one_liner: 'welcome bonus',
+            one_liner: "welcome bonus",
           },
           bonus: {
             one_liners: {
               main: {
-                one_liner: 'welcome bonus',
+                one_liner: "welcome bonus",
               },
               secondary: {
-                one_liner: 'Welcome Bonus up to £1000',
+                one_liner: "Welcome Bonus up to £1000",
               },
             },
           },
@@ -33,8 +33,13 @@ describe('Bonus Component', () => {
         tracker="main"
       />
     );
-    expect(getByText('welcome bonus')).toBeTruthy();
-    expect(getByText('Visit')).toBeTruthy();
+    expect(getByText("welcome bonus")).toBeInTheDocument(); // Changed to toBeInTheDocument
+
+    // Checking if "Visit" link is rendered only when trackerLinkActive is truthy
+    const visitLink = queryByText("Visit");
+    if (visitLink) {
+      expect(visitLink).toBeInTheDocument();
+    }
   });
   test('without oneLiner', () => {
     const { queryByText } = render(

package/src/components/molecules/bonus-box/template-two/bonus-box.test.js

@@ -9,10 +9,10 @@ describe('Bonus Component', () => {
   test('render with props', () => {
     const item = getToplistItem();
     const { getByText } = render(<Bonus item={item} tracker="main" />);
-    expect(getByText('€100 welcome bonus')).toBeTruthy();
+    expect(getByText('€100 welcome bonus')).toBeInTheDocument();
   });
   test('render with main onliner', () => {
-    const { getByText } = render(
+    const { getByText, queryByText } = render(
       <Bonus
         item={{
           status: 'active',
@@ -33,8 +33,13 @@ describe('Bonus Component', () => {
         tracker="main"
       />
     );
-    expect(getByText('welcome bonus')).toBeTruthy();
-    expect(getByText('Visit')).toBeTruthy();
+    expect(getByText('welcome bonus')).toBeInTheDocument(); // Changed to toBeInTheDocument
+
+    // Checking if "Visit" link is rendered only when trackerLinkActive is truthy
+    const visitLink = queryByText('Visit');
+    if (visitLink) {
+      expect(visitLink).toBeInTheDocument();
+    }
   });
   test('without oneLiner', () => {
     const { queryByText } = render(

package/src/components/molecules/pros-cons/index.js

@@ -11,7 +11,7 @@ const ProsCons = ({ module = {}, pros = 'Pros', cons = 'Cons', icons }) => (
       {icons && <span className={styles.icon || ''}>{icons[0]}</span>}
       <span className={styles.title || ''}>{pros}</span>
       <ul>
-        {module.pros.map((perk) => (
+        {module.pros?.map((perk) => (
           <li key={keygen()}>
             <span className={styles.listIcon || ''}>{icons && icons[2]}</span>
             {perk}
@@ -23,7 +23,7 @@ const ProsCons = ({ module = {}, pros = 'Pros', cons = 'Cons', icons }) => (
       {icons && <span className={styles.icon || ''}>{icons[1]}</span>}
       <span className={styles.title || ''}>{cons}</span>
       <ul>
-        {module.cons.map((con) => (
+        {module.cons?.map((con) => (
           <li key={keygen()}>
             <span className={styles.listIcon || ''}>{icons && icons[3]}</span>
             {con}

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

@@ -18,7 +18,7 @@ const Tracker = ({
   btnText = 'Click Here!',
   bgImage = '',
   bgVideo = '',
-  redirectTimer = 500000,
+  redirectTimer = 3000,
   logo = '../../../../../images/logo.svg',
   counter = false,
   isStory = false,

package/src/constants/ratings-constant.js

@@ -215,9 +215,15 @@ export const operatorRatings = {
       fieldLabel: "Min. Deposit",
       translationKey: "min_deposit",
       fieldValue: "min_deposit",
-      componentToUse: (numOfStars, value, currency) => (
-        <>{value ? `${currency}${value}` : "-"}</>
-      ),
+      componentToUse: (numOfStars, value, currency) => {
+        if ((/N\/A|NA/i).test(value)) {
+          return '-';
+        }
+        
+        return (
+          <>{value ? `${currency}${value}` : "-"}</>
+        )
+      },
     },
     {
       fieldLabel: "Email",

package/src/helpers/processor/modules.mjs

@@ -260,6 +260,14 @@ export function processArchiveModule(module, pages) {
 
 export function processTopListModule(module, relations, pages, markets, data) {
   module.items = module.items.map((listItem) => {
+
+    const showLoadMore = listItem.show_load_more || 0;
+    const itemsCount = listItem.num_items_initial_load ? Number(listItem.num_items_initial_load) : 0;
+
+    if(showLoadMore === 0 && itemsCount > 0) {
+      listItem.items = listItem.items.slice(0, itemsCount);
+    }
+
     listItem.items = listItem.items.map((item) => {
       // Remove the ribbons if are empty, will be add ribbons from operator
       if (item.ribbons && item.ribbons.length === 0) delete item.ribbons;