diff --git a/src/hooks/photoFeed/posts/useInfinitePosts.ts b/src/hooks/photoFeed/posts/useInfinitePosts.ts index 94c3e122..f9e40d8d 100644 --- a/src/hooks/photoFeed/posts/useInfinitePosts.ts +++ b/src/hooks/photoFeed/posts/useInfinitePosts.ts @@ -17,11 +17,11 @@ export function useInfinitePosts() { getNextPageParam: (lastPage, allPages) => lastPage.previewList.length < PAGE_SIZE ? undefined : allPages.length, - staleTime: 1000 * 60 * 5, // 5분 동안은 "신선" → 마운트돼도 refetch 안 함 - gcTime: 1000 * 60 * 30, // 30분간 캐시 유지 (v5, v4면 cacheTime) + staleTime: 1000 * 60, // 1분 동안은 "신선" → 마운트돼도 refetch 안 함 + gcTime: 1000 * 60 * 5, // 5분간 캐시 유지 refetchOnMount: false, // 컴포넌트 마운트 시 재요청 막기 refetchOnWindowFocus: false, // 탭 다시 클릭/포커스 시 재요청 막기 refetchOnReconnect: false, // 네트워크 재연결 시 재요청 막기 - retry: 1, // (선택) 실패 시 재시도 횟수 줄이기 + retry: 1, // 실패 시 재시도 횟수 줄이기 }); } diff --git a/src/pages/photoFeed/PhotoFeedPage.tsx b/src/pages/photoFeed/PhotoFeedPage.tsx index 37f8e539..b0ed224f 100644 --- a/src/pages/photoFeed/PhotoFeedPage.tsx +++ b/src/pages/photoFeed/PhotoFeedPage.tsx @@ -25,6 +25,9 @@ const breakpointColumnsObj = { 1024: 2, }; +export const TOAST_FADE_START_DELAY = 1600; +export const TOAST_UNMOUNT_DELAY = 3000; + export default function PhotoFeedPage() { const [isCreateModalOpen, setIsCreateModalOpen] = useState(false); const sentinelRef = useRef(null); @@ -41,14 +44,20 @@ export default function PhotoFeedPage() { useEffect(() => { if (!isDeleted) return; - const fadeTimer = setTimeout(() => setToastVisible(false), 1600); - const removeTimer = setTimeout(() => setMounted(false), 3000); + const fadeTimer = setTimeout( + () => setToastVisible(false), + TOAST_FADE_START_DELAY, + ); + const removeTimer = setTimeout(() => { + setMounted(false); + navigate(location.pathname, { replace: true }); // 타이머 없앨 때 state도 같이 삭제 + }, TOAST_UNMOUNT_DELAY); return () => { clearTimeout(fadeTimer); clearTimeout(removeTimer); }; - }, [isDeleted]); + }, [isDeleted, navigate, location.pathname]); const { data, diff --git a/src/pages/photoFeed/PostPage.tsx b/src/pages/photoFeed/PostPage.tsx index 1b53388c..01be4951 100644 --- a/src/pages/photoFeed/PostPage.tsx +++ b/src/pages/photoFeed/PostPage.tsx @@ -15,6 +15,7 @@ import EmptyView from "@/components/common/EmptyView"; import CommentSheet from "@/components/photoFeed/postDetail/CommentSheet"; import { useNewPostState } from "@/store/useNewPostState.store"; import ProfileSkeleton from "@/components/photoFeed/postDetail/ProfileSkeleton"; +import { TOAST_FADE_START_DELAY, TOAST_UNMOUNT_DELAY } from "./PhotoFeedPage"; export default function PostPage() { const [commentVisible, setCommentVisible] = useState(false); @@ -63,8 +64,14 @@ export default function PostPage() { useEffect(() => { if (!isNewPost) return; - const fadeTimer = setTimeout(() => setToastVisible(false), 1600); - const removeTimer = setTimeout(() => setMounted(false), 3000); + const fadeTimer = setTimeout( + () => setToastVisible(false), + TOAST_FADE_START_DELAY, + ); + const removeTimer = setTimeout(() => { + setIsNewPost(false); + setMounted(false); + }, TOAST_UNMOUNT_DELAY); return () => { clearTimeout(fadeTimer);