# Bug: Ghost/duplicate closing animation when using multiple ConfirmDialog groups (#8535)

## Problem

When multiple <ConfirmDialog> instances are used with different group props, opening a secondary dialog and then closing it causes a ghost flash of the secondary dialog's content during the main dialog's closing animation.

## Root Cause

All ConfirmDialog instances listen to the same confirm-dialog event on OverlayService. The event handler only filtered by tagKey to decide whether to process an event:

```javascript
    const confirm = (updatedProps) => {
        if (updatedProps.tagKey === props.tagKey) { // both are undefined → always true
```

Since tagKey is undefined by default on all instances, every instance processed every event. While the group check inside show() correctly prevented the wrong dialog from becoming visible, confirmProps.current was still being overwritten with the incoming event's props before that check ran:

```javascript
    confirmProps.current = updatedProps; // ← written on ALL instances, regardless of group
    updatedProps.visible ? show() : hide();
```

So after opening and closing a secondary dialog, the main dialog's confirmProps.current held stale props from the secondary dialog. When the main dialog later closed, it rendered those stale props during its closing animation — causing the ghost flash.

## Fix

Add a group check to the event handler so each instance only processes events intended for its own group:

```javascript
    if (updatedProps.tagKey === props.tagKey && (updatedProps.group === undefined || updatedProps.group === props.group)) {
```

The updatedProps.group === undefined condition preserves backward compatibility for single-dialog usage where no group is specified.

Co-authored-by: Nitipol Pattanapun <nitipolpat@gosoft.co.th>

Author: icenitipol

components/lib/confirmdialog/ConfirmDialog.js

@@ -105,7 +105,7 @@ export const ConfirmDialog = React.memo(
         };
 
         const confirm = (updatedProps) => {
-            if (updatedProps.tagKey === props.tagKey) {
+            if (updatedProps.tagKey === props.tagKey && (updatedProps.group === undefined || updatedProps.group === props.group)) {
                 const isVisibleChanged = visibleState !== updatedProps.visible;
                 const targetChanged = getPropValue('target') !== updatedProps.target;