diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx index 24fe2143..2604ae59 100644 --- a/src/components/header/Header.jsx +++ b/src/components/header/Header.jsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import { Link } from 'react-router-dom/dist'; import AppBar from '@mui/material/AppBar'; import Box from '@mui/material/Box'; @@ -8,6 +8,9 @@ import Logo from '../icons/Logo.jsx'; import AuthorizedOptions from './AuthorizedOptions.jsx'; import UnauthorizedOptions from './UnauthorizedOptions.jsx'; import { addTestsLabel, isAuth } from '../../lib/helper.js'; +import { AUDITOR, CUSTOMER } from '../../redux/actions/types.js'; +import CustomSnackbar from '../custom/CustomSnackbar.jsx'; +import { useSelector } from 'react-redux'; const Header = () => { return ( diff --git a/src/routes/AppRoutes.jsx b/src/routes/AppRoutes.jsx index 749d2438..4b829bf1 100644 --- a/src/routes/AppRoutes.jsx +++ b/src/routes/AppRoutes.jsx @@ -1,4 +1,4 @@ -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { Route, Routes } from 'react-router-dom/dist'; import { useDispatch, useSelector } from 'react-redux'; import HomePage from '../pages/HomePage.jsx'; @@ -50,6 +50,7 @@ import DeleteBadge from '../pages/Delete-badge.jsx'; import Github from '../pages/Github.jsx'; import ConnectAccount from '../pages/Connect-account.jsx'; import DisclaimerPage from '../pages/DisclaimerPage.jsx'; +import { AUDITOR, CUSTOMER } from '../redux/actions/types.js'; const AppRoutes = () => { const token = useSelector(s => s.user.token); @@ -59,6 +60,25 @@ const AppRoutes = () => { const dispatch = useDispatch(); const { reconnect, connected, needUpdate } = useSelector(s => s.websocket); const [isOpen, setIsOpen] = React.useState(false); + const { differentRoleUnreadMessages } = useSelector(s => s.chat); + const reduxUser = useSelector(state => state.user.user); + const [isOpenAlert, setIsOpenAlert] = useState(false); + + useEffect(() => { + if ( + isAuth() && + differentRoleUnreadMessages > 0 && + reduxUser.current_role !== AUDITOR + ) { + setIsOpenAlert(true); + } else if ( + isAuth() && + differentRoleUnreadMessages > 0 && + reduxUser.current_role !== CUSTOMER + ) { + setIsOpenAlert(true); + } + }, [differentRoleUnreadMessages, isAuth()]); useEffect(() => { if (isAuth()) { @@ -136,6 +156,13 @@ const AppRoutes = () => { onClose={() => setIsOpen(false)} text="New version is available. Please reload the page" /> + setIsOpenAlert(false)} + text="You have unread notifications for a different role profile" + /> } /> } />