Add a button to remove surveyors from individual assignments

codeforboston · Oct 29, 2024 · f8fe475 · f8fe475
1 parent 755cdaf
commit f8fe475
Showing 1 changed file with 13 additions and 10 deletions.
diff --git a/frontend/front/src/pages/Admin/assignment/AssignTable.js b/frontend/front/src/pages/Admin/assignment/AssignTable.js
@@ -1,4 +1,4 @@
-import { Box, Button, MenuItem, Stack } from "@mui/material";
+import { Box, Button, Chip, MenuItem, Stack } from "@mui/material";
 import React, { useMemo, useState } from "react";
 import {
   useAddAssignmentsToSurveyorMutation,
@@ -135,21 +135,24 @@ const AssignTable = () => {
             maxWidth="100%"
             justifyContent="flex-start"
             overflow="scroll"
-            sx={{ overflowY: "auto", overflowX: "auto" }}
+            sx={{ overflowY: "auto", overflowX: "auto", pl: 2 }}
             flexWrap="wrap"
           >
             {params.row.surveyorData.map((surveyor) => {
               return (
-                <Button
+                <Chip
                   key={`surveyor-${surveyor.id}`}
+                  label={`${surveyor.firstname} ${surveyor.lastname}`}
+                  color="primary"
+                  variant="outlined"
                   onClick={() => handleUserLink(surveyor)}
-                  sx={{
-                    textAlign: "left",
-                    minWidth: "max-content",
-                  }}
-                >
-                  {`${surveyor.firstname} ${surveyor.lastname}`}
-                </Button>
+                  onDelete={() =>
+                    removeAssignmentsFromSurveyor({
+                      surveyorId: surveyor.id,
+                      assignmentIds: [params.row.id],
+                    })
+                  }
+                />
               );
             })}
           </Stack>