#68 fix : 대시보드 초대 수락시 네브바에 실시간 반영

src/components/AlarmBlock.tsx

@@ -2,25 +2,32 @@ import styled from 'styled-components';
 import Flex from './Flex';
 import theme from '../styles/Theme/Theme';
 import { postTeamDashboard } from '../api/TeamDashBoardApi';
+import { customErrToast } from '../utils/customErrorToast';
+import { useAtom } from 'jotai';
+import { navbarUpdateTriggerAtom } from '../contexts/atoms';
 
 type Props = {
   message: string;
   isRead: boolean;
 };
 const AlarmBlock = ({ message, isRead }: Props) => {
   const nameMatch = message.match(/([가-힣]+)(?=님)/);
-
   const dashboardMatch = message.match(/\s(.+?)\s대시보드/);
-
   const numberMatch = message.match(/\d+$/);
 
   const name = nameMatch ? nameMatch[0] : null;
   const dashboard = dashboardMatch ? dashboardMatch[0] : null;
   const number = numberMatch ? numberMatch[0] : '';
+  const [, setUpdate] = useAtom(navbarUpdateTriggerAtom);
 
-  const onAcceptHandler = () => {
-    postTeamDashboard(number);
+  const onAcceptHandler = async () => {
+    const response = await postTeamDashboard(number);
+    if (response) {
+      customErrToast(`${dashboard} 초대를 수락했습니다.`);
+    }
+    setUpdate(prev => !prev);
   };
+
   return (
     <AlarmContainer isRead={isRead}>
       <Flex alignItems="center">

src/components/Navbar.tsx

@@ -10,12 +10,25 @@ import { useQuery } from '@tanstack/react-query';
 import { userInfoApi } from '../api/UserApi';
 import { useAtom } from 'jotai';
 import { nicknameAtom } from '../contexts/NickName';
+import { searchPersonalDashBoard, searchTeamDashBoard } from '../api/BoardApi';
+import { navbarUpdateTriggerAtom } from '../contexts/atoms';
+import { unreadCount } from '../contexts/sseAtom';
 
 const Navbar = () => {
-  const { dashboard } = usePersonalDashBoardSearch();
-  const { teamDashboard } = useTeamDashBoard();
-  const { data: UserInfo, refetch } = useQuery({ queryKey: ['userinfo'], queryFn: userInfoApi });
+  const { data: dashboard } = useQuery({
+    queryKey: ['personalDashboard'],
+    queryFn: searchPersonalDashBoard,
+  });
+  const { data: teamDashboard, refetch } = useQuery({
+    queryKey: ['teamDashBoard'],
+    queryFn: searchTeamDashBoard,
+  });
+  const { data: UserInfo, refetch: refetchTeamDashboard } = useQuery({
+    queryKey: ['userinfo'],
+    queryFn: userInfoApi,
+  });
   const [nickname, setNickname] = useAtom(nicknameAtom);
+  const [update] = useAtom(navbarUpdateTriggerAtom);
 
   // 닉네임을 API에서 받아와서 atom에 저장
   useEffect(() => {
@@ -24,6 +37,10 @@ const Navbar = () => {
     }
   }, [UserInfo, nickname, setNickname]);
 
+  //네브바 렌더링 트리거
+  useEffect(() => {
+    refetch();
+  }, [update]);
   return (
     <S.NavBarLayout>
       <div>

src/contexts/atoms.ts

@@ -1,4 +1,6 @@
 import { atom } from 'jotai';
+import { TeamDashboardList } from '../types/MyPage';
 
 // 데이터를 다시 불러오는 트리거 상태를 관리할 atom
 export const fetchTriggerAtom = atom(0);
+export const navbarUpdateTriggerAtom = atom(false);