refactor: save버튼이 active 상태일때 get요청 계속 보내고, 혹시 찜한 스토어가 없을 때 에러처리

src/apis/view/useFetchLikesStoreCoordinate.ts

@@ -1,11 +1,12 @@
-import { useSuspenseQuery } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
 
 import { instance } from '@apis/instance';
 
 import { END_POINT, queryKey } from '@constants';
 
 import {
   ApiResponseType,
+  ErrorResponse,
   StoreCoordinate,
   StoreCoordinateListResponse,
 } from '@types';
@@ -17,14 +18,20 @@ const fetchLikesStoreCoordinate = async (): Promise<StoreCoordinate[]> => {
     >(END_POINT.FETCH_LIKES_STORE_COORDINATE_LIST);
     return response.data.data.stores;
   } catch (error) {
-    console.log(error);
+    const errorResponse = error as ErrorResponse;
+    if (errorResponse.response.data.code === 40402) {
+      return [];
+    }
     throw error;
   }
 };
 
-export const useFetchLikesStoreCoordinate = () => {
-  return useSuspenseQuery({
+export const useFetchLikesStoreCoordinate = (isSaveActive: boolean) => {
+  return useQuery({
     queryKey: [queryKey.LIKES_STORE_COORDINATE_LIST],
     queryFn: () => fetchLikesStoreCoordinate(),
+    enabled: isSaveActive,
+    staleTime: 0,
+    gcTime: 0,
   });
 };

src/pages/view/hooks/useKakaoMap.tsx

@@ -18,7 +18,6 @@ export const useKakaoMap = (
   const { data: storeCoordinateList } = useFetchStoreCoordinateList(
     currentLocation.stationEnName
   );
-  const { data: likesStoreCoordinateList } = useFetchLikesStoreCoordinate();
 
   const [selectedStoreId, setSelectedStoreId] = useState<number>(0);
   const [storeMarkerList, setStoreMarkerList] = useState<
@@ -43,6 +42,9 @@ export const useKakaoMap = (
   // gps 버튼 활성화 상태
   const [isGpsActive, setIsGpsActive] = useState(false);
 
+  const { data: likesStoreCoordinateList } =
+    useFetchLikesStoreCoordinate(isSaveActive);
+
   const fetchCurrentPosition = () => {
     if (navigator.geolocation) {
       navigator.geolocation.getCurrentPosition(
@@ -116,6 +118,7 @@ export const useKakaoMap = (
 
   useEffect(() => {
     if (currentLocation) {
+      setIsSaveActive(false);
       if (currentLocation.stationEnName === 'ALL') {
         fetchCurrentPosition();
       } else {

src/types/apis/commonType.ts

@@ -10,3 +10,12 @@ export interface MutateResposneType {
   code: number;
   message: string;
 }
+
+export interface ErrorResponse {
+  response: {
+    data: {
+      code: number;
+      message: string;
+    };
+  };
+}