Pass list children as props in detail element

NYPL · Dec 11, 2024 · 5ba879f · 5ba879f
1 parent 52a1e65
commit 5ba879f
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 12 deletions.
diff --git a/src/components/BibPage/BibDetail.tsx b/src/components/BibPage/BibDetail.tsx
@@ -14,6 +14,7 @@ import type {
 } from "../../types/bibDetailsTypes"
 import { rtlOrLtr, isItTheLastElement } from "../../utils/bibUtils"
 import type { ReactNode } from "react"
+import { child } from "winston"
 
 interface BibDetailsProps {
   details: AnyBibDetail[]
@@ -60,9 +61,14 @@ const DetailElement = (label: string, listChildren: ReactNode[]) => {
     <>
       <dt>{label}</dt>
       <dd>
-        <List noStyling data-testid={kebabCase(label)} type="ol">
-          {listChildren}
-        </List>
+        <List
+          noStyling
+          data-testid={kebabCase(label)}
+          type="ol"
+          listItems={listChildren.map((listElement) => (
+            <>{listElement}</>
+          ))}
+        />
       </dd>
     </>
   )

diff --git a/src/components/HoldPages/HoldConfirmationItemDetails.tsx b/src/components/HoldPages/HoldConfirmationItemDetails.tsx
@@ -26,19 +26,15 @@ const HoldConfirmationItemDetails = ({
       mb="l"
       mt={0}
     >
-      {pickupLocationLabel ? (
+      {pickupLocationLabel && (
         <PlainTextElement
           label="Pickup location"
           value={[pickupLocationLabel]}
         />
-      ) : (
-        <></>
       )}
       <PlainTextElement label="Call number" value={[item.callNumber]} />
-      {item.barcode ? (
+      {item.barcode && (
         <PlainTextElement label="Barcode" value={[item.barcode]} />
-      ) : (
-        <></>
       )}
     </List>
   )

diff --git a/src/components/HoldPages/HoldRequestItemDetails.tsx b/src/components/HoldPages/HoldRequestItemDetails.tsx
@@ -29,10 +29,8 @@ const HoldRequestItemDetails = ({ item }: HoldRequestItemDetailsProps) => {
         link="internal"
       />
       <PlainTextElement label="Call number" value={[item.callNumber]} />
-      {item.volume ? (
+      {item.volume && (
         <PlainTextElement label="Volume/date" value={[item.volume]} />
-      ) : (
-        <></>
       )}
     </List>
   )