gatsby-matrix-theme 19.0.4 → 19.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/package.json +1 -1
  3. package/src/components/atoms/cards/article-card/template-one/index.js +8 -10
  4. package/src/components/atoms/cards/game-cards/template-five/index.js +7 -4
  5. package/src/components/atoms/cards/game-cards/template-five/template-five.stories.js +10 -4
  6. package/src/components/atoms/cards/game-cards/template-five/template-five.test.js +1 -1
  7. package/src/components/atoms/cards/game-cards/template-four/index.js +7 -4
  8. package/src/components/atoms/cards/game-cards/template-four/template-four.test.js +1 -1
  9. package/src/components/atoms/cards/game-cards/template-one/index.js +7 -4
  10. package/src/components/atoms/cards/game-cards/template-one/template-one.module.scss +1 -1
  11. package/src/components/atoms/cards/game-cards/template-one/template-one.test.js +1 -1
  12. package/src/components/atoms/cards/game-cards/template-three/index.js +7 -4
  13. package/src/components/atoms/cards/game-cards/template-three/template-three.module.scss +1 -1
  14. package/src/components/atoms/cards/game-cards/template-three/template-three.test.js +1 -1
  15. package/src/components/atoms/cards/game-cards/template-two/index.js +7 -4
  16. package/src/components/atoms/cards/game-cards/template-two/template-two.module.scss +1 -1
  17. package/src/components/atoms/cards/game-cards/template-two/template-two.test.js +1 -1
  18. package/storybook/public/iframe.html +1 -1
  19. package/storybook/public/main.c96ee0d7.iframe.bundle.js +1 -0
  20. package/storybook/public/main.b1705345.iframe.bundle.js +0 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,11 @@
1
+ ## [19.0.5](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v19.0.4...v19.0.5) (2023-04-13)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * fix for article default banner and add vars for bards bg ([83a98e7](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/83a98e74bfd5c483e149776bfcd609d37cd86347))
7
+ * game card with operators logic ([600348d](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/600348dcf0f4e455e9ad39c85fb200c6f966a4a5))
8
+
1
9
  ## [19.0.4](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v19.0.3...v19.0.4) (2023-04-13)
2
10
 
3
11
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gatsby-matrix-theme",
3
- "version": "19.0.4",
3
+ "version": "19.0.5",
4
4
  "main": "index.js",
5
5
  "description": "Matrix Theme NPM Package",
6
6
  "author": "",
package/src/components/atoms/cards/article-card/template-one/index.js CHANGED
@@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
5
5
  import Link from 'gatsby-core-theme/src/hooks/link';
6
6
  import { imagePrettyUrl, translate } from 'gatsby-core-theme/src/helpers/getters';
7
7
  import LazyImage from 'gatsby-core-theme/src/hooks/lazy-image';
8
+ import GatsbyImg from 'gatsby-core-theme/src/hooks/gatsby-img';
8
9
  import { formatDate } from '~helpers/date-time';
9
10
  import { Context } from '~context/MainProvider';
10
11
  import styles from './article-card.module.scss';
@@ -25,16 +26,13 @@ const ArticleCard = ({
25
26
 
26
27
  return (
27
28
  <div className={styles.article}>
28
- {banner && (
29
- <Link to={path} className={`${styles.image} article-card-gtm`} aria-label={`${title} Link`}>
30
- <LazyImage
31
- width={width}
32
- height={height}
33
- src={imagePrettyUrl(banner, width, height)}
34
- alt={title}
35
- />
36
- </Link>
37
- )}
29
+ <Link to={path} className={`${styles.image} article-card-gtm`} aria-label={`${title} Link`}>
30
+ {banner ? (
31
+ <LazyImage width={width} height={height} src={imagePrettyUrl(banner)} alt={title} />
32
+ ) : (
33
+ <GatsbyImg alt={title} width="100%" height="100%" filename="default-article.jpg" />
34
+ )}
35
+ </Link>
38
36
  <div className={`${styles.cardContent}`}>
39
37
  <Link to={path} className="article-card-gtm">
40
38
  <span className={styles.cardTitle}>{title}</span>
package/src/components/atoms/cards/game-cards/template-five/index.js CHANGED
@@ -31,7 +31,8 @@ const TemplateFive = ({
31
31
  const { relation, title, path, banner } = item;
32
32
  const { translations } = useContext(Context) || {};
33
33
  const featured = !!getSectionExtraField(null, item, 'card_background_image');
34
- const operator = item.extra_fields?.related_operator || relation?.game_provider;
34
+ const operator = item.extra_fields?.operator;
35
+ const provider = relation?.game_provider;
35
36
  const gameImage = (useThumbnail && relation?.thumbnail_filename_object?.filename) || banner;
36
37
  const operatorLogo = operator?.logo_url_object || operator?.logo_filename_object;
37
38
  const operatorText = operator?.one_liners?.main?.one_liner
@@ -87,12 +88,14 @@ const TemplateFive = ({
87
88
  alt={getAltText(operatorLogo, title)}
88
89
  />
89
90
  )}
90
- {operator?.name && operator?.path ? (
91
+ {operator && operator.path ? (
91
92
  <Link to={operator.path} className={styles.cardProvider}>
92
93
  {operatorText}
93
94
  </Link>
94
95
  ) : (
95
- <div className={styles.cardProvider}>{operatorText}</div>
96
+ <Link to={provider?.path} className={styles.cardProvider}>
97
+ <div className={styles.cardProvider}>{provider?.name}</div>
98
+ </Link>
96
99
  )}
97
100
  {affilateLink ? (
98
101
  <>
@@ -155,7 +158,7 @@ TemplateFive.propTypes = {
155
158
  path: PropTypes.string,
156
159
  banner: PropTypes.string,
157
160
  extra_fields: PropTypes.shape({
158
- related_operator: PropTypes.shape({
161
+ operator: PropTypes.shape({
159
162
  status: PropTypes.string,
160
163
  name: PropTypes.string,
161
164
  path: PropTypes.string,
package/src/components/atoms/cards/game-cards/template-five/template-five.stories.js CHANGED
@@ -33,10 +33,8 @@ Default.args = {
33
33
  ...card,
34
34
  banner: '',
35
35
  title: 'Wolf Gold',
36
- relation: {
37
- ...card.relation,
38
- rating: '4.5',
39
- game_provider: {
36
+ extra_fields: {
37
+ operator: {
40
38
  name: 'Wildz',
41
39
  path: 'wildz-casino',
42
40
  one_liners: {
@@ -46,6 +44,14 @@ Default.args = {
46
44
  },
47
45
  },
48
46
  },
47
+ relation: {
48
+ ...card.relation,
49
+ rating: '4.5',
50
+ game_provider: {
51
+ name: 'Wildz',
52
+ path: 'wildz-casino',
53
+ },
54
+ },
49
55
  },
50
56
  translations: {
51
57
  play_now_slots: 'Play Slots LANG',
package/src/components/atoms/cards/game-cards/template-five/template-five.test.js CHANGED
@@ -26,7 +26,7 @@ describe('Game Cards', () => {
26
26
  const card = getSampleOperatorCards().items[0];
27
27
  card.extra_fields = {
28
28
  ...card.extra_fields,
29
- related_operator: {
29
+ operator: {
30
30
  name: 'Test Game Operator',
31
31
  path: 'test-game-operator-path',
32
32
  one_liners: {
package/src/components/atoms/cards/game-cards/template-four/index.js CHANGED
@@ -30,7 +30,8 @@ const TemplateFour = ({
30
30
  const { relation, title, path, banner } = item;
31
31
  const { translations } = useContext(Context) || {};
32
32
  const featured = !!getSectionExtraField(null, item, 'card_background_image');
33
- const operator = item.extra_fields?.related_operator || relation?.game_provider;
33
+ const operator = item.extra_fields?.operator;
34
+ const provider = relation?.game_provider;
34
35
  const gameImage = (useThumbnail && relation?.thumbnail_filename_object?.filename) || banner;
35
36
  const StarRating = useOneStarRating
36
37
  ? loadable(() => import('gatsby-core-theme/src/components/molecules/star-rating/one-star'))
@@ -71,12 +72,14 @@ const TemplateFour = ({
71
72
  <div className={styles.cardInner}>
72
73
  <span>
73
74
  Game Powered by:
74
- {operator?.name && operator?.path ? (
75
+ {operator && operator.path ? (
75
76
  <Link to={operator.path} className={styles.cardProvider}>
76
77
  {operator.name}
77
78
  </Link>
78
79
  ) : (
79
- <div className={styles.cardProvider}>{operator?.name}</div>
80
+ <Link to={provider?.path} className={styles.cardProvider}>
81
+ <div className={styles.cardProvider}>{provider?.name}</div>
82
+ </Link>
80
83
  )}
81
84
  </span>
82
85
  {affilateLink ? (
@@ -136,7 +139,7 @@ TemplateFour.propTypes = {
136
139
  path: PropTypes.string,
137
140
  banner: PropTypes.string,
138
141
  extra_fields: PropTypes.shape({
139
- related_operator: PropTypes.shape({
142
+ operator: PropTypes.shape({
140
143
  status: PropTypes.string,
141
144
  name: PropTypes.string,
142
145
  path: PropTypes.string,
package/src/components/atoms/cards/game-cards/template-four/template-four.test.js CHANGED
@@ -26,7 +26,7 @@ describe('Game Cards', () => {
26
26
  const card = getSampleOperatorCards().items[0];
27
27
  card.extra_fields = {
28
28
  ...card.extra_fields,
29
- related_operator: {
29
+ operator: {
30
30
  name: 'Test Game Operator',
31
31
  path: 'test-game-operator-path',
32
32
  },
package/src/components/atoms/cards/game-cards/template-one/index.js CHANGED
@@ -31,7 +31,8 @@ const TemplateOne = ({
31
31
  const { relation, title, path, banner } = item;
32
32
  const { translations } = useContext(Context) || {};
33
33
  const featured = !!getSectionExtraField(null, item, 'card_background_image');
34
- const operator = item.extra_fields?.related_operator || relation?.game_provider;
34
+ const operator = item.extra_fields?.operator;
35
+ const provider = relation?.game_provider;
35
36
  const gameImage = (useThumbnail && relation?.thumbnail_filename_object?.filename) || banner;
36
37
  const StarRating = useOneStarRating
37
38
  ? loadable(() => import('gatsby-core-theme/src/components/molecules/star-rating/one-star'))
@@ -56,12 +57,14 @@ const TemplateOne = ({
56
57
  <span className={styles.cardTitle}>{title}</span>
57
58
  </Link>
58
59
  <div className={styles.cardInner}>
59
- {operator?.name && operator?.path ? (
60
+ {operator && operator.path ? (
60
61
  <Link to={operator.path} className={styles.cardProvider}>
61
62
  {operator.name}
62
63
  </Link>
63
64
  ) : (
64
- <div className={styles.cardProvider}>{operator?.name}</div>
65
+ <Link to={provider?.path} className={styles.cardProvider}>
66
+ <div className={styles.cardProvider}>{provider?.name}</div>
67
+ </Link>
65
68
  )}
66
69
  <div className={styles.cardRating}>
67
70
  {relation && (
@@ -137,7 +140,7 @@ TemplateOne.propTypes = {
137
140
  path: PropTypes.string,
138
141
  banner: PropTypes.string,
139
142
  extra_fields: PropTypes.shape({
140
- related_operator: PropTypes.shape({
143
+ operator: PropTypes.shape({
141
144
  status: PropTypes.string,
142
145
  name: PropTypes.string,
143
146
  path: PropTypes.string,
package/src/components/atoms/cards/game-cards/template-one/template-one.module.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  max-width: 34.5rem;
5
5
  width: 100%;
6
6
  overflow: hidden;
7
- background: #fff;
7
+ background: var(--cards-background-color, #fff);
8
8
  border-radius: var(--cards-border-radius);
9
9
  border: var(--cards-border);
10
10
  position: relative;
package/src/components/atoms/cards/game-cards/template-one/template-one.test.js CHANGED
@@ -26,7 +26,7 @@ describe('Game Cards', () => {
26
26
  const card = getSampleOperatorCards().items[0];
27
27
  card.extra_fields = {
28
28
  ...card.extra_fields,
29
- related_operator: {
29
+ operator: {
30
30
  name: 'Test Game Operator',
31
31
  path: 'test-game-operator-path',
32
32
  },
package/src/components/atoms/cards/game-cards/template-three/index.js CHANGED
@@ -30,7 +30,8 @@ const TemplateThree = ({
30
30
  const { relation, title, path, banner } = item;
31
31
  const { translations } = useContext(Context) || {};
32
32
  const featured = !!getSectionExtraField(null, item, 'card_background_image');
33
- const operator = item.extra_fields?.related_operator || relation?.game_provider;
33
+ const operator = item.extra_fields?.operator;
34
+ const provider = relation?.game_provider;
34
35
  const gameImage = (useThumbnail && relation?.thumbnail_filename_object?.filename) || banner;
35
36
  const StarRating = useOneStarRating
36
37
  ? loadable(() => import('gatsby-core-theme/src/components/molecules/star-rating/one-star'))
@@ -71,12 +72,14 @@ const TemplateThree = ({
71
72
  <span className={styles.cardTitle}>{title}</span>
72
73
  </Link>
73
74
  <div className={styles.cardInner}>
74
- {operator?.name && operator?.path ? (
75
+ {operator && operator.path ? (
75
76
  <Link to={operator.path} className={styles.cardProvider}>
76
77
  {operator.name}
77
78
  </Link>
78
79
  ) : (
79
- <div className={styles.cardProvider}>{operator?.name}</div>
80
+ <Link to={provider?.path} className={styles.cardProvider}>
81
+ <div className={styles.cardProvider}>{provider?.name}</div>
82
+ </Link>
80
83
  )}
81
84
  {affilateLink ? (
82
85
  <>
@@ -135,7 +138,7 @@ TemplateThree.propTypes = {
135
138
  path: PropTypes.string,
136
139
  banner: PropTypes.string,
137
140
  extra_fields: PropTypes.shape({
138
- related_operator: PropTypes.shape({
141
+ operator: PropTypes.shape({
139
142
  status: PropTypes.string,
140
143
  name: PropTypes.string,
141
144
  path: PropTypes.string,
package/src/components/atoms/cards/game-cards/template-three/template-three.module.scss CHANGED
@@ -3,7 +3,7 @@
3
3
  max-width: 34.5rem;
4
4
  width: 100%;
5
5
  overflow: hidden;
6
- background: #fff;
6
+ background: var(--cards-background-color, #fff);
7
7
  border-radius: var(--cards-border-radius);
8
8
  border: var(--cards-border);
9
9
  position: relative;
package/src/components/atoms/cards/game-cards/template-three/template-three.test.js CHANGED
@@ -26,7 +26,7 @@ describe('Game Cards', () => {
26
26
  const card = getSampleOperatorCards().items[0];
27
27
  card.extra_fields = {
28
28
  ...card.extra_fields,
29
- related_operator: {
29
+ operator: {
30
30
  name: 'Test Game Operator',
31
31
  path: 'test-game-operator-path',
32
32
  },
package/src/components/atoms/cards/game-cards/template-two/index.js CHANGED
@@ -30,7 +30,8 @@ const TemplateTwo = ({
30
30
  const { relation, title, path, banner } = item;
31
31
  const { translations } = useContext(Context) || {};
32
32
  const featured = !!getSectionExtraField(null, item, 'card_background_image');
33
- const operator = item.extra_fields?.related_operator || relation?.game_provider;
33
+ const operator = item.extra_fields?.operator;
34
+ const provider = relation?.game_provider;
34
35
  const gameImage = (useThumbnail && relation?.thumbnail_filename_object?.filename) || banner;
35
36
  const StarRating = useOneStarRating
36
37
  ? loadable(() => import('gatsby-core-theme/src/components/molecules/star-rating/one-star'))
@@ -73,12 +74,14 @@ const TemplateTwo = ({
73
74
  </div>
74
75
  </div>
75
76
  <div className={styles.cardInnerBottom}>
76
- {operator?.name && operator?.path ? (
77
+ {operator && operator.path ? (
77
78
  <Link to={operator.path} className={styles.cardProvider}>
78
79
  {operator.name}
79
80
  </Link>
80
81
  ) : (
81
- <div className={styles.cardProvider}>{operator?.name}</div>
82
+ <Link to={provider?.path} className={styles.cardProvider}>
83
+ <div className={styles.cardProvider}>{provider?.name}</div>
84
+ </Link>
82
85
  )}
83
86
  {affilateLink ? (
84
87
  <>
@@ -137,7 +140,7 @@ TemplateTwo.propTypes = {
137
140
  path: PropTypes.string,
138
141
  banner: PropTypes.string,
139
142
  extra_fields: PropTypes.shape({
140
- related_operator: PropTypes.shape({
143
+ operator: PropTypes.shape({
141
144
  status: PropTypes.string,
142
145
  name: PropTypes.string,
143
146
  path: PropTypes.string,
package/src/components/atoms/cards/game-cards/template-two/template-two.module.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  max-width: 34.5rem;
5
5
  width: 100%;
6
6
  overflow: hidden;
7
- background: #fff;
7
+ background: var(--cards-background-color, #fff);
8
8
  border-radius: var(--cards-border-radius);
9
9
  border: var(--cards-border);
10
10
  position: relative;
package/src/components/atoms/cards/game-cards/template-two/template-two.test.js CHANGED
@@ -26,7 +26,7 @@ describe('Game Cards', () => {
26
26
  const card = getSampleOperatorCards().items[0];
27
27
  card.extra_fields = {
28
28
  ...card.extra_fields,
29
- related_operator: {
29
+ operator: {
30
30
  name: 'Test Game Operator',
31
31
  path: 'test-game-operator-path',
32
32
  },
package/storybook/public/iframe.html CHANGED
@@ -345,4 +345,4 @@
345
345
 
346
346
 
347
347
 
348
- window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"}];</script><script src="runtime~main.62b34c07.iframe.bundle.js"></script><script src="627.44a6c91f.iframe.bundle.js"></script><script src="main.b1705345.iframe.bundle.js"></script></body></html>
348
+ window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"}];</script><script src="runtime~main.62b34c07.iframe.bundle.js"></script><script src="627.44a6c91f.iframe.bundle.js"></script><script src="main.c96ee0d7.iframe.bundle.js"></script></body></html>