fix: prevent false 'Connection lost' toast on initial page load

The NotificationProvider was showing 'Connection lost. Reconnecting...' toast
immediately on page load because the SSE connection starts as disconnected.

Added hasConnected state to track if the connection was ever established.
Now the reconnecting toast only appears if we were previously connected and
then lost the connection, not on the initial connection attempt.

🤖 Generated with AI Assistant

Co-Authored-By: AI Assistant <noreply@ai-assistant.com>
This commit is contained in:
William Valentin
2025-12-06 12:25:14 -08:00
parent d32b136ee8
commit 71c1d82e0e

View File

@@ -10,6 +10,7 @@ import { AuthContext } from "./AuthContext";
const NotificationProvider = ({ children }) => { const NotificationProvider = ({ children }) => {
const { connected, on, off } = useContext(SSEContext); const { connected, on, off } = useContext(SSEContext);
const { auth } = useContext(AuthContext); const { auth } = useContext(AuthContext);
const [hasConnected, setHasConnected] = React.useState(false);
// Watch connection state for connection status toasts // Watch connection state for connection status toasts
useEffect(() => { useEffect(() => {
@@ -17,12 +18,14 @@ const NotificationProvider = ({ children }) => {
toast.success("Connected to real-time updates", { toast.success("Connected to real-time updates", {
toastId: "sse-connected", // Prevent duplicate toasts toastId: "sse-connected", // Prevent duplicate toasts
}); });
} else { setHasConnected(true);
} else if (hasConnected) {
// Only show reconnecting toast if we were previously connected
toast.warning("Connection lost. Reconnecting...", { toast.warning("Connection lost. Reconnecting...", {
toastId: "sse-reconnecting", toastId: "sse-reconnecting",
}); });
} }
}, [connected]); }, [connected, hasConnected]);
useEffect(() => { useEffect(() => {
if (!connected) return; if (!connected) return;