fix list key error

ethereumjs · Oct 16, 2023 · a383e29 · a383e29
1 parent 3539b34
commit a383e29
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 10 deletions.
diff --git a/packages/ui/src/Components/ContentStore.tsx b/packages/ui/src/Components/ContentStore.tsx
@@ -241,7 +241,7 @@ export default function ContentStore(props: any) {
                   })
                   .map(([key, value]) => {
                     return (
-                      <TableRow>
+                      <TableRow key={key}>
                         <TableCell width={'33%'} sx={{ overflow: 'scroll' }}>
                           <Tooltip title={key}>
                             <ListItemButton onClick={() => setDisplayKey(key)}>
@@ -291,6 +291,7 @@ export default function ContentStore(props: any) {
                       const data = val ? Object.entries(val)[i] : undefined
                       return (
                         <TableCell
+                        key={idx}
                           onClick={() => {
                             console.log('copy', data && data[1])
                           }}

diff --git a/packages/ui/src/Components/MessageLogs.tsx b/packages/ui/src/Components/MessageLogs.tsx
@@ -212,7 +212,7 @@ export default function MessageLogs() {
               {Object.entries(state.RECEIVED_LOGS).map(([peer, logs]: any) => {
                 const sentLogs = (state.SENT_LOGS as any)[peer] ?? {}
                 return (
-                  <>
+                  <div key={peer}>
                     <TableRow>
                       <TableCell
                       onMouseEnter={() => setHover(peer)}
@@ -289,7 +289,7 @@ export default function MessageLogs() {
                         {logs['UTP'] ? logs['UTP'].length : 0}
                       </TableCell>
                     </TableRow>
-                  </>
+                  </div>
                 )
               })}
             </TableBody>

diff --git a/packages/ui/src/Components/PeerMessageLogs.tsx b/packages/ui/src/Components/PeerMessageLogs.tsx
@@ -65,7 +65,7 @@ export default function PeerMessageLogs(props: { selected: string }) {
             <TableBody>
               {messageTypes.map((msgType, idx) => {
                 return (
-                  <TableRow>
+                  <TableRow key={idx}>
                     <TableCell align="center">
                       <Button onClick={() => setValue(idx + 1)}>{msgType}</Button>
                     </TableCell>
@@ -87,7 +87,7 @@ export default function PeerMessageLogs(props: { selected: string }) {
         </TableContainer>
         {messageTypes.map((msgType, idx) => {
           return (
-            <TabPanel value={value} index={idx + 1}>
+            <TabPanel key={idx + 1} value={value} index={idx + 1}>
               <Paper>
                 <ListItemText sx={{ textAlign: 'center' }} primary={msgType} />
               </Paper>
@@ -106,11 +106,11 @@ export default function PeerMessageLogs(props: { selected: string }) {
                         sentLogs[msgType].length ?? 0,
                         sentLogs[msgType].length ?? 0,
                       ),
-                    }).map((_, idx) => {
+                    }).map((_, _idx) => {
                       return (
-                        <TableRow key={idx}>
-                          <TableCell>{sentLogs[msgType][idx] ?? ''}</TableCell>
-                          <TableCell>{receivedLogs[msgType][idx] ?? ''}</TableCell>
+                        <TableRow key={[idx, _idx].toString()}>
+                          <TableCell>{sentLogs[msgType][_idx] ?? ''}</TableCell>
+                          <TableCell>{receivedLogs[msgType][_idx] ?? ''}</TableCell>
                         </TableRow>
                       )
                     })}

diff --git a/packages/ui/src/Components/RPCParams.tsx b/packages/ui/src/Components/RPCParams.tsx
@@ -104,7 +104,7 @@ export default function RPCParams(props: { method: RPCMethod }) {
                 val = `<set ${key}>`
               }
               return (
-                <TableRow>
+                <TableRow key={key}>
                   <TableCell>{key}</TableCell>
                   <TableCell>{val}</TableCell>
                 </TableRow>