From b7f215e90c61e58d524dbd6ae48b9d3903c9a626 Mon Sep 17 00:00:00 2001
From: hsiegeln <37154749+hsiegeln@users.noreply.github.com>
Date: Wed, 8 Apr 2026 17:55:37 +0200
Subject: [PATCH] feat: add delete confirmation dialog for apps

Prevents accidental app deletion by requiring the user to type the app
slug before confirming.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 ui/src/pages/AppsTab/AppsTab.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/ui/src/pages/AppsTab/AppsTab.tsx b/ui/src/pages/AppsTab/AppsTab.tsx
index 18aa411e..a08e9973 100644
--- a/ui/src/pages/AppsTab/AppsTab.tsx
+++ b/ui/src/pages/AppsTab/AppsTab.tsx
@@ -3,6 +3,7 @@ import { useParams, useNavigate } from 'react-router';
 import {
   Badge,
   Button,
+  ConfirmDialog,
   DataTable,
   Input,
   Modal,
@@ -271,6 +272,7 @@ function AppDetailView({ appId, environments, selectedEnv }: { appId: string; en
   const deleteApp = useDeleteApp();
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [subTab, setSubTab] = useState<'overview' | 'config'>('overview');
+  const [deleteConfirm, setDeleteConfirm] = useState(false);
 
   const envMap = useMemo(() => new Map(environments.map((e) => [e.id, e])), [environments]);
   const sortedVersions = useMemo(() => [...versions].sort((a, b) => b.version - a.version), [versions]);
@@ -323,7 +325,7 @@ function AppDetailView({ appId, environments, selectedEnv }: { appId: string; en
         <div className={styles.detailActions}>
           <input ref={fileInputRef} type="file" accept=".jar" style={{ display: 'none' }} onChange={handleUpload} />
           <Button size="sm" variant="primary" onClick={() => fileInputRef.current?.click()} loading={uploadJar.isPending}>Upload JAR</Button>
-          <Button size="sm" variant="danger" onClick={handleDelete}>Delete App</Button>
+          <Button size="sm" variant="danger" onClick={() => setDeleteConfirm(true)}>Delete App</Button>
         </div>
       </div>
 
@@ -342,6 +344,15 @@ function AppDetailView({ appId, environments, selectedEnv }: { appId: string; en
       {subTab === 'config' && (
         <ConfigSubTab app={app} environment={env} />
       )}
+
+      <ConfirmDialog
+        open={deleteConfirm}
+        onClose={() => setDeleteConfirm(false)}
+        onConfirm={handleDelete}
+        message={`Delete app "${app.displayName}"? All versions and deployments will be removed. This cannot be undone.`}
+        confirmText={app.slug}
+        loading={deleteApp.isPending}
+      />
     </div>
   );
 }