{
{
/>
-
-
Mot de passe oublié?
+
+
Mot de passe oublié?
{messages && (
@@ -124,7 +84,7 @@ const LoginPage = () => {
)}
diff --git a/src/app/auth/verif/page.jsx b/src/app/auth/verif/page.jsx
index cfea4df1253203ecab55cdbcb6d5644d8980cac5..15d3d4083be7e343e184e71bde68c51c9ab26e99 100644
--- a/src/app/auth/verif/page.jsx
+++ b/src/app/auth/verif/page.jsx
@@ -5,7 +5,7 @@ const Verif = () => {
// fetch data from the server /example
const fetchExampleData = async () => {
try {
- const data = await fetchRequest('http://localhost:8000/example/',
+ const data = await fetchRequest(`/example/`,
{method: 'POST',
body: JSON.stringify({
"name": "jhon",
@@ -20,18 +20,18 @@ const Verif = () => {
}
};
const isAuth = async () => {
- isAuthenticated();
+ await isAuthenticated();
}
return (
- <>
+
user is redirected to this page after successful login
{/*test fetchExampleData */}
-
+
);
}
export default Verif;
\ No newline at end of file
diff --git a/src/app/etage/AddEtageComponent.jsx b/src/app/etage/AddEtageComponent.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..d84ae41ffbd070751b3decbd867a59fd8fd87ee1
--- /dev/null
+++ b/src/app/etage/AddEtageComponent.jsx
@@ -0,0 +1,58 @@
+'use client'
+import Loader from '@/components/Loader/Loader'
+import React, { useState, useRef } from 'react'
+import fetchRequest from '../lib/fetchRequest'
+
+
+
+const AddEtageComponent = ({ etagesState })=> {
+ const [ numeroEtage, setNumeroEtage ] = useState("")
+ const [isLoading, setIsLoading] = useState(false)
+ const [errorMessage, setErrorMessage] = useState(null)
+ const inputRef = useRef(null)
+
+
+ const handleNewEtage = (e) => {
+ setErrorMessage(null)
+ setNumeroEtage(e.target.value)
+ }
+
+ const handleAddNewEtage = async () => {
+ setIsLoading(true)
+ const { data, errors, isSuccess } = await fetchRequest("/zoaning/etages/", {
+ method: "POST",
+ body: JSON.stringify({ numero: numeroEtage })
+ })
+ if (isSuccess) {
+ setIsLoading(false)
+ inputRef.current.value = ""
+ console.log(data)
+ etagesState((prevEtagesState) => [...prevEtagesState, data]);
+ } else {
+ setIsLoading(false)
+ if(errors.type == "ValidationError")
+ {setErrorMessage(errors.detail.numero)}
+ else{
+ setErrorMessage(errorMessage.type)
+ }
+ console.log(errors)
+ }
+
+ }
+
+ return(
+
+
+
Nouveau étage:
+
+
+
+
+
+ {errorMessage &&
{errorMessage}}
+
+
+ )
+}
+
+export default(AddEtageComponent)
\ No newline at end of file
diff --git a/src/app/etage/page.jsx b/src/app/etage/page.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..5177625933b1d8af927834ac9068aa67da4c722f
--- /dev/null
+++ b/src/app/etage/page.jsx
@@ -0,0 +1,83 @@
+"use client"
+import React from 'react'
+import AddEtageComponent from './AddEtageComponent'
+import fetchRequest from '../lib/fetchRequest'
+import { useState, useEffect } from 'react';
+import Loader from '@/components/Loader/Loader'
+
+
+
+const Etage = ()=> {
+ const [etages, setEtages] = useState([])
+ const [ isLoadingData, setIsLoadingData ] = useState(true)
+ // Fetch data from external API
+ useEffect(() => {
+ const getAllEtages = async () => {
+ try{
+ const {isSuccess, errors, data} = await fetchRequest('/zoaning/etages/', {method: 'GET'})
+ setIsLoadingData(false)
+ if(isSuccess){
+ setEtages(data)
+ }else{
+ setEtages([])
+ }
+ }catch(error){
+ setIsLoadingData(false)
+ console.log(error)
+ }
+ }
+ getAllEtages()
+ }, [])
+ const handleDeleteEtage = async (etage) => {
+ try{
+ console.log(etage)
+ const {isSuccess, errors, data} = await fetchRequest(`/zoaning/etages/${etage.id}/`, {method: "DELETE"})
+ console.log(isSuccess)
+ console.log(errors)
+ console.log(data)
+ if(isSuccess){
+ console.log(etages)
+ console.log("etage: ", etage)
+ setEtages((prevEtages) => prevEtages.filter((e) => e.id !== etage.id));
+ }
+ }catch(error){
+ console.log(error)
+ }
+ }
+ return(
+
+
+
+
Liste des étages
+
+
+ {(!isLoadingData) ? etages && etages?.length ?
+ {etages?.map((etage, index) =>
+ (
+ -
+ Etage numéro: {etage.numero}
+
{handleDeleteEtage(etage)}}>
+ )
+ )}
+
:
+
+ Aucun étage n'a été ajouté
+
+ :
+
+
+
+ }
+
+
+
+
+
+
+ )
+}
+
+export default Etage
\ No newline at end of file
diff --git a/src/app/globals.css b/src/app/globals.css
index 6c139df80533021db2ee61f9f06c23be2eb0a57f..b6ba7d37334c09788aa0026af48f37b048eed1d8 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -2,29 +2,6 @@
@tailwind components;
@tailwind utilities;
-:root {
- --foreground-rgb: 0, 0, 0;
- --background-start-rgb: 214, 219, 220;
- --background-end-rgb: 255, 255, 255;
-}
-
-@media (prefers-color-scheme: dark) {
- :root {
- --foreground-rgb: 255, 255, 255;
- --background-start-rgb: 0, 0, 0;
- --background-end-rgb: 0, 0, 0;
- }
-}
-
-body {
- color: rgb(var(--foreground-rgb));
- background: linear-gradient(
- to bottom,
- transparent,
- rgb(var(--background-end-rgb))
- )
- rgb(var(--background-start-rgb));
-}
@layer utilities {
.text-balance {
@@ -34,18 +11,23 @@ body {
/* Customize the scrollbar */
::-webkit-scrollbar {
- width: 6px; /* Set the width of the scrollbar */
+ width: 6px;
+ /* Set the width of the scrollbar */
}
::-webkit-scrollbar-thumb {
- background-color: rgba(0, 0, 0, 0.3); /* Color of the thumb */
- border-radius: 3px; /* Rounded corners of the thumb */
+ background-color: rgba(0, 0, 0, 0.3);
+ /* Color of the thumb */
+ border-radius: 3px;
+ /* Rounded corners of the thumb */
}
::-webkit-scrollbar-thumb:hover {
- background-color: rgba(0, 0, 0, 0.5); /* Color of the thumb on hover */
+ background-color: rgba(0, 0, 0, 0.5);
+ /* Color of the thumb on hover */
}
::-webkit-scrollbar-track {
- background-color: rgba(0, 0, 0, 0.1); /* Color of the track */
-}
+ background-color: rgba(0, 0, 0, 0.1);
+ /* Color of the track */
+}
\ No newline at end of file
diff --git a/src/app/layout.js b/src/app/layout.js
index 9aef1df7d6c3d50515ab62f578c5cc963a1243a7..45c21613310f3980d4975a0ebb436337cd7e5b89 100644
--- a/src/app/layout.js
+++ b/src/app/layout.js
@@ -1,17 +1,24 @@
import { Inter } from "next/font/google";
import "./globals.css";
+import Header from "@/app/ui/Header";
+import { NotificationProvider } from "@/context/NotificationContext";
const inter = Inter({ subsets: ["latin"] });
export const metadata = {
- title: "Create Next App",
+ title: "TeamBook",
description: "Generated by create next app",
};
export default function RootLayout({ children }) {
return (
- {children}
+
+
+
+ {children}
+
+
);
}
diff --git a/src/app/lib/TypesHelper.js b/src/app/lib/TypesHelper.js
new file mode 100644
index 0000000000000000000000000000000000000000..8077bc8cdb962a8c84c120e94ded330e19f02a38
--- /dev/null
+++ b/src/app/lib/TypesHelper.js
@@ -0,0 +1,3 @@
+export const isArray = (arg) => {
+ return Array.isArray(arg)
+}
\ No newline at end of file
diff --git a/src/app/lib/constants.js b/src/app/lib/constants.js
new file mode 100644
index 0000000000000000000000000000000000000000..9d34296b9316dac3c714bc0476dcfa97e05dda4d
--- /dev/null
+++ b/src/app/lib/constants.js
@@ -0,0 +1,3 @@
+export const PASSWORD_REGEX = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[^a-zA-Z\d\s]).*$/;
+export const EMAIL_REGEX = /^[a-zA-Z0-9._%+-]+@teamwillgroup\.com$/
+export const PAGINATION_SIZE = 3
\ No newline at end of file
diff --git a/src/app/lib/dal.js b/src/app/lib/dal.js
deleted file mode 100644
index 74c6293b78f5f50dac5fc7d8a9b11ed8f1b15fbe..0000000000000000000000000000000000000000
--- a/src/app/lib/dal.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import 'server-only'
-
-import Cookies from 'js-cookie';
-import { decrypt } from '@/app/lib/session'
-import {redirect} from "next/navigation";
-
-export const verifySession = cache(async () => {
- const cookie = Cookies.get('session').value
- const session = await decrypt(cookie)
-
- if (!session.token) {
- redirect('/login')
- }
-
- return { isAuth: true, userName: session.username }
-})
\ No newline at end of file
diff --git a/src/app/lib/fetchRequest.js b/src/app/lib/fetchRequest.js
index 3afb1c3072b662f2ba0461e36390f1f9e0700eed..a47d118550b459a157d8b8878de6a0cb8a859cd5 100644
--- a/src/app/lib/fetchRequest.js
+++ b/src/app/lib/fetchRequest.js
@@ -1,29 +1,52 @@
-//custom fetch tha have the token in header
-
import Cookies from 'js-cookie';
import {decrypt} from "@/app/lib/session";
+const BASE_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:8000"
const fetchRequest = async (url, options = {}) => {
- const token = Cookies.get('session');
- console.log('token', token)
- const jwtDecrypted = decrypt(token);
- console.log('jwtDecrypted', jwtDecrypted)
+ const jwtCookie = Cookies.get('session');
+ console.log('jwtCookie', jwtCookie)
+ const jwtDecrypted = await decrypt(jwtCookie);
+ console.log('jwtDecrypted', jwtDecrypted.sessionData.token)
const headers = {
...options.headers,
- 'Authorization': `Token ${token}`,
+ // add authorization header with token if there is jwtDecrypted.sessionData.token
+ Authorization: jwtDecrypted?.sessionData.token ? `Token ${jwtDecrypted.sessionData.token}` : undefined,
'Content-Type': 'application/json',
};
- const response = await fetch(url, {
+ const response = await fetch(`${BASE_URL}${url}`, {
...options,
headers,
});
-
+ console.log(response.status)
if (!response.ok) {
- throw new Error('Network response was not ok');
+ try {
+ const errorData = await response.json();
+ return {isSuccess: false, errors: errorData, data: null, status: response.status}
+ } catch (error) {
+ return {isSuccess: false, errors: error, data: null, status: response.status}
+ }
}
-
- return response.json();
+ console.log('response', response)
+ // Check if the response has content before parsing it as JSON
+ const contentType = response.headers.get('content-type');
+ if (contentType && contentType.includes('application/json')) {
+ const data = await response.json();
+ return {isSuccess: true, errors: null, data: data, status: response.status};
+ }
+ // If no JSON content, return null for data
+ return {isSuccess: true, errors: null, data: data, status: response.status};
};
export default fetchRequest;
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/lib/fetchRequestServer.js b/src/app/lib/fetchRequestServer.js
new file mode 100644
index 0000000000000000000000000000000000000000..16aafe94dd8d3c9fe65996005f25770a3231b70e
--- /dev/null
+++ b/src/app/lib/fetchRequestServer.js
@@ -0,0 +1,48 @@
+// src/app/lib/fetchRequestServer.js
+import {cookies as nextCookies} from 'next/headers';
+import {decrypt} from "@/app/lib/session";
+
+const BASE_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:8000";
+
+const fetchRequestServer = async (url, options = {}) => {
+ const cookieStore = nextCookies();
+ const jwtCookie = cookieStore.get('session')?.value;
+
+ if (!jwtCookie) {
+ return {isSuccess: false, errors: "No session cookie found", data: null};
+ }
+
+ const jwtDecrypted = await decrypt(jwtCookie);
+
+ const headers = {
+ ...options.headers,
+ Authorization: jwtDecrypted?.sessionData.token ? `Token ${jwtDecrypted.sessionData.token}` : undefined,
+ 'Content-Type': 'application/json',
+ };
+
+ const response = await fetch(`${BASE_URL}${url}`, {
+ ...options,
+ headers,
+ });
+
+ if (!response.ok) {
+ try {
+ const errorData = await response.json();
+ return {isSuccess: false, errors: errorData, data: null};
+ } catch (error) {
+ return {isSuccess: false, errors: error, data: null};
+ }
+ }
+
+ // Check if the response has content before parsing it as JSON
+ const contentType = response.headers.get('content-type');
+ if (contentType && contentType.includes('application/json')) {
+ const data = await response.json();
+ return {isSuccess: true, errors: null, data: data};
+ }
+ // If no JSON content, return null for data
+ return {isSuccess: true, errors: null, data: null};
+
+};
+
+export default fetchRequestServer;
diff --git a/src/app/lib/isAuthenticated.js b/src/app/lib/isAuthenticated.js
index 0a880acf5d8ce15ae58da3d0295208ff7a4ca3f6..7c77a5e9fe0c6cb8dff56ea1052bd1b27e4b6f6b 100644
--- a/src/app/lib/isAuthenticated.js
+++ b/src/app/lib/isAuthenticated.js
@@ -1,16 +1,20 @@
//verify if the user is authenticated
import Cookies from "js-cookie";
+import {decrypt} from "@/app/lib/session";
-export default function isAuthenticated() {
+export default async function isAuthenticated() {
if (!Cookies.get('session')) {
console.log('user is not authenticated');
// redirect to auth/login page
- window.location.href = '/auth/login';
-
+ // window.location.href = '/auth/login';
return false;
}
- else console.log('user is authenticated');
- return true;
+
+ console.log('user is authenticated');
+ const session = Cookies.get('session')
+ const cookieDecoded = await decrypt(session)
+ return { isAuth: true, sessionData: cookieDecoded.sessionData }
+
}
diff --git a/src/app/lib/isAuthenticatedSSR.js b/src/app/lib/isAuthenticatedSSR.js
new file mode 100644
index 0000000000000000000000000000000000000000..b06881511928d746e1963011e32bac21034e96b9
--- /dev/null
+++ b/src/app/lib/isAuthenticatedSSR.js
@@ -0,0 +1,20 @@
+//verify if the user is authenticated
+import { cookies } from 'next/headers'
+
+import {decrypt} from "@/app/lib/session";
+
+export default async function isAuthenticatedSSR() {
+ if (!cookies().get('session')) {
+ console.log('user is not authenticated');
+ // redirect to auth/login page
+ // window.location.href = '/auth/login';
+ return false;
+ }
+
+ console.log('user is authenticated');
+ const cookie = cookies().get('session')?.value
+ const session = await decrypt(cookie)
+ return { isAuth: true, sessionData: session.sessionData }
+
+}
+
diff --git a/src/app/lib/session.js b/src/app/lib/session.js
index 850ed748db48de63bae014a7fe245ff3a84f3278..1eb509a2e30326ef4e345033f9811c8dc0688513 100644
--- a/src/app/lib/session.js
+++ b/src/app/lib/session.js
@@ -2,7 +2,8 @@
import Cookies from 'js-cookie';
import { SignJWT, jwtVerify } from 'jose'
-const secretKey = "password1234"
+const secretKey = process.env.NEXT_PUBLIC_SESSION_SECRET;
+console.log(secretKey);
const encodedKey = new TextEncoder().encode(secretKey)
export async function encrypt(payload) {
diff --git a/src/app/page.js b/src/app/page.js
index ecfca6f8e5034eb7f60a623d3db202433f6b96b9..87ce7aa74a17bf1ba51f0e9979b2d955634bf8ca 100644
--- a/src/app/page.js
+++ b/src/app/page.js
@@ -1,149 +1,8 @@
-import Image from "next/image";
export default function Home() {
return (
-
-
- Get started by editing
- src/app/page.js
-
-
-
-
-
-
-
+ Home Page
);
}
diff --git a/src/app/privilege/CreatePrivilegeForm.jsx b/src/app/privilege/CreatePrivilegeForm.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..d124e2edfbefad535461e370dcba8910952705f8
--- /dev/null
+++ b/src/app/privilege/CreatePrivilegeForm.jsx
@@ -0,0 +1,78 @@
+'use client'
+import Loader from '@/components/Loader/Loader'
+import React, { useRef, useState } from 'react'
+import fetchRequest from '../lib/fetchRequest'
+import {useNotification} from "@/context/NotificationContext";
+
+const CreatePrivilegeForm = ({ appendPrivilege }) => {
+ 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)
+ const handleSubmit = async (event) => {
+ event.preventDefault()
+ setIsLoading(true)
+ const { data, errors, isSuccess } = await fetchRequest("/privileges/", {
+ method: "POST",
+ body: JSON.stringify({ name: privilegeName })
+ })
+ if (isSuccess) {
+ setIsLoading(false)
+ appendPrivilege(data)
+ inputRef.current.value = ""
+ setPrivilegeName("")
+ toggleNotification({
+ visible: true,
+ message: "L'habilitation a été créé avec succès",
+ type: "success"
+ })
+ } else {
+ setIsLoading(false)
+ if (errors.type === "ValidationError") {
+ if (errors.detail.name) {
+ toggleNotification({
+ type: "warning",
+ message: "Le nom de l'habilitation existe déjà",
+ visible: true,
+ })
+ }
+ else {
+ toggleNotification({
+ visible: true,
+ message: "Erreur de validation de l'habilitation",
+ type: "warning"
+ })
+ }
+ } else {
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ }
+ console.log(errors)
+ }
+ }
+ return (
+
+ )
+}
+
+export default CreatePrivilegeForm
\ No newline at end of file
diff --git a/src/app/privilege/PrivilegeTableRow.jsx b/src/app/privilege/PrivilegeTableRow.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..7537e45773778a694de9fbe0655fdb37d9a04980
--- /dev/null
+++ b/src/app/privilege/PrivilegeTableRow.jsx
@@ -0,0 +1,174 @@
+'use client'
+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 CancelIcon from "@/static/image/svg/cancel.svg"
+import CheckIcon from "@/static/image/svg/check.svg"
+import { useNotification } from '@/context/NotificationContext'
+import ConfirmationModal from '../ui/ConfirmationModal'
+const PrivilegeTableRow = ({ id, name, setPrivileges }) => {
+ const [isUpdating, setIsUpdating] = useState(false)
+ const [privilegeName, setPrivilegeName] = useState(name)
+ const [loadingStatus, setLoadingStatus] = useState(false)
+ const { toggleNotification } = useNotification()
+ const [isModalOpen, setModalOpen] = useState(false)
+ const showDeletePopup = () => {
+ setModalOpen(true);
+ }
+ useEffect(() => {
+ setPrivilegeName(name)
+ inputRef.current.value = name
+ }, [name])
+ const handleUpdatePrivilege = async () => {
+ setLoadingStatus(true)
+ const { isSuccess, errors, data, status } = await fetchRequest(`/privileges/${id}/`, {
+ method: "PATCH",
+ body: JSON.stringify({ name: privilegeName })
+ })
+ setLoadingStatus(false)
+ if (isSuccess) {
+ setPrivileges((privileges) => privileges.map((element) => element.id === id ? data.data : element))
+ setIsUpdating(false)
+ toggleNotification({
+ visible: true,
+ message: "L'habilitation a été modifiée avec succès.",
+ type: "success"
+ })
+ } else {
+ if (errors.type === "ValidationError") {
+ if (errors.detail.name) {
+ toggleNotification({
+ type: "warning",
+ message: "Le nom de l'habilitation existe déjà",
+ visible: true,
+ })
+ }
+ else {
+ toggleNotification({
+ visible: true,
+ message: "Erreur de validation de l'habilitation",
+ type: "warning"
+ })
+ }
+ } else if (status === 404) {
+ toggleNotification({
+ visible: true,
+ message: "L'habilitation n'a pas été trouvé",
+ type: "warning"
+ })
+ } else {
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ }
+ console.log(errors)
+ }
+
+ }
+ const handleDelete = async () => {
+ const { isSuccess, errors, status } = await fetchRequest(`/privileges/${id}/`, { method: "DELETE" })
+ if (isSuccess) {
+ setPrivileges((privileges) => privileges.filter((element) => element.id !== id))
+ toggleNotification({
+ visible: true,
+ message: "L'habilitation a été supprimée avec succès",
+ type: "success"
+ })
+ } else if (status == 404) {
+ toggleNotification({
+ visible: true,
+ message: "L'habilitation n'a pas été trouvé",
+ type: "warning"
+ })
+ } else {
+ console.log(errors)
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ }
+ setModalOpen(false)
+ }
+ const cancelUpdate = () => {
+ setIsUpdating(false)
+ setPrivilegeName(name)
+ inputRef.current.value = name
+ }
+ const inputRef = useRef(null)
+ const rowRef = useRef(null)
+ const handleUpdateBlur = (event) => {
+ const eventTarget = event.target
+ let isInsideRowRef = false;
+ let element = eventTarget;
+ while (element !== null) {
+ if (element === rowRef.current) {
+ isInsideRowRef = true;
+ break;
+ }
+ if (element.parentElement === null) {
+ isInsideRowRef = false;
+ break;
+ }
+ element = element.parentElement;
+ }
+ if (!isInsideRowRef && element?.classList.contains("privilegeRowSVG")) return;
+ if (!isInsideRowRef) {
+ cancelUpdate();
+ document.removeEventListener("click", handleUpdateBlur);
+ }
+ }
+ useEffect(() => {
+ if (isUpdating && inputRef?.current) {
+ inputRef.current.focus()
+ document.addEventListener("click", handleUpdateBlur)
+ }
+ return () => {
+ document.removeEventListener("click", handleUpdateBlur)
+ }
+ }, [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' />
+ |
+
+ {!isUpdating
+ ?
+
+
+
+ :
+
+
+
+ }
+ |
+
+
setModalOpen(false)}
+ onConfirm={handleDelete}
+ message={`Voulez-vous vraiment supprimer l'habilitation ?`}
+ />
+
+ )
+
+}
+
+export default PrivilegeTableRow
\ No newline at end of file
diff --git a/src/app/privilege/page.jsx b/src/app/privilege/page.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..46c9515f8523b64d56f4b60cedc04afaffeaf2fb
--- /dev/null
+++ b/src/app/privilege/page.jsx
@@ -0,0 +1,55 @@
+'use client'
+import React, { useEffect, useState } from 'react'
+import CreatePrivilegeForm from './CreatePrivilegeForm'
+import fetchRequest from '../lib/fetchRequest'
+import { isArray } from '../lib/TypesHelper'
+import PrivilegeTableRows from './PrivilegeTableRow'
+import Loader from '@/components/Loader/Loader'
+const Privilege = () => {
+ const [privileges, setPrivileges] = useState([])
+ const [isLoading, setIsLoading] = useState(true)
+ useEffect(() => {
+ const getPrivileges = async () => {
+ const { data, errors, isSuccess } = await fetchRequest("/privileges")
+ setIsLoading(false)
+ if (isSuccess) {
+ setPrivileges(data)
+ } else {
+ console.log(errors)
+ }
+ }
+ getPrivileges()
+ }, [])
+ const appendPrivilege = (privilege) => {
+ setPrivileges((data) => [privilege, ...data])
+ }
+ return (
+
+
+
+
+
List des habilitations
+ {isLoading &&
}
+ {!isLoading && <> {(!isArray(privileges) || privileges?.length === 0)
+ ?
+
Pas encore des habilitations
+
+ :
+
+
+ | Habilitation |
+ Action |
+
+ {privileges.map((element) => {
+ return
+ })}
+
+
+ }}
+
+
+
+
+
+ | Projet |
+ Membres de léquipe |
+ Nom du client |
+ Actions |
+
+
+
+ {projects
+ .sort((a, b) => new Date(b.updated_at) - new Date(a.updated_at))
+ .map((project, index) => (
+
+ | {project.nom} |
+ {project.users.length} |
+ {project.nomClient} |
+
+
+
+ |
+
+ ))}
+
+
+ {/* Pagination */}
+ {projects.count &&
+
+
+ -
+
+
+ -
+ 1
+
+ -
+
+
+
+
+
+
+
+
+
+
+
Projets
+ {loading ? ... : null}
+
+ {/*errors from request*/}
+ {errors && errors.detail && Object.keys(errors.detail).map((key) => (
+
+
+
+
Something went wrong
+
+
+ {errors.detail[key]}
+
+
+ ))}
+
+
+
+
+
+
+
setIsOpen(false)} className="h-8 w-8 cursor-pointer absolute top-2 right-2 fill-neutral-600" />
+ {(privileges) ? :
}
+
+
+ |
+ {name}
+ |
+
+
+ {privileges?.map((element, index) => {
+ return {element.name}
+ })}
+ |
+
+
+
+
+
+ |
+
+ setModalOpen(false)}
+ onConfirm={handleDelete}
+ message={`Voulez-vous vraiment supprimer le rôle ?`}
+ />
+
+
+ )
+}
+
+export default RoleTableRows
\ No newline at end of file
diff --git a/src/app/role/UpdateRoleForm.jsx b/src/app/role/UpdateRoleForm.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..348ebfce5dc70d57d41f4157b2bb2579c29dafca
--- /dev/null
+++ b/src/app/role/UpdateRoleForm.jsx
@@ -0,0 +1,143 @@
+import { useNotification } from '@/context/NotificationContext'
+import React, { useState, useRef, useEffect, useMemo } from 'react'
+import fetchRequest from '../lib/fetchRequest'
+import Loader from '@/components/Loader/Loader'
+import CancelIcon from "@/static/image/svg/cancel.svg"
+import { isArray } from '../lib/TypesHelper'
+const UpdateRoleForm = ({ setRoleToUpdate, setRoles, roles, privileges: rolePrivileges, name, id }) => {
+ const { toggleNotification } = useNotification()
+ const [loadingStatus, setLoadingStatus] = useState(false)
+ const [roleName, setRoleName] = useState(name)
+ const [privileges, setPrivileges] = useState(null)
+ const [selectedPrivileges, setSelectedPrivileges] = useState(isArray(rolePrivileges) ? rolePrivileges : [])
+ const inputRef = useRef(null)
+ console.log("les priv de role ", rolePrivileges)
+ useEffect(() => {
+ const getPrivileges = async () => {
+ const { data, errors, isSuccess } = await fetchRequest("/privileges")
+ if (isSuccess) {
+ setPrivileges(data)
+ } else {
+ setPrivileges([])
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ console.log(errors)
+ }
+ }
+ getPrivileges()
+ }, [])
+ const handleSubmit = async (event) => {
+ event.preventDefault()
+ setLoadingStatus(true)
+ const { isSuccess, errors, data, status } = await fetchRequest(`/roles/${id}/`, {
+ method: "PATCH",
+ body: JSON.stringify({ name: roleName, privileges: selectedPrivileges.filter((element) => privileges.find((prvElement) => prvElement.id === element.id)).map((element) => element.id) })
+ })
+ console.log(data)
+ setLoadingStatus(false)
+ if (isSuccess) {
+ setRoles((roles) => roles.map((element) => element.id === id ? data : element))
+ toggleNotification({
+ visible: true,
+ message: "Le rôle a été modifé avec succès",
+ type: "success"
+ })
+ setRoleToUpdate(null)
+ } else {
+ if (errors.type === "ValidationError") {
+ if (errors.detail.name) {
+ toggleNotification({
+ type: "warning",
+ message: "Le nom de rôle existe déjà",
+ visible: true,
+ })
+ }
+ else {
+ toggleNotification({
+ visible: true,
+ message: "Erreur de validation de rôle",
+ type: "warning"
+ })
+ setRoleToUpdate(null)
+ }
+ } else if (status === 404) {
+ toggleNotification({
+ visible: true,
+ message: "Le rôle n'a pas été trouvé",
+ type: "warning"
+ })
+ setRoleToUpdate(null)
+ } else if (errors.detail === "Privilege matching query does not exist.") {
+ toggleNotification({
+ visible: true,
+ message: "Des privilèges que vous avez utilisés ont été supprimés.",
+ type: "warning"
+ })
+ setRoleToUpdate(null)
+ }
+ else {
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ setRoleToUpdate(null)
+ }
+ console.log(errors)
+ }
+ }
+ const handleRoleNameChange = (event) => {
+ setRoleName(event.target.value)
+ }
+ const handlePrivilegeClick = (privilege) => {
+ if (selectedPrivileges.find((element) => element.id === privilege.id)) {
+ setSelectedPrivileges(selectedPrivileges.filter((element) => element.id !== privilege.id))
+ } else {
+ setSelectedPrivileges([...selectedPrivileges, privilege])
+ }
+ }
+ const selectAll = () => {
+ if (privileges.every((element) => selectedPrivileges.find((priv) => priv.id === element.id)))
+ setSelectedPrivileges([])
+ else setSelectedPrivileges(privileges)
+ }
+ var isAllSelected = useMemo(() => privileges ? privileges.every((element) => selectedPrivileges.find((priv) => priv.id === element.id)) : false, [selectedPrivileges, privileges])
+ return (
+
+
+
setRoleToUpdate(null)} className="h-8 w-8 cursor-pointer absolute top-2 right-2 fill-neutral-600" />
+ {(privileges) ? :
}
+
+
+
+
+ {openCreatePopup &&
}
+ {roleToUpdate &&
}
+
+
List des Roles
+
+
+ {isLoading &&
}
+ {!isLoading && <> {(!isArray(roles) || roles?.length === 0)
+ ?
+ :
+
+
+ | Rôle |
+ Habilitations |
+ Action |
+
+ {roles?.map((element) => {
+ return
+ })}
+
+
+ }}
+
+
+
+
+
Confirmation
+
{message}
+
+
+
+
+
+
+
+
setIsOpen(false)} className="h-8 w-8 cursor-pointer absolute top-2 right-2 fill-neutral-600" />
+ {(roles && projects) ? :
}
+
+
+
+
setUserToUpdate(null)} className="h-8 w-8 cursor-pointer absolute top-2 right-2 fill-neutral-600" />
+ {(roles && projects) ? :
}
+
+
+ |
+ {first_name} {last_name}
+ |
+
+ {email}
+ |
+
+ {role?.name || ""}
+ |
+
+
+ {(!projects || projects.length === 0) && - }
+ {projects?.map((project) => {
+ return - {project.nom}
+ })}
+
+ |
+
+
+
+
+
+ |
+
+ setModalOpen(false)}
+ onConfirm={handleDelete}
+ message={`Voulez-vous vraiment supprimer le rôle ?`}
+ />
+
+ )
+}
+
+export default UserTableRow
\ No newline at end of file
diff --git a/src/app/user/page.jsx b/src/app/user/page.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..de82ec7b2e39c034cebdb294b46644b769a81f0a
--- /dev/null
+++ b/src/app/user/page.jsx
@@ -0,0 +1,119 @@
+'use client';
+import React, { useEffect, useState, useDeferredValue } from 'react'
+import CreateUserForm from './CreateUserForm'
+import UpdateUserForm from './UpdateUserForm'
+import AddIcon from "@/static/image/svg/add.svg"
+import Loader from '@/components/Loader/Loader'
+import fetchRequest from '../lib/fetchRequest';
+import { isArray } from '../lib/TypesHelper';
+import { useNotification } from '@/context/NotificationContext';
+import UserTableRow from './UserTableRow';
+import { PAGINATION_SIZE } from '../lib/constants';
+import ArrowRightIcon from "@/static/image/svg/chevron-right.svg"
+import ArrowLeftIcon from "@/static/image/svg/chevron-left.svg"
+const UserPage = () => {
+ const [users, setUsers] = useState([])
+ const [paginationData, setPaginationData] = useState(null)
+ const [isLoading, setIsLoading] = useState(true)
+ const [openCreatePopup, setOpenCreatePopup] = useState(null)
+ const [userToUpdate, setUserToUpdate] = useState(null)
+ const { toggleNotification } = useNotification()
+ const [query, setQuery] = useState('');
+ const getUsers = async (pageNumber = 1, signal) => {
+ setIsLoading(true)
+ if (search) var { data, errors, isSuccess } = await fetchRequest(`/users/?page=${pageNumber}&search=${query}`, { signal: signal })
+ else var { data, errors, isSuccess } = await fetchRequest(`/users/?page=${pageNumber}`)
+ setIsLoading(false)
+ if (isSuccess) {
+ console.log(data)
+ setUsers(data.results)
+ setPaginationData({ pagesNumber: Math.ceil((data.count || 0) / PAGINATION_SIZE), currentPage: pageNumber })
+ } else {
+ toggleNotification({
+ visible: true,
+ message: "Internal Server Error",
+ type: "error"
+ })
+ }
+ }
+ useEffect(() => {
+ const controller = new AbortController()
+ const signal = controller.signal
+ getUsers(1, signal)
+ return () => {
+ controller.abort("fetching another users")
+ }
+ }, [query])
+ const appendUser = (newUser) => {
+ setUsers([newUser, ...users])
+ }
+
+ const handleSearchChange = (event) => {
+ setQuery(event.target.value)
+ }
+ return (
+
+
+ {openCreatePopup &&
}
+ {userToUpdate &&
}
+
+
List des Utilisateurs
+
+
+
+
+
+ {(isLoading) &&
}
+ {(!isLoading) && <> {(!isArray(users) || users?.length === 0)
+ ?
+
Pas encore des utilisateurs
+
+ :
+
+
+
+ | Nom |
+ Email |
+ Rôle |
+ Projects |
+ Action |
+
+ {users?.map((element) => {
+ return
+ })}
+
+
}
+
+ }
+
+ {(paginationData) &&
+ {(paginationData.currentPage > 1) &&
getUsers(paginationData.currentPage - 1)} className='flex cursor-pointer hover:bg-neutral-200 duration-150 delay-75 h-8 w-9 items-center justify-center'>
+
+
}
+ {paginationData && Array.from({ length: paginationData.pagesNumber }, (_, index) => index).map((element, index) => {
+ if (element + 1 === paginationData.currentPage + 3) return
+ ...
+
+ else if (paginationData.currentPage === element + 1) return
+ {element + 1}
+
+ else if (paginationData.currentPage < element + 3 && element - paginationData.currentPage < 3) return
getUsers(element + 1)} key={element} className='h-8 w-9 hover:bg-neutral-200 cursor-pointer duration-150 delay-75 font-bold text-neutral-700 text-sm flex items-center justify-center' >
+ {element + 1}
+
+ else return <>
+ })}
+ {(paginationData.currentPage !== paginationData.pagesNumber) &&
getUsers(paginationData.currentPage + 1)} className='flex h-8 w-9 items-center hover:bg-neutral-200 duration-150 delay-75 cursor-pointer justify-center'>
+
+
}
+
}
+
+
+
+
+ |
+
+ |
+
+
+ |
+
+
+
+
+
+
+
+
+
+ |
+
+ )
+}
+
+
+export default RowZone
\ No newline at end of file
diff --git a/src/app/zone/page.jsx b/src/app/zone/page.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..a1c067effa3ea3e661e1e37ec94322ca0c992fd8
--- /dev/null
+++ b/src/app/zone/page.jsx
@@ -0,0 +1,66 @@
+"use client"
+import React from 'react'
+import fetchRequest from '../lib/fetchRequest'
+import { useState, useEffect } from 'react';
+import Loader from '@/components/Loader/Loader'
+import CreateNewZone from './CreateNewZone'
+import DeleteIcon from "@/static/image/svg/delete.svg"
+import EditIcon from "@/static/image/svg/edit.svg"
+import CancelIcon from "@/static/image/svg/cancel.svg"
+import CheckIcon from "@/static/image/svg/check.svg"
+import RowZone from './RowZone'
+
+
+const Zone = ()=> {
+ const [zones, setZones] = useState([])
+ const [ isLoadingData, setIsLoadingData ] = useState(true)
+ // Fetch data from external API
+ useEffect(() => {
+ const getAllZones = async () => {
+ try{
+ const {isSuccess, errors, data} = await fetchRequest('/zoaning/zones/', {method: 'GET'})
+ setIsLoadingData(false)
+ if(isSuccess){
+ setZones(data)
+ }else{
+ setZones([])
+ }
+ }catch(error){
+ setIsLoadingData(false)
+ console.log(error)
+ }
+ }
+ getAllZones()
+ }, [])
+ return(
+
+
+
+
+
List des Zones
+ {zones ?
+
+
Pas encore des habilitations
+
+ :
+
+
+
+ | Zone |
+ Etage |
+ Action |
+
+ {zones.map((element) => {
+ return
+ })}
+
+
+ }
+
+
+
+
+
+
+
+
+
+
+
+
+
Avertissement
+
{message}
+
+
+
+
+