From f92bb3375e1b254d8a84c74a72d9e7be6f49c2bb Mon Sep 17 00:00:00 2001 From: ColinRgm <90181373+ColinRgm@users.noreply.github.com> Date: Mon, 27 Jan 2025 10:34:50 +0100 Subject: [PATCH] fix: add a verification before deleting a user or an ESP (#235) * fix: add a verification before deleting a user or an ESP * fix: hide popover if click on NON Closes: #230 --- Dockerfile/Nginx.Dockerfile | 4 +- docker-compose.yml | 6 +- .../src/app/dashboard/users/page.tsx | 37 +++------ .../src/app/ui/dashboard/AddUserElement.tsx | 2 +- .../src/app/ui/dashboard/DeleteEsp.tsx | 45 ++++++++++- .../src/app/ui/dashboard/DeleteUsersData.tsx | 78 +++++++++++++++++++ 6 files changed, 139 insertions(+), 33 deletions(-) create mode 100644 nextjs-interface/src/app/ui/dashboard/DeleteUsersData.tsx diff --git a/Dockerfile/Nginx.Dockerfile b/Dockerfile/Nginx.Dockerfile index 9afa4df..ae2ba4c 100644 --- a/Dockerfile/Nginx.Dockerfile +++ b/Dockerfile/Nginx.Dockerfile @@ -9,5 +9,5 @@ RUN sed -i '/location \/adminer\//,/}/d' /etc/nginx/conf.d/default.conf COPY ../php/public /var/www/memoires-info/php/public # copy the nginx certificats -COPY ../climateguardian_dev.com.pem /etc/nginx -COPY ../climateguardian_dev.com-key.pem /etc/nginx \ No newline at end of file +COPY ../climateguardian_dev.com.pem /etc/nginx/climateguardian_dev.com.pem +COPY ../climateguardian_dev.com-key.pem /etc/nginx/climateguardian_dev.com-key.pem \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index ebcc526..d610d8a 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -77,6 +77,8 @@ services: - "./nextjs-interface:/var/www/memoires-info/html/" web: + build: + dockerfile: Dockerfile/Nginx.Dockerfile image: nginx:1.26-alpine-otel ports: - "80:80" @@ -86,8 +88,8 @@ services: - "./nginx.conf:/etc/nginx/conf.d/default.conf" - "./php:/var/www/memoires-info/php/" # Nginx certificats - - "./climateguardian_dev.com.pem:/etc/nginx" - - "./climateguardian_dev.com-key.pem:/etc/nginx" + - "./climateguardian_dev.com.pem:/etc/nginx/climateguardian_dev.com.pem" + - "./climateguardian_dev.com-key.pem:/etc/nginx/climateguardian_dev.com-key.pem" depends_on: - php - postg-rest diff --git a/nextjs-interface/src/app/dashboard/users/page.tsx b/nextjs-interface/src/app/dashboard/users/page.tsx index cfaf578..46ef444 100644 --- a/nextjs-interface/src/app/dashboard/users/page.tsx +++ b/nextjs-interface/src/app/dashboard/users/page.tsx @@ -12,6 +12,7 @@ import { } from "@/components/ui/card"; import { getToken, user } from "@/lib/context"; import EditUsersData from "@/app/ui/dashboard/EditUsersData"; +import DeleteUsersData from "@/app/ui/dashboard/DeleteUsersData"; export default function Page() { const [users, setUsers] = useState([]); @@ -23,34 +24,16 @@ export default function Page() { } }, [allUsers]); + const handleUserDelete = (username: string) => { + setUsers((prevUsers) => + prevUsers.filter((user) => user.username !== username), + ); + }; + if (!allUsers) { return
Chargement...
; } - // Fonction de suppression d'un utilisateur - const handleDelete = async (username: string) => { - try { - const response = await fetch(`/postgrest/users?username=eq.${username}`, { - method: "DELETE", - headers: { - "Content-Type": "application/json", - Authorization: `Bearer ${getToken()}`, - }, - }); - - if (!response.ok) { - console.error("Erreur à la suppression de l'utilisateur"); - console.error(await response.json()); - return; - } - - // Remove user from local state after successful deletion - setUsers(users.filter((user) => user.username !== username)); - } catch (error) { - console.error("Error:", error); - } - }; - return ( <> @@ -74,9 +57,9 @@ export default function Page() { password={user.password} /> - handleDelete(user.username)} + diff --git a/nextjs-interface/src/app/ui/dashboard/AddUserElement.tsx b/nextjs-interface/src/app/ui/dashboard/AddUserElement.tsx index 2879dda..d88356d 100644 --- a/nextjs-interface/src/app/ui/dashboard/AddUserElement.tsx +++ b/nextjs-interface/src/app/ui/dashboard/AddUserElement.tsx @@ -44,7 +44,7 @@ export function AddUserElement({ setUsername(""); setPassword(""); } else { - setMessage("Erreur à l'ajout 'un utilisateur. Veuillez réessayer."); + setMessage("Erreur à l'ajout de l'utilisateur. Veuillez réessayer."); } } catch (error: any) { setMessage("Error: " + error.message); diff --git a/nextjs-interface/src/app/ui/dashboard/DeleteEsp.tsx b/nextjs-interface/src/app/ui/dashboard/DeleteEsp.tsx index ae44082..dcc6712 100644 --- a/nextjs-interface/src/app/ui/dashboard/DeleteEsp.tsx +++ b/nextjs-interface/src/app/ui/dashboard/DeleteEsp.tsx @@ -1,7 +1,25 @@ import { Trash2 } from "lucide-react"; import { getToken } from "@/lib/context"; +import { + Popover, + PopoverContent, + PopoverTrigger, +} from "@/components/ui/popover"; +import { Button } from "@/components/ui/button"; +import { useState } from "react"; export default function DeleteEsp({ id }: { id: string }) { + // Function to hide the delete popup + const [isOpen, setIsOpen] = useState(false); + + const hidePopover = () => { + setIsOpen(false); + }; + + const openPopover = () => { + setIsOpen(true); + }; + const deleteEsp = async (id: string) => { // Get the id in the URL of the page @@ -29,6 +47,8 @@ export default function DeleteEsp({ id }: { id: string }) { } else { console.log("ESP supprimé avec succés"); } + + setIsOpen(false); } catch (error) { console.error("Error: ", error); } @@ -36,7 +56,30 @@ export default function DeleteEsp({ id }: { id: string }) { return (
- deleteEsp(id)} /> + + + + + + +

Supprimer cet ESP ?

+ + + +
); } diff --git a/nextjs-interface/src/app/ui/dashboard/DeleteUsersData.tsx b/nextjs-interface/src/app/ui/dashboard/DeleteUsersData.tsx new file mode 100644 index 0000000..4a37547 --- /dev/null +++ b/nextjs-interface/src/app/ui/dashboard/DeleteUsersData.tsx @@ -0,0 +1,78 @@ +import React, { useEffect, useState } from "react"; +import { getToken, user } from "@/lib/context"; +import { + Popover, + PopoverContent, + PopoverTrigger, +} from "@/components/ui/popover"; +import { Trash2 } from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { useAllUsers } from "@/lib/data"; + +export default function DeleteUserData({ + username, + onDelete, +}: { + username: string; + onDelete: (username: string) => void; +}) { + // Function to hide the delete popup + const [isOpen, setIsOpen] = useState(false); + + const hidePopover = () => { + setIsOpen(false); + }; + + const openPopover = () => { + setIsOpen(true); + }; + + // Function to delete a user + const [users, setUsers] = useState([]); + + const handleDelete = async () => { + try { + const response = await fetch(`/postgrest/users?username=eq.${username}`, { + method: "DELETE", + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${getToken()}`, + }, + }); + + if (!response.ok) { + return; + } + + onDelete(username); + // Remove user from local state after successful deletion + setUsers(users.filter((user) => user.username !== username)); + setIsOpen(false); + } catch (error) { + console.error("Error:", error); + } + }; + + return ( +
+ + + + + + +

Supprimer {username} ?

+ + + + +
+ ); +}