fix(List): add identifier, use label.text as key

digitalservicebund · Mar 4, 2024 · 9b6e0b7 · 9b6e0b7
1 parent 880d054
commit 9b6e0b7
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/app/components/List.tsx b/app/components/List.tsx
@@ -13,12 +13,17 @@ type ListProps = z.infer<typeof ListPropsSchema>;
 
 const List = ({ identifier, items, heading, isNumeric }: ListProps) => {
   return (
-    <div className="ds-stack-8 scroll-my-40">
+    <div className="ds-stack-8 scroll-my-40" id={identifier}>
       {heading && <Heading {...heading} />}
       <ol className="list-none ds-stack-32 ps-0">
         {items.map((item, index) => (
           <li
-            key={item.identifier ?? item.headline?.text ?? item.content}
+            key={
+              item.identifier ??
+              item.label?.text ??
+              item.headline?.text ??
+              item.content
+            }
             className="first:pt-0 scroll-my-40"
           >
             <ListItem {...item} numeric={isNumeric ? index + 1 : undefined} />

diff --git a/tests/unit/components/__snapshots__/storybook.test.ts.snap b/tests/unit/components/__snapshots__/storybook.test.ts.snap
@@ -664,6 +664,7 @@ exports[`Storyshots Page/List Example 1`] = `
   >
     <div
       className="ds-stack-8 scroll-my-40"
+      id="default-list-id"
     >
       <h2
         className="ds-heading-02-reg"
-Original file line number
+Diff line change
@@ Expand Up / @@ -664,6 +664,7 @@ exports[`Storyshots Page/List Example 1`] = ` @@
       >
         <div
           className="ds-stack-8 scroll-my-40"
+          id="default-list-id"
         >
           <h2
             className="ds-heading-02-reg"
@@ Expand Down @@