From e701c2bd29d7aa04cbaca294226fd0ab7ed63915 Mon Sep 17 00:00:00 2001
From: Nick Adam <hi@nixk.de>
Date: Fri, 21 Nov 2025 00:31:54 +0100
Subject: [PATCH] refined delete function in permission groups

---
 backend/spaces.db-shm              | Bin 32768 -> 32768 bytes
 backend/spaces.db-wal              | Bin 2698632 -> 2748072 bytes
 frontend/src/pages/Permissions.jsx |  93 +++++++++++++++++++++++++++--
 3 files changed, 87 insertions(+), 6 deletions(-)

diff --git a/backend/spaces.db-shm b/backend/spaces.db-shm
index aa0ec1d58d92697db5e8f1eb5450d232a70a67d8..a184a4a98f87abf24aff63beb96da865f3bd1085 100644
GIT binary patch
delta 297
zcmZo@U}|V!s+V}A%K!okfS8eiL0~o$1A{7%{rh&^yMyKP<bh1qCLy&Ctv*}YZ+q{)
zNve9FelP%;`yUBFg*Vo_a!o$KDKNQ&OJVa7t_Nn5uQ)a^&YT?Rx^nYBrw}H_SzzWL
z*K1;ovo~Lik!0NbCiV^^<AlwEiHeMyUnSgPWSj_OD>H6>k^F*@aS~9CDC6d5X+ZX5
z2>VGUP|XyGnnyW6_EZS_L4Fk{<Fw6;DZ3dbU*I}4`9^gE<8%b~T3rL<43OmjD<W~g

delta 266
zcmZo@U}|V!s+V}A%K!rNfS8eiL7<<Bfk73>b}3U{&UL2l0FcSrB&7C%>+0Q^`wnHg
zlByo49}Ga|{zn2(;f?jKT${geJusWZZ7}(YW5Z;j#8sRBIfXER8Gl@_iES22lw#cc
zCiV^^kfp@9`BlO#5KDz|^NZvcAeI>8=4WXz){{(_?4ukQ>p^}M=VqpqU5t~sk4(N%
M-2i7_s{`8y095W_0RR91

diff --git a/backend/spaces.db-wal b/backend/spaces.db-wal
index dc681d3f111e5d08d5bb88ca10cbc6448411808e..c240e1f074cc531ac3a9ff87ef5d8500c14c0a3d 100644
GIT binary patch
delta 895
zcma))ZD<rn9L9I`?s9vZoyp6^c;=Ga#of&u=cK#0ms~E2hH6CG*rbW4iKW$GbBYNX
zu&I8Ck_&(241xwV14YyizM>c*tt<5<jaseL+DM^F!=<IRrENeAf>uJ+y~_u`I`d&*
z=K1}fhlfdyALmb}PVv3K!z`E$Hn4*OvcL%fxIlz#kN^RO9LR+{$OktRz#J%qx!{3$
zPy}8mh7u?RANZjR=7S6hs89~%%RrK{u0kcpomjcB_WcRrxrEPhJZ|N1D{eJ&7iO)*
z?EY<~$;okC%p>`iu-=oh%(m{9wIb_^v-jnxPbU4z;ER^)DHncdu|pglGRLk7GCrUU
zB$)4%-Nu?Diej_mWCp)5DCf*6zCQJL*V^juB|L0VaSq3^2Yb?<B4#fxlP{RjLjr8?
zVG?{}^*q=g{Cs+HqbmcobGY3+)<Z@R`}M4)y>d~O9X9Lf1AfNHf@QYg964Gbr_)+1
z6L`zLr4RcYhrTuUf2VX{7Mw0Wk+)*#QqQ9h*X^=Iyfp$3n`49WM>sv%&bIAQW!5lV
zF0+1-e4?(8U25!DU!R{AQ|DbSyGeY23efNPV_`D;ndlO_q#Mq==7Jx{d1t19Kvl%h
zjVdEd^|q=A4IAMwjeZ){XuEDySL#|@s8X+@WOj^a>wE#(q(76Vj=Wc?KllDsGMUQQ
zh<7;gj;W={h{zfy1c_DLQXTeajS-^Ee@o3bz5fue4X<c!@{b--{+NmOgq7}48bsl$
za8T$F-W5Df^TW>KeNNW9xs>pf<zCGvX5tz7(c%5CddqJk_ZO|pfXL0^QPhT3qgvF7
z+^jaKEH^LwPrjDeH(z;dS<C9`>sHlKbGsOr;!BbhKaC$B>#m<cWe!iEqo^Nsqctds
zWY+kv`kr}D3fz>~nWBK3r>1p0;L9HG8lNsbvVBytS`_#e4xP(>DXtX;oL)z>?b@u{
ze9N$ZU@^b6uainKBUb34vBW#U#G1G1GNgqnsjkzI?$flI5ZgC3m)g>)*)MT*wYagp
o^Tx$(8#aAb<IDV%+_If|C{m$WTdxTlk*LP_xEePbeSvD}H3Kgg00000

delta 93
zcmV~$*%84|006*w&JZL)+*c6ChaP?GM+z}R0lLZP#qQ_#4psdMPeDUdOIt@*q^B=7
jFf@`#WyU6^ax-%aODk&|TRVFPg`<<R(#6&7d#@gUt?3>d

diff --git a/frontend/src/pages/Permissions.jsx b/frontend/src/pages/Permissions.jsx
index 9c556b2..265247b 100644
--- a/frontend/src/pages/Permissions.jsx
+++ b/frontend/src/pages/Permissions.jsx
@@ -10,6 +10,9 @@ const Permissions = () => {
   const [error, setError] = useState('')
   const [showForm, setShowForm] = useState(false)
   const [editingGroup, setEditingGroup] = useState(null)
+  const [showDeleteModal, setShowDeleteModal] = useState(false)
+  const [groupToDelete, setGroupToDelete] = useState(null)
+  const [confirmChecked, setConfirmChecked] = useState(false)
   const [formData, setFormData] = useState({
     name: '',
     description: '',
@@ -132,28 +135,43 @@ const Permissions = () => {
     setShowForm(true)
   }
 
-  const handleDelete = async (groupId) => {
-    if (!window.confirm('Möchten Sie diese Berechtigungsgruppe wirklich löschen?')) {
+  const handleDelete = (group) => {
+    setGroupToDelete(group)
+    setShowDeleteModal(true)
+    setConfirmChecked(false)
+  }
+
+  const confirmDelete = async () => {
+    if (!confirmChecked || !groupToDelete) {
       return
     }
 
     try {
-      const response = await authFetch(`/api/permission-groups/${groupId}`, {
+      const response = await authFetch(`/api/permission-groups/${groupToDelete.id}`, {
         method: 'DELETE',
       })
 
       if (response.ok) {
         await fetchGroups()
+        setShowDeleteModal(false)
+        setGroupToDelete(null)
+        setConfirmChecked(false)
       } else {
-        const errorData = await response.json()
+        const errorData = await response.json().catch(() => ({ error: 'Fehler beim Löschen' }))
         alert(errorData.error || 'Fehler beim Löschen der Berechtigungsgruppe')
       }
     } catch (err) {
-      alert('Fehler beim Löschen der Berechtigungsgruppe')
       console.error('Error deleting permission group:', err)
+      alert('Fehler beim Löschen der Berechtigungsgruppe')
     }
   }
 
+  const cancelDelete = () => {
+    setShowDeleteModal(false)
+    setGroupToDelete(null)
+    setConfirmChecked(false)
+  }
+
   const handleChange = (e) => {
     setFormData({
       ...formData,
@@ -488,7 +506,7 @@ const Permissions = () => {
                       </svg>
                     </button>
                     <button
-                      onClick={() => handleDelete(group.id)}
+                      onClick={() => handleDelete(group)}
                       className="p-2 bg-red-600/20 hover:bg-red-600/30 text-red-300 rounded-lg transition-all duration-200"
                       title="Löschen"
                     >
@@ -541,6 +559,69 @@ const Permissions = () => {
             ))}
           </div>
         )}
+
+        {/* Delete Confirmation Modal */}
+        {showDeleteModal && groupToDelete && (
+          <div className="fixed inset-0 bg-black/60 backdrop-blur-sm z-50 flex items-center justify-center p-4">
+            <div className="bg-slate-800 rounded-xl shadow-2xl border border-slate-600/50 max-w-md w-full p-6">
+              <div className="flex items-center mb-4">
+                <div className="flex-shrink-0 w-12 h-12 bg-red-500/20 rounded-full flex items-center justify-center mr-4">
+                  <svg
+                    className="w-6 h-6 text-red-400"
+                    fill="none"
+                    strokeLinecap="round"
+                    strokeLinejoin="round"
+                    strokeWidth="2"
+                    viewBox="0 0 24 24"
+                    stroke="currentColor"
+                  >
+                    <path d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+                  </svg>
+                </div>
+                <h3 className="text-xl font-bold text-white">
+                  Berechtigungsgruppe löschen
+                </h3>
+              </div>
+
+              <div className="mb-6">
+                <p className="text-slate-300 mb-4">
+                  Möchten Sie die Berechtigungsgruppe <span className="font-semibold text-white">{groupToDelete.name}</span> wirklich löschen?
+                </p>
+                <p className="text-sm text-red-400 mb-4">
+                  Diese Aktion kann nicht rückgängig gemacht werden.
+                </p>
+
+                <label className="flex items-start cursor-pointer group">
+                  <input
+                    type="checkbox"
+                    checked={confirmChecked}
+                    onChange={(e) => setConfirmChecked(e.target.checked)}
+                    className="mt-1 w-5 h-5 text-red-600 bg-slate-700 border-slate-600 rounded focus:ring-2 focus:ring-red-500 focus:ring-offset-2 focus:ring-offset-slate-800 cursor-pointer"
+                  />
+                  <span className="ml-3 text-sm text-slate-300 group-hover:text-white transition-colors">
+                    Ich bestätige, dass ich diese Berechtigungsgruppe unwiderruflich löschen möchte
+                  </span>
+                </label>
+              </div>
+
+              <div className="flex gap-3">
+                <button
+                  onClick={confirmDelete}
+                  disabled={!confirmChecked}
+                  className="flex-1 px-4 py-2 bg-red-600 hover:bg-red-700 disabled:bg-slate-700 disabled:text-slate-500 disabled:cursor-not-allowed text-white font-semibold rounded-lg transition-colors duration-200"
+                >
+                  Löschen
+                </button>
+                <button
+                  onClick={cancelDelete}
+                  className="flex-1 px-4 py-2 bg-slate-600 hover:bg-slate-700 text-white font-semibold rounded-lg transition-colors duration-200"
+                >
+                  Abbrechen
+                </button>
+              </div>
+            </div>
+          </div>
+        )}
       </div>
     </div>
   )