gatsby-core-theme 31.0.2 → 32.0.1

package/CHANGELOG.md

@@ -1,3 +1,32 @@
+## [32.0.1](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v32.0.0...v32.0.1) (2024-05-30)
+
+
+### Bug Fixes
+
+* tracker ([72f0022](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/72f0022e49a21ab9e6a7750a090257aac6058072))
+
+# [32.0.0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v31.0.2...v32.0.0) (2024-05-28)
+
+
+### Bug Fixes
+
+* footer as seen logo ([3ae88b2](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3ae88b28abf3e256afb63f628183732c2c1ed18c))
+
+
+### Code Refactoring
+
+* add storybook and changes to test scripts ([3a135d6](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3a135d65bf8fcecf3befe3db2d4c3b16f6a4edff))
+* changes to bonus storybook ([9e2bb5a](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9e2bb5a8fce4dcefcd57fb4f1917de637273722e))
+* changes to ratings ([b11c595](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/b11c5957e2ee520d6b0d4a5a775c084bdee35e59))
+* correct to bonus box ratings ([0a2aa6a](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/0a2aa6af2bea338c4add3c8ea374228d35f2f38a))
+* revert rating changes ([6c7a422](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/6c7a4222dce826d0e06d45544aa5b48fd7f1387c))
+* temp ([49efcf9](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/49efcf9e37363ef0a30d25e70fb61dd52b199617))
+
+
+* Merge branch 'tm-4382-ratings' into 'master' ([0cd66dd](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/0cd66dda52540d1f272a1ffdfa79cac543af5b2b))
+* Merge branch 'master' into tm-4382-ratings ([e359fe3](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/e359fe38fe209bc63aa3b5b000760fd429086f6e))
+* Merge branch 'tm-4379-footer-as-seen-logo' into 'master' ([8a8e50c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/8a8e50cd86ed2a205128b99f8a0df4380b3a2b1c))
+
 ## [31.0.2](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v31.0.1...v31.0.2) (2024-05-22)
 
 

package/package.json

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

package/src/components/atoms/footer/as-seen-on/index.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import LinkList from '../../../molecules/link-list';
 import styles from './as-seen-on.module.scss';
 
-const AsSeenOn = ({ asSeenOn, template }) => (
+const AsSeenOn = ({ asSeenOn, template, width = '130', height = '36' }) => (
   <div
     className={`${styles?.asSeenOn || ''} ${
       template && styles[template] ? styles[template] || '' : ''
@@ -15,8 +15,8 @@ const AsSeenOn = ({ asSeenOn, template }) => (
       imageOnly
       singleList
       lists={asSeenOn}
-      width={130}
-      height={36}
+      width={width}
+      height={height}
       gtmClass="mobile-menu-gtm logo-cta"
     />
   </div>
@@ -27,4 +27,6 @@ export default AsSeenOn;
 AsSeenOn.propTypes = {
   asSeenOn: PropTypes.shape({}),
   template: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
 };

package/src/components/atoms/number-rating/index.js

@@ -4,14 +4,15 @@ import PropTypes from 'prop-types';
 import styles from './number-rating.module.scss';
 import { getRating } from '~helpers/rating';
 
-const NumberRating = ({ total, rating }) => {
-  const rate = getRating(rating);
+const NumberRating = ({ total, rating, showRoundedRating = true }) => {
+  const rate = getRating(rating, showRoundedRating);
   return <div className={styles.numberRatingContainer || ''}>{`${rate}/${total}`}</div>;
 };
 
 NumberRating.propTypes = {
   total: PropTypes.oneOfType([PropTypes.oneOf([5, 10]), PropTypes.oneOf(['5', '10'])]).isRequired,
   rating: PropTypes.oneOfType([PropTypes.array, PropTypes.number]).isRequired,
+  showRoundedRating: PropTypes.bool,
 };
 
 export default NumberRating;

package/src/components/molecules/bonus/template-one/bonus.stories.js

@@ -45,6 +45,16 @@ export default {
         defaultValue: { summary: false },
       },
     },
+    showRoundedRating: {
+      name: 'showRoundedRating',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: 'Show rating as a rounded number or exact number',
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: false },
+      },
+    },
   },
   parameters: {
     docs: {

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

@@ -19,6 +19,7 @@ export default function Bonus({
   },
   tncEnable = true,
   tncFixed = false,
+  showRoundedRating = false,
 }) {
   const { standardised_logo_url, logo_url, bonus, name } = operator || {};
   const logo = standardised_logo_url || logo_url;
@@ -45,7 +46,11 @@ export default function Bonus({
             <div className={styles.details}>
               {name && <span>{name}</span>}
               {(operator?.rating || bonus?.rating) && (
-                <Rating rating={operator.rating || bonus?.rating} showDecimal />
+                <Rating
+                  rating={operator.rating || bonus?.rating}
+                  showDecimal
+                  showRoundedRating={showRoundedRating}
+                />
               )}
             </div>
           </PrettyLink>
@@ -92,4 +97,5 @@ Bonus.propTypes = {
     type: PropTypes.string,
     name: PropTypes.string,
   }),
+  showRoundedRating: PropTypes.bool,
 };

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

@@ -47,6 +47,16 @@ export default {
         defaultValue: { summary: false },
       },
     },
+    showRoundedRating: {
+      name: 'showRoundedRating',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: 'Show rating as a rounded number or exact number',
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: false },
+      },
+    },
   },
   parameters: {
     docs: {

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

@@ -26,6 +26,7 @@ export default function TemplateOne({
   floating = false,
   closedBanner,
   setClosedBanner,
+  showRoundedRating = false,
 }) {
   const { translations } = useContext(Context) || {};
   const { standardised_logo_url, logo_url, bonus, name } = operator || {};
@@ -71,7 +72,11 @@ export default function TemplateOne({
             <div className={styles.details}>
               {name && <span>{name}</span>}
               {(operator?.rating || bonus?.rating) && (
-                <Rating rating={operator?.rating || bonus?.rating} showDecimal />
+                <Rating
+                  rating={operator?.rating || bonus?.rating}
+                  showDecimal
+                  showRoundedRating={showRoundedRating}
+                />
               )}
             </div>
           </PrettyLink>
@@ -137,4 +142,5 @@ TemplateOne.propTypes = {
     type: PropTypes.string,
     name: PropTypes.string,
   }),
+  showRoundedRating: PropTypes.bool,
 };

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

@@ -11,8 +11,9 @@ const OneStar = ({
   numOfStars = 5,
   active = true,
   showLabel = false,
-  icon = false,
+  icon = null,
   showDecimal = false,
+  showRoundedRating = false,
 }) => {
   const { translations } = useContext(Context) || {};
 
@@ -20,7 +21,9 @@ const OneStar = ({
     <div className={`${styles.starRatingContainer || ''} ${!active && (styles.inactive || '')}`}>
       {showLabel && <span>{translate(translations, 'rating', 'Rating:')}</span>}
       {!icon ? <span className={styles.fullStar || ''} /> : icon}
-      {showDecimal ? getRating(rating).toFixed(1) : getRating(rating)}
+      {showDecimal
+        ? getRating(rating, showRoundedRating).toFixed(1)
+        : getRating(rating, showRoundedRating)}
       <span>/</span>
       <span>{numOfStars}</span>
     </div>
@@ -32,8 +35,9 @@ OneStar.propTypes = {
   rating: PropTypes.oneOfType([PropTypes.array, PropTypes.number, PropTypes.string]).isRequired,
   active: PropTypes.bool,
   showLabel: PropTypes.bool,
-  icon: PropTypes.bool,
+  icon: PropTypes.element,
   showDecimal: PropTypes.bool,
+  showRoundedRating: PropTypes.bool,
 };
 
 export default OneStar;

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

@@ -0,0 +1,106 @@
+import React from 'react';
+import {
+  Title,
+  Description,
+  Primary,
+  PRIMARY_STORY,
+  ArgsTable,
+} from '@storybook/addon-docs/blocks';
+
+import OneStar from './one-star';
+
+export default {
+  title: 'Theme/Molecules/Star Rating/One Star',
+  component: OneStar,
+  argTypes: {
+    numOfStars: {
+      name: 'numOfStars',
+      type: { name: 'number', required: true },
+      defaultValue: '',
+      description: 'Total number.',
+      table: {
+        type: { summary: 'one of 5 and 10' },
+        defaultValue: { summary: '' },
+      },
+      control: {
+        type: 'inline-radio',
+        options: [5, 10],
+      },
+    },
+    rating: {
+      name: 'rating',
+      type: { name: 'number', required: true },
+      defaultValue: '',
+      description: 'Rate number/s.',
+      table: {
+        type: { summary: 'number | array of numbers' },
+        defaultValue: { summary: '' },
+      },
+      control: { type: 'range', min: 0, max: 10, step: 0.2 },
+    },
+    active: {
+      name: 'active',
+      type: { name: 'boolean', required: false },
+      defaultValue: true,
+      description: 'Show as active star or not',
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: true },
+      },
+    },
+    showLabel: {
+      name: 'showLabel',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: "Show a translatable lable 'Rating'",
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: false },
+      },
+    },
+    showDecimal: {
+      name: 'showDecimal',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: 'Show decimal if a whole number',
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: false },
+      },
+    },
+    showRoundedRating: {
+      name: 'showRoundedRating',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: 'Show rating as a rounded number or exact number',
+      table: {
+        type: { summary: 'boolean' },
+        defaultValue: { summary: false },
+      },
+    },
+  },
+  parameters: {
+    docs: {
+      description: {
+        component:
+          'A component that accepts the rate numbers and the total number and generates a rating div.',
+      },
+      page: () => (
+        <>
+          <Title />
+          <Description />
+          <Primary />
+          <ArgsTable story={PRIMARY_STORY} />
+        </>
+      ),
+    },
+  },
+};
+
+const Template = (args) => <OneStar {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  numOfStars: 10,
+  rating: 6.2,
+};

package/src/helpers/rating.js

@@ -4,15 +4,15 @@ export const roundHalf = (num) => {
   return Math.round(num * 2) / 2;
 };
 
-export const getRating = (rating) => {
+export const getRating = (rating, showRoundedRating = false) => {
   // check if rating is an array or a number
   let rate = 0;
   if (Array.isArray(rating)) {
     const sum = rating.reduce((a, b) => parseInt(a) + parseInt(b));
     const avg = sum / rating.length;
-    rate = roundHalf(avg);
+    rate = showRoundedRating ? roundHalf(avg) : +avg;
   } else {
-    rate = roundHalf(rating);
+    rate = showRoundedRating ? roundHalf(rating) : +rating;
   }
   return rate;
 };

package/src/helpers/rating.test.js

@@ -8,8 +8,13 @@ describe('Rating Helper', () => {
     expect(roundHalf(3.75)).toEqual(4);
   });
 
-  test('getRating()', () => {
+  test('getRating() with rounded', () => {
     expect(getRating([5, 6, 7, 6.3])).toEqual(6);
-    expect(getRating(3.75)).toEqual(4);
+    expect(getRating(3.75, true)).toEqual(4);
+  });
+
+  test('getRating() without rounded', () => {
+    expect(getRating([5, 6, 7, 6.3])).toEqual(6);
+    expect(getRating(3.75, false)).toEqual(3.75);
   });
 });

package/src/helpers/tracker.mjs

@@ -1,3 +1,4 @@
+/* eslint-disable no-nested-ternary */
 /* eslint-disable no-underscore-dangle */
 import { generateTrackerLink } from '~helpers/generators';
 
@@ -90,6 +91,7 @@ export async function getAffiliateLink(operator, path, page, headers, url) {
     facebook_browser_id: cookie ? cookie._fbp || null : null,
     facebook_click_id: cookie ? cookie._fbc || null : null,
     split_test_name: cookie ? cookie.split_test_name || null : null,
+    google_client_id:  cookie ? cookie._ga || null : null,
     split_test_variant: cookie ? cookie.split_test_variant || null : null,
     facebook_pixel_id: process.env.PIXEL_ID || null,
     ...(isJsonString(cookie.affObject) ? JSON.parse(cookie.affObject) : {}),
@@ -102,7 +104,7 @@ export async function getAffiliateLink(operator, path, page, headers, url) {
       : {}),
     ...(extraURLParams || {}),
   };
-
+  
   const res = await fetch(
     `${process.env.GATSBY_TRACKING_API_URL}?${new URLSearchParams(clean(urlParam)).toString()}`
   ).catch((err) => null);
@@ -115,6 +117,7 @@ export async function getAffiliateLink(operator, path, page, headers, url) {
 
 export function getTrackingAPIParams(pageTemplate, module, tracker, clickedElement, url, referer) {
   const urlParams = {};
+  let extraData = {}
 
   if (pageTemplate) {
     urlParams.page_type = pageTemplate;
@@ -137,22 +140,20 @@ export function getTrackingAPIParams(pageTemplate, module, tracker, clickedEleme
   if (url && url.split('?').length === 2) {
     // eslint-disable-next-line prefer-destructuring
     urlParams.request_url = url.split('?')[0];
-    const extraData = deparam(url.split('?')[1]);
+    extraData = deparam(url.split('?')[1]);
     
     if (extraData.msclkid) {
-      urlParams.microsoft_click_id = extraData.msclkid;
-    }
-
-    if (extraData.brevo_customer_id) {
-      urlParams.brevo_customer_id = extraData.brevo_customer_id;
+      extraData.microsoft_click_id = extraData.msclkid;
+      delete extraData.msclkid;
     }
 
     if (extraData.gclid) {
-      urlParams.google_click_id = extraData.gclid;
+      extraData.google_click_id = extraData.gclid;
+      delete extraData.gclid;
     }
   } else if (url) {
     urlParams.request_url = url;
   }
-
-  return urlParams;
+  
+  return {...urlParams, ...extraData};
 }