upload ai slop

frontend/src/components/package/PackagePatchesList.tsx

@@ -0,0 +1,34 @@
+import type React from "react";
+import { Box, Typography, Chip, IconButton } from "@mui/material";
+import DeleteIcon from "@mui/icons-material/Delete";
+import type { Patch } from "api/types/Patch";
+
+interface PackagePatchesListProps {
+    patches: Patch[];
+    editable: boolean;
+    onDelete: (key: string) => void;
+}
+
+export default function PackagePatchesList({ patches, editable, onDelete }: PackagePatchesListProps): React.JSX.Element | null {
+    if (patches.length === 0) {
+        return null;
+    }
+
+    return (
+        <Box sx={{ mt: 2 }}>
+            <Typography variant="subtitle2" gutterBottom>Environment variables</Typography>
+            {patches.map((patch) => (
+                <Box key={patch.key} sx={{ display: "flex", alignItems: "center", gap: 1, mb: 0.5 }}>
+                    <Chip label={patch.key} size="small" />
+                    <Typography variant="body2">=</Typography>
+                    <Typography variant="body2" sx={{ fontFamily: "monospace" }}>{JSON.stringify(patch.value)}</Typography>
+                    {editable && (
+                        <IconButton size="small" color="error" onClick={() => onDelete(patch.key)}>
+                            <DeleteIcon fontSize="small" />
+                        </IconButton>
+                    )}
+                </Box>
+            ))}
+        </Box>
+    );
+}