From 79b4482e6c40b672be846b1c6a406edf0e9723c0 Mon Sep 17 00:00:00 2001
From: Hyein Jeong <jhi2359@naver.com>
Date: Wed, 4 Dec 2024 01:55:53 +0900
Subject: [PATCH] =?UTF-8?q?[FE][Fix]=20#350=20:=20HostView=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20=EC=9C=A0=EC=A0=80=20=ED=99=95=EC=9D=B8=20=EC=8B=9C?=
 =?UTF-8?q?=20=EC=9C=A0=EC=A0=80=EC=9D=98=20=ED=98=84=EC=9E=AC=20=EC=9C=84?=
 =?UTF-8?q?=EC=B9=98=EA=B0=80=20=EA=B0=90=EC=B6=B0=EC=A7=80=EC=A7=80=20?=
 =?UTF-8?q?=EC=95=8A=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- HostView에서 유저 확인 시 유저의 현재 위치가 감춰지지 않는 문제 해결
---
 frontend/src/pages/HostView.tsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/HostView.tsx b/frontend/src/pages/HostView.tsx
index 3fc5b52..5b92c73 100644
--- a/frontend/src/pages/HostView.tsx
+++ b/frontend/src/pages/HostView.tsx
@@ -32,7 +32,11 @@ export const HostView = () => {
   const [guestsData, setGuestsData] = useState<IGuestData[]>([]);
   const [mapProps, setMapProps] = useState<IGuestDataInMapProps[]>([]);
   const [clickedId, setClickedId] = useState<string>('');
+
   const [otherLocations, setOtherLocations] = useState<IOtherLocationsInHostView[]>([]);
+  const [filteredOtherLocations, setFilteredOtherLocations] = useState<IOtherLocationsInHostView[]>(
+    [],
+  );
   const [showErrorAlert, setShowErrorAlert] = useState<boolean>(false); // 오류 알림 상태 추가
 
   const headerDropdownContext = useContext(HeaderDropdownContext);
@@ -194,6 +198,14 @@ export const HostView = () => {
     }
   }, [showErrorAlert, navigate]);
 
+  useEffect(() => {
+    if (clickedId === '') {
+      setFilteredOtherLocations(otherLocations);
+    } else {
+      setFilteredOtherLocations(otherLocations.filter(el => el.guestId === clickedId));
+    }
+  }, [clickedId]);
+
   return (
     <article className="absolute h-full w-screen flex-grow overflow-hidden">
       {showErrorAlert && (
@@ -217,7 +229,7 @@ export const HostView = () => {
               width="100%"
               height="100%"
               guests={mapProps}
-              otherLocations={otherLocations}
+              otherLocations={filteredOtherLocations}
               ref={mapRef}
             />
           ) : (