gatsby-core-theme 14.0.2 → 15.0.0

package/CHANGELOG.md

@@ -1,3 +1,40 @@
+# [15.0.0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v14.0.3...v15.0.0) (2022-11-11)
+
+
+### Bug Fixes
+
+* added new fields in payment and software providers ([4c09173](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/4c09173104d745a36d3d3b1fd99f9cb6f2b95066))
+* commit mistakes ([d6a6b1c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/d6a6b1c45a37c884340b0bd1b0145ffc6dd00b2f))
+* images-explicit-width-height ([bc279e5](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/bc279e5e483395981311ff61b99145b97e8159fb))
+* init commit ([f715767](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/f715767484a23a8dd90c299eb71d3b1679118a4a))
+* init commit ([6889643](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/688964337c3174693a33cc12220ae76d272fe59f))
+
+
+### Code Refactoring
+
+* changes to author component ([5d03632](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/5d036328439dd240c6fa940d02021e01a6553f33))
+* remove author from sitemap ([10c5537](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/10c55370b6fd8709b5db9a3936a079d71e92cfe7))
+
+
+* Merge branch 'TM-3044-replace-author' into 'master' ([dfda6cc](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/dfda6cceee50b1ee4902bacb2ef2e27f20247a9a))
+* Merge branch 'tm-3096-images-explicit-width-height' into 'master' ([29a8226](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/29a822610fc3a07a077af9b355c9cdd147fe9282))
+* Merge branch 'master' into TM-3044-replace-author ([4f51f20](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/4f51f20884df620616eba09649e1cccf274d68f6))
+
+
+### Tests
+
+* correction to test scripts ([a868f6f](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/a868f6f37f7482ad63850b118cd4fcd4614e9cf9))
+
+## [14.0.3](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v14.0.2...v14.0.3) (2022-11-04)
+
+
+### Bug Fixes
+
+* aligned master branch ([63acad9](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/63acad942ba18affb6a0d95fad1c4149dfd1060e))
+* aligned master branch ([89246fc](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/89246fc645950553c3f6a0a9888851357d222a2f))
+* reverted logo fix ([786879f](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/786879f6d3f5afd6da37b90ccc3da7136613c5f8))
+
+
 ## [14.0.2](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v14.0.1...v14.0.2) (2022-11-03)
 
 

package/__mocks__/file-mock.js

@@ -1 +1 @@
-module.exports = 'test-file-stub'
+module.exports = 'test-file-stub';

package/jest-preprocess.js

@@ -1,4 +1,4 @@
 const babelOptions = {
   presets: ['babel-preset-gatsby'],
-}
-module.exports = require('babel-jest').createTransformer(babelOptions)
+};
+module.exports = require('babel-jest').createTransformer(babelOptions);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-core-theme",
-  "version": "14.0.2",
+  "version": "15.0.0",
   "description": "Gatsby Theme NPM Package",
   "main": "index.js",
   "GATSBY_RECAPTCHA_SITEKEY": "6LfoyvMUAAAAAO4nl_MQnqHb4XdHxEiu5cXgIqeB",

package/src/components/atoms/author/author.module.scss

@@ -1,34 +1,168 @@
-.authorInfo {
-  font-size: 1.5rem;
-}
-.date {
-  font-size: 1.5rem;
-}
-.authorIcon {
-  margin-right: 0.5rem;
-  font-size: 1.8rem;
-}
-.authorIcon,
-.dateTimeWrapper,
-.authorInfo {
-  height: 2rem;
-  display: inline-block;
-  font-weight: 400;
-  vertical-align: bottom;
-  a {
-    color: #09f;
-  }
-}
-
-.authorWrapper {
+.authorWraper {
   display: flex;
-  flex-direction: column;
+  flex-wrap: wrap;
+  align-items: center;
+  font-size: var(--author-text-fontSize);
+  color: var(--author-primary-text-color);
   column-gap: 0.5rem;
+  max-width: var(--main-container-max);
+  margin: 0 auto;
+  padding: 0 2.4rem;
 
   > div {
     display: flex;
     justify-content: flex-end;
-    flex-wrap: wrap;
-    column-gap: 0.5rem;
+  }
+
+  .infoContainer {
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    order: 1;
+
+    .prefixStyle {
+      margin: 0;
+    }
+
+    img {
+      width: 30px;
+      height: 30px;
+      border-radius: 50%;
+      margin: 0 8px 0 6px;
+    }
+
+    > a {
+      color: var(--author-link-text-color);
+      font-weight: var(--author-fontweight);
+      text-decoration: underline;
+
+      &:before {
+        content: '';
+        padding: 0 2px;
+      }
+
+      &:after {
+        content: '';
+        padding: 0 2px;
+      }
+    }
+
+    @include max(mobile) {
+      justify-content: flex-start;
+
+      > a,
+      .prefixStyle {
+        display: none;
+      }
+
+      img {
+        margin: 0;
+      }
+    }
+  }
+  .dateTimeWrapper {
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    order: 4;
+    flex: 1 1 auto;
+    gap: 0.5rem;
+
+    a {
+      pointer-events: none;
+      color: var(--author-primary-text-color);;
+    } 
+
+    @include max(mobile){
+      order: 2;
+      flex: 0 0 auto;
+
+      .dateLink {
+        pointer-events: all;
+        text-decoration: underline;
+      }
+    }
+  }
+  
+  .readingWithBorder {
+    order: 2;
+    flex: 0 0 auto;
+    gap: 0.5rem;
+
+    .readText {
+      display: none;
+    }
+    
+    @include max(mobile){
+      order: 4;
+      flex: 1 1 auto;
+
+      .readingTimeText {
+        display: none;
+      }
+
+      .readText {
+        display: block;
+      }
+    }
+  }
+
+  .reviewer {
+    order: 3;
+    gap: 0.5rem;
+
+    > a {
+      color: var(--author-link-text-color);
+      font-weight: var(--author-fontweight);
+      text-decoration: underline;
+    }
+
+    @include max(mobile) {
+      justify-content: flex-start;
+      display: none;
+    }
+  }
+
+  @include max(mobile) {
+    padding: 0 1.6rem;
+  }
+}
+
+.authorCard {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  color: var( --author-card-text-color);
+  padding: 0;
+
+  .infoContainer {
+    justify-content: flex-start;
+
+    @include max(mobile) {
+      .prefixStyle {
+        display: block;
+      }
+    }
+  }
+
+  @include min(tablet){
+    display: flex;
+    justify-content: space-between;
+
+  }
+}
+
+.prefixCardText {
+  padding-right: 2px;
+}
+
+.authorSeparator:not(.authorCard) {
+  div:not(:first-of-type):not(:last-of-type)::before {
+    content: '|';
+    padding: 0 3px;
+
+    @include max(mobile){
+      display: none;
+    }
   }
 }

package/src/components/atoms/author/author.test.js

@@ -6,26 +6,21 @@ import Author from '.';
 
 describe('Author Component', () => {
   test('render with props', () => {
-    const { container, getByText } = render(
-      <Author
-        name="mohsen"
-        prefix="by"
-        authorProfile="/author"
-        link="https://twitter.com/name"
-        icon={<i className="twitter" />}
-      />
-    );
-    expect(container.querySelector('.authorInfo')).toBeTruthy();
-    const info = getByText('mohsen');
-    expect(info).toBeTruthy();
-    expect(container.querySelector('a').getAttribute('href')).toEqual('https://twitter.com/name');
-    expect(container.querySelector('i.twitter')).toBeTruthy();
+    const { container, getByText } = render(<Author name="mohsen" prefix="by" link="name" />);
+    expect(container.querySelector('.authorWraper')).toBeTruthy();
+    expect(container.querySelector('.infoContainer')).toBeTruthy();
+    const prefix = getByText('by');
+    const name = getByText('mohsen');
+    expect(prefix).toBeTruthy();
+    expect(name).toBeTruthy();
+    expect(container.querySelector('a').getAttribute('href')).toEqual('/name');
   });
 
-  test('without link and icon', () => {
+  test('without link and image', () => {
     const { container } = render(<Author name="mohsen" />);
-    expect(container.querySelector('.authorInfo')).toBeTruthy();
+    expect(container.querySelector('.infoContainer')).toBeTruthy();
     expect(container.querySelector('a')).toBeFalsy();
+    expect(container.querySelector('img')).toBeFalsy();
   });
 
   test('with date', () => {
@@ -38,10 +33,11 @@ describe('Author Component', () => {
       />
     );
     expect(container.querySelector('.dateTimeWrapper')).toBeTruthy();
-    const info = getByText('with mohsen');
-    expect(info).toBeTruthy();
+    const date = getByText('24.04.2020');
+    const prefix = getByText('with');
+    expect(date).toBeTruthy();
+    expect(prefix).toBeTruthy();
     expect(container.querySelector('i')).toBeTruthy();
-    expect(container.querySelector('a')).toBeFalsy();
   });
 });
 afterEach(() => {

package/src/components/atoms/author/index.js

@@ -1,94 +1,111 @@
 /* eslint-disable arrow-body-style */
-import React from 'react';
+import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 
 import { formatDate } from '~helpers/date-time';
+import { translate, imagePrettyUrl } from '~helpers/getters';
 import Link from '~hooks/link';
+import LazyImage from '~hooks/lazy-image';
+import { Context } from '~context/MainProvider';
 import styles from './author.module.scss';
 
 const Author = ({
   name,
-  icon = null,
-  link = '',
-  authorProfile = '',
+  date,
+  authorImg,
+  readingTime,
+  link,
   prefix = '',
-  date = '',
+  type = 'default',
+  icon = false,
+  splitDateFormat = '.',
   dateFormat = 'DD.MM.YYYY',
-  dateSeparator = '/',
-  readingTime = '',
-  reviewer = {},
+  isCardsAuthor = false,
+  reviewer,
+  clock = '../../../images/clock.svg',
 }) => {
-  return (
-    <div className={styles.authorWrapper}>
-      <div>
-        {link && icon && (
-          <div className={styles.authorIcon}>
-            <a
-              href={link}
-              target="_blank"
-              rel="noreferrer"
-              aria-label={`${name} Link`}
-              className="author-gtm"
-            >
-              {icon}
-            </a>
-          </div>
-        )}
-        {!link && icon && <div className={styles.authorIcon}>{icon}</div>}
+  const { translations } = useContext(Context) || {};
+  const prefixstyle = !link || !authorImg;
+
+  const getPrefixBasedOnPage = type.includes('review')
+    ? translate(translations, 'reviewed_by', 'Review by')
+    : translate(translations, 'written_by', 'Written by');
 
-        <div className={styles.authorInfo}>
-          {name &&
-            (authorProfile ? (
-              <>
-                {`${prefix} `}
-                <Link to={authorProfile} className="author-gtm" title={name}>
-                  {name}
-                </Link>
-              </>
-            ) : (
-              `${prefix} ${name}`
-            ))}
+  return (
+    <div
+      className={`${styles.authorWraper} ${isCardsAuthor && styles.authorCard} ${
+        styles.authorSeparator
+      }`}
+    >
+      {name && (
+        <div className={`${styles.infoContainer} ${isCardsAuthor && styles.infoCardContainer}`}>
+          <p className={`${styles.prefixStyle} ${prefixstyle && styles.prefixCardText}`}>
+            <span>{translate(translations, prefix, prefix) || getPrefixBasedOnPage}</span>
+          </p>
+          <Link to={link} title={name}>
+            {name}
+          </Link>
+          {icon}
+          {authorImg && (
+            <LazyImage
+              alt={name}
+              loading="eager"
+              width={30}
+              height={30}
+              src={imagePrettyUrl(authorImg, 30, 30)}
+            />
+          )}
+        </div>
+      )}
+      {reviewer && !isCardsAuthor && (
+        <div className={date && styles.reviewer}>
+          <span>{`${translate(translations, 'fact_checked_by', 'Fact checked by')}`}</span>
+          {` `}
+          <Link to={reviewer.profile_page_path} title={reviewer.name}>
+            {reviewer.name}
+          </Link>
+        </div>
+      )}
+      {readingTime && !isCardsAuthor && (
+        <div className={date && styles.readingWithBorder}>
+          <img width={14} height={14} className={styles.clock} src={clock} alt="clock" />
+          <span className={styles.readingTimeText}>
+            {translate(translations, 'reading_time', 'Reading time')}
+          </span>
+          {` ${readingTime} ${translate(translations, 'minutes', 'min')}`}
+          <span className={styles.readText}>{translate(translations, 'read', 'read')}</span>
         </div>
-        {readingTime && (
-          <div className={date && styles.readingWithBorder}>
-            <span>Reading time</span>
-            {` ${readingTime} min`}
-          </div>
-        )}
-      </div>
-      <div>
-        {reviewer && (
-          <div className={date && styles.reviewer}>
-            <span>Fact checked by</span>
-            {` `}
-            <Link to={reviewer.profile_page_path} title={reviewer.name}>
-              {reviewer.name}
-            </Link>
-          </div>
-        )}
-        {date && (
-          <div className={styles.dateTimeWrapper}>
-            <span>Published on</span>
-            {` `}
-            {formatDate(date, dateFormat, dateSeparator, 'en-GB')}
-          </div>
-        )}
-      </div>
+      )}
+      {date && (
+        <div className={styles.dateTimeWrapper}>
+          {!isCardsAuthor && <span>{translate(translations, 'published_on', 'Published on')}</span>}
+          {` `}
+          <a href="#authorbox" className={!isCardsAuthor && styles.dateLink}>
+            {formatDate(date, dateFormat, splitDateFormat, 'en-GB')}
+          </a>
+        </div>
+      )}
     </div>
   );
 };
 
 Author.propTypes = {
-  name: PropTypes.string.isRequired,
-  icon: PropTypes.oneOfType([PropTypes.element, PropTypes.any]),
-  link: PropTypes.string,
-  authorProfile: PropTypes.string,
   prefix: PropTypes.string,
+  name: PropTypes.string.isRequired,
   date: PropTypes.string,
   dateFormat: PropTypes.string,
-  dateSeparator: PropTypes.string,
+  type: PropTypes.string,
+  link: PropTypes.string,
+  authorImg: PropTypes.string,
   readingTime: PropTypes.string,
-  reviewer: PropTypes.shape({}),
+  icon: PropTypes.string,
+  splitDateFormat: PropTypes.string,
+  isCardsAuthor: PropTypes.bool,
+  reviewer: PropTypes.shape({
+    profile_page_path: PropTypes.string,
+    name: PropTypes.string,
+  }),
+  clock: PropTypes.string,
 };
 
 export default Author;

package/src/components/atoms/author-box/index.js

@@ -62,6 +62,8 @@ export default function AuthorBox({
               <LazyImage
                 src="../../../images/verify.svg"
                 alt={translate(translations, 'verified', 'Verified')}
+                width={20}
+                height={20}
               />
             </p>
             {author.author_title && <p className={styles.title}>{author.author_title}</p>}
@@ -145,7 +147,13 @@ export default function AuthorBox({
                 {author.expertise.map((item, index) => (
                   // eslint-disable-next-line react/no-array-index-key
                   <li key={index} className={styles.expertiseItem}>
-                    <img className={styles.check} src={check} alt="check" />
+                    <img
+                      className={styles.check}
+                      src={check}
+                      alt="check"
+                      width="10px"
+                      height="8px"
+                    />
                     {item}
                   </li>
                 ))}

package/src/components/atoms/collapse/collpase.stories.js

@@ -67,8 +67,7 @@ export default {
   parameters: {
     docs: {
       description: {
-        component:
-          'Generates a collapsible box, with content & icon.',
+        component: 'Generates a collapsible box, with content & icon.',
       },
       page: () => (
         <>
@@ -86,9 +85,10 @@ const Template = (args) => <Collapse {...args} />;
 
 export const Default = Template.bind({});
 Default.args = {
-  buttonText : "show",
-  contentText : "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy",
-  onlyMobile : false,
-  onlyDesktop : false,
-  initOpen : false,
+  buttonText: 'show',
+  contentText:
+    "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy",
+  onlyMobile: false,
+  onlyDesktop: false,
+  initOpen: false,
 };

package/src/components/atoms/content-box/content-box.stories.js

@@ -6,9 +6,9 @@ import {
   PRIMARY_STORY,
   ArgsTable,
 } from '@storybook/addon-docs/blocks';
-import content_1 from "../../../../static/images/content-1.png"
-import content_2 from "../../../../static/images/content-2.png"
-import content_3 from "../../../../static/images/content-3.png"
+import content_1 from '../../../../static/images/content-1.png';
+import content_2 from '../../../../static/images/content-2.png';
+import content_3 from '../../../../static/images/content-3.png';
 
 import ContentBox from '.';
 
@@ -52,20 +52,17 @@ Default.args = {
     {
       title: 'Fully licensed casinos',
       image: content_1,
-      text:
-        'We only list and review fully licensed and legally operating casinos so you can be sure where you end up playing will be safe and secure.',
+      text: 'We only list and review fully licensed and legally operating casinos so you can be sure where you end up playing will be safe and secure.',
     },
     {
       title: 'Get the most for your money',
       image: content_2,
-      text:
-        'We list all the features the Casinos have to offer so you can make an educated decision about where to place your money for maximum gains!',
+      text: 'We list all the features the Casinos have to offer so you can make an educated decision about where to place your money for maximum gains!',
     },
     {
       title: 'Authenticly written articles',
       image: content_3,
-      text:
-        'All our Authors are professional writers with industry know-how, so you can depend on what we say is the truth!',
+      text: 'All our Authors are professional writers with industry know-how, so you can depend on what we say is the truth!',
     },
   ],
 };

package/src/components/atoms/google-tag-manager/body.js

@@ -9,7 +9,7 @@ const GoogleTagManagerBody = ({ gtm_id }) => (
           src={`https://www.googletagmanager.com/ns.html?id=${gtm_id}`}
           height="0"
           width="0"
-          style={{display: "none", visibility: "hidden"}}
+          style={{ display: 'none', visibility: 'hidden' }}
           aria-hidden="true"
         ></iframe>
       </noscript>

package/src/components/atoms/label/label.stories.js

@@ -33,13 +33,11 @@ export default {
         defaultValue: { summary: 'yellow' },
       },
     },
-   
   },
   parameters: {
     docs: {
       description: {
-        component:
-          'A component that accepts title & background color and generates  a label div.',
+        component: 'A component that accepts title & background color and generates  a label div.',
       },
       page: () => (
         <>
@@ -58,5 +56,5 @@ const Template = (args) => <Label {...args} />;
 export const Default = Template.bind({});
 Default.args = {
   title: 'Top Casino',
-  bgColor: 'yellow'
+  bgColor: 'yellow',
 };

package/src/components/atoms/open-graph/open-graph.stories.js

@@ -37,8 +37,7 @@ export default {
   parameters: {
     docs: {
       description: {
-        component:
-          'A component to share the page on Twitter & Facebook.',
+        component: 'A component to share the page on Twitter & Facebook.',
       },
       page: () => (
         <>

package/src/components/atoms/operator-info-block/operator-info-block.test.js

@@ -16,7 +16,7 @@ describe('operatorInfoBlock Component', () => {
             support_types: ' hello live chat world',
             types: ['live', 'poker', 'foo', 'bar'],
             games_amount: '+1000',
-            status : 'active'
+            status: 'active',
           },
         }}
       />

package/src/components/atoms/search/autocomplete/game.js

@@ -11,7 +11,7 @@ const Game = ({ item = {} }) => (
 
 Game.propTypes = {
   item: PropTypes.shape({
-    title: PropTypes.string
+    title: PropTypes.string,
   }).isRequired,
 };
 

package/src/components/atoms/timeline/timeline.stories.js

@@ -27,8 +27,7 @@ export default {
   parameters: {
     docs: {
       description: {
-        component:
-          'A component that accepts an array of objects and returns a timeline.',
+        component: 'A component that accepts an array of objects and returns a timeline.',
       },
       page: () => (
         <>
@@ -50,36 +49,31 @@ Default.args = {
     {
       date: '2013',
       title: 'Launched',
-      text:
-        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+      text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
       isActive: false,
     },
     {
       date: '2015',
       title: 'Rebrand + New Website',
-      text:
-        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+      text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
       isActive: false,
     },
     {
       date: '2017',
       title: '150+ Employees',
-      text:
-        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+      text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
       isActive: false,
     },
     {
       date: '2019',
       title: 'We acquired XXX',
-      text:
-        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+      text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
       isActive: false,
     },
     {
       date: 'Today',
       title: 'Over 500 Casino Reviews',
-      text:
-        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+      text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
       isActive: true,
     },
   ],

package/src/components/atoms/timeline/timeline.test.js

@@ -8,36 +8,31 @@ const timelineArray = [
   {
     date: '2013',
     title: 'Launched',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: false,
   },
   {
     date: '2015',
     title: 'Rebrand + New Website',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: false,
   },
   {
     date: '2017',
     title: '150+ Employees',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: false,
   },
   {
     date: '2019',
     title: 'We acquired XXX',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: false,
   },
   {
     date: 'Today',
     title: 'Over 500 Casino Reviews',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: true,
   },
 ];

package/src/components/molecules/content-and-custom-module/content-and-custom-module.stories.js

@@ -88,36 +88,31 @@ Default.args = {
       {
         date: '2013',
         title: 'Launched',
-        text:
-          'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+        text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
         isActive: false,
       },
       {
         date: '2015',
         title: 'Rebrand + New Website',
-        text:
-          'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+        text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
         isActive: false,
       },
       {
         date: '2017',
         title: '150+ Employees',
-        text:
-          'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+        text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
         isActive: false,
       },
       {
         date: '2019',
         title: 'We acquired XXX',
-        text:
-          'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+        text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
         isActive: false,
       },
       {
         date: 'Today',
         title: 'Over 500 Casino Reviews',
-        text:
-          'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+        text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
         isActive: true,
       },
     ],

package/src/components/molecules/content-and-custom-module/content-and-custom-module.test.js

@@ -9,8 +9,7 @@ const timelineArray = [
   {
     date: '2013',
     title: 'Launched',
-    text:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. At urna in sapien posuere leo imperdiet pulvinar dictum.',
     isActive: false,
   },
 ];

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

@@ -44,6 +44,7 @@ function Header({ section, content = null, backgroundImage = true, showAuthor =
   const Author =
     section.page.path !== '/' &&
     section.page.path !== 'contact-us' &&
+    section.page.path !== 'sitemap' &&
     section.page.author &&
     showAuthor
       ? loadable(() => import('~atoms/author'))

package/src/components/molecules/link-list/index.js

@@ -30,8 +30,8 @@ const LinkList = ({
       <LazyImage
         src={imagePrettyUrl(item.image)}
         alt={getAltText(item?.image_object, item.title)}
-        width={width}
-        height={height}
+        width={width || item?.image_object?.width}
+        height={height || item?.image_object?.height}
         loading={disableLazyLoad ? 'eager' : 'lazy'}
       />
     );

package/src/components/molecules/link-list/link-list.test.js

@@ -5,34 +5,25 @@ import '@testing-library/jest-dom/extend-expect';
 import { getNavigationModule } from '~tests/factories/sections/navigation.factory';
 import LinkList from '.';
 
-
-
 describe('Link List Component', () => {
   test('render multiple lists', () => {
-    const links = getNavigationModule(2,true);
+    const links = getNavigationModule(2, true);
 
-    const { getByText } = render(
-      <LinkList
-        lists={links}
-      />
-    );
+    const { getByText } = render(<LinkList lists={links} />);
     expect(getByText('title nav_1_1')).toBeTruthy();
-    expect(getByText('submenu nav_1_1').closest('a').getAttribute('href')).toEqual('/submenu_nav_1_1');
+    expect(getByText('submenu nav_1_1').closest('a').getAttribute('href')).toEqual(
+      '/submenu_nav_1_1'
+    );
     expect(getByText('title nav_1_1').closest('ul').children.length).toBe(2);
     expect(getByText('title nav_1_2')).toBeTruthy();
-    expect(getByText('submenu nav_1_2').closest('a').getAttribute('href')).toEqual('/submenu_nav_1_2');
+    expect(getByText('submenu nav_1_2').closest('a').getAttribute('href')).toEqual(
+      '/submenu_nav_1_2'
+    );
     expect(getByText('title nav_1_2').closest('ul').children.length).toBe(2);
   });
   const links = getNavigationModule(4);
   test('render single list', () => {
-    
-
-    const { getByText } = render(
-      <LinkList
-        lists={links}
-        singleList
-      />
-    );
+    const { getByText } = render(<LinkList lists={links} singleList />);
 
     expect(getByText('title nav_1_1')).toBeTruthy();
     expect(getByText('title nav_1_1').closest('a').getAttribute('href')).toEqual('/menu_nav_1_1');
@@ -45,14 +36,7 @@ describe('Link List Component', () => {
   });
 
   test('render image list', () => {
-
-    const { getByTitle } = render(
-      <LinkList
-        lists={links}
-        singleList
-        imageOnly
-      />
-    );
+    const { getByTitle } = render(<LinkList lists={links} singleList imageOnly />);
 
     expect(getByTitle('title nav_1_1')).toBeTruthy();
     expect(getByTitle('title nav_1_2')).toBeTruthy();

package/src/components/molecules/operator-banner/operator-banner.stories.js

@@ -63,8 +63,7 @@ export default {
       name: 'sticky',
       type: { name: 'boolean', required: false },
       defaultValue: false,
-      description:
-        'If true it will be wrapped with a Sticky component.',
+      description: 'If true it will be wrapped with a Sticky component.',
       table: {
         type: { summary: 'boolean' },
         defaultValue: { summary: false },

package/src/components/molecules/slider/slider.stories.js

@@ -119,8 +119,7 @@ export default {
 const list = [
   {
     title: 'slide one',
-    text:
-      "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,",
+    text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,",
     image: Slide1,
   },
   {

package/src/components/molecules/star-rating/star-rating.stories.js

@@ -36,7 +36,7 @@ export default {
         type: { summary: 'number | array of numbers' },
         defaultValue: { summary: '' },
       },
-      control: { type: 'range', min: 0, max: 10, step: .5 },
+      control: { type: 'range', min: 0, max: 10, step: 0.5 },
     },
     halfStars: {
       name: 'halfStars',
@@ -106,5 +106,5 @@ export const Default = Template.bind({});
 Default.args = {
   numOfStars: 10,
   rating: 6.5,
-  halfStars: true
+  halfStars: true,
 };

package/src/components/molecules/sticky/sticky.test.js

@@ -8,7 +8,7 @@ describe('summary component', () => {
   test('test content', () => {
     const { container, getByText } = render(<Sticky>Test content</Sticky>);
     expect(container).toBeTruthy();
-    
+
     expect(container.querySelector('.notScrolled')).toBeTruthy();
     expect(getByText('Test content')).toBeTruthy();
     // expect(container.querySelector('.sticky')).toBeVisible();
@@ -16,15 +16,19 @@ describe('summary component', () => {
 
   test('test content', () => {
     const { container, getByText } = render(<Sticky showOnScroll={false}>Test content</Sticky>);
-    
+
     expect(container).toBeTruthy();
     expect(container.querySelector('.notScrolled')).toBeFalsy();
     expect(getByText('Test content')).toBeTruthy();
   });
 
   test('test content', () => {
-    const { container, getByText } = render(<Sticky showOnScroll={false} position='top'>Test content</Sticky>);
-    
+    const { container, getByText } = render(
+      <Sticky showOnScroll={false} position="top">
+        Test content
+      </Sticky>
+    );
+
     expect(container).toBeTruthy();
     expect(container.querySelector('.top')).toBeTruthy();
     expect(container.querySelector('.notScrolled')).toBeFalsy();

package/src/components/organisms/carousel/carousel.test.js

@@ -14,15 +14,11 @@ describe('Carousel Component', () => {
   test('render slides', () => {
     const { container, getAllByText } = render(<Carousel module={carouselItems} />);
     expect(getAllByText('title 1')).toBeTruthy();
-    
+
     expect(container.querySelectorAll('.sliderItem span.title')).toHaveLength(2);
     expect(container.querySelectorAll('.sliderItem a.primary')).toHaveLength(1);
-    expect(container.querySelectorAll('.sliderItem a.secondary')).toHaveLength(
-      1
-    );
-    expect(container.querySelectorAll('.sliderItem span.label')).toHaveLength(
-      2
-    );
+    expect(container.querySelectorAll('.sliderItem a.secondary')).toHaveLength(1);
+    expect(container.querySelectorAll('.sliderItem span.label')).toHaveLength(2);
   });
 });
 afterEach(() => {

package/src/components/organisms/form/form.stories.js

@@ -91,8 +91,7 @@ export default {
   parameters: {
     docs: {
       description: {
-        component:
-          'Generates a Contact-us or Newsletter from.',
+        component: 'Generates a Contact-us or Newsletter from.',
       },
       page: () => (
         <>

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

@@ -7,7 +7,6 @@ import Menu from '~molecules/menu';
 import { toggleScroll } from '~helpers/scroll';
 import ConditionalWrapper from '~atoms/conditional-wrapper';
 import Sticky from '~molecules/sticky';
-import Image from '../../../hooks/gatsby-img';
 
 import NavigationProvider from './navigationContext';
 
@@ -15,7 +14,7 @@ import styles from './navigation.module.scss';
 
 const Navigation = ({
   section,
-  logo = 'logo.jpg',
+  logo = '../../../../../images/logo.svg',
   logoWidth = 200,
   logoHeight = 31,
   searchIcon = null,
@@ -43,18 +42,11 @@ const Navigation = ({
 
   const Search = hasSearch ? loadable(() => import('~organisms/search')) : null;
   const logoImg = (
-    // <img
-    //   alt={`${process.env.GATSBY_SITE_NAME} logo`}
-    //   src={logo}
-    //   width={logoWidth}
-    //   height={logoHeight}
-    // />
-    <Image
-      objectFit="contain"
-      filename={logo}
+    <img
+      alt={`${process.env.GATSBY_SITE_NAME} logo`}
+      src={logo}
       width={logoWidth}
       height={logoHeight}
-      alt={`${process.env.GATSBY_SITE_NAME} logo`}
     />
   );
 

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

@@ -1,8 +1,8 @@
-import React, { useState, createContext } from "react";
+import React, { useState, createContext } from 'react';
 
 export const NavigationContext = createContext(false);
 
-const NavigationProvider = props => {
+const NavigationProvider = (props) => {
   const [showMenu, setShowMenu] = useState(false);
   const [showSearch, setShowSearch] = useState(false);
 

package/src/components/organisms/toplist/toplist.stories.js

@@ -52,8 +52,7 @@ export default {
       name: 'page',
       type: { name: 'object', required: false },
       defaultValue: null,
-      description:
-        'The page object.',
+      description: 'The page object.',
       table: {
         type: { summary: 'object' },
         defaultValue: { summary: null },

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

@@ -10,7 +10,7 @@ import {
 import Tracker from '.';
 // When we separate repo's we need to move these files to gatsby-theme
 import bgVideoSrc from '../../../../../storybook-images/splash-page.webm';
-import bgImageSrc from '../../../../../storybook-images/splash-page.svg'; 
+import bgImageSrc from '../../../../../storybook-images/splash-page.svg';
 
 export default {
   title: 'Gatsby-Theme/Pages/Tracker',

package/src/constants/module-value.js

@@ -7,4 +7,4 @@ export default Object.freeze({
   OWNER_TYPE_TEMPLATE: 'template',
   VALUE_TYPE_PREFILLED_MODULE_MARKET: 'prefilled_module_market',
   VALUE_TYPE_PREFILLED_MODULE: 'prefilled_module',
-})
+});

package/src/constants/pick-keys.js

@@ -68,8 +68,8 @@ export const pickRelationKeys = {
     'thumbnail_filename',
     'thumbnail_filename_object',
   ],
-  software_provider: ['logo_object', 'logo', 'games_count', 'name'],
-  payment_method: ['logo_object', 'logo', 'name', 'rating'],
+  software_provider: ['logo_object', 'logo', 'games_count', 'name', 'standardised_logo_url_object'],
+  payment_method: ['logo_object', 'logo', 'name', 'rating', 'standardised_logo_url_object'],
 };
 
 export const pickHTMLSitemapPageKeys = ['title', 'path', 'template_id'];

package/src/helpers/cookies.test.js

@@ -2,12 +2,12 @@ import * as Cookies from './cookies';
 
 describe('Cookies Helper', () => {
   test('setCookie()', () => {
-    Cookies.setCookie('name','foo',1,'/')
+    Cookies.setCookie('name', 'foo', 1, '/');
     expect(document.cookie).toEqual('name=foo');
   });
 
   test('getCookie()', () => {
-    Cookies.setCookie('bar','foo',1,'/')
+    Cookies.setCookie('bar', 'foo', 1, '/');
     expect(Cookies.getCookie('bar')).toEqual('foo');
   });
 });

package/src/helpers/css-parser.js

@@ -1,5 +1,4 @@
 export function parseCss(css) {
-
   const cssFormat = css.trim();
   const tokenizer = /\s*([a-z-]+)\s*:\s*((?:[^;]*url\(.*?\)[^;]*|[^;]*)*)\s*(?:;|$)/gi;
   const obj = {};

package/src/helpers/date-time.test.js

@@ -3,8 +3,8 @@ import { formatDate } from './date-time';
 describe('Date-Time Helper', () => {
   test('formatDate()', () => {
     expect(formatDate(null, 'YYYY')).toBeNull();
-    expect(formatDate('2020-04-23 11:45:10', 'DD.MM.YY','.','en-US')).toEqual('4.23.2020');
-    expect(formatDate('2020-04-23 11:45:10', 'MMM YYYY','/','en-US')).toEqual('April 2020');
-    expect(formatDate('2020-04-23 11:45:10', 'DD/MM/YYYY', '@@','en-US')).toEqual('04@@23@@2020');
+    expect(formatDate('2020-04-23 11:45:10', 'DD.MM.YY', '.', 'en-US')).toEqual('4.23.2020');
+    expect(formatDate('2020-04-23 11:45:10', 'MMM YYYY', '/', 'en-US')).toEqual('April 2020');
+    expect(formatDate('2020-04-23 11:45:10', 'DD/MM/YYYY', '@@', 'en-US')).toEqual('04@@23@@2020');
   });
 });

package/src/helpers/search-source.js

@@ -1,7 +1,7 @@
 import { returnDataSet } from '~helpers/search';
 
 export default async function loadSource(uniqueField, indexFields) {
-    return import('../data/search/data.json').then((data) => {
-      return returnDataSet(uniqueField, indexFields, data);
-    });
-}
+  return import('../data/search/data.json').then((data) => {
+    return returnDataSet(uniqueField, indexFields, data);
+  });
+}

package/src/helpers/validation.test.js

@@ -9,18 +9,18 @@ describe('Validation Helper', () => {
 
   test('validateString()', () => {
     expect(Validation.validateString(2)).toEqual('not_string');
-    expect(Validation.validateString(true, false,false)).toBe(false);
-    expect(Validation.validateString('', true,true)).toEqual('empty');
-    expect(Validation.validateString([], true,false)).toBe(false);
-    expect(Validation.validateString('some string', true,true)).toBe(true);
+    expect(Validation.validateString(true, false, false)).toBe(false);
+    expect(Validation.validateString('', true, true)).toEqual('empty');
+    expect(Validation.validateString([], true, false)).toBe(false);
+    expect(Validation.validateString('some string', true, true)).toBe(true);
   });
 
   test('validateEmail()', () => {
     expect(Validation.validateEmail(2)).toEqual('not_string');
-    expect(Validation.validateEmail(true, false,false)).toBe(false);
-    expect(Validation.validateEmail('', true,true)).toEqual('empty');
-    expect(Validation.validateEmail({}, true,false)).toBe(false);
-    expect(Validation.validateEmail('mm@gig', true,true)).toEqual('not_email');
-    expect(Validation.validateEmail('mohsen@gmail.com', true,true)).toBe(true);
+    expect(Validation.validateEmail(true, false, false)).toBe(false);
+    expect(Validation.validateEmail('', true, true)).toEqual('empty');
+    expect(Validation.validateEmail({}, true, false)).toBe(false);
+    expect(Validation.validateEmail('mm@gig', true, true)).toEqual('not_email');
+    expect(Validation.validateEmail('mohsen@gmail.com', true, true)).toBe(true);
   });
 });

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

@@ -24,7 +24,6 @@ export const PureImage = ({
       style={{ height, width }}
       alt={alt}
       image={image.node.childImageSharp.gatsbyImageData}
-      placeholder="none"
     />
   );
 };

package/storybook/babel.config.js

@@ -5,9 +5,9 @@ module.exports = {
       '@babel/preset-env',
       {
         targets: {
-          node: 'current'
-        }
-      }
-    ]
-  ]
-}
+          node: 'current',
+        },
+      },
+    ],
+  ],
+};

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

@@ -139,32 +139,56 @@ const prefilledModules = [
     expected: false,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'cards_v2', sort_by: 'random' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'cards_v2',
+      sort_by: 'random',
+    },
     siteName: 'playcasino.co.za',
     expected: false,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'module', sort_by: 'asc' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'module',
+      sort_by: 'asc',
+    },
     siteName: 'playcasino.co.za',
     expected: true,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'module', sort_by: 'random' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'module',
+      sort_by: 'random',
+    },
     siteName: 'playcasino.co.za',
     expected: true,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'cards', sort_by: 'asc' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'cards',
+      sort_by: 'asc',
+    },
     siteName: 'playcasino.co.za',
     expected: true,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'cards', sort_by: 'random' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'cards',
+      sort_by: 'random',
+    },
     siteName: 'playcasino.co.za',
     expected: false,
   },
   {
-    module: { value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET, name: 'cards_v2', sort_by: 'random' },
+    module: {
+      value_type: ModuleValue.VALUE_TYPE_PREFILLED_MODULE_MARKET,
+      name: 'cards_v2',
+      sort_by: 'random',
+    },
     siteName: 'playcasino.co.za',
     expected: false,
   },

package/tests/factories/pages/default.factory.js

@@ -34,7 +34,7 @@ export default function getPageData() {
       logo_url: 'rizk-logopng7ed316ac19-original.png',
       url: 'https://rizk.com',
       status: 'active',
-      short_name: "rizk",
+      short_name: 'rizk',
       type: 'casino',
       iframe: 'https://www.youtube.com/embed/DU1Pio4n_N0',
       bonus: {