feat: 초기화, 적용 버튼 구현

apps/wr/app/map/mapSearchBar.tsx

@@ -22,7 +22,7 @@ type SearchBaseType = {
   selectEnvPartData?: EnvPartSelectDataType[] | [];
   queryClick: (returnType: ReturnType) => void;
   initClick: () => void;
-  applyClick: () => void;
+  onFeatureSelect: () => void;
   btnClass?: string;
   ref?: React.RefObject<ReturnType>;
   isAdmin?: boolean;
@@ -60,7 +60,7 @@ export function MapSearchBar({
   btnClass,
   queryClick,
   initClick,
-  applyClick,
+  onFeatureSelect,
   isAdmin = false,
   leftClassName,
   rightClassName,
@@ -91,11 +91,11 @@ export function MapSearchBar({
   // 공급처 후보지 조회 필터 목록
   const [selectedSido, setSelectedSido] = useState<SelectDataType>({ text: "전체", val: '0' });
   const [selectedSigun, setSelectedSigun] = useState<SelectDataType>({ text: "전체", val: '0' });
-  const [selectedFclt, setSelectedFclt] = useState<SelectDataType>({ text: "전체", val: '0' });
+  const [selectedFclt, setSelectedFclt] = useState<SelectedDataTypeWithSggNm>({ text: "전체", val: '0', sggNm: '전체' }); // 시설명 선택 상태
   // 전체 시설
   let allFclt: SelectedDataTypeWithSggNm[] = [{ text: "전체", val: '0', sggNm: '전체' }];
   // 우리동네가뭄지도 필터 목록
-  const [selectedDong, setSelectedDong] = useState<SelectDataType>({ text: "전체", val: '0' }); // 행정동
+  const [selectedDong, setSelectedDong] = useState<SelectedDataTypeWithSggNm>({ text: "전체", val: '0', sggNm: '전체' }); // 시설명 선택 상태 // 행정동
 
   const [allSido, setAllSido] = useState<SelectDataType[]>([
     { text: "전체", val: '0' },
@@ -131,32 +131,46 @@ export function MapSearchBar({
   }, [selectedSigun]);
 
   const queryVal = () => {
-    console.log("조회버튼 클릭");
-    queryClick({
-      partValue: partValue,
-      sidoValue: sidoValue,
-      sigunValue: sigunValue,
-      regionValue: regionValue,
-      unitWaterShedValue: untitWaterShedValue,
-      middleRegionValue: middleRegionValue,
-      envPartValue: envPartValue,
-      sidoText: selectedSido.text,
-      sigunText: selectedSigun.text,
-    });
-  }
-
-  const initVal = useCallback(() => {
-    setResetTrigger(true);
-    initClick();
-  }, [setResetTrigger, initClick]);
-
-  const applyVal = useCallback(() => {
     if (searchType == '공급처 후보지 조회') {
     } else if (searchType == '우리동네가뭄지도보기') {
     } else if (searchType == '지도보기') {
-
+      console.log("조회버튼 클릭");
+      queryClick({
+        partValue: partValue,
+        sidoValue: sidoValue,
+        sigunValue: sigunValue,
+        regionValue: regionValue,
+        unitWaterShedValue: untitWaterShedValue,
+        middleRegionValue: middleRegionValue,
+        envPartValue: envPartValue,
+        sidoText: selectedSido.text,
+        sigunText: selectedSigun.text,
+      });
     }
-  }, [setResetTrigger, initClick]);
+  }
+
+  const initVal = useCallback(() => {
+    setPartValue("A");
+    setSidoValue("0");
+    setSigunValue("0");
+    setRegionValue("0");
+    setUntitWaterShedValue("0");
+    setMiddleRegionValue("0");
+    setEnvPartValue("0");
+    setSidoText("전체");
+    setSigunText("전체");
+    setSelectedSido({ text: "전체", val: '0' });
+    setSelectedSigun({ text: "전체", val: '0' });
+    setSelectedFclt({ text: "전체", val: '0', sggNm: '전체' });
+    setSelectedDong({ text: "전체", val: '0', sggNm: '전체' });
+    setResetTrigger(true);
+    
+    initClick(); // 부모로부터 받은 초기화 함수 호출
+  }, [initClick]);
+
+  const applyVal = useCallback(() => {
+    onFeatureSelect
+  }, [onFeatureSelect]);
 
   useEffect(() => {
     if (resetTrigger) {