#124 refactor: localpathname 수정 및 스타일 업데이트

AJD-Archive · Dec 19, 2024 · d5ad1a9 · d5ad1a9
1 parent c91ecaf
commit d5ad1a9
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 7 deletions.
diff --git 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
@@ -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
@@ -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;