gatsby-core-theme 30.0.61 → 30.0.63

package/CHANGELOG.md

@@ -1,3 +1,21 @@
+## [30.0.63](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v30.0.62...v30.0.63) (2024-01-25)
+
+
+### Bug Fixes
+
+* added prop for nofollow in links component ([92f2a0c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/92f2a0ce520fcf6a8941f49710c02e93cacd540c))
+* added prop to row ([fda7eb3](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/fda7eb36729126d21b5f4b684e349e7a18fe95d2))
+
+
+* Merge branch 'tm-3991-review-links-nofollow' into 'master' ([9a9bbea](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9a9bbea8686949397b769cb8b1ecb68ad52314b6))
+
+## [30.0.62](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v30.0.61...v30.0.62) (2024-01-25)
+
+
+### Bug Fixes
+
+* operator banner ([c75ded0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/c75ded0143f6da5f6f0d9516396a02dc5911b12f))
+
 ## [30.0.61](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v30.0.60...v30.0.61) (2024-01-24)
 
 

package/package.json

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

package/src/components/atoms/review-link/index.js

@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { Context } from 'gatsby-core-theme/src/context/MainProvider';
 import { translate } from 'gatsby-core-theme/src/helpers/getters';
-import Link from 'gatsby-core-theme/src/hooks/link';
+import LinkCustom from 'gatsby-core-theme/src/hooks/link';
 
 const ReviewLink = ({
   template,
@@ -10,6 +10,7 @@ const ReviewLink = ({
   operatorName,
   reviewPath,
   className,
+  nofollow = false,
   isComparisonTable = false,
 }) => {
   let isBonusTemplate = false;
@@ -20,7 +21,7 @@ const ReviewLink = ({
   }
 
   return (
-    <Link className={className || ''} to={reviewPath}>{`${
+    <LinkCustom className={className || ''} nofollow={nofollow} to={reviewPath}>{`${
       isBonusTemplate
         ? translate(translations, 'bonus', '[operator_name] Bonus').replace(
             '[operator_name]',
@@ -31,13 +32,14 @@ const ReviewLink = ({
             isComparisonTable ? 'read_review_comparison' : 'read_review',
             (pageName && '[operator_name]') || (operatorName && '[operator_name] Review')
           ).replace('[operator_name]', pageName || operatorName)
-    }`}</Link>
+    }`}</LinkCustom>
   );
 };
 
 ReviewLink.propTypes = {
   template: PropTypes.string,
   pageName: PropTypes.string,
+  nofollow: PropTypes.bool,
   operatorName: PropTypes.string,
   reviewPath: PropTypes.string,
   className: PropTypes.string,

package/src/components/molecules/bonus/template-two/bonus.module.scss

@@ -157,18 +157,19 @@
   }
 }
 
+.hide {
+  display: none;
+}
+
 .floating {
   max-width: var(--main-container-max);
   border-radius: 1.6rem;
   width: 95%;
   box-shadow: 0px 4px 6px -2px rgba(27, 27, 28, 0.02), 0px 12px 16px -4px rgba(27, 27, 28, 0.05);
-  left: 0;
-  right: 0;
-  transition: all 1s;
-  margin-bottom: -10rem;
   margin-left: auto;
   margin-right: auto;
   padding: 0.8rem 1.6rem;
+
   > svg {
     right: 10px;
     top: -7px;

package/src/components/molecules/bonus/template-two/index.js

@@ -16,19 +16,17 @@ import styles from './bonus.module.scss';
 
 export default function TemplateOne({
   operator,
-  stickyOffset = 0,
   pageTemplate,
   module = {
     name: 'bonus',
   },
   tncEnable = true,
   tncFixed = false,
-  showOnLoad = false,
   showWelcomeText = true,
   floating = false,
+  closedBanner,
+  setClosedBanner,
 }) {
-  const [show, setShow] = useState(showOnLoad);
-  const [closed, setClosed] = useState(false);
   const { translations } = useContext(Context) || {};
   const { standardised_logo_url, logo_url, bonus, name } = operator || {};
   const logo = standardised_logo_url || logo_url;
@@ -42,80 +40,76 @@ export default function TemplateOne({
     },
   };
 
-  isSticky(stickyOffset, setShow);
-
   const clickHandler = () => {
-    setShow(false);
-    setClosed(true);
+    setClosedBanner(true);
   };
 
   return (
-    !closed && (
-      <div
-        className={`${styles.operatorBanner || ''} ${show && styles.show} ${
-          tncEnable ? styles.tncEnable : ''
-        } ${showTncFixed ? styles.showTncFixed || '' : ''} ${floating ? styles.floating : ''}
+    <div
+      className={`${styles.operatorBanner || ''} ${!closedBanner ? styles.show : styles.hide} ${
+        tncEnable ? styles.tncEnable : ''
+      } ${showTncFixed ? styles.showTncFixed || '' : ''} ${floating ? styles.floating : ''}
         `}
-      >
-        <div className={styles.container}>
-          <div>
-            <PrettyLink
-              operator={operator}
-              pageTemplate={pageTemplate}
-              module={module.name}
-              tracker={module?.tracking_link_name || 'main'}
-              clickedElement="oneliner"
-              className={`${styles.logo || ''} operator-banner-gtm logo-cta`}
-            >
-              <LazyImage
-                alt={operator?.name}
-                src={imagePrettyUrl(logo, 120, 120)}
-                loading="eager"
-                height={120}
-                width={100}
-              />
-              <div className={styles.details}>
-                {name && <span>{name}</span>}
-                {bonus?.rating && <Rating rating={bonus?.rating} showDecimal />}
-              </div>
-            </PrettyLink>
-            <div className={styles.bonus || ''}>
-              {showWelcomeText && (
-                <p className={styles.welcomeBonus}>
-                  {translate(translations, 'welcome_bonus', 'Welcome Bonus')}
-                </p>
-              )}
-
-              <BonusBox item={operator} tracker={module?.type || 'main'} />
-              {tncEnable && !tncFixed && <Tnc hasCollapse={false} operator={operator} />}
-            </div>
-          </div>
-
-          <OperatorCta
+    >
+      <div className={styles.container}>
+        <div>
+          <PrettyLink
             operator={operator}
-            module={module.name}
             pageTemplate={pageTemplate}
+            module={module.name}
             tracker={module?.tracking_link_name || 'main'}
-            icon={<FaArrowRight fontSize={20} title="Right-pointing Arrow Icon" />}
-            translationsObj={translationsObj}
-          />
-          {showTncFixed && <Tnc hasCollapse={false} operator={operator} />}
-          <IoMdClose
-            className={`${styles.closeBtn || ''}`}
-            onClick={clickHandler}
-            fontSize={16}
-            color="#ffffff"
-            title="Close Icon"
-          />
+            clickedElement="oneliner"
+            className={`${styles.logo || ''} operator-banner-gtm logo-cta`}
+          >
+            <LazyImage
+              alt={operator?.name}
+              src={imagePrettyUrl(logo, 120, 120)}
+              loading="eager"
+              height={120}
+              width={100}
+            />
+            <div className={styles.details}>
+              {name && <span>{name}</span>}
+              {bonus?.rating && <Rating rating={bonus?.rating} showDecimal />}
+            </div>
+          </PrettyLink>
+          <div className={styles.bonus || ''}>
+            {showWelcomeText && (
+              <p className={styles.welcomeBonus}>
+                {translate(translations, 'welcome_bonus', 'Welcome Bonus')}
+              </p>
+            )}
+
+            <BonusBox item={operator} tracker={module?.type || 'main'} />
+            {tncEnable && !tncFixed && <Tnc hasCollapse={false} operator={operator} />}
+          </div>
         </div>
+
+        <OperatorCta
+          operator={operator}
+          module={module.name}
+          pageTemplate={pageTemplate}
+          tracker={module?.tracking_link_name || 'main'}
+          icon={<FaArrowRight fontSize={20} title="Right-pointing Arrow Icon" />}
+          translationsObj={translationsObj}
+        />
+        {showTncFixed && <Tnc hasCollapse={false} operator={operator} />}
+        <IoMdClose
+          className={`${styles.closeBtn || ''}`}
+          onClick={clickHandler}
+          fontSize={16}
+          color="#ffffff"
+          title="Close Icon"
+        />
       </div>
-    )
+    </div>
   );
 }
 
 TemplateOne.propTypes = {
   showWelcomeText: PropTypes.bool,
-  showOnLoad: PropTypes.bool,
+  closedBanner: PropTypes.bool,
+  setClosedBanner: PropTypes.func,
   operator: PropTypes.shape({
     standardised_logo_url: PropTypes.string,
     logo: PropTypes.string,

package/src/components/molecules/toplist/default-row/index.js

@@ -21,6 +21,7 @@ const Row = ({
   itemRefs,
   index,
   className,
+  nofollow = false,
   module,
 }) => {
   const reviewPath = item.review_link ? `/${item.review_link}` : item.path || null;
@@ -62,6 +63,7 @@ const Row = ({
           className={`${styles.reviewLink || ''}  toplist-variant-one-gtm`}
           template={pageTemplate}
           operatorName={item.name}
+          nofollow={nofollow}
           reviewPath={reviewPath}
         />
       )}

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

@@ -1,7 +1,7 @@
 /* eslint-disable camelcase */
 /* eslint-disable no-useless-concat */
 /* eslint-disable no-restricted-globals */
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import loadable from '@loadable/component';
 // eslint-disable-next-line import/no-extraneous-dependencies
@@ -21,7 +21,7 @@ function Body({ pageContext, children, hideOperatorBanner, serverData, offsetTop
   const getBodySection = (name) => getSection(name, pageContext);
   const { template } = pageContext.page;
   const is404 = pageContext?.page?.path?.includes('404');
-
+  const [closedBanner, setClosedBanner] = useState(false);
   const main = getBodySection('main');
   const navigation = getBodySection('navigation');
   const footer = getBodySection('footer');
@@ -67,6 +67,8 @@ function Body({ pageContext, children, hideOperatorBanner, serverData, offsetTop
             pageTemplate={template}
             module={{ name: 'operator_banner', tracking_link_name: 'main' }}
             floating
+            closedBanner={closedBanner}
+            setClosedBanner={setClosedBanner}
             operator={pageContext.page.relation}
           />
         )}

package/src/hooks/link/index.js

@@ -10,6 +10,7 @@ function LinkCustom({
   activeClassName = '',
   partiallyActive = false,
   external = false,
+  nofollow = false,
   ...other
 }) {
   if (!to) {
@@ -50,6 +51,7 @@ function LinkCustom({
         </a>
       ) : (
         <Link
+          rel={nofollow ? 'nofollow' : null}
           to={formatPath(to)}
           activeClassName={activeClassName}
           partiallyActive={partiallyActive}
@@ -64,6 +66,7 @@ function LinkCustom({
 
 LinkCustom.propTypes = {
   to: PropTypes.string,
+  nofollow: PropTypes.bool,
   children: PropTypes.oneOfType([PropTypes.node, PropTypes.element, PropTypes.any]),
   activeClassName: PropTypes.string,
   partiallyActive: PropTypes.bool,