admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature/IO-3255-simplified-parts-management - centralize alerts

Browse Source
This commit is contained in:
Dave
2025-08-13 18:22:12 -04:00
parent 81d642fcd3
commit a3122a59b1
4 changed files with 111 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
client/src/pages/manage/manage.page.component.jsx
View File

@@ -20,11 +20,9 @@ import LoadingSpinner from "../../components/loading-spinner/loading-spinner.com
import PartnerPingComponent from "../../components/partner-ping/partner-ping.component";
import ShopSubStatusComponent from "../../components/shop-sub-status/shop-sub-status.component";
import UpdateAlert from "../../components/update-alert/update-alert.component";
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
import { addAlerts } from "../../redux/application/application.actions.js";
import { selectAlerts } from "../../redux/application/application.selectors.js";
import { selectBodyshop, selectInstanceConflict } from "../../redux/user/user.selectors";
import InstanceRenderManager from "../../utils/instanceRenderMgr.js";
import useAlertsNotifications from "../../hooks/useAlertsNotifications.jsx";
const PrintCenterModalContainer = lazy(
() => import("../../components/print-center-modal/print-center-modal.container")
@@ -108,78 +106,16 @@ const { Content } = Layout;
const mapStateToProps = createStructuredSelector({
conflict: selectInstanceConflict,
bodyshop: selectBodyshop,
alerts: selectAlerts
bodyshop: selectBodyshop
});
const ALERT_FILE_URL = InstanceRenderManager({
imex: "https://images.imex.online/alerts/alerts-imex.json",
rome: "https://images.imex.online/alerts/alerts-rome.json"
});
const mapDispatchToProps = (dispatch) => ({
setAlerts: (alerts) => dispatch(addAlerts(alerts))
});
export function Manage({ conflict, bodyshop, alerts, setAlerts }) {
export function Manage({ conflict, bodyshop }) {
const { t } = useTranslation();
const [chatVisible] = useState(false);
const notification = useNotification();
// State to track displayed alerts
const [displayedAlertIds, setDisplayedAlertIds] = useState([]);
// Centralized alerts handling (fetch + dedupe + notifications)
useAlertsNotifications();
// Fetch displayed alerts from localStorage on mount
useEffect(() => {
const displayedAlerts = JSON.parse(localStorage.getItem("displayedAlerts") || "[]");
setDisplayedAlertIds(displayedAlerts);
}, []);
// Fetch alerts from the JSON file and dispatch to Redux store
useEffect(() => {
const fetchAlerts = async () => {
try {
const response = await fetch(ALERT_FILE_URL);
const fetchedAlerts = await response.json();
setAlerts(fetchedAlerts);
} catch (error) {
console.warn("Error fetching alerts:", error.message);
}
};
fetchAlerts().catch((err) => `Error fetching Bodyshop Alerts: ${err?.message || ""}`);
}, [setAlerts]);
// Use useEffect to watch for new alerts
useEffect(() => {
if (alerts && Object.keys(alerts).length > 0) {
// Convert the alerts object into an array
const alertArray = Object.values(alerts);
// Filter out alerts that have already been dismissed
const newAlerts = alertArray.filter((alert) => !displayedAlertIds.includes(alert.id));
newAlerts.forEach((alert) => {
// Display the notification
notification.open({
key: "notification-alerts-" + alert.id,
message: alert.message,
description: alert.description,
type: alert.type || "info",
duration: 0,
closable: true,
onClose: () => {
// When the notification is closed, update displayed alerts state and localStorage
setDisplayedAlertIds((prevIds) => {
const updatedIds = [...prevIds, alert.id];
localStorage.setItem("displayedAlerts", JSON.stringify(updatedIds));
return updatedIds;
});
}
});
});
}
}, [alerts, displayedAlertIds, notification]);
useEffect(() => {
window.Canny("initChangelog", {
appID: "680bd2c7ee501290377f6686",
@@ -657,4 +593,4 @@ export function Manage({ conflict, bodyshop, alerts, setAlerts }) {
);
}
export default connect(mapStateToProps, mapDispatchToProps)(Manage);
export default connect(mapStateToProps)(Manage);