Fixes #4350: updates incorrectly replacing old state instead of actual (

#4349) * fix: updates incorrectly replacing old state instead of actual. * fix: follow up for #4349: apply fix to messages as well * Update Messages.js * Update Toast.js --------- Co-authored-by: Melloware <[email protected]>
primefaces · May 9, 2023 · d168af8 · d168af8
1 parent cfe06c5
commit d168af8
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 27 deletions.
diff --git a/components/lib/messages/Messages.js b/components/lib/messages/Messages.js
@@ -13,15 +13,13 @@ export const Messages = React.memo(
         const [messagesState, setMessagesState] = React.useState([]);
         const elementRef = React.useRef(null);
 
-        const show = (value) => {
-            if (value) {
-                const messages = assignIdentifiers(value, true);
-
-                setMessagesState(messages);
+        const show = (messageInfo) => {
+            if (messageInfo) {
+                setMessagesState((prev) => assignIdentifiers(prev, messageInfo, true));
             }
         };
 
-        const assignIdentifiers = (messageInfo, copy) => {
+        const assignIdentifiers = (currentState, messageInfo, copy) => {
             let messages;
 
             if (Array.isArray(messageInfo)) {
@@ -32,15 +30,15 @@ export const Messages = React.memo(
                 }, []);
 
                 if (copy) {
-                    messages = messagesState ? [...messagesState, ...multipleMessages] : multipleMessages;
+                    messages = currentState ? [...currentState, ...multipleMessages] : multipleMessages;
                 } else {
                     messages = multipleMessages;
                 }
             } else {
                 const message = { _pId: messageIdx++, message: messageInfo };
 
                 if (copy) {
-                    messages = messagesState ? [...messagesState, message] : [message];
+                    messages = currentState ? [...currentState, message] : [message];
                 } else {
                     messages = [message];
                 }
@@ -54,15 +52,11 @@ export const Messages = React.memo(
         };
 
         const replace = (messageInfo) => {
-            const replaced = assignIdentifiers(messageInfo, false);
-
-            setMessagesState(replaced);
+            setMessagesState((prev) => assignIdentifiers(prev, messageInfo, false));
         };
 
         const remove = (messageInfo) => {
-            const messages = messagesState.filter((msg) => msg._pId !== messageInfo._pId);
-
-            setMessagesState(messages);
+            setMessagesState((prev) => prev.filter((msg) => msg._pId !== messageInfo._pId));
 
             props.onRemove && props.onRemove(messageInfo.message);
         };

diff --git a/components/lib/toast/Toast.js b/components/lib/toast/Toast.js
@@ -4,7 +4,7 @@ import PrimeReact from '../api/Api';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { Portal } from '../portal/Portal';
-import { classNames, ZIndexUtils } from '../utils/Utils';
+import { ZIndexUtils, classNames } from '../utils/Utils';
 import { ToastBase } from './ToastBase';
 import { ToastMessage } from './ToastMessage';
 
@@ -19,13 +19,11 @@ export const Toast = React.memo(
 
         const show = (messageInfo) => {
             if (messageInfo) {
-                const messages = assignIdentifiers(messageInfo, true);
-
-                setMessagesState(messages);
+                setMessagesState((prev) => assignIdentifiers(prev, messageInfo, true));
             }
         };
 
-        const assignIdentifiers = (messageInfo, copy) => {
+        const assignIdentifiers = (currentState, messageInfo, copy) => {
             let messages;
 
             if (Array.isArray(messageInfo)) {
@@ -36,15 +34,15 @@ export const Toast = React.memo(
                 }, []);
 
                 if (copy) {
-                    messages = messagesState ? [...messagesState, ...multipleMessages] : multipleMessages;
+                    messages = currentState ? [...currentState, ...multipleMessages] : multipleMessages;
                 } else {
                     messages = multipleMessages;
                 }
             } else {
                 const message = { _pId: messageIdx++, message: messageInfo };
 
                 if (copy) {
-                    messages = messagesState ? [...messagesState, message] : [message];
+                    messages = currentState ? [...currentState, message] : [message];
                 } else {
                     messages = [message];
                 }
@@ -59,15 +57,11 @@ export const Toast = React.memo(
         };
 
         const replace = (messageInfo) => {
-            const replaced = assignIdentifiers(messageInfo, false);
-
-            setMessagesState(replaced);
+            setMessagesState((previousMessagesState) => assignIdentifiers(previousMessagesState, messageInfo, false));
         };
 
         const remove = (messageInfo) => {
-            const messages = messagesState.filter((msg) => msg._pId !== messageInfo._pId);
-
-            setMessagesState(messages);
+            setMessagesState((m) => m.filter((msg) => msg._pId !== messageInfo._pId));
 
             props.onRemove && props.onRemove(messageInfo.message);
         };