fix: add keys on mapped components

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

View File

@@ -47,7 +47,7 @@ function DynamicComponent({ component, props }: AccountPageContentProps) {
}
export default function Content({ lang, content }: ContentProps) {
return content.map((item) => {
return content.map((item, idx) => {
switch (item.__typename) {
case ContentEntries.AccountPageContentDynamicContent:
const link = item.dynamic_content.link.linkConnection.edges.length
@@ -71,6 +71,7 @@ export default function Content({ lang, content }: ContentProps) {
}
return (
<DynamicComponent
key={`${item.dynamic_content.title}-${idx}`}
component={item.dynamic_content.component}
props={componentProps}
/>
@@ -78,6 +79,7 @@ export default function Content({ lang, content }: ContentProps) {
case ContentEntries.AccountPageContentShortcuts:
return (
<Shortcuts
key={`${item.shortcuts.title}-${idx}`}
shortcuts={item.shortcuts.shortcuts}
subtitle={item.shortcuts.preamble}
title={item.shortcuts.title}
@@ -85,7 +87,7 @@ export default function Content({ lang, content }: ContentProps) {
)
case ContentEntries.AccountPageContentTextContent:
return (
<section>
<section key={`${item.__typename}-${idx}`}>
<JsonToHtml
embeds={item.text_content.content.embedded_itemsConnection.edges}
nodes={item.text_content.content.json.children}

View File

@@ -48,7 +48,7 @@ function DynamicComponent({ component, props }: AccountPageContentProps) {
export default function Content({ lang, content }: ContentProps) {
return (
<>
{content.map((item) => {
{content.map((item, idx) => {
switch (item.__typename) {
case ContentEntries.AccountPageContentDynamicContent:
const link = item.dynamic_content.link.linkConnection.edges.length
@@ -70,6 +70,7 @@ export default function Content({ lang, content }: ContentProps) {
}
return (
<DynamicComponent
key={`${item.dynamic_content.title}-${idx}`}
component={item.dynamic_content.component}
props={componentProps}
/>
@@ -83,6 +84,7 @@ export default function Content({ lang, content }: ContentProps) {
})
return (
<Shortcuts
key={`${item.shortcuts.title}-${idx}`}
shortcuts={shortcuts}
subtitle={item.shortcuts.preamble}
title={item.shortcuts.title}
@@ -90,7 +92,7 @@ export default function Content({ lang, content }: ContentProps) {
)
case ContentEntries.AccountPageContentTextContent:
return (
<section>
<section key={`${item.__typename}-${idx}`}>
<JsonToHtml
embeds={
item.text_content.content.embedded_itemsConnection.edges