diff --git a/frontend/src/design/components/DeleteObjectWithFrictionModal.js b/frontend/src/design/components/DeleteObjectWithFrictionModal.js index b7a610bdf..06f3c1449 100644 --- a/frontend/src/design/components/DeleteObjectWithFrictionModal.js +++ b/frontend/src/design/components/DeleteObjectWithFrictionModal.js @@ -29,6 +29,7 @@ export const DeleteObjectWithFrictionModal = (props) => { const handleChange = (event) => { setConfirmValue(event.target.value); }; + return ( diff --git a/frontend/src/modules/Environments/components/EnvironmentTeams.js b/frontend/src/modules/Environments/components/EnvironmentTeams.js index 52b2a3775..228fcbaea 100644 --- a/frontend/src/modules/Environments/components/EnvironmentTeams.js +++ b/frontend/src/modules/Environments/components/EnvironmentTeams.js @@ -34,6 +34,7 @@ import { HiUserRemove } from 'react-icons/hi'; import { VscChecklist } from 'react-icons/vsc'; import { Defaults, + DeleteObjectWithFrictionModal, Label, Pager, RefreshTableMenu, @@ -65,6 +66,16 @@ function TeamRow({ team, environment, fetchItems }) { const [accessingConsole, setAccessingConsole] = useState(false); const [loadingCreds, setLoadingCreds] = useState(false); const [isTeamEditModalOpen, setIsTeamEditModalOpen] = useState(false); + const [isDeleteTeamModalOpen, setIsDeleteTeamModalOpen] = useState(false); + + const handleDeleteTeamModalOpen = () => { + setIsDeleteTeamModalOpen(true); + }; + + const handleDeleteTeamModalClose = () => { + setIsDeleteTeamModalOpen(false); + }; + const handleTeamEditModalClose = () => { setIsTeamEditModalOpen(false); }; @@ -215,7 +226,7 @@ function TeamRow({ team, environment, fetchItems }) { )} {team.groupUri !== environment.SamlGroupName && ( - removeGroup(team.groupUri)}> + handleDeleteTeamModalOpen()}> )} + removeGroup(team.groupUri)} + /> ); @@ -252,6 +271,14 @@ export const EnvironmentTeams = ({ environment }) => { const [inputValueRoles, setInputValueRoles] = useState(''); const [isTeamInviteModalOpen, setIsTeamInviteModalOpen] = useState(false); const [isAddRoleModalOpen, setIsAddRoleModalOpen] = useState(false); + const [isDeleteRoleModalOpenId, setIsDeleteRoleModalOpen] = useState(0); + const handleDeleteRoleModalOpen = (id) => { + setIsDeleteRoleModalOpen(id); + }; + const handleDeleteRoleModalClosed = (id) => { + setIsDeleteRoleModalOpen(0); + }; + const handleTeamInviteModalOpen = () => { setIsTeamInviteModalOpen(true); }; @@ -424,10 +451,6 @@ export const EnvironmentTeams = ({ environment }) => { setRowModesModel({ ...rowModesModel, [id]: { mode: GridRowModes.View } }); }; - const handleDeleteClick = (id) => () => { - removeConsumptionRole(id); - }; - const handleCancelClick = (id) => () => { setRowModesModel({ ...rowModesModel, @@ -711,7 +734,8 @@ export const EnvironmentTeams = ({ environment }) => { flex: 0.5, type: 'actions', cellClassName: 'actions', - getActions: ({ id }) => { + getActions: ({ id, ...props }) => { + const name = props.row.consumptionRoleName; const isInEditMode = rowModesModel[id]?.mode === GridRowModes.Edit; @@ -745,8 +769,16 @@ export const EnvironmentTeams = ({ environment }) => { } label="Delete" - onClick={handleDeleteClick(id)} + onClick={() => handleDeleteRoleModalOpen(id)} color="inherit" + />, + handleDeleteRoleModalClosed(id)} + onClose={() => handleDeleteRoleModalClosed(id)} + open={isDeleteRoleModalOpenId === id} + isAWSResource={false} + deleteFunction={() => removeConsumptionRole(id)} /> ]; } diff --git a/frontend/src/modules/Organizations/components/OrganizationTeams.js b/frontend/src/modules/Organizations/components/OrganizationTeams.js index f4288c02f..2b7887ba8 100644 --- a/frontend/src/modules/Organizations/components/OrganizationTeams.js +++ b/frontend/src/modules/Organizations/components/OrganizationTeams.js @@ -26,6 +26,7 @@ import { HiUserRemove } from 'react-icons/hi'; import { VscChecklist } from 'react-icons/vsc'; import { Defaults, + DeleteObjectWithFrictionModal, Label, Pager, RefreshTableMenu, @@ -49,6 +50,16 @@ function TeamRow({ team, organization, fetchItems }) { const theme = useTheme(); const { enqueueSnackbar } = useSnackbar(); const [isPermissionModalOpen, setIsPermissionsModalOpen] = useState(false); + const [isDeleteGroupModalOpen, setIsDeleteGroupModalOpenId] = useState(false); + + const handleDeleteGroupModalClosed = () => { + setIsDeleteGroupModalOpenId(false); + }; + + const handleDeleteGroupModalOpen = () => { + setIsDeleteGroupModalOpenId(true); + }; + const handlePermissionsModalClose = () => { setIsPermissionsModalOpen(false); }; @@ -125,7 +136,7 @@ function TeamRow({ team, organization, fetchItems }) { {team.groupUri !== organization.SamlGroupName && ( - removeGroup(team.groupUri)}> + handleDeleteGroupModalOpen()}> )} + {team.groupUri !== organization.SamlGroupName && ( + handleDeleteGroupModalClosed()} + onClose={() => handleDeleteGroupModalClosed()} + open={isDeleteGroupModalOpen} + isAWSResource={false} + deleteFunction={() => removeGroup(team.groupUri)} + /> + )}