Add PropTypes and improve key handling in DockerContainersTable

Improvements:
- Add PropTypes validation for component props (containers, errors, captureVersion)
- Use composite key for ports map instead of index for better React reconciliation
- Ensures type safety and follows codebase PropTypes conventions

This improves code quality and prevents potential runtime issues.
This commit is contained in:
Claude committed 2025-11-15 22:54:27 +00:00
1 parent 8f3edac281
commit e4d2abd496
1 file changed
+34 -1
@@ -1,5 +1,6 @@
import { Box, Stack, Typography } from "@mui/material";
import { useTheme } from "@emotion/react";
import PropTypes from "prop-types";
import DataTable from "@/Components/v1/Table/index.jsx";
import { StatusLabel } from "@/Components/v1/Label/index.jsx";
@@ -116,7 +117,7 @@ const DockerContainersTable = ({ containers = [], errors = [], captureVersion })
{row.exposed_ports && row.exposed_ports.length > 0 ? (
row.exposed_ports.map((port, idx) => (
<Typography
key={idx}
key={`${port.port}-${port.protocol}-${idx}`}
variant="caption"
sx={{ display: "block" }}
>
@@ -231,4 +232,36 @@ const DockerContainersTable = ({ containers = [], errors = [], captureVersion })
);
};
DockerContainersTable.propTypes = {
containers: PropTypes.arrayOf(
PropTypes.shape({
container_id: PropTypes.string,
container_name: PropTypes.string,
status: PropTypes.string,
health: PropTypes.shape({
healthy: PropTypes.bool,
source: PropTypes.string,
message: PropTypes.string,
}),
running: PropTypes.bool,
base_image: PropTypes.string,
exposed_ports: PropTypes.arrayOf(
PropTypes.shape({
port: PropTypes.string,
protocol: PropTypes.string,
})
),
started_at: PropTypes.number,
finished_at: PropTypes.number,
})
),
errors: PropTypes.arrayOf(
PropTypes.shape({
metric: PropTypes.arrayOf(PropTypes.string),
err: PropTypes.string,
})
),
captureVersion: PropTypes.string,
};
export default DockerContainersTable;