64 lines
2.3 KiB
React
64 lines
2.3 KiB
React
import React, { useContext } from "react";
|
|
import styles from "./ProfilePage.module.css";
|
|
import { AuthContext } from "../../contexts/auth/AuthContext.js";
|
|
import formatDate from "../../utils/date/formatDate.js";
|
|
import Task from "../../components/Task/Task";
|
|
import Button from "../../components/ui/button/button.jsx";
|
|
import { useNavigate } from "react-router";
|
|
import ThemeSwitcher from "../../components/ui/themeSwitcher/ThemeSwitcher.jsx";
|
|
|
|
function ProfilePage() {
|
|
|
|
const { user, logout } = useContext(AuthContext);
|
|
const navigate = useNavigate();
|
|
|
|
const handleLogout = () => {
|
|
logout();
|
|
}
|
|
|
|
return (
|
|
<div className={styles.container}>
|
|
<div className={`${styles.profileboard} glassCard`}>
|
|
<div className={styles.contentWrapper}>
|
|
<div className={styles.profilePictureContainer}>
|
|
<img
|
|
src="/react.svg"
|
|
alt="Photo de profil"
|
|
className={styles.profilePicture}
|
|
/>
|
|
</div>
|
|
<div className={styles.description}>
|
|
<div className={styles.headerProfile}>
|
|
<h2> {user.name} {user.lastname} </h2>
|
|
<div className={styles.settingsBtns}>
|
|
<ThemeSwitcher />
|
|
<Button variant={"danger"} onClick={handleLogout}> Déconnexion </Button>
|
|
</div>
|
|
</div>
|
|
<div className={styles.topDescription}>
|
|
<div className={styles.infoBlock}>
|
|
<p><strong>Role :</strong> {user.role}</p>
|
|
<p><strong>Membre depuis :</strong> {formatDate(user.created_at)}</p>
|
|
</div>
|
|
<div className={styles.infoBlock}>
|
|
<p><strong>Mail :</strong> {user.email} </p>
|
|
<p><strong>Téléphone :</strong> {user.phone}</p>
|
|
</div>
|
|
<Button variant={"transparent"} onClick={() => navigate("/profile/update")}>
|
|
<img src={"/icons/pen.svg"} alt={"Modify btn"} className={styles.modifyIcon}/>
|
|
</Button>
|
|
</div>
|
|
|
|
<h2>Vos Événements :</h2>
|
|
{user.tasks && user.tasks.map((task, index) => (
|
|
<Task key={index} task={task} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ProfilePage;
|