[Fix/sidebar-240] 🚨 Fix : SSR + React Query 하이드레이션 범위 수정

[swallowedB]

요약

• 변경 목적(왜?)

  • React Query 하이드레이션 범위가 페이지(GoalsPage)에만 적용되어,
    레이아웃((protected) layout)에 위치한 네비게이션에서 goals 캐시를 전달받지 못하던 문제를 해결
  • 동일한 goals 쿼리를 layout과 page에서 중복 prefetch/hydration 하던 구조를 정리하여,
    SSR 단계에서의 불필요한 중복 요청과 인증 관련 에러(Unauthenticated) 발생 가능성을 제거

• 주요 변경(무엇을?)

  • goals 쿼리의 prefetch + HydrationBoundary를 (protected) layout 레벨로 이동
  • 네비게이션(NavigationDesktop / NavigationGoalSection)이 하이드레이션된 goals 캐시를 공유하도록 수정
  • GoalsPage에서 goals 중복 prefetch 제거, 페이지 전용 데이터(todos)만 유지

---

변경 내용

• (protected) layout에서 goals 쿼리 prefetch 및 HydrationBoundary 적용
• 네비게이션 영역에서 goals 캐시를 SSR 하이드레이션으로 공유
• GoalsPage에서 goalsQueryKeys.list() 중복 prefetch 제거
• 페이지 단에서는 todos 등 페이지 전용 쿼리만 prefetch/hydration 유지

---

배경 설명

기존 구조에서는:

• GoalsPage에만 HydrationBoundary가 존재
• 네비게이션은 layout 하위에 위치하여 해당 boundary 범위 밖에 있음
• 그 결과 네비게이션의 useGoalList()가 캐시 없이 실행되며,
  SSR 단계에서 클라이언트 전용 fetcher가 호출되는 문제가 발생
• 토큰 만료 상태에서 초기 진입 시 Unauthenticated 에러가 노출될 수 있었음

개선 후에는:

• layout에서 goals를 단일 소스로 prefetch/hydration
• 네비게이션과 페이지가 동일한 goals 캐시를 공유
• 서버 = backendFetch / 클라이언트 = fetcher 분리 원칙 유지
• SSR 단계에서 불필요한 fetcher 실행 방지

---

관련 이슈

close #240

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
slice	Ready	Preview, Comment	Jan 1, 2026 0:20am