Add user deletion functionality: Implement DELETE API endpoint for user management, allowing admins to remove users while preventing self-deletion. Enhance UserManagement component with delete confirmation and error handling for improved user experience.
This commit is contained in:
@@ -149,3 +149,51 @@ export async function PUT(
|
||||
}
|
||||
}
|
||||
|
||||
export async function DELETE(
|
||||
request: Request,
|
||||
{ params }: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const session = await auth();
|
||||
|
||||
if (!session?.user || session.user.role !== Role.ADMIN) {
|
||||
return NextResponse.json({ error: "Accès refusé" }, { status: 403 });
|
||||
}
|
||||
|
||||
const { id } = await params;
|
||||
|
||||
// Vérifier que l'utilisateur existe
|
||||
const user = await prisma.user.findUnique({
|
||||
where: { id },
|
||||
});
|
||||
|
||||
if (!user) {
|
||||
return NextResponse.json(
|
||||
{ error: "Utilisateur non trouvé" },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
// Empêcher la suppression de soi-même
|
||||
if (user.id === session.user.id) {
|
||||
return NextResponse.json(
|
||||
{ error: "Vous ne pouvez pas supprimer votre propre compte" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Supprimer l'utilisateur (les relations seront supprimées en cascade)
|
||||
await prisma.user.delete({
|
||||
where: { id },
|
||||
});
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error deleting user:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Erreur lors de la suppression de l'utilisateur" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { NextResponse } from "next/server";
|
||||
import { auth } from "@/lib/auth";
|
||||
import { prisma } from "@/lib/prisma";
|
||||
import { calculateEventStatus } from "@/lib/eventStatus";
|
||||
|
||||
export async function POST(
|
||||
request: Request,
|
||||
@@ -30,7 +31,8 @@ export async function POST(
|
||||
);
|
||||
}
|
||||
|
||||
if (event.status !== "UPCOMING") {
|
||||
const eventStatus = calculateEventStatus(event.date);
|
||||
if (eventStatus !== "UPCOMING") {
|
||||
return NextResponse.json(
|
||||
{ error: "Vous ne pouvez vous inscrire qu'aux événements à venir" },
|
||||
{ status: 400 }
|
||||
|
||||
@@ -31,6 +31,7 @@ export default function UserManagement() {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [editingUser, setEditingUser] = useState<EditingUser | null>(null);
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [deletingUserId, setDeletingUserId] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
fetchUsers();
|
||||
@@ -117,14 +118,41 @@ export default function UserManagement() {
|
||||
setEditingUser(null);
|
||||
};
|
||||
|
||||
const handleDelete = async (userId: string) => {
|
||||
if (
|
||||
!confirm(
|
||||
"Êtes-vous sûr de vouloir supprimer cet utilisateur ? Cette action est irréversible."
|
||||
)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
setDeletingUserId(userId);
|
||||
try {
|
||||
const response = await fetch(`/api/admin/users/${userId}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
await fetchUsers();
|
||||
} else {
|
||||
const error = await response.json();
|
||||
alert(error.error || "Erreur lors de la suppression");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error deleting user:", error);
|
||||
alert("Erreur lors de la suppression");
|
||||
} finally {
|
||||
setDeletingUserId(null);
|
||||
}
|
||||
};
|
||||
|
||||
const formatNumber = (num: number) => {
|
||||
return num.toLocaleString("en-US");
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="text-center text-gray-400 py-8">Chargement...</div>
|
||||
);
|
||||
return <div className="text-center text-gray-400 py-8">Chargement...</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -159,11 +187,17 @@ export default function UserManagement() {
|
||||
className="w-full h-full object-cover"
|
||||
onError={(e) => {
|
||||
e.currentTarget.style.display = "none";
|
||||
e.currentTarget.nextElementSibling?.classList.remove("hidden");
|
||||
e.currentTarget.nextElementSibling?.classList.remove(
|
||||
"hidden"
|
||||
);
|
||||
}}
|
||||
/>
|
||||
) : null}
|
||||
<div className={`w-full h-full flex items-center justify-center text-pixel-gold text-sm font-bold ${user.avatar ? "hidden" : ""}`}>
|
||||
<div
|
||||
className={`w-full h-full flex items-center justify-center text-pixel-gold text-sm font-bold ${
|
||||
user.avatar ? "hidden" : ""
|
||||
}`}
|
||||
>
|
||||
{user.username.charAt(0).toUpperCase()}
|
||||
</div>
|
||||
</div>
|
||||
@@ -172,22 +206,45 @@ export default function UserManagement() {
|
||||
<h3 className="text-pixel-gold font-bold text-base">
|
||||
{user.username}
|
||||
</h3>
|
||||
<span className="text-xs text-gray-500">Niveau {user.level}</span>
|
||||
<span className="text-xs text-gray-500">Score: {formatNumber(user.score)}</span>
|
||||
<span className={`text-xs ${user.role === "ADMIN" ? "text-pixel-gold" : "text-gray-500"}`}>
|
||||
<span className="text-xs text-gray-500">
|
||||
Niveau {user.level}
|
||||
</span>
|
||||
<span className="text-xs text-gray-500">
|
||||
Score: {formatNumber(user.score)}
|
||||
</span>
|
||||
<span
|
||||
className={`text-xs ${
|
||||
user.role === "ADMIN"
|
||||
? "text-pixel-gold"
|
||||
: "text-gray-500"
|
||||
}`}
|
||||
>
|
||||
{user.role}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-gray-400 text-xs truncate">{user.email}</p>
|
||||
<p className="text-gray-400 text-xs truncate">
|
||||
{user.email}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{!isEditing && (
|
||||
<div className="flex gap-2 flex-shrink-0 ml-2">
|
||||
<button
|
||||
onClick={() => handleEdit(user)}
|
||||
className="px-3 py-1.5 border border-pixel-gold/50 bg-black/60 text-white uppercase text-xs tracking-widest rounded hover:bg-pixel-gold/10 transition flex-shrink-0 ml-2"
|
||||
className="px-3 py-1.5 border border-pixel-gold/50 bg-black/60 text-white uppercase text-xs tracking-widest rounded hover:bg-pixel-gold/10 transition"
|
||||
>
|
||||
Modifier
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleDelete(user.id)}
|
||||
disabled={deletingUserId === user.id}
|
||||
className="px-3 py-1.5 border border-red-500/50 bg-red-900/20 text-red-400 uppercase text-xs tracking-widest rounded hover:bg-red-900/30 transition disabled:opacity-50"
|
||||
>
|
||||
{deletingUserId === user.id
|
||||
? "Suppression..."
|
||||
: "Supprimer"}
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -264,7 +321,10 @@ export default function UserManagement() {
|
||||
<div
|
||||
className="h-full bg-gradient-to-r from-red-600 to-green-500 transition-all duration-300"
|
||||
style={{
|
||||
width: `${Math.min(100, (previewHp / user.maxHp) * 100)}%`,
|
||||
width: `${Math.min(
|
||||
100,
|
||||
(previewHp / user.maxHp) * 100
|
||||
)}%`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@@ -341,7 +401,10 @@ export default function UserManagement() {
|
||||
<div
|
||||
className="h-full bg-gradient-to-r from-blue-600 to-purple-500 transition-all duration-300"
|
||||
style={{
|
||||
width: `${Math.min(100, (previewXp / user.maxXp) * 100)}%`,
|
||||
width: `${Math.min(
|
||||
100,
|
||||
(previewXp / user.maxXp) * 100
|
||||
)}%`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@@ -522,7 +585,10 @@ export default function UserManagement() {
|
||||
<div
|
||||
className="h-full bg-gradient-to-r from-red-600 to-green-500"
|
||||
style={{
|
||||
width: `${Math.min(100, (user.hp / user.maxHp) * 100)}%`,
|
||||
width: `${Math.min(
|
||||
100,
|
||||
(user.hp / user.maxHp) * 100
|
||||
)}%`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@@ -538,7 +604,10 @@ export default function UserManagement() {
|
||||
<div
|
||||
className="h-full bg-gradient-to-r from-blue-600 to-purple-500"
|
||||
style={{
|
||||
width: `${Math.min(100, (user.xp / user.maxXp) * 100)}%`,
|
||||
width: `${Math.min(
|
||||
100,
|
||||
(user.xp / user.maxXp) * 100
|
||||
)}%`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@@ -552,4 +621,3 @@ export default function UserManagement() {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user