update

frontend/src/contexts/NotificationContext.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useState, ReactNode, useCallback } from 'react';
+import React, { createContext, useContext, useState, useRef, ReactNode, useCallback } from 'react';
 import { Snackbar, Alert, AlertColor } from '@mui/material';
 
 interface Notification {
@@ -22,8 +22,8 @@ interface NotificationProviderProps {
 }
 
 export const NotificationProvider: React.FC<NotificationProviderProps> = ({ children }) => {
-  const [_notifications, setNotifications] = useState<Notification[]>([]);
   const [currentNotification, setCurrentNotification] = useState<Notification | null>(null);
+  const queueRef = useRef<Notification[]>([]);
 
   // Left-side toast queue for new backend notifications
   const [toastQueue, setToastQueue] = useState<Notification[]>([]);
@@ -32,13 +32,15 @@ export const NotificationProvider: React.FC<NotificationProviderProps> = ({ chil
     const id = Date.now();
     const notification: Notification = { id, message, severity };
 
-    setNotifications((prev) => [...prev, notification]);
-
-    // If no notification is currently displayed, show this one immediately
-    if (!currentNotification) {
-      setCurrentNotification(notification);
-    }
-  }, [currentNotification]);
+    // Use functional update to avoid stale closure over currentNotification
+    setCurrentNotification((prev) => {
+      if (prev) {
+        queueRef.current.push(notification);
+        return prev;
+      }
+      return notification;
+    });
+  }, []);
 
   const showSuccess = useCallback((message: string) => {
     addNotification(message, 'success');
@@ -68,15 +70,12 @@ export const NotificationProvider: React.FC<NotificationProviderProps> = ({ chil
 
     setCurrentNotification(null);
 
-    // Show next notification after a short delay
+    // Show next queued notification after a short delay
     setTimeout(() => {
-      setNotifications((prev) => {
-        const remaining = prev.filter((n) => n.id !== currentNotification?.id);
-        if (remaining.length > 0) {
-          setCurrentNotification(remaining[0]);
-        }
-        return remaining;
-      });
+      const next = queueRef.current.shift();
+      if (next) {
+        setCurrentNotification(next);
+      }
     }, 200);
   };