fix: 위시리스트 뒤로가기 시 스크롤 위치 리셋되는 문제

[kanghaeun]

버그 내용

위시리스트(/archive/wish)에서 스크롤 후 상품 상세로 이동했다가 뒤로가기 시, 리스트가 맨 위로 리셋되는 문제

버그 재현 방법

1. 위시리스트에서 아래로 스크롤
2. 상품 카드 클릭 → 상세(/archive/wish/[id]) 이동
3. 뒤로가기 시 리스트가 항상 맨 위로 리셋됨

예상 결과

직전 스크롤 위치를 저장/복원하여 뒤로가기 시 원래 위치로 돌아오도록 한다.

작업 목록

1. 루트 스크롤 컨테이너에 식별자 추가

• layout.tsx의 스크롤 div에 id="scroll-container" 추가 (현재 ref/id 없음)
• id 문자열은 src/consts/ 상수 또는 훅 파일 내 상수로 관리

2. 스크롤 복원 훅 생성

• apps/web/src/app/archive/wish/_hooks/useScrollRestoration.ts 생성 (colocation 규칙에 따라 _hooks/에 배치, 화살표 함수)
• 저장: 스크롤 컨테이너에 scroll 리스너(rAF 스로틀) → sessionStorage['scroll:/archive/wish']에 scrollTop 저장
• 뒤로가기 감지: popstate 이벤트로 플래그 세팅
  • 뒤로가기/스와이프 백은 popstate가 먼저 발생한 뒤 페이지 마운트됨
  • 상세 페이지의 router.back()도 popstate를 발생시키므로 동일하게 처리됨
• 복원: 페이지 마운트 시 popstate 플래그가 켜져 있고 저장값이 있으면 useLayoutEffect에서 scrollTop 복원 후 플래그 리셋
  • 탭바 등으로 새로 진입(push)한 경우엔 복원하지 않고 맨 위 유지

3. 훅 적용

• WishlistList.tsx에서 훅 호출
  • useSuspenseInfiniteQuery 데이터 렌더 후 useLayoutEffect가 실행되므로 캐시된 페이지들의 DOM 높이가 확보된 상태에서 복원됨
  • 무한스크롤로 여러 페이지 내려간 경우도 캐시에 전 페이지가 남아있어 복원 가능