feat(profile): add account deletion with confirmation and update privacy policy

This commit is contained in:
jessy-david-dev
2026-04-10 19:24:12 +02:00
parent cd5f2bdf3f
commit 2242adc011
3 changed files with 66 additions and 1 deletions
+14
View File
@@ -0,0 +1,14 @@
import { NextResponse } from "next/server";
import { auth } from "../../../auth";
import { prisma } from "../../../lib/prisma";
export async function DELETE() {
const session = await auth();
if (!session?.user?.id) {
return NextResponse.json({ error: "Non connecté" }, { status: 401 });
}
await prisma.user.delete({ where: { id: session.user.id } });
return NextResponse.json({ ok: true });
}
+47
View File
@@ -46,6 +46,15 @@ export function ProfileScreen({ userName, onBack }: { userName: string; onBack:
const [games, setGames] = useState<Game[]>([]);
const [loading, setLoading] = useState(true);
const [filter, setFilter] = useState<"all" | "solo" | "multi">("all");
const [confirmDelete, setConfirmDelete] = useState(false);
const [deleting, setDeleting] = useState(false);
async function handleDeleteAccount() {
setDeleting(true);
await fetch("/api/account", { method: "DELETE" });
await signOut({ redirect: false });
onBack();
}
useEffect(() => {
fetch("/api/games")
@@ -160,6 +169,44 @@ export function ProfileScreen({ userName, onBack }: { userName: string; onBack:
</div>
))}
</div>
{/* Danger zone */}
<div className="mt-8 border border-red-900/50 rounded-xl p-4 flex flex-col gap-3">
<h3 className="text-xs font-bold text-red-400 uppercase tracking-wider">Zone dangereuse</h3>
{!confirmDelete ? (
<div className="flex items-center justify-between gap-3 flex-wrap">
<p className="text-xs sm:text-sm text-[#888]">Supprime définitivement ton compte et toutes tes parties.</p>
<button
className="min-h-9 px-3 rounded-lg text-xs sm:text-sm font-semibold bg-transparent border border-red-800 text-red-400 hover:bg-red-950/40 cursor-pointer transition-colors shrink-0"
onClick={() => setConfirmDelete(true)}
>
Supprimer mon compte
</button>
</div>
) : (
<div className="flex flex-col gap-3">
<p className="text-xs sm:text-sm text-red-300 font-semibold">
Cette action est irréversible. Toutes tes données seront supprimées.
</p>
<div className="flex gap-2">
<button
className="flex-1 min-h-9 px-3 rounded-lg text-xs sm:text-sm font-semibold bg-red-700 hover:bg-red-600 text-white cursor-pointer disabled:opacity-50 transition-colors"
onClick={handleDeleteAccount}
disabled={deleting}
>
{deleting ? "Suppression..." : "Oui, supprimer"}
</button>
<button
className="flex-1 min-h-9 px-3 rounded-lg text-xs sm:text-sm font-semibold bg-[#242424] border border-[#2e2e2e] text-[#f0f0f0] hover:bg-[#1a1a1a] cursor-pointer transition-colors"
onClick={() => setConfirmDelete(false)}
disabled={deleting}
>
Annuler
</button>
</div>
</div>
)}
</div>
</div>
);
}
+5 -1
View File
@@ -74,7 +74,11 @@ export default function PrivacyPage() {
<p>Vous pouvez à tout moment :</p>
<ul className="list-disc pl-5 flex flex-col gap-1.5">
<li><span className="text-[#f0f0f0] font-semibold">Consulter</span> vos données via votre page de profil.</li>
<li><span className="text-[#f0f0f0] font-semibold">Demander la suppression</span> de votre compte et de toutes vos données en nous contactant.</li>
<li>
<span className="text-[#f0f0f0] font-semibold">Supprimer</span> votre compte directement depuis votre profil,
rubrique <span className="italic">Zone dangereuse</span>. Cette action supprime immédiatement et définitivement
votre compte ainsi que l&apos;intégralité de vos parties enregistrées.
</li>
</ul>
</section>