From a4c952872f58caae40b8cebb2cee27672bfc2d20 Mon Sep 17 00:00:00 2001 From: michaelschal <35957947-michaelschal@users.noreply.replit.com> Date: Wed, 8 Oct 2025 14:49:50 +0000 Subject: [PATCH] Add functionality to manage user permissions for social media pages Integrate new dialogs and mutations to allow administrators to assign and update user permissions for social media pages, including fetching all pages and user-specific page permissions. Replit-Commit-Author: Agent Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda Replit-Commit-Checkpoint-Type: intermediate_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/u2SCNAb --- .replit | 4 - client/src/pages/users-admin.tsx | 153 ++++++++++++++++++++++++++++++- 2 files changed, 151 insertions(+), 6 deletions(-) diff --git a/.replit b/.replit index 087ac91..518307b 100644 --- a/.replit +++ b/.replit @@ -14,10 +14,6 @@ run = ["npm", "run", "start"] localPort = 5000 externalPort = 80 -[[ports]] -localPort = 32831 -externalPort = 3003 - [[ports]] localPort = 35357 externalPort = 3002 diff --git a/client/src/pages/users-admin.tsx b/client/src/pages/users-admin.tsx index 3ba8cfb..bcab46c 100644 --- a/client/src/pages/users-admin.tsx +++ b/client/src/pages/users-admin.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; import { useQuery, useMutation } from "@tanstack/react-query"; import Sidebar from "@/components/sidebar"; import TopBar from "@/components/topbar"; @@ -11,9 +11,10 @@ import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, D import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@/components/ui/alert-dialog"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; import { Badge } from "@/components/ui/badge"; +import { Checkbox } from "@/components/ui/checkbox"; import { useToast } from "@/hooks/use-toast"; import { apiRequest, queryClient } from "@/lib/queryClient"; -import { Users, UserPlus, Pencil, Trash2, Shield, User as UserIcon } from "lucide-react"; +import { Users, UserPlus, Pencil, Trash2, Shield, User as UserIcon, Settings } from "lucide-react"; type UserData = { id: string; @@ -21,6 +22,19 @@ type UserData = { role: "admin" | "user"; }; +type SocialPage = { + id: string; + name: string; + platform: string; + userId: string; +}; + +type UserPagePermission = { + id: string; + userId: string; + pageId: string; +}; + export default function UsersAdmin() { const [sidebarOpen, setSidebarOpen] = useState(false); const { toast } = useToast(); @@ -41,11 +55,27 @@ export default function UsersAdmin() { const [deleteDialogOpen, setDeleteDialogOpen] = useState(false); const [userToDelete, setUserToDelete] = useState(null); + // Permissions dialog states + const [permissionsDialogOpen, setPermissionsDialogOpen] = useState(false); + const [permissionsUser, setPermissionsUser] = useState(null); + const [selectedPageIds, setSelectedPageIds] = useState([]); + // Charger la liste des utilisateurs const { data: users, isLoading } = useQuery({ queryKey: ["/api/users"], }); + // Charger toutes les pages (admin voit toutes les pages) + const { data: allPages } = useQuery({ + queryKey: ["/api/pages"], + }); + + // Charger les permissions de l'utilisateur sélectionné + const { data: userPermissions } = useQuery({ + queryKey: ["/api/users", permissionsUser?.id, "page-permissions"], + enabled: !!permissionsUser && permissionsDialogOpen, + }); + // Mutation pour créer un utilisateur const createUserMutation = useMutation({ mutationFn: async (userData: { username: string; password: string; role: string }) => { @@ -119,6 +149,31 @@ export default function UsersAdmin() { }, }); + // Mutation pour mettre à jour les permissions d'un utilisateur + const updatePermissionsMutation = useMutation({ + mutationFn: async ({ userId, pageIds }: { userId: string; pageIds: string[] }) => { + const res = await apiRequest("POST", `/api/users/${userId}/page-permissions`, { pageIds }); + return await res.json(); + }, + onSuccess: () => { + toast({ + title: "Permissions mises à jour", + description: "Les permissions de l'utilisateur ont été mises à jour avec succès", + }); + setPermissionsDialogOpen(false); + setPermissionsUser(null); + setSelectedPageIds([]); + queryClient.invalidateQueries({ queryKey: ["/api/users"] }); + }, + onError: (error: any) => { + toast({ + variant: "destructive", + title: "Erreur", + description: error.message || "Erreur lors de la mise à jour des permissions", + }); + }, + }); + const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); @@ -191,6 +246,37 @@ export default function UsersAdmin() { } }; + const handlePermissionsClick = (user: UserData) => { + setPermissionsUser(user); + setPermissionsDialogOpen(true); + }; + + // Mettre à jour selectedPageIds quand les permissions sont chargées + useEffect(() => { + if (userPermissions) { + setSelectedPageIds(userPermissions.map(p => p.pageId)); + } + }, [userPermissions]); + + const handlePermissionsSubmit = () => { + if (permissionsUser) { + updatePermissionsMutation.mutate({ + userId: permissionsUser.id, + pageIds: selectedPageIds, + }); + } + }; + + const togglePagePermission = (pageId: string) => { + setSelectedPageIds(prev => { + if (prev.includes(pageId)) { + return prev.filter(id => id !== pageId); + } else { + return [...prev, pageId]; + } + }); + }; + return (
{sidebarOpen && ( @@ -264,6 +350,16 @@ export default function UsersAdmin() {
+ {user.role === "user" && ( + + )} + + + +
); }