refactor(storybook): small change in unordered list story

eea · Mar 8, 2022 · 6ce16e9 · 6ce16e9
1 parent 7d02014
commit 6ce16e9
Showing 1 changed file with 18 additions and 25 deletions.
diff --git a/src/ui/List/UnorderedList.stories.js b/src/ui/List/UnorderedList.stories.js
@@ -14,7 +14,7 @@ export default {
       },
     },
     divided: {
-      description: 'a list can show divisions between conten',
+      description: 'a list can show divisions between content',
       table: {
         type: { summary: 'boolean' },
         defaultValue: { summary: false },
@@ -45,18 +45,20 @@ function UnorderedList(animated, divided, horizontal, items) {
       divided={divided}
       horizontal={horizontal}
     >
-      {items.map((item, index) => (
-        <List.Item key={index}>
-          {item.content}
-          <List.List role="list">
-            {item.subList.map((sub, subIndex) => (
-              <List.Item key={subIndex} as="a" role="listitem">
-                {sub.content}
-              </List.Item>
-            ))}
-          </List.List>
-        </List.Item>
-      ))}
+      {items &&
+        items.map((item, index) => (
+          <List.Item key={index}>
+            {item.content}
+            <List.List role="list">
+              {item.subList &&
+                item.subList.map((sub, subIndex) => (
+                  <List.Item key={subIndex} as="a" role="listitem">
+                    {sub.content}
+                  </List.Item>
+                ))}
+            </List.List>
+          </List.Item>
+        ))}
     </List>
   );
 }
@@ -78,26 +80,17 @@ Default.args = {
     {
       header: 'header 1',
       content: 'Content 1',
-      subList: [
-        { header: 'Sub header 1', content: 'content' },
-        { header: 'Sub header ', content: 'content' },
-      ],
+      subList: [],
     },
     {
       header: 'header 2',
       content: 'Content 2',
-      subList: [
-        { header: 'Sub header 1', content: 'content' },
-        { header: 'Sub header ', content: 'content' },
-      ],
+      subList: [],
     },
     {
       header: 'header 3',
       content: 'Content 3',
-      subList: [
-        { header: 'Sub header 1', content: 'content' },
-        { header: 'Sub header ', content: 'content' },
-      ],
+      subList: [],
     },
     {
       header: 'header 4',