From 428a9c813b004d4280d7ba593e0f5cf3b443eb01 Mon Sep 17 00:00:00 2001
From: pp449 <mma7710@naver.com>
Date: Sun, 9 Apr 2023 21:26:11 +0900
Subject: [PATCH] =?UTF-8?q?Fix:=20useEffect=EB=A5=BC=20=EC=9D=B4=EC=9A=A9?=
 =?UTF-8?q?=ED=95=B4=20=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8=ED=95=B4?=
 =?UTF-8?q?=EB=8F=84=20URL=EC=97=90=20=EB=94=B0=EB=9D=BC=20=EC=95=84?=
 =?UTF-8?q?=EC=9D=B4=EC=BD=98=EC=83=89=EC=9D=B4=20=EC=9C=A0=EC=A7=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/FooterTab/index.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/FooterTab/index.tsx b/src/components/FooterTab/index.tsx
index 1a8a79b8..b1e51718 100644
--- a/src/components/FooterTab/index.tsx
+++ b/src/components/FooterTab/index.tsx
@@ -1,6 +1,6 @@
 import Icon from '@components/Icon';
 import styled from '@emotion/styled';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 
 type IconKind =
@@ -26,9 +26,13 @@ const footerIcons = [
 ] as const;
 
 const FooterTab = () => {
-  const [activeIcon, setActiveIcon] = useState('home');
+  const [activeIcon, setActiveIcon] = useState('/');
   const navigate = useNavigate();
 
+  useEffect(() => {
+    setActiveIcon(window.location.pathname);
+  }, [window.location.pathname]);
+
   const handleIconClick = (kind: IconKind, path: string) => {
     setActiveIcon(kind);
     navigate(path);
@@ -45,7 +49,7 @@ const FooterTab = () => {
           <Icon
             key={kind}
             kind={kind}
-            color={activeIcon === kind ? PRIMARY_COLOR : BLACK_COLOR}
+            color={activeIcon === path ? PRIMARY_COLOR : BLACK_COLOR}
           />
         </IconContainer>
       ))}