Define an array of maintenance item and Map maintenance items array to ListItem components with icons

Client/src/Pages/Incidents/index.jsx

@@ -1,15 +1,49 @@
 import React from "react";
-import { Card, CardContent, Box, Typography, Button } from "@mui/material";
+import "./index.css";
+import {
+  Card,
+  CardContent,
+  Box,
+  Typography,
+  Button,
+  List,
+  ListItem,
+  ListItemIcon,
+  ListItemText,
+} from "@mui/material";
+import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
 
 const Incidents = () => {
+  const maintenanceItems = [
+    "Mark your maintenance periods",
+    "Eliminate any misunderstandings",
+    "Stop sending alerts in maintenance windows",
+  ];
+
   return (
     <Card>
       <CardContent>
         <Box />
         <Typography>Create a maintenance window to</Typography>
+        <List>
+          {maintenanceItems.map((item, index) => {
+            <ListItem key={index}>
+              <ListItemIcon>
+                <CheckCircleOutlineIcon color="primary" />
+              </ListItemIcon>
+              <ListItemText primary={item} />
+            </ListItem>;
+          })}
+        </List>
       </CardContent>
       <Box>
-        <Button>Let&apos;s create your maintenance window</Button>
+        <Button
+          variant="contained"
+          color="primary"
+          sx={{ textTransform: "none" }}
+        >
+          Let&apos;s create your maintenance window
+        </Button>
       </Box>
     </Card>
   );