gatsby-core-theme 6.1.1 → 6.1.7

package/CHANGELOG.md

@@ -1,3 +1,77 @@
+## [6.1.7](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.6...v6.1.7) (2022-04-19)
+
+
+### Code Refactoring
+
+* update cards, cards_v2 filtering for operator pages ([08ecad7](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/08ecad782f75f6f8105f203e06baf48951d68789))
+
+
+* Merge branch 'tm-2805-cards-random-filter' into 'master' ([206b0e8](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/206b0e89234188e5a0ad38ad1fd1aec3a1212e89))
+
+
+### refactoe
+
+* update processor modules tests ([11fd5a0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/11fd5a0f7dcadf71a9550c58eeed383db35437e4))
+
+## [6.1.6](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.5...v6.1.6) (2022-04-18)
+
+
+### Bug Fixes
+
+* commit to trigger publish ([6c6c3fb](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/6c6c3fb19ff72f175da8843c02cc467033211097))
+
+## [6.1.5](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.4...v6.1.5) (2022-04-18)
+
+
+### Bug Fixes
+
+* changed npm token ([eba1721](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/eba17217edfaa65a57f0fc911341ae040df4e2df))
+
+
+* Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/gatsby-themes ([44e4e94](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/44e4e940745311f4435de7e965394481a0e13e21))
+
+## [6.1.4](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.3...v6.1.4) (2022-04-18)
+
+
+### Bug Fixes
+
+* changed tracker ([4ed35aa](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/4ed35aa6ccdad19fdf9e203da67a8a74d78fd662))
+
+
+* Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/gatsby-themes ([43f8dcf](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/43f8dcf4f647f3f7128c10bfcc73482876129890))
+
+## [6.1.3](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.2...v6.1.3) (2022-04-18)
+
+
+### Bug Fixes
+
+* star rating fixed design ([eaf7472](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/eaf74723c83f203e465d5cc3811cca562134b3ef))
+
+
+* Merge branch 'tm-2783-fix-star-rating' into 'master' ([3f1d310](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3f1d3105db166d2bbdd48c2a2d19bb0c1e3a462e))
+
+## [6.1.2](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.1...v6.1.2) (2022-04-13)
+
+
+### Bug Fixes
+
+* add star ratings changes ([a7145f4](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/a7145f4ee6c6e8c73c879e3ea968ef1b5b3566f9))
+* replace h3 with p for heading sequence ([046fd25](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/046fd25173b6293285687c0da4545eb687cfe726))
+
+
+### Code Refactoring
+
+* seperate one star component ([77e38fc](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/77e38fc9dfb1ec1b8be2a62bfbbad695ba9c46ca))
+
+
+* Merge branch 'tm-2813-heading-sequence' into 'master' ([1536f72](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/1536f723f30ec5b794222db41fffcd398b3e0688))
+* Merge branch 'fix-star-ratings' into 'master' ([954ff3a](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/954ff3ace386c2165421731ad280e6d8ecd60c94))
+
+
+### Tests
+
+* added test for onestar ([0f21ec6](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/0f21ec6ae1ae0133450ba1d15c442469c4abf18d))
+
 ## [6.1.1](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v6.1.0...v6.1.1) (2022-04-06)
 
 

package/package.json

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

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

@@ -52,8 +52,8 @@ export default function OperatorBanner({
                 <LazyImage alt={operator?.name} src={imagePrettyUrl(logo)} />
               </a>
             ) : (
-              <div>
-                <h3>
+              <div className={styles.nameTitle}>
+                <p>
                   <a
                     href={prettyLink}
                     title={operator?.name}
@@ -63,7 +63,7 @@ export default function OperatorBanner({
                   >
                     {operator?.name}
                   </a>
-                </h3>
+                </p>
                 {!isPlaceholder && hasStars && (
                   <StarRating numOfStars={5} rating={operator.rating} />
                 )}

package/src/components/molecules/operator-banner/operator-banner.module.scss

@@ -33,7 +33,7 @@
   }
 
   > div:first-child {
-    h3 a {
+    .nameTitle a {
       @include link-color(var(--color-18));
     }
 

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

@@ -0,0 +1,20 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { getRating } from '~helpers/rating';
+
+import styles from './one-star.module.scss';
+
+const OneStar = ({ numOfStars, rating, active = true }) => (
+  <div className={`${styles.starRatingContainer} ${!active && styles.inactive}`}>
+    <span className={styles.fullStar} />
+    <span className={styles.rateNr}>{`${getRating(rating)}/${numOfStars}`}</span>
+  </div>
+);
+
+OneStar.propTypes = {
+  numOfStars: PropTypes.oneOf([5, 10]).isRequired,
+  rating: PropTypes.oneOfType([PropTypes.array, PropTypes.number, PropTypes.string]).isRequired,
+  active: PropTypes.bool,
+};
+
+export default OneStar;

package/src/components/molecules/star-rating/one-star.module.scss

@@ -0,0 +1,28 @@
+.starRatingContainer {
+  @include flex-direction(row);
+  justify-content: center;
+  background-color: #ffffff;
+  min-width: 6.5rem;
+  min-height: 2.1rem;
+  line-height: 2.1rem;
+  border-radius: 0.4rem;
+  border: 1px solid var(--main-star-wrapper-color);
+
+  .fullStar {
+    @include star(var(--full-star-fill-color), var(--full-star-border-color), unset, 2.1rem);
+  }
+
+  .rateNr {
+    color: #17182f;
+    font-weight: 700;
+    font-size: 1.3rem;
+    margin-left: 0.33rem;
+    line-height: 2.1rem;
+  }
+
+  &.inactive {
+    .fullStar {
+      @include star(var(--empty-star-border-color), var(--empty-star-border-color), unset, 2.1rem);
+    }
+  }
+}

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

@@ -0,0 +1,18 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+
+import OneStar from './one-star';
+
+describe('OneStar Component', () => {
+  test('render container with correct rating', async () => {
+    const { container } = render(<OneStar numOfStars={5} rating={3} />);
+
+    expect(container.querySelectorAll('span')).toHaveLength(2);
+    expect(container.querySelectorAll('span')[1].innerHTML).toBe('3/5');
+  });
+});
+
+afterEach(() => {
+  cleanup();
+});

package/src/components/molecules/star-rating/star-rating.module.scss

@@ -29,4 +29,4 @@
       @include half-star(var(--empty-star-border-color),  var(--empty-star-border-color), var(--halfEmpty-star-fill-color))
     }
   }
-}
+}

package/src/helpers/processor/modules.js

@@ -18,9 +18,15 @@ export function processCardsModule(module, pages, pagesCloned, pagesMappedById)
     const numOfItems =
       Math.sign(module.num_of_items) === 0 ? pages[modelType].length : Number(module.num_of_items);
     if (sortBy === 'random') {
-      const samplePages = pagesCloned[modelType].filter(
-        (page) => !settings.filter_cards_modules[process.env.GATSBY_SITE_NAME].includes(page.status)
-      );
+      const samplePages =
+        module.cards_page_type !== 'operator'
+          ? pagesCloned[modelType]
+          : pagesCloned[modelType].filter(
+              (page) =>
+                !settings.filter_cards_modules[process.env.GATSBY_SITE_NAME].includes(
+                  page.relation && page.relation.status
+                )
+            );
       module.items = sampleSize(samplePages, numOfItems);
     } else {
       module.items = pagesCloned[modelType].slice(0, numOfItems);
@@ -180,10 +186,15 @@ export function processCardsV2(module, pagesCloned, pagesMappedById) {
 
       // Applying sorting
       if (sortType === 'random') {
-        const samplePages = uniquePages.filter(
-          (page) =>
-            !settings.filter_cards_modules[process.env.GATSBY_SITE_NAME].includes(page.status)
-        );
+        const samplePages =
+          module.cards_page_type !== 'operator'
+            ? uniquePages
+            : uniquePages.filter(
+                (page) =>
+                  !settings.filter_cards_modules[process.env.GATSBY_SITE_NAME].includes(
+                    page.relation && page.relation.status
+                  )
+              );
         module.items = sampleSize(samplePages, itemLimit);
       } else if (sortType === 'latest') {
         if (uniquePages.length > 0) {

package/src/helpers/processor/modules.test.js

@@ -17,6 +17,11 @@ import {
 import { relationData, singleToplistData } from '../../../tests/factories/modules/toplist.factory';
 
 describe('Modules Helper', () => {
+  beforeEach(() => {
+    jest.resetModules();
+    process.env = { ...process.env };
+    delete process.env.NODE_ENV;
+  });
   test('Cards V2 Manual list', () => {
     const pagesNum = 10;
     const moduleData = getSampleCardsV2ModuleManual();
@@ -45,12 +50,14 @@ describe('Modules Helper', () => {
     const moduleData = getSampleCardsV2Filtered(false, 'Game');
     moduleData.cards_selector_filters_sort_by = 'random';
     moduleData.cards_selector_filters_limit = '3';
+    moduleData.cards_page_type = 'operator';
     const pageList = getPageDataList(pagesNum).map((page, i) =>
       i % 2
-        ? { ...page, type: 'game', status: 'inactive' }
-        : { ...page, type: 'game', status: 'active' }
+        ? { ...page, type: 'operator', relation: { ...page.relation, status: 'inactive' } }
+        : { ...page, type: 'operator', relation: { ...page.relation, status: 'active' } }
     );
-    processCardsV2(moduleData, groupBy(pageList, 'type'));
+    const { processCardsV2: processCardsV2Clean } = require('./modules');
+    processCardsV2Clean(moduleData, groupBy(pageList, 'type'), groupBy(pageList, 'id'));
 
     expect(moduleData.items).toHaveLength(3);
     moduleData.items.forEach((item) => {

package/src/styles/utils/_mixins.scss

@@ -67,7 +67,7 @@
     border-top: $height solid $color;
     border-right: calc($width / 2) solid transparent;
     border-left: calc($width / 2) solid transparent;
-    margin-left: - calc($width / 2);
+    margin-left: -calc($width / 2);
   }
 }
 
@@ -85,9 +85,9 @@
   }
 }
 
-@mixin star($border-color: #fba62f, $fill-color: #fba62f) {
-  line-height: 2rem;
-  width: 16px;
+@mixin star($border-color: #ffb400, $fill-color: #ffb400, $width: 16px, $line-height: 2rem) {
+  line-height: $line-height;
+  width: $width;
   font-weight: normal;
   display: inline-block;
   color: $fill-color;
@@ -103,7 +103,7 @@
   }
 }
 
-@mixin half-star($border-color: #fba62f, $half-empty-color: #fba62f, $half-full-color: white) {
+@mixin half-star($border-color: #ffb400, $half-empty-color: #ffb400, $half-full-color: white) {
   line-height: 2rem;
   width: 16px;
   font-weight: normal;

package/src/styles/utils/variables/_main.scss

@@ -16,6 +16,7 @@
   --half-star-border-color: #fba62f;
   --empty-star-fill-color: white;
   --empty-star-border-color: grey;
+  --main-star-wrapper-color: #a5bcf0;
 
   // Font
   --main-font: Nunito;

package/storybook/.ci.yml

@@ -1,5 +1,5 @@
 # ######################
-#  STORYBOOK CI
+#  STORYBOOK
 # #####################
 
 Storybook Build:
@@ -9,7 +9,7 @@ Storybook Build:
     - floyd-runner-test
   script:
     - yarn config set cache-folder .yarn
-    - npm config set //registry.npmjs.org/:_authToken 32bb5578-6354-4c61-8d7a-d49a4869bc21
+    - npm config set //registry.npmjs.org/:_authToken $NPM_AUTH_TOKEN
     - yarn
     - yarn workspace gatsby-core-theme build-storybook -o ./storybook/public
   artifacts: