From 4e33165d9b487585b6e841f0aad9544f7f9d8d40 Mon Sep 17 00:00:00 2001 From: Eddi3_As Date: Tue, 18 Mar 2025 19:31:44 -0400 Subject: [PATCH] Fix - Users ajout admintable --- client/src/Types/LabelMap.tsx | 12 ++++- .../src/components/AdminTable/AdminTable.tsx | 16 +++--- client/src/pages/Admin/Stats.tsx | 10 ++-- client/src/pages/Admin/Users.tsx | 53 ++++++++----------- client/src/services/ApiService.tsx | 4 +- 5 files changed, 48 insertions(+), 47 deletions(-) diff --git a/client/src/Types/LabelMap.tsx b/client/src/Types/LabelMap.tsx index 7ceeab3..3678291 100644 --- a/client/src/Types/LabelMap.tsx +++ b/client/src/Types/LabelMap.tsx @@ -1,2 +1,12 @@ -export type LabelMap = { [key: string]: string }; \ No newline at end of file +export type LabelMap = { [key: string]: string }; + +export interface AdminTableType { + _id: string; + email: string; + title: string; + created_at: Date; + updated_at: Date; + name: string; + roles: string[]; +} \ No newline at end of file diff --git a/client/src/components/AdminTable/AdminTable.tsx b/client/src/components/AdminTable/AdminTable.tsx index b56abd7..dba90a8 100644 --- a/client/src/components/AdminTable/AdminTable.tsx +++ b/client/src/components/AdminTable/AdminTable.tsx @@ -22,12 +22,12 @@ import { import DeleteIcon from "@mui/icons-material/Delete"; import SearchIcon from "@mui/icons-material/Search"; import { QuizTypeShort } from "../../Types/QuizType"; -import { LabelMap } from "../../Types/LabelMap"; +import { LabelMap, AdminTableType } from "../../Types/LabelMap"; interface AdminTableProps { - data: QuizTypeShort[]; - onDelete: (row: QuizTypeShort) => void; + data: AdminTableType[]; + onDelete: (row: AdminTableType) => void; filterKeys?: string[]; labelMap?: LabelMap; } @@ -42,7 +42,7 @@ const AdminTable: React.FC = ({ const [rowsPerPage, setRowsPerPage] = useState(10); const [searchQuery, setSearchQuery] = useState(""); const [openDialog, setOpenDialog] = useState(false); - const [deleteRow, setDeleteRow] = useState(null); + const [deleteRow, setDeleteRow] = useState(null); const handleChangePage = (_event: unknown, newPage: number) => { setPage(newPage); @@ -58,7 +58,7 @@ const AdminTable: React.FC = ({ setPage(0); }; - const handleOpenDialog = (row: QuizTypeShort) => { + const handleOpenDialog = (row: AdminTableType) => { setDeleteRow(row); setOpenDialog(true); }; @@ -116,12 +116,12 @@ const AdminTable: React.FC = ({ .map((row, index) => ( {headers.map((key) => { - const value = row[key as keyof QuizTypeShort]; + const value = row[key as keyof AdminTableType]; let displayValue; if (value instanceof Date) { - displayValue = value.toLocaleDateString("en-GB"); + displayValue = value.toLocaleDateString(); } else if (value && typeof value === "string" && !isNaN(Date.parse(value))) { - displayValue = new Date(value).toLocaleDateString("en-GB"); + displayValue = new Date(value).toLocaleDateString(); } else { displayValue = value; } diff --git a/client/src/pages/Admin/Stats.tsx b/client/src/pages/Admin/Stats.tsx index 290b7f9..5d61033 100644 --- a/client/src/pages/Admin/Stats.tsx +++ b/client/src/pages/Admin/Stats.tsx @@ -2,13 +2,13 @@ import React, { useState, useEffect } from "react"; import { Paper, Grid, Typography, CircularProgress, Box, TextField, Accordion, AccordionSummary, AccordionDetails} from "@mui/material"; import ApiService from '../../services/ApiService'; import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; -import { QuizTypeShort } from "../../Types/QuizType"; +import { AdminTableType } from "../../Types/LabelMap/AdminTableType"; import AdminTable from "../../components/AdminTable/AdminTable"; const Users: React.FC = () => { - const [quizzes, setQuizzes] = useState([]); - const [filteredQuizzes, setFilteredQuizzes] = useState([]); + const [quizzes, setQuizzes] = useState([]); + const [filteredQuizzes, setFilteredQuizzes] = useState([]); const [monthlyQuizzes, setMonthlyQuizzes] = useState(0); const [totalUsers, setTotalUsers] = useState(0); const [loading, setLoading] = useState(true); @@ -26,7 +26,7 @@ const Users: React.FC = () => { const currentMonth = new Date().getMonth(); const currentYear = new Date().getFullYear(); - const filteredMonthlyQuizzes = data.quizzes.filter((quiz: QuizTypeShort) => { + const filteredMonthlyQuizzes = data.quizzes.filter((quiz: AdminTableType) => { const quizDate = new Date(quiz.created_at); return quizDate.getMonth() === currentMonth && quizDate.getFullYear() === currentYear; }); @@ -50,7 +50,7 @@ const Users: React.FC = () => { setFilteredQuizzes(filtered); }, [emailFilter, dateFilter, quizzes]); - const handleQuizDelete = (rowToDelete: QuizTypeShort) => { + const handleQuizDelete = (rowToDelete: AdminTableType) => { setQuizzes((prevData) => prevData.filter((row) => row._id !== rowToDelete._id)); }; diff --git a/client/src/pages/Admin/Users.tsx b/client/src/pages/Admin/Users.tsx index 059f4c0..eeac721 100644 --- a/client/src/pages/Admin/Users.tsx +++ b/client/src/pages/Admin/Users.tsx @@ -2,15 +2,17 @@ import React, { useState, useEffect } from "react"; import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Paper, IconButton } from "@mui/material"; import DeleteIcon from "@mui/icons-material/Delete"; import ApiService from '../../services/ApiService'; -import { UserType } from "../../Types/UserType"; +import { LabelMap, AdminTableType } from "../../Types/LabelMap"; +import AdminTable from "../../components/AdminTable/AdminTable"; const Users: React.FC = () => { - const [users, setUsers] = useState([]); + const [users, setUsers] = useState([]); useEffect(() => { const fetchUsers = async () => { try { const data = await ApiService.getUsers(); + console.log(data); setUsers(data); } catch (error) { console.error("Error fetching users:", error); @@ -19,38 +21,27 @@ const Users: React.FC = () => { fetchUsers(); }, []); - const handleDelete = (email: string) => { - setUsers(users.filter(user => user.email !== email)); + const handleDelete = (data: AdminTableType) => { + setUsers(users.filter(user => user.email !== data.email)); + }; + + + const labelMap = { + _id: "ID", + name: "Enseignant", + email: "Courriel", + created_at: "Création", + roles: "Rôles", }; return ( - - - - - Nom - Courriel - Crée - Roles - - - - {users.map((user) => ( - - {user.name} - {user.email} - {new Date(user.created_at).toLocaleDateString()} - {user.roles?.join(", ")} - - handleDelete(user.email)} color="error"> - - - - - ))} - -
- + + ); }; diff --git a/client/src/services/ApiService.tsx b/client/src/services/ApiService.tsx index 209f370..91f4d40 100644 --- a/client/src/services/ApiService.tsx +++ b/client/src/services/ApiService.tsx @@ -5,7 +5,7 @@ import { ENV_VARIABLES } from '../constants'; import { FolderType } from 'src/Types/FolderType'; import { QuizType, QuizResponse } from 'src/Types/QuizType'; import { RoomType } from 'src/Types/RoomType'; -import { UserType } from 'src/Types/UserType'; +import { AdminTableType } from 'src/Types/LabelMap'; import { ImagesResponse, ImagesParams } from 'src/Types/ImageType'; type ApiResponse = boolean | string; @@ -1171,7 +1171,7 @@ public async login(email: string, password: string): Promise { } } - public async getUsers(): Promise { + public async getUsers(): Promise { try { const url: string = this.constructRequestUrl(`/admin/getUsers`);