From f276d6286100ba95ba1a4daeb9910f10834e437c Mon Sep 17 00:00:00 2001
From: melloware <mellowaredev@gmail.com>
Date: Thu, 12 Oct 2023 08:33:58 -0400
Subject: [PATCH] Fix #5083: Toast/Messages remove by message

---
 components/lib/messages/Messages.js |  9 ++++++---
 components/lib/toast/Toast.js       | 14 ++++++++------
 components/lib/utils/ObjectUtils.js |  6 ++++++
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/components/lib/messages/Messages.js b/components/lib/messages/Messages.js
index 72414ed500..41e4874357 100644
--- a/components/lib/messages/Messages.js
+++ b/components/lib/messages/Messages.js
@@ -3,7 +3,7 @@ import { TransitionGroup } from 'react-transition-group';
 import { PrimeReactContext } from '../api/Api';
 import { useHandleStyle } from '../componentbase/ComponentBase';
 import { CSSTransition } from '../csstransition/CSSTransition';
-import { mergeProps } from '../utils/Utils';
+import { ObjectUtils, mergeProps } from '../utils/Utils';
 import { MessagesBase } from './MessagesBase';
 import { UIMessage } from './UIMessage';
 
@@ -70,9 +70,12 @@ export const Messages = React.memo(
         };
 
         const remove = (messageInfo) => {
-            setMessagesState((prev) => prev.filter((msg) => msg._pId !== messageInfo._pId));
+            // allow removal by ID or by message equality
+            const removeMessage = messageInfo._pId ? messageInfo.message : messageInfo;
 
-            props.onRemove && props.onRemove(messageInfo.message);
+            setMessagesState((prev) => prev.filter((msg) => msg._pId !== messageInfo._pId && !ObjectUtils.deepEquals(msg.message, removeMessage)));
+
+            props.onRemove && props.onRemove(removeMessage);
         };
 
         const onClose = (messageInfo) => {
diff --git a/components/lib/toast/Toast.js b/components/lib/toast/Toast.js
index 1fe29ab3ce..47403d97e6 100644
--- a/components/lib/toast/Toast.js
+++ b/components/lib/toast/Toast.js
@@ -1,14 +1,13 @@
 import * as React from 'react';
 import { TransitionGroup } from 'react-transition-group';
-import { PrimeReactContext } from '../api/Api';
+import PrimeReact, { PrimeReactContext } from '../api/Api';
+import { useHandleStyle } from '../componentbase/ComponentBase';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { Portal } from '../portal/Portal';
-import { ZIndexUtils, mergeProps } from '../utils/Utils';
+import { ObjectUtils, ZIndexUtils, mergeProps } from '../utils/Utils';
 import { ToastBase } from './ToastBase';
 import { ToastMessage } from './ToastMessage';
-import PrimeReact from '../api/Api';
-import { useHandleStyle } from '../componentbase/ComponentBase';
 
 let messageIdx = 0;
 
@@ -75,9 +74,12 @@ export const Toast = React.memo(
         };
 
         const remove = (messageInfo) => {
-            setMessagesState((m) => m.filter((msg) => msg._pId !== messageInfo._pId));
+            // allow removal by ID or by message equality
+            const removeMessage = messageInfo._pId ? messageInfo.message : messageInfo;
+
+            setMessagesState((prev) => prev.filter((msg) => msg._pId !== messageInfo._pId && !ObjectUtils.deepEquals(msg.message, removeMessage)));
 
-            props.onRemove && props.onRemove(messageInfo.message);
+            props.onRemove && props.onRemove(removeMessage);
         };
 
         const onClose = (messageInfo) => {
diff --git a/components/lib/utils/ObjectUtils.js b/components/lib/utils/ObjectUtils.js
index 998d7f610b..9076adbf04 100644
--- a/components/lib/utils/ObjectUtils.js
+++ b/components/lib/utils/ObjectUtils.js
@@ -4,6 +4,12 @@ export default class ObjectUtils {
         else return this.deepEquals(obj1, obj2);
     }
 
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
     static deepEquals(a, b) {
         if (a === b) return true;