scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: add keys on mapped components

Browse Source
This commit is contained in:
Christel Westerberg
2024-06-04 13:37:17 +02:00
parent d5b08e3a36
commit d84c27b73c
9 changed files with 55 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/Loyalty/Blocks/DynamicContent/OverviewTable/BenefitCard/index.tsx
View File

@@ -37,7 +37,10 @@ export default function BenefitCard({
</div>
<div className={styles.benefitComparison}>
{comparedValues.map((benefit, idx) => (
<div key={idx} className={styles.comparisonItem}>
<div
key={`${benefit.valueDetails}-${idx}`}
className={styles.comparisonItem}
>
<BenefitValue benefit={benefit} />
</div>
))}

3
components/Loyalty/Blocks/DynamicContent/OverviewTable/BenefitList/index.tsx
View File

@@ -29,8 +29,9 @@ export default function BenefitList({ levels }: BenefitListProps) {
<BenefitCard
title={benefit.name}
description={benefit.description}
comparedValues={levelBenefits.map((benefit) => {
comparedValues={levelBenefits.map((benefit, idx) => {
return {
key: `${benefit.name}-${idx}`,
value: benefit.value,
unlocked: benefit.unlocked,
valueDetails: benefit.valueDetails,

11
components/Loyalty/Blocks/WebView/index.tsx
View File

@@ -14,10 +14,15 @@ export function Blocks({ lang, blocks }: BlocksProps & LangParams) {
const firstItem = idx === 0
switch (block.__typename) {
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksCardsGrid:
return <CardsGrid cards_grid={block.cards_grid} />
return (
<CardsGrid
key={`${block.cards_grid.title}-${idx}`}
cards_grid={block.cards_grid}
/>
)
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksContent:
return (
<section>
<section key={`${block.__typename}-${idx}`}>
<JsonToHtml
nodes={block.content.content.json.children}
embeds={block.content.content.embedded_itemsConnection.edges}
@@ -39,6 +44,7 @@ export function Blocks({ lang, blocks }: BlocksProps & LangParams) {
<DynamicContentBlock
dynamicContent={dynamicContent}
firstItem={firstItem}
key={`${block.dynamic_content.title}-${idx}`}
/>
)
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts:
@@ -49,6 +55,7 @@ export function Blocks({ lang, blocks }: BlocksProps & LangParams) {
return (
<Shortcuts
firstItem={firstItem}
key={`${block.shortcuts.title}-${idx}`}
shortcuts={shortcuts}
title={block.shortcuts.title}
subtitle={block.shortcuts.preamble}

11
components/Loyalty/Blocks/index.tsx
View File

@@ -13,7 +13,7 @@ export function Blocks({ blocks }: BlocksProps) {
switch (block.__typename) {
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksContent:
return (
<section>
<section key={`${block.__typename}-${idx}`}>
<JsonToHtml
nodes={block.content.content.json.children}
embeds={block.content.content.embedded_itemsConnection.edges}
@@ -25,19 +25,26 @@ export function Blocks({ blocks }: BlocksProps) {
<DynamicContentBlock
dynamicContent={block.dynamic_content}
firstItem={firstItem}
key={`${block.dynamic_content.title}-${idx}`}
/>
)
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts:
return (
<Shortcuts
firstItem={firstItem}
key={`${block.shortcuts.title}-${idx}`}
shortcuts={block.shortcuts.shortcuts}
subtitle={block.shortcuts.preamble}
title={block.shortcuts.title}
/>
)
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksCardsGrid:
return <CardsGrid cards_grid={block.cards_grid} />
return (
<CardsGrid
cards_grid={block.cards_grid}
key={`${block.cards_grid.title}-${idx}`}
/>
)
default:
return null
}