Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 | 55x 55x 55x 55x 55x | import { Stack, Box } from "@mui/material";
import { DividerText } from "./components";
import { SubTitle } from "./components";
import { Button } from "@common/Button";
import { MemberData } from "@customTypes/team.member";
import { DELETE_DENY_MESSAGE } from "@constants/permissions";
import NiceModal from "@ebay/nice-modal-react";
import {
GIVE_DELETE_TEAM_MEMBER_MODAL,
MEMBER_MOBILE,
TEAM_MEMBER_PANEL_MODAL,
} from "modals/modal_names";
import { useCustomTheme } from "@theme/hooks/useCustomTheme";
type DeleteMemeberProps = {
rowData: MemberData;
isCurrentUser: boolean;
isDeleteAllowed: boolean;
isDeleteOwnerAllowed: boolean;
};
function DeleteMember({
rowData,
isCurrentUser,
isDeleteAllowed,
isDeleteOwnerAllowed,
}: DeleteMemeberProps) {
const { isMobileView } = useCustomTheme();
const isDisabled =
(rowData.roleName === "owner" && !isDeleteOwnerAllowed) ||
isCurrentUser ||
!isDeleteAllowed;
const teamPanelId = isMobileView ? MEMBER_MOBILE : TEAM_MEMBER_PANEL_MODAL;
const handleDelete = () => {
if (rowData) {
const url = `/accounts/${rowData?.accID}/members/${rowData?.user.accID}`;
NiceModal.show(GIVE_DELETE_TEAM_MEMBER_MODAL, {
variant: "team_member",
itemName:
rowData.user.firstName && rowData.user.lastName
? `${rowData?.user.firstName} ${rowData?.user.lastName}`
: rowData?.user.email,
url: url,
onSuccess: () => NiceModal.hide(teamPanelId),
});
}
};
return (
<>
<Stack
direction="column"
gap={2}
alignItems="stretch"
pb={isMobileView ? 12 : 0}
>
<Box>
<DividerText mb={1}>Remove member</DividerText>
<SubTitle>
Take into consideration that removing a member is a one-way action
</SubTitle>
</Box>
<Button
background="secondary"
size="medium"
sx={{
width: "fit-content",
paddingY: "2px",
fontWeight: 400,
fontSize: "14px",
}}
disabled={isDisabled}
tooltipProps={{
show: !isDeleteAllowed,
message: DELETE_DENY_MESSAGE,
}}
onClick={() => handleDelete()}
data-testid="remove-member-btn"
>
Remove Member
</Button>
</Stack>
</>
);
}
export default DeleteMember;
|