Change logic of handling all notifications array

src/common/Topics/ChatsBlock/ChatsBlock.jsx

@@ -23,7 +23,7 @@ import {
 } from '../../../redux/chatSlice';
 import { useUser } from '../../../hooks/useUser';
 // eslint-disable-next-line max-len
-import { selectAccessToken } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import localLogOutUtil from '../../../utils/localLogOutUtil';
 import {
   subscribeOnlineOrTypingStatus,

src/components/Chat/Chat.jsx

@@ -77,7 +77,7 @@ import {
   useSendMessageToNewTopicMutation,
   useSendMessageToTopicMutation,
 } from '../../redux/messagesAPI/messagesAPI';
-import { selectAccessToken } from '../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import localLogOutUtil from '../../utils/localLogOutUtil';
 import UsersAvatar from './UsersAvatar/';
 import { useMediaQuery } from 'react-responsive';

src/components/Chat/MessageContainerObserver/MessageContainerObserver.jsx

@@ -4,7 +4,7 @@ import { useInView } from 'react-intersection-observer';
 import { MessageContainer } from '../Chat.styled';
 import { useSetMessageStatusMutation } from '../../../redux/messagesAPI/messagesAPI';
 import { useDispatch, useSelector } from 'react-redux';
-import { selectAccessToken } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import { useEffect, useState } from 'react';
 import { deletReadedAllTopicsNotification } from '../../../redux/chatSlice';
 

src/components/Chat/TopicSettingsMenu/TopicSettingsMenu.jsx

@@ -22,12 +22,12 @@ import {
 } from '../../../redux/topics-operations';
 import { useDispatch, useSelector } from 'react-redux';
 // eslint-disable-next-line max-len
-import { selectAccessToken } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import {
   setAccessToken,
   setIsLoggedIn,
   setRefreshToken,
-} from '../../../redux/authOperatonsToolkit/authOperationsThunkSlice';
+} from '../../../redux/authOperationsToolkit/authOperationsThunkSlice';
 import localLogOutUtil from '../../../utils/localLogOutUtil';
 
 const TopicSettingsMenu = ({ topicId, subscribeStatus }) => {

src/components/Chat/UsersAvatar/UsersAvatar.jsx

@@ -3,7 +3,7 @@
 import { useSelector } from 'react-redux';
 import { useGetSubscribersQuery } from '../../../redux/topics-operations';
 // eslint-disable-next-line max-len
-import { selectAccessToken } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import { Avatars } from '../../../ui-kit/images/avatars';
 import Avatar from '../../../ui-kit/components/Avatar';
 

src/components/Layouts/Footer/Footer.jsx

@@ -8,7 +8,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import {
   selectAccessToken,
   selectIsLoggedIn,
-} from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+} from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 // import {
 //   setAccessToken,
 //   setIsLoggedIn,

src/components/Layouts/Header/Header.jsx

@@ -13,7 +13,8 @@ import { NavLink, useLocation } from 'react-router-dom';
 import HeaderUserInfo from './HeaderUserInfo';
 import { useTopicsContext } from '../../../common/Topics/TopicsContext';
 import { useDispatch, useSelector } from 'react-redux';
-import { selectIsLoggedIn } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+// eslint-disable-next-line max-len
+import { selectIsLoggedIn } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import { setChatOpened } from '../../../redux/chatSlice';
 import { useMediaQuery } from 'react-responsive';
 

src/components/Layouts/Header/HeaderUserInfo/HeaderUserInfo.jsx

@@ -22,7 +22,7 @@ import {
   UserName,
 } from './HeaderUserInfo.styled';
 // eslint-disable-next-line max-len
-import { selectAccessToken } from '../../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import localLogOutUtil from '../../../../utils/localLogOutUtil';
 // import { selectUserThunk } from '../../../../redux/userApiThunk/userApiThunkSelectors';
 // import { useUser } from '../../../../hooks/useUser';

src/components/LoginPageComponent/LoginPageComponent.jsx

@@ -22,7 +22,7 @@ import {
   setAccessToken,
   setIsLoggedIn,
   setRefreshToken,
-} from '../../redux/authOperatonsToolkit/authOperationsThunkSlice.js';
+} from '../../redux/authOperationsToolkit/authOperationsThunkSlice.js';
 
 function LoginPageComponent() {
   const [login] = useLoginMutation();

src/components/NewTopic/NewTopic.jsx

@@ -10,7 +10,7 @@ import {
 import NewTopicInput from './NewTopicInput';
 import { useCreateMutation } from '../../redux/topics-operations';
 import { useDispatch, useSelector } from 'react-redux';
-import { selectAccessToken } from '../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import localLogOutUtil from '../../utils/localLogOutUtil';
 
 const defaultValues = {

src/components/Routes/PrivateRoute.jsx

@@ -2,7 +2,8 @@ import { Navigate, Outlet } from 'react-router-dom';
 // import { useUser } from '../../hooks/useUser';
 // import { PATH } from '../../constans/routes';
 import { useSelector } from 'react-redux';
-import { selectIsLoggedIn } from '../../redux/authOperatonsToolkit/authOperationsThunkSelectors.js';
+// eslint-disable-next-line max-len
+import { selectIsLoggedIn } from '../../redux/authOperationsToolkit/authOperationsThunkSelectors.js';
 
 export const PrivateRoute = ({ redirectTo }) => {
   // const { isAuthenticated } = useUser();

src/components/Routes/PublicRoute.jsx

@@ -1,6 +1,6 @@
 import { useSelector } from 'react-redux';
 import { Navigate, Outlet } from 'react-router-dom';
-import { selectIsLoggedIn } from '../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectIsLoggedIn } from '../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 // import { useUser } from '../../hooks/useUser';
 // import { PATH } from '../../constans/routes';
 // import { useSelector } from 'react-redux';

src/components/SettingsPageComponent/UserSettings/PermissionPrivateMessage.js

@@ -6,7 +6,7 @@ import {
 import { useSelector } from 'react-redux';
 import { selectUserInfo } from '../../../redux/userSlice';
 // eslint-disable-next-line max-len
-import { selectAccessToken } from '../../../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../../../redux/authOperationsToolkit/authOperationsThunkSelectors';
 
 export const PermissionPrivateMessage = () => {
   const { hasPermissionSendingPrivateMessage } = useSelector(selectUserInfo);

src/hooks/useAllTopicsNotificationInfo.js

@@ -1,37 +1,36 @@
 import { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
-import { selectAccessToken } from '../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../redux/authOperationsToolkit/authOperationsThunkSelectors';
 import {
-  useGetAllPrivateTopicsQuery,
-  useGetAllQuery,
-} from '../redux/topics-operations';
-import { setAllTopicsNotifications } from '../redux/chatSlice';
+  fetchNotificationsAllTopics,
+  fetchNotificationsPrivateTopics,
+} from '../redux/chatSlice';
+// import { useGetAllPrivateTopicsQuery, useGetAllQuery } from '../redux/topics-operations';
+// import { setAllTopicsNotifications } from '../redux/chatSlice';
 
 export const useAllTopicsNotificationInfo = (isLoggedIn) => {
   const accessTokenInStore = useSelector(selectAccessToken);
-  const { currentData: allTopicsCurrentData } = useGetAllQuery({
-    accessTokenInStore,
-  });
-  const { currentData: privateTopicsData } =
-    useGetAllPrivateTopicsQuery(accessTokenInStore);
+
+  // const { currentData: allTopicsCurrentData } = useGetAllQuery({
+  // accessTokenInStore,
+  // });
+  // const { currentData: privateTopicsData } = useGetAllPrivateTopicsQuery(accessTokenInStore);
+
   const dispatch = useDispatch();
   // useEffect for notification array filling
   useEffect(() => {
     if (isLoggedIn && accessTokenInStore) {
-      if (allTopicsCurrentData && privateTopicsData) {
-        dispatch(
-          setAllTopicsNotifications([
-            ...allTopicsCurrentData.filter((el) => el.unreadMessageCount !== 0),
-            ...privateTopicsData.filter((el) => el.unreadMessageCount !== 0),
-          ]),
-        );
-      }
+      dispatch(fetchNotificationsAllTopics(accessTokenInStore));
+      dispatch(fetchNotificationsPrivateTopics(accessTokenInStore));
+      // if (allTopicsCurrentData && privateTopicsData) {
+      //   dispatch(
+      //     setAllTopicsNotifications([
+      //       ...allTopicsCurrentData.filter(el => el.unreadMessageCount !== 0),
+      //       ...privateTopicsData.filter(el => el.unreadMessageCount !== 0),
+      //     ])
+      //   );
+      // }
     }
-  }, [
-    isLoggedIn,
-    accessTokenInStore,
-    allTopicsCurrentData,
-    privateTopicsData,
-    dispatch,
-  ]);
+    // }, [isLoggedIn, accessTokenInStore, allTopicsCurrentData, privateTopicsData, dispatch]);
+  }, [isLoggedIn, accessTokenInStore, dispatch]);
 };

src/hooks/useWebSocketConnection.js

@@ -6,7 +6,7 @@ import createClientInstance from '../utils/stompClient';
 // import { connectWebSocket } from '../redux/chat-operations';
 // import SockJS from 'sockjs-client';
 // import { BASE_URL } from '../redux/apiParams';
-import { selectAccessToken } from '../redux/authOperatonsToolkit/authOperationsThunkSelectors';
+import { selectAccessToken } from '../redux/authOperationsToolkit/authOperationsThunkSelectors';
 // import localLogOutUtil from '../utils/localLogOutUtil';
 
 export const useWebSocketConnection = (isLoggedIn) => {