feature/IO-3096-GlobalNotifications - Checkpoint - Clicking the alert notification will also navigate you to the job.

This commit is contained in:
Dave Richer
2025-02-26 16:44:25 -05:00
parent abd530b8b2
commit eb51085055
2 changed files with 16 additions and 8 deletions

View File

@@ -4,7 +4,7 @@ import LogRocket from "logrocket";
import { lazy, Suspense, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { Route, Routes } from "react-router-dom";
import { Route, Routes, useNavigate } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import DocumentEditorContainer from "../components/document-editor/document-editor.container";
import ErrorBoundary from "../components/error-boundary/error-boundary.component"; // Component Imports
@@ -46,6 +46,7 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
const client = useSplitClient().client;
const [listenersAdded, setListenersAdded] = useState(false);
const { t } = useTranslation();
const navigate = useNavigate();
useEffect(() => {
if (!navigator.onLine) {
@@ -200,7 +201,7 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
path="/manage/*"
element={
<ErrorBoundary>
<SocketProvider bodyshop={bodyshop}>
<SocketProvider bodyshop={bodyshop} navigate={navigate}>
<PrivateRoute isAuthorized={currentUser.authorized} />
</SocketProvider>
</ErrorBoundary>
@@ -212,7 +213,7 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
path="/tech/*"
element={
<ErrorBoundary>
<SocketProvider bodyshop={bodyshop}>
<SocketProvider bodyshop={bodyshop} navigate={navigate}>
<PrivateRoute isAuthorized={currentUser.authorized} />
</SocketProvider>
</ErrorBoundary>

View File

@@ -15,7 +15,7 @@ import { useMutation } from "@apollo/client";
const SocketContext = createContext(null);
export const SocketProvider = ({ children, bodyshop }) => {
export const SocketProvider = ({ children, bodyshop, navigate }) => {
const socketRef = useRef(null);
const [clientId, setClientId] = useState(null);
const [isConnected, setIsConnected] = useState(false);
@@ -279,9 +279,16 @@ export const SocketProvider = ({ children, bodyshop }) => {
description: (
<ul
onClick={() => {
markNotificationRead({ variables: { id: notificationId } }).catch((e) =>
console.error(`Error marking notification read from info: ${e?.message || ""}`)
);
markNotificationRead({ variables: { id: notificationId } })
.then(() => {
if (navigate) {
navigate(`/manage/jobs/${jobId}`); // Use react-router-dom navigate
} else {
console.warn("Navigate function not provided to SocketProvider");
window.location.href = `/manage/jobs/${jobId}`; // Fallback
}
})
.catch((e) => console.error(`Error marking notification read from info: ${e?.message || ""}`));
}}
style={{ cursor: "pointer" }}
>
@@ -345,7 +352,7 @@ export const SocketProvider = ({ children, bodyshop }) => {
setIsConnected(false);
}
};
}, [bodyshop, notification, userAssociationId, markNotificationRead, markAllNotificationsRead]);
}, [bodyshop, notification, userAssociationId, markNotificationRead, markAllNotificationsRead, navigate]); // Add navigate to dependencies
return (
<SocketContext.Provider