fix(tooltiptable): fix non-unique react keys (#365)

* fix(tooltiptable): fix non-unique react keys * refactor(tooltiptable): refactor code
chanzuckerberg · Feb 23, 2023 · f504156 · f504156
1 parent ac94655
commit f504156
Showing 1 changed file with 7 additions and 4 deletions.
diff --git a/src/core/TooltipTable/index.tsx b/src/core/TooltipTable/index.tsx
@@ -22,15 +22,18 @@ const TooltipTableContent = (props: TooltipTableContentProps): JSX.Element => {
   return (
     <TableContainer {...rest}>
       {contentAlert && <Alert>{contentAlert}</Alert>}
-      {data?.map((section) => (
-        <Section disabled={section.disabled} key={`${section.label}`}>
+      {data?.map((section, index) => (
+        <Section
+          disabled={section.disabled}
+          key={`${section.label + String(index)}`}
+        >
           <SectionLabel disabled={section.disabled} label={section.label}>
             {section.label}
           </SectionLabel>
           <Table size="small">
             <TableBody>
-              {section.dataRows.map((row) => (
-                <TableRow key={row.label}>
+              {section.dataRows.map((row, rowIndex) => (
+                <TableRow key={row.label + String(rowIndex)}>
                   <RowLabel disabled={section.disabled} align="left">
                     {row.label}
                   </RowLabel>