add keys to badges

src/frontend/src/components/details/DetailsBadge.tsx

@@ -5,7 +5,6 @@ export type DetailsBadgeProps = {
   label: string;
   size?: string;
   visible?: boolean;
-  key?: any;
 };
 
 export default function DetailsBadge(props: DetailsBadgeProps) {
@@ -14,12 +13,7 @@ export default function DetailsBadge(props: DetailsBadgeProps) {
   }
 
   return (
-    <Badge
+    <Badge color={props.color} variant="filled" size={props.size ?? 'lg'}>
-      key={props.key}
-      color={props.color}
-      variant="filled"
-      size={props.size ?? 'lg'}
-    >
       {props.label}
     </Badge>
   );

src/frontend/src/pages/part/PartDetail.tsx

@@ -643,21 +643,25 @@ export default function PartDetail() {
         label={t`In Stock` + `: ${part.in_stock}`}
         color={part.in_stock >= part.minimum_stock ? 'green' : 'orange'}
         visible={part.in_stock > 0}
+        key="in_stock"
       />,
       <DetailsBadge
         label={t`No Stock`}
         color="red"
         visible={part.in_stock == 0}
+        key="no_stock"
       />,
       <DetailsBadge
         label={t`On Order` + `: ${part.ordering}`}
         color="blue"
         visible={part.on_order > 0}
+        key="on_order"
       />,
       <DetailsBadge
         label={t`In Production` + `: ${part.building}`}
         color="blue"
         visible={part.building > 0}
+        key="in_production"
       />
     ];
   }, [part, instanceQuery]);

src/frontend/src/pages/stock/StockDetail.tsx

@@ -440,21 +440,25 @@ export default function StockDetail() {
             color="blue"
             label={t`Serial Number` + `: ${stockitem.serial}`}
             visible={!!stockitem.serial}
+            key="serial"
           />,
           <DetailsBadge
             color="blue"
             label={t`Quantity` + `: ${stockitem.quantity}`}
             visible={!stockitem.serial}
+            key="quantity"
           />,
           <DetailsBadge
             color="blue"
             label={t`Batch Code` + `: ${stockitem.batch}`}
             visible={!!stockitem.batch}
+            key="batch"
           />,
           <StatusRenderer
             status={stockitem.status}
             type={ModelType.stockitem}
             options={{ size: 'lg' }}
+            key="status"
           />
         ];
   }, [stockitem, instanceQuery]);