From 525b773cf4799913ac24e34857348e3aa176608b Mon Sep 17 00:00:00 2001
From: rootphantomer <rootphantomy@hotmail.com>
Date: Sun, 5 Jul 2026 17:03:28 +0800
Subject: [PATCH] fix: preserve dialog title during closing animation to
 prevent flash

---
 webapp/src/components/ConfirmDialog.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/webapp/src/components/ConfirmDialog.tsx b/webapp/src/components/ConfirmDialog.tsx
index 51a1c1f..6f5f6e8 100644
--- a/webapp/src/components/ConfirmDialog.tsx
+++ b/webapp/src/components/ConfirmDialog.tsx
@@ -87,6 +87,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
   const cardRef = useRef<HTMLFormElement | null>(null);
   const maskPointerStartedRef = useRef(false);
   const restoreFocusRef = useRef<HTMLElement | null>(null);
+  const lastTitleRef = useRef<ComponentChildren>(props.title);
   const dialogId = useMemo(() => `confirm-dialog-${++dialogIdCounter}`, []);
   const titleId = `${dialogId}-title`;
   const messageId = `${dialogId}-message`;
@@ -95,6 +96,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
 
   useEffect(() => {
     if (props.open) {
+      lastTitleRef.current = props.title;
       setPresent(true);
       setClosing(false);
       return;
@@ -228,7 +230,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
             <X size={18} />
           </button>
         )}
-        <h3 id={titleId} className="dialog-title">{props.title}</h3>
+        <h3 id={titleId} className="dialog-title">{props.open ? props.title : lastTitleRef.current}</h3>
         {hasMessage && <div id={messageId} className={`dialog-message ${props.variant === 'warning' ? 'warning' : ''}`}>{props.message}</div>}
         {props.children}
         {!props.hideConfirm && (