From d5ad1a9ce01643ce885bd06718c869f8fc53952d Mon Sep 17 00:00:00 2001
From: sinamong0620 <sinaskim60@gmail.com>
Date: Thu, 19 Dec 2024 13:37:37 +0900
Subject: [PATCH] =?UTF-8?q?#124=20refactor:=20localpathname=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=20=EB=B0=8F=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=97=85?=
 =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=8A=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useSSE.ts            | 10 +++++-----
 src/styles/DashboardStyled.tsx |  2 +-
 src/styles/MainPageStyled.tsx  |  2 +-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/hooks/useSSE.ts b/src/hooks/useSSE.ts
index c076693..35fc796 100644
--- a/src/hooks/useSSE.ts
+++ b/src/hooks/useSSE.ts
@@ -3,12 +3,13 @@ import { atom, useAtom } from 'jotai';
 import { EventSourcePolyfill } from 'event-source-polyfill';
 import { unreadCount } from '../contexts/sseAtom';
 import { customErrToast } from '../utils/customErrorToast';
-import { FaMaskVentilator } from 'react-icons/fa6';
+import { useLocation } from 'react-router-dom';
 
 const sseConnectedAtom = atom(false); // SSE 연결 상태
 const sseMessagesAtom = atom<string[]>([]); // SSE 메시지 상태
 
 export const useSSE = () => {
+  const location = useLocation();
   const [, setConnected] = useAtom(sseConnectedAtom);
   const [, setUnReadCount] = useAtom(unreadCount);
 
@@ -47,10 +48,9 @@ export const useSSE = () => {
 
     eventSourceRef.current.onmessage = event => {
       const hasNoSuccessMessage = !event.data.includes('연결 성공');
-      const isNotTargetURL = !window.location.href.startsWith('http://localhost:3000/');
+      const isNotTargetURL = location.pathname !== '/';
 
-      console.log(event.data);
-      if (hasNoSuccessMessage || isNotTargetURL) {
+      if (hasNoSuccessMessage && isNotTargetURL) {
         const modifiedMessage = event.data.split('.')[0];
         if (modifiedMessage.includes('친구'))
           customErrToast(modifiedMessage.split(':').slice(1).join(':').trim());
@@ -72,7 +72,7 @@ export const useSSE = () => {
       localStorage.setItem('sseConnected', 'false'); // 연결 상태 저장
       reconnectTimeoutRef.current = setTimeout(connectToSSE, 1000); // 1초 후 재연결 시도
     };
-  }, [setConnected, clearReconnectTimeout]);
+  }, [setConnected, clearReconnectTimeout, location.pathname]);
 
   useEffect(() => {
     connectToSSE();
diff --git a/src/styles/DashboardStyled.tsx b/src/styles/DashboardStyled.tsx
index 615153d..4a1c3e2 100644
--- a/src/styles/DashboardStyled.tsx
+++ b/src/styles/DashboardStyled.tsx
@@ -108,7 +108,7 @@ export const CardContainer = styled.div<Props>`
   flex-shrink: 0;
   border-radius: 10px;
   background: ${({ backGroundColor }) => backGroundColor};
-  min-width: 311.188px;
+  min-width: 19.449rem;
 
   header {
     display: flex;
diff --git a/src/styles/MainPageStyled.tsx b/src/styles/MainPageStyled.tsx
index 23027c7..6bfa2f9 100644
--- a/src/styles/MainPageStyled.tsx
+++ b/src/styles/MainPageStyled.tsx
@@ -22,7 +22,7 @@ export const CardContainer = styled.section`
   display: flex;
   justify-content: center;
   padding: 4.5vw 3.8125vw;
-  gap: 25px;
+  gap: 1.563rem;
 
   @media screen and (min-width: 1700px) {
     justify-content: space-evenly;