Files
SAE-BUT2-frontend/src/pages/Profile/components/ManageMember/ManageMember.tsx
T

42 lines
1.8 KiB
TypeScript

import Button from "../../../../components/ui/Button/Button";
import Modal from "../../../../components/ui/Modal/Modal";
import {useContext, useState} from "react";
import styles from "./ManageMember.module.css"
import DeactivateMemberBtn from "./DeactivateMember/DeactivateMemberBtn.jsx";
import ModifyRole from "./ModifyRole/ModifyRole.jsx";
import { AuthContext, AuthContextType } from "../../../../contexts/Auth/AuthContext.js";
import DeleteMemberBtn from "./DeleteMember/DeleteMemberBtn";
import User from "../../../../interfaces/user.interface";
export default function ManageMember({ userToManage }: { userToManage: User }) {
const { user } = useContext(AuthContext) as AuthContextType;
const [open, setOpen] = useState(false);
return <>
<Button onClick={() => setOpen(true)} variant={"default"} className={styles.manageBtn}>
<img src="/icons/tools.svg" alt="tools icon" className={styles.icon} />
<p>Gérer</p>
</Button>
<Modal open={open} onClose={() => setOpen(false)} title={`Gestion de l'utilisateur ${userToManage.name}`}>
{(user?.id != userToManage.id) ? (
<div className={styles.manageSection}>
<h3>Désactiver le compte</h3>
<DeactivateMemberBtn name={userToManage.name} id={userToManage.id} className={styles.manageBlockContent} />
<h3>Supprimer le compte</h3>
<DeleteMemberBtn name={userToManage.name} id={userToManage.id} className={styles.manageBlockContent} />
</div>
) : null}
<div className={styles.manageSection}>
<h3>Modifier le rôle</h3>
<ModifyRole user={userToManage} />
</div>
</Modal>
</>
}