gatsby-matrix-theme 37.0.3 → 37.0.5

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+## [37.0.5](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v37.0.4...v37.0.5) (2023-11-15)
+
+
+### Bug Fixes
+
+* operator review summary ([67d5d3a](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/67d5d3a39a95e15779ddc9ff7ab91923263c9636))
+* operator review summary ([9657b9d](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/9657b9d1b55abe9e3be6d31b5a1c5b7a262c93f9))
+
+## [37.0.4](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v37.0.3...v37.0.4) (2023-11-15)
+
+
+### Bug Fixes
+
+* buttons fixes ([c563413](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c5634135fce42d4aa0b56db78d663b81f65b8e1c))
+
 ## [37.0.3](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v37.0.2...v37.0.3) (2023-11-15)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-matrix-theme",
-  "version": "37.0.3",
+  "version": "37.0.5",
   "main": "index.js",
   "description": "Matrix Theme NPM Package",
   "author": "",
@@ -25,7 +25,7 @@
   "dependencies": {
     "@react-icons/all-files": "^4.1.0",
     "gatsby": "^5.11.0",
-    "gatsby-core-theme": "30.0.18",
+    "gatsby-core-theme": "30.0.19",
     "gatsby-plugin-sharp": "^5.11.0",
     "gatsby-plugin-sitemap": "^3.3.0",
     "gatsby-transformer-sharp": "^5.11.0",

package/src/components/atoms/newsletter/privacy&button/index.js

@@ -3,13 +3,25 @@ import PropTypes from 'prop-types';
 import Button from 'gatsby-core-theme/src/components/atoms/button/button';
 import styles from './newsletter-privacy&button.module.scss';
 
-const PrivacyandSuccess = ({ privacyText, btnText, onSubmit = null }) => (
+const PrivacyandSuccess = ({
+  privacyText,
+  btnText,
+  buttonSize = 'm',
+  buttonType = 'primary',
+  onSubmit = null,
+}) => (
   <div className={styles?.display || ''}>
     {privacyText ? (
       // eslint-disable-next-line react/no-danger
       <p className={styles?.privacytext || ''} dangerouslySetInnerHTML={{ __html: privacyText }} />
     ) : null}
-    <Button isInternalLink={false} btnText={btnText} buttonType="primary" onClick={onSubmit} />
+    <Button
+      isInternalLink={false}
+      btnText={btnText}
+      buttonSize={buttonSize}
+      buttonType={buttonType}
+      onClick={onSubmit}
+    />
   </div>
 );
 
@@ -17,6 +29,8 @@ PrivacyandSuccess.propTypes = {
   privacyText: PropTypes.string,
   btnText: PropTypes.string,
   onSubmit: PropTypes.func,
+  buttonType: PropTypes.string,
+  buttonSize: PropTypes.string,
 };
 
 export default PrivacyandSuccess;

package/src/components/molecules/operator-summary/template-one/index.js

@@ -1,12 +1,14 @@
+/* eslint-disable react/no-danger */
 /* eslint-disable camelcase */
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
-import { imagePrettyUrl, getExtraField, translate } from 'gatsby-core-theme/src/helpers/getters';
+import { imagePrettyUrl, translate } from 'gatsby-core-theme/src/helpers/getters';
 import { generatePlaceholderString } from 'gatsby-core-theme/src/helpers/generators.mjs';
 import { formatDate } from 'gatsby-core-theme/src/helpers/date-time';
 import LazyImage from 'gatsby-core-theme/src/hooks/lazy-image';
 import { Context } from 'gatsby-core-theme/src/context/MainProvider';
 import Ratings from 'gatsby-core-theme/src/components/molecules/star-rating/one-star';
+import getOperatorForSummary from '../../../../helpers/operator';
 import Author from '../../../atoms/author/template-one';
 import OperatorBanner from '../../../atoms/header-operator-bannner';
 import styles from './template-one.module.scss';
@@ -20,10 +22,18 @@ const TemplateOne = ({
   showExperience = false,
 }) => {
   const { translations } = useContext(Context) || {};
-  const operatorData = page?.relation;
+
+  const operatorDetails = getOperatorForSummary(page);
+
+  if (!operatorDetails) {
+    return <></>;
+  }
+
+  const operatorData = operatorDetails[0];
+  const operatorSummary = operatorDetails[1];
+
   const { standardised_logo_url_object, logo_url_object, name } = operatorData;
-  const operatorSummary = getExtraField(page.extra_fields, 'operator_review_summary', null);
-  const author = page?.reviewer;
+  const author = page.reviewer_id ? page?.reviewer : null;
   const img = operatorImg
     ? standardised_logo_url_object?.filename || logo_url_object?.filename
     : author?.image;
@@ -40,23 +50,25 @@ const TemplateOne = ({
           <LazyImage src={imagePrettyUrl(img)} width={imgWidth} height={imgHeight} alt={name} />
           {operatorImg && <Ratings rating={operatorData?.rating} />}
         </div>
-        <div className={styles.author}>
-          <Author
-            label="By"
-            authorName={author?.name}
-            verify={imagePrettyUrl(author?.image)}
-            authorPath={author?.profile_page_path}
-          />
-          <span>
-            {author?.pages_count} {translate(translations, 'reviews', 'Reviews')}
-          </span>
-          <p>
-            {translate(translations, 'updated_on', 'Updated on')} {formatDate(page.updated_at)}
-          </p>
-          {showExperience && author?.experience && (
-            <div className={styles.experience}>{author?.experience}</div>
-          )}
-        </div>
+        {author && (
+          <div className={styles.author}>
+            <Author
+              label="By"
+              authorName={author?.name}
+              verify={imagePrettyUrl(author?.image)}
+              authorPath={author?.profile_page_path}
+            />
+            <span>
+              {author?.pages_count} {translate(translations, 'reviews', 'Reviews')}
+            </span>
+            <p>
+              {translate(translations, 'updated_on', 'Updated on')} {formatDate(page.updated_at)}
+            </p>
+            {showExperience && author?.experience && (
+              <div className={styles.experience}>{author?.experience}</div>
+            )}
+          </div>
+        )}
         {operatorSummary && (
           <div
             className={styles.description}
@@ -83,6 +95,7 @@ TemplateOne.propTypes = {
   operatorImg: PropTypes.bool,
   page: PropTypes.shape({
     reviewer: PropTypes.shape({}),
+    reviewer_id: PropTypes.number,
     relation_type: PropTypes.string,
     extra_fields: PropTypes.shape({}),
     template: PropTypes.string,

package/src/components/molecules/operator-summary/template-one/template-one.test.js

@@ -4,7 +4,7 @@ import OperatorSummary from '.';
 
 const mockPage = {
   reviewer: {},
-  relation_type: 'casino',
+  relation_type: 'operator',
   extra_fields: {},
   template: 'operator',
   relation: {
@@ -27,7 +27,5 @@ test('renders with custom props', () => {
 
   expect(getByText('Expert Casino Review')).toBeInTheDocument();
   expect(getByAltText('Rizk')).toBeInTheDocument();
-  expect(getByText('Reviews')).toBeInTheDocument();
-  expect(getByText('Reviews')).toHaveTextContent('Reviews');
   expect(document.querySelector('.description')).not.toBeInTheDocument();
 });

package/src/components/molecules/operator-summary/template-three/index.js

@@ -1,12 +1,14 @@
+/* eslint-disable react/no-danger */
 /* eslint-disable camelcase */
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
-import { imagePrettyUrl, getExtraField, translate } from 'gatsby-core-theme/src/helpers/getters';
+import { imagePrettyUrl, translate } from 'gatsby-core-theme/src/helpers/getters';
 import { generatePlaceholderString } from 'gatsby-core-theme/src/helpers/generators.mjs';
 import { Context } from 'gatsby-core-theme/src/context/MainProvider';
 import Bonus from 'gatsby-core-theme/src/components/molecules/bonus/template-one';
 import LazyImage from 'gatsby-core-theme/src/hooks/lazy-image';
 import Tnc from 'gatsby-core-theme/src/components/molecules/tnc';
+import getOperatorForSummary from '../../../../helpers/operator';
 import AuthorName from '../../../atoms/author/template-one';
 import styles from './template-three.module.scss';
 
@@ -20,9 +22,17 @@ const TemplateThree = ({
   tncContainer = false,
 }) => {
   const { translations } = useContext(Context) || {};
-  const operatorData = page?.relation;
-  const operatorSummary = getExtraField(page.extra_fields, 'operator_review_summary', null);
-  const author = page?.reviewer;
+
+  const operatorDetails = getOperatorForSummary(page);
+
+  if (!operatorDetails) {
+    return <></>;
+  }
+
+  const operatorData = operatorDetails[0];
+  const operatorSummary = operatorDetails[1];
+
+  const author = page.reviewer_id ? page?.reviewer : null;
   const title = generatePlaceholderString(
     translate(translations, 'expert_casino_review_title', 'Expert Casino Review [operator_name]'),
     translations,
@@ -43,18 +53,20 @@ const TemplateThree = ({
             dangerouslySetInnerHTML={{ __html: operatorSummary }}
           />
         )}
-        <div className={styles.author}>
-          <LazyImage
-            src={imagePrettyUrl(author?.image)}
-            width={imgWidth}
-            height={imgHeight}
-            alt={author?.name}
-          />
-          <div>
-            <AuthorName verify={verify} authorName={author?.name} />
-            <span>{author?.author_title}</span>
+        {author && (
+          <div className={styles.author}>
+            <LazyImage
+              src={imagePrettyUrl(author?.image)}
+              width={imgWidth}
+              height={imgHeight}
+              alt={author?.name}
+            />
+            <div>
+              <AuthorName verify={verify} authorName={author?.name} />
+              <span>{author?.author_title}</span>
+            </div>
           </div>
-        </div>
+        )}
       </div>
       <Bonus
         tncFixed={tncFixed}
@@ -86,6 +98,7 @@ TemplateThree.propTypes = {
   page: PropTypes.shape({
     reviewer: PropTypes.shape({}),
     relation_type: PropTypes.string,
+    reviewer_id: PropTypes.number,
     extra_fields: PropTypes.shape({}),
     template: PropTypes.string,
     updated_at: PropTypes.string,

package/src/components/molecules/operator-summary/template-three/template-three.test.js

@@ -4,7 +4,7 @@ import OperatorSummary from '.';
 
 const mockPage = {
   reviewer: {},
-  relation_type: 'casino',
+  relation_type: 'operator',
   extra_fields: {},
   template: 'operator',
   relation: {

package/src/components/molecules/operator-summary/template-two/index.js

@@ -1,13 +1,15 @@
+/* eslint-disable react/no-danger */
 /* eslint-disable camelcase */
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
-import { imagePrettyUrl, getExtraField, translate } from 'gatsby-core-theme/src/helpers/getters';
+import { imagePrettyUrl, translate } from 'gatsby-core-theme/src/helpers/getters';
 import { generatePlaceholderString } from 'gatsby-core-theme/src/helpers/generators.mjs';
 import { formatDate } from 'gatsby-core-theme/src/helpers/date-time';
 import LazyImage from 'gatsby-core-theme/src/hooks/lazy-image';
 import Tnc from 'gatsby-core-theme/src/components/molecules/tnc';
 import { Context } from 'gatsby-core-theme/src/context/MainProvider';
 import Ratings from 'gatsby-core-theme/src/components/molecules/star-rating/index';
+import getOperatorForSummary from '../../../../helpers/operator';
 import Author from '../../../atoms/author/template-one';
 import OperatorBanner from '../../../atoms/header-operator-bannner';
 import styles from './template-two.module.scss';
@@ -17,15 +19,24 @@ const TemplateTwo = ({
   imgWidth = 128,
   imgHeight = 146,
   tnc = false,
-  operatorImg = false,
+  operatorImg = true,
 }) => {
   const { translations } = useContext(Context) || {};
-  const operatorData = page?.relation;
+
+  const operatorDetails = getOperatorForSummary(page);
+
+  if (!operatorDetails) {
+    return <></>;
+  }
+
+  const operatorData = operatorDetails[0];
+  const operatorSummary = operatorDetails[1];
+
   const { name } = operatorData;
   const imageObject = operatorData?.standardised_logo_url_object || operatorData?.logo_url_object;
-  const operatorSummary = getExtraField(page.extra_fields, 'operator_review_summary', null);
-  const author = page?.reviewer;
+  const author = page.reviewer_id ? page?.reviewer : null;
   const img = operatorImg ? imageObject : author?.image;
+
   const title = generatePlaceholderString(
     translate(translations, 'expert_casino_review_title', 'Expert Casino Review'),
     translations,
@@ -37,7 +48,7 @@ const TemplateTwo = ({
       <div className={styles.details}>
         <div className={styles.img}>
           <LazyImage
-            src={imagePrettyUrl(img, imgWidth, imgHeight)}
+            src={imagePrettyUrl(img?.filename, imgWidth, imgHeight)}
             width={imgWidth}
             height={imgHeight}
             alt={name}
@@ -56,17 +67,20 @@ const TemplateTwo = ({
             dangerouslySetInnerHTML={{ __html: operatorSummary }}
           />
         )}
-        <div className={styles.author}>
-          <Author
-            label="By"
-            authorName={author?.name}
-            verify={imagePrettyUrl(author?.image)}
-            authorPath={author?.profile_page_path}
-          />
-          <span>
-            {author?.pages_count} {translate(translations, 'reviews', 'Reviews')}
-          </span>
-        </div>
+
+        {author && (
+          <div className={styles.author}>
+            <Author
+              label="By"
+              authorName={author?.name}
+              verify={imagePrettyUrl(author?.image)}
+              authorPath={author?.profile_page_path}
+            />
+            <span>
+              {author?.pages_count} {translate(translations, 'reviews', 'Reviews')}
+            </span>
+          </div>
+        )}
       </div>
 
       <OperatorBanner logo={imageObject} operator={operatorData} template={page?.template} />
@@ -81,8 +95,9 @@ TemplateTwo.propTypes = {
   tnc: PropTypes.bool,
   operatorImg: PropTypes.bool,
   page: PropTypes.shape({
-    reviewer: PropTypes.shape({}),
     relation_type: PropTypes.string,
+    reviewer_id: PropTypes.number,
+    reviewer: PropTypes.shape({}),
     extra_fields: PropTypes.shape({}),
     template: PropTypes.string,
     updated_at: PropTypes.string,

package/src/components/molecules/operator-summary/template-two/template-two.test.js

@@ -4,7 +4,7 @@ import OperatorSummary from '.';
 
 const mockPage = {
   reviewer: {},
-  relation_type: 'casino',
+  relation_type: 'operator',
   extra_fields: {},
   template: 'operator',
   relation: {
@@ -27,7 +27,5 @@ test('renders with custom props', () => {
 
   expect(getByText('Expert Casino Review')).toBeInTheDocument();
   expect(getByAltText('Rizk')).toBeInTheDocument();
-  expect(getByText('Reviews')).toBeInTheDocument();
-  expect(getByText('Reviews')).toHaveTextContent('Reviews');
   expect(document.querySelector('.description')).not.toBeInTheDocument();
 });

package/src/components/molecules/small-welcome-bonus/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 /* eslint-disable import/no-extraneous-dependencies */
 /* eslint-disable react/prop-types */
 /* eslint-disable camelcase */
@@ -18,6 +19,9 @@ import styles from './small-welcome-bonus.module.scss';
 
 const Index = ({ page }) => {
   const operator = page?.extra_fields?.game_review_summary_operator;
+  if (!operator) {
+    return <></>;
+  }
   const { status } = operator;
   const { translations } = useContext(Context) || {};
   const prettyLink = prettyTracker(operator, 'main', false, page.template);

package/src/helpers/operator.js

@@ -0,0 +1,20 @@
+import { getExtraField } from 'gatsby-core-theme/src/helpers/getters';
+
+const getOperatorForSummary = (page) => {
+  switch (page.relation_type) {
+    case 'operator':
+      return page?.relation
+        ? [page?.relation, getExtraField(page.extra_fields, 'operator_review_summary', null)]
+        : null;
+    case 'game':
+      // eslint-disable-next-line no-case-declarations
+      const operator = getExtraField(page.extra_fields, 'game_review_summary_operator', null);
+      return operator
+        ? [operator, getExtraField(page.extra_fields, 'game_review_summary', null)]
+        : null;
+    default:
+      return null;
+  }
+};
+
+export default getOperatorForSummary;