fix: 무한스크롤 미반영으로 캐시 삭제

DDD-Community · Feb 27, 2024 · c7b0d26 · c7b0d26
1 parent 03a0d6e
commit c7b0d26
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 8 deletions.
diff --git a/src/components/organisms/FridgeBoard.tsx b/src/components/organisms/FridgeBoard.tsx
@@ -92,9 +92,9 @@ const FridgeBoard: React.FC = () => {
           handleTabNameChange={handleTabNameChange}
         />
         <div className="flex flex-col w-full gap-[24px]">
-          {ingredients?.pages.map((page) =>
-            page.content && page.content.length > 0 ? (
-              page.content.map((ingredient) => (
+          {ingredients?.pages.map(({ content }) =>
+            content && content.length > 0 ? (
+              content.map((ingredient) => (
                 <IngredientItemBox
                   key={ingredient.ingredientDetailId}
                   data={ingredient}

diff --git a/src/components/organisms/IngredientModal.tsx b/src/components/organisms/IngredientModal.tsx
@@ -22,6 +22,7 @@ import type { PostIngredientBodyType } from '@/hooks/queries/fridge/usePostIngre
 import { useRouter } from 'next/router';
 import usePutIngredientById from '@/hooks/queries/fridge/usePutIngredientById';
 import axiosInstance from '@/api/axiosInstance';
+import { queryClient } from '@/pages/_app';
 
 const IngredientModal: React.FC<{
   id: number;
@@ -47,8 +48,9 @@ const IngredientModal: React.FC<{
 
   const onSuccess = () => {
     toggleIsOpenIngredientModal();
-    ingredientsRefetch();
     showToast('식자재 추가가 완료되었습니다.', 'success');
+    ingredientsRefetch();
+    queryClient.invalidateQueries({ queryKey: ['my_fridge'] });
   };
 
   const postIngredient = usePostIngredient(

diff --git a/src/hooks/queries/fridge/useGetFridgeContentById.ts b/src/hooks/queries/fridge/useGetFridgeContentById.ts
@@ -20,11 +20,12 @@ const useGetFridgeContentById = ({
   sort: LocationEnum;
   id: number;
 }) => {
-  return useBaseInfiniteQuery<FridgeContentType[]>({
+  const data = useBaseInfiniteQuery<FridgeContentType[]>({
     queryKey: queryKeys.MY_FRIDGE_CONTENT(id, sort),
     url: `/ingrs/detail/refrig/${id}`,
     params: { location: sort },
   });
+  return data;
 };
 
 export default useGetFridgeContentById;
diff --git a/src/hooks/queries/fridge/usePostFridge.ts b/src/hooks/queries/fridge/usePostFridge.ts
@@ -8,7 +8,6 @@ interface PostFridgeBodyType {
 
 const usePostFridge = () => {
   const onSuccess = (data: PostFridgeBodyType) => {
-    console.log(data);
     void queryClient.invalidateQueries();
   };
   return useBaseMutation<PostFridgeBodyType>(

diff --git a/src/hooks/queries/useBaseInfiniteQuery.ts b/src/hooks/queries/useBaseInfiniteQuery.ts
@@ -43,9 +43,12 @@ export const useBaseInfiniteQuery = <T>({
 
   return useInfiniteQuery({
     queryKey,
-    queryFn: async (context: QueryFunctionContext<QueryKey, number>) =>
-      await fetchData<T>(context),
+    queryFn: async (context: QueryFunctionContext<QueryKey, number>) => {
+      const data = await fetchData<T>(context);
+      return data;
+    },
     initialPageParam: INITIAL_PAGE_PARAM,
     getNextPageParam: (res) => getNextOffset<T>(res),
+    staleTime: 0,
   });
 };
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -25,6 +25,7 @@ export const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
       staleTime: 0,
+      gcTime: 0,
       retry: false,
       refetchOnWindowFocus: false,
     },