diff --git a/src/app/(dashboard)/privilege/CreatePrivilegeForm.jsx b/src/app/(dashboard)/privilege/CreatePrivilegeForm.jsx index 861c65b910f8b4c8b386866ac59fb2e7c9c110ef..a156ab54e57d49a52e27a1692b86f0a034fdf239 100644 --- a/src/app/(dashboard)/privilege/CreatePrivilegeForm.jsx +++ b/src/app/(dashboard)/privilege/CreatePrivilegeForm.jsx @@ -1,16 +1,17 @@ 'use client' import Loader from '@/components/Loader/Loader' -import React, { useRef, useState } from 'react' +import React, { useRef, useState, useEffect } from 'react' import fetchRequest from '../../lib/fetchRequest' import { useNotification } from "@/context/NotificationContext"; +import CancelIcon from "@/static/image/svg/cancel.svg" +import CheckIcon from "@/static/image/svg/check.svg" -const CreatePrivilegeForm = ({ appendPrivilege }) => { + +const CreatePrivilegeForm = ({ appendPrivilege, cancelCreate }) => { const [isLoading, setIsLoading] = useState(false) - const [error, setError] = useState(null) const [privilegeName, setPrivilegeName] = useState(""); const { toggleNotification } = useNotification() const handlePrivilegeNameChange = (event) => { - setError("") setPrivilegeName(event.target.value) } const inputRef = useRef(null) @@ -31,6 +32,7 @@ const CreatePrivilegeForm = ({ appendPrivilege }) => { message: "L'habilitation a été créé avec succès", type: "success" }) + cancelCreate(); } else { setIsLoading(false) if (errors.type === "ValidationError") { @@ -58,21 +60,56 @@ const CreatePrivilegeForm = ({ appendPrivilege }) => { console.log(errors) } } - return ( -
-

Ajout d'habilitation

-
- - -
-

{error}

-
- +
-
- ) + + } export default CreatePrivilegeForm \ No newline at end of file diff --git a/src/app/(dashboard)/privilege/PrivilegeTableRow.jsx b/src/app/(dashboard)/privilege/PrivilegeTableRow.jsx index d0527ec777e59d06f3301aadc10b47744500378b..c1389375bf37c24c2712b86844c04c895d44b9bf 100644 --- a/src/app/(dashboard)/privilege/PrivilegeTableRow.jsx +++ b/src/app/(dashboard)/privilege/PrivilegeTableRow.jsx @@ -2,8 +2,8 @@ import React, { useEffect, useRef, useState } from 'react' import fetchRequest from '../../lib/fetchRequest' import Loader from '@/components/Loader/Loader' -import DeleteIcon from "@/static/image/svg/delete.svg" -import EditIcon from "@/static/image/svg/edit.svg" +import DeleteIcon from "@/static/image/svg/trash-bold.svg" +import EditIcon from "@/static/image/svg/edit-bold.svg" import CancelIcon from "@/static/image/svg/cancel.svg" import CheckIcon from "@/static/image/svg/check.svg" import { useNotification } from '@/context/NotificationContext' @@ -133,33 +133,33 @@ const PrivilegeTableRow = ({ id, name, setPrivileges }) => { }, [isUpdating]) return ( <> - - - setPrivilegeName(event.target.value)} defaultValue={name} type='text' className='disabled:bg-white w-full border-0 rounded-md px-2 enabled:drop-shadow border-none enabled:bg-gray-100 duration-100 h-10 outline-none' /> + + + setPrivilegeName(event.target.value)} defaultValue={name} type='text' className='w-full border-0 rounded-md px-2 enabled:drop-shadow border-none enabled:bg-gray-100 disabled:bg-transparent duration-100 h-10 outline-none' /> - + {!isUpdating - ?
- -
- :
- -
} - + setModalOpen(false)} diff --git a/src/app/(dashboard)/privilege/PrivilegesFilter.jsx b/src/app/(dashboard)/privilege/PrivilegesFilter.jsx new file mode 100644 index 0000000000000000000000000000000000000000..306083f4772e2bb142a0606b921f2693ab3ef2b3 --- /dev/null +++ b/src/app/(dashboard)/privilege/PrivilegesFilter.jsx @@ -0,0 +1,31 @@ +import React, { memo } from 'react' +import ResetIcon from "@/static/image/svg/reset.svg" +const PrivilegesFilter = memo(function page({ setFilter, filter }) { + const handleChangeFilter = (event) => { + const name = event.target.name + const value = event.target.value + setFilter((filter) => ({ ...filter, [name]: value })) + } + const handleResetFilters = () => { + setFilter({ privilege: "" }) + } + return ( +
+

Recherche

+
+
+ + +
+
+
+ +
+
+ ) +}) + +export default PrivilegesFilter \ No newline at end of file diff --git a/src/app/(dashboard)/privilege/page.jsx b/src/app/(dashboard)/privilege/page.jsx index f10039bf8b06739cf424d8b4c759122b37c03223..f7e796676219363d84f60122ce4bc01bdf8e059e 100644 --- a/src/app/(dashboard)/privilege/page.jsx +++ b/src/app/(dashboard)/privilege/page.jsx @@ -5,12 +5,17 @@ import fetchRequest from '../../lib/fetchRequest' import { isArray } from '../../lib/TypesHelper' import PrivilegeTableRows from './PrivilegeTableRow' import Loader from '@/components/Loader/Loader' +import PrivilegesFilter from "./PrivilegesFilter" +import SubSideBar from '@/app/ui/SubSideBar' +import AddIcon from "@/static/image/svg/add.svg" const Privilege = () => { const [privileges, setPrivileges] = useState([]) const [isLoading, setIsLoading] = useState(true) + const [filter, setFilter] = useState({ privilege: "" }); + const [isCreating, setIsCreating] = useState(false) useEffect(() => { const getPrivileges = async () => { - const { data, errors, isSuccess } = await fetchRequest("/privileges") + const { data, errors, isSuccess } = await fetchRequest(`/privileges/?privilege_name=${filter.privilege}`) setIsLoading(false) if (isSuccess) { setPrivileges(data) @@ -19,32 +24,43 @@ const Privilege = () => { } } getPrivileges() - }, []) + }, [filter.privilege]) const appendPrivilege = (privilege) => { setPrivileges((data) => [privilege, ...data]) } + const subLinks = [{ label: "Utilisateurs", link: "/user" }, { label: "Rôles", link: "/role" }, { label: "Habilitations", link: "/privilege" }, { label: "Projets", link: "/projects" }] return ( -
- -

Liste des habilitations

- {isLoading &&
} - {!isLoading && <> {(!isArray(privileges) || privileges?.length === 0) - ?
-

Pas encore des habilitations

+ <> + + +
+
+

Liste des habilitations

+
- :
- - - - - - {privileges.map((element) => { - return - })} -
HabilitationAction
-
- }} -
+ {isLoading &&
} + {!isLoading && <> {(!isArray(privileges) || privileges?.length === 0) + ?
+

Aucune habilitation n'a été trouvée.

+
+ :
+ + + + + + {(isCreating) && setIsCreating(false)} appendPrivilege={appendPrivilege} />} + {privileges?.map((element) => { + return + })} +
HabilitationActions
+
+ }} +
+ ) } diff --git a/src/app/(dashboard)/reporting/page.jsx b/src/app/(dashboard)/reporting/page.jsx index 47058e4bce01ba403b2a2878ac147e39372cbd40..22ca155804efd376b20ae37d7647109bf5bbcd82 100644 --- a/src/app/(dashboard)/reporting/page.jsx +++ b/src/app/(dashboard)/reporting/page.jsx @@ -18,14 +18,14 @@ const Reporting = () => { const [chartDataProject, setChartDataProject] = useState(null) const [isLoadingZone, setIsLoadingZone] = useState(false) const [isLoadingProject, setIsLoadingProject] = useState(false) - const [ countUsers, setCountUsers ] = useState(0) - const [ countProjects, setCountProjects ] = useState(0) - const [ countPlaces, setCountPlaces ] = useState(0) + const [countUsers, setCountUsers] = useState(0) + const [countProjects, setCountProjects] = useState(0) + const [countPlaces, setCountPlaces] = useState(0) const { toggleNotification } = useNotification() const [dates, setDates] = useState({ fromDate: extractDate(subtractDays(new Date(), 4)), toDate: extractDate(new Date()) }) useEffect(() => { - const getStats= async () => { + const getStats = async () => { const { data, errors, isSuccess } = await fetchRequest(`/statistics/`, { method: "GET", }) @@ -146,15 +146,15 @@ const Reporting = () => { })) }, [chartDataZone, axisX]) return ( -
-
+
+

Collaborateurs

{countUsers}
- - + +
@@ -163,8 +163,8 @@ const Reporting = () => {
{countProjects}
- - + +
@@ -173,8 +173,8 @@ const Reporting = () => {
{countPlaces}
- - + +
@@ -192,7 +192,7 @@ const Reporting = () => {
{(isLoadingZone || isLoadingProject) ?
-
:
+
:
} diff --git a/src/app/(dashboard)/role/RoleTableRows.jsx b/src/app/(dashboard)/role/RoleTableRows.jsx index ccdcad936b6b9f077fc3ac86eb584d85d919d691..a834a619b496ff0e7f107bf50c6205e35e7a6826 100644 --- a/src/app/(dashboard)/role/RoleTableRows.jsx +++ b/src/app/(dashboard)/role/RoleTableRows.jsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import fetchRequest from '@/app/lib/fetchRequest' -import DeleteIcon from "@/static/image/svg/delete.svg" -import EditIcon from "@/static/image/svg/edit.svg" +import DeleteIcon from "@/static/image/svg/trash-bold.svg" +import EditIcon from "@/static/image/svg/edit-bold.svg" import { useNotification } from '@/context/NotificationContext' import ConfirmationModal from '@/app/ui/ConfirmationModal' @@ -48,29 +48,29 @@ const RoleTableRows = ({ name, setRoles, id, privileges, setRoleToUpdate }) => { return ( <> - - -

{name}

+ + +

{name}

- -
+ +
{privileges?.map((element, index) => { - return
{element.name}
+ return
{element.name}
})} - {!privileges || privileges.length == 0 &&

-

} + {!privileges || privileges.length == 0 &&

Habilitations non accordées à ce rôle

}
- -
- -
- + setModalOpen(false)} diff --git a/src/app/(dashboard)/role/RolesFilter.jsx b/src/app/(dashboard)/role/RolesFilter.jsx new file mode 100644 index 0000000000000000000000000000000000000000..25fc2cdb4fc812581f4ba9188a88e559155d4658 --- /dev/null +++ b/src/app/(dashboard)/role/RolesFilter.jsx @@ -0,0 +1,89 @@ +import React, { memo, useEffect, useState } from 'react' +import ResetIcon from "@/static/image/svg/reset.svg" +import Select from "react-select"; +import fetchRequest from '@/app/lib/fetchRequest'; +const RolesFilter = memo(function Page({ setFilter, filter }) { + const [privileges, setPrivileges] = useState([]) + const handleChangeRoleName = (event) => { + const value = event.target.value + setFilter({ ...filter, "role": value }) + } + const handleResetFilters = () => { + setFilter({ "role": "", "privileges": [] }) + } + + const handlePrivilegesChange = (selectedOptions) => { + setFilter({ ...filter, privileges: selectedOptions }) + } + useEffect(() => { + const getPrivileges = async () => { + const { data, errors, isSuccess } = await fetchRequest(`/privileges`) + if (isSuccess) { + setPrivileges(data) + } else { + console.log(errors) + } + } + getPrivileges() + }, []) + return ( +
+

Recherche

+
+
+ + +
+
+ + +
- +
- +
- +
- {/*
- -
*/} +
) -} +}) export default UsersFilter \ No newline at end of file diff --git a/src/app/(dashboard)/user/page.jsx b/src/app/(dashboard)/user/page.jsx index 8f5795faa0d9353e48647e70ade6da34957de4c2..726ea0d09011af2575115c7f413516a8e64ed851 100644 --- a/src/app/(dashboard)/user/page.jsx +++ b/src/app/(dashboard)/user/page.jsx @@ -56,7 +56,7 @@ const UserPage = () => { return ( <> - +
{openCreatePopup && } {userToUpdate && } @@ -70,7 +70,7 @@ const UserPage = () => { {(isLoading) &&
} {(!isLoading) && <> {(!isArray(users) || users?.length === 0) ?
-

Pas encore des utilisateurs

+

Aucun utilisateurs n'a été trouvé

:
diff --git a/src/app/ui/SideBar.jsx b/src/app/ui/SideBar.jsx index ba45eace93b079bae81c0cc00950bb4f78bf2e04..9534806d9808a1d0db05a1856afa3d0b3ec8b084 100644 --- a/src/app/ui/SideBar.jsx +++ b/src/app/ui/SideBar.jsx @@ -4,7 +4,7 @@ import RoleIcon from "@/static/image/svg/role.svg" import UserIcon from "@/static/image/svg/user.svg" import LogoutButton from "./LogoutButton"; import isAuthenticated from "@/app/lib/isAuthenticated"; -import {useEffect, useState} from "react"; +import { useEffect, useState } from "react"; import { usePathname } from "next/navigation"; import './SideBar.css'; @@ -26,7 +26,7 @@ const SideBar = () => { if (!isAuth || !sessionData) { return (