feat: 가져올 위시가 없을 때 안내 모달·빈 상태 노출 - #421
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Discord 스레드 연동용 메타데이터입니다. discord-pr-bot 워크플로가 자동 생성하며, 수정·삭제하면 PR 과 Discord 알림 연동이 끊깁니다. |
|
Warning Review limit reached
Next review available in: 29 minutes You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (2)
📝 WalkthroughWalkthrough위시리스트 무한 쿼리 설정을 공유 옵션으로 통합했습니다. 위시 항목이 없으면 이동 대신 오류 다이얼로그를 표시합니다. 위시 선택 화면에는 선택 가능한 상품이 없을 때 빈 상태를 표시합니다. Changes위시리스트 가져오기 흐름
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested labels: Suggested reviewers: Sequence Diagram(s)sequenceDiagram
participant ItemDialog as GetItemDialog
participant WishlistAPI as wishlistInfiniteQueryOptions
participant ErrorDialog as TournamentErrorDialog
participant Router
ItemDialog->>WishlistAPI: 위시리스트 페이지 조회
ItemDialog->>ItemDialog: 전체 위시 항목 확인
alt 위시 항목 없음
ItemDialog->>ErrorDialog: no-wish 오류 다이얼로그 표시
else 위시 항목 있음
ItemDialog->>Router: 위시 상품 추가 화면 이동
end
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/web/src/components/get-item-dialog/index.tsx`:
- Around line 34-50: Update handleWishClick and the wishlist option’s
OptionButton so it cannot be activated while wishlistData is still loading or
unavailable. Treat missing data, including failed requests, as no available
wishes and open the no-wish dialog instead of calling router.push; only navigate
after a completed query confirms at least one wish.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 7c918394-06b0-464c-8c3f-4fa4dbe2ad86
📒 Files selected for processing (6)
apps/web/src/apis/getWishlist.tsapps/web/src/app/archive/wish/_components/WishContent.tsxapps/web/src/app/tournament/[id]/create/by-wish/_components/ByWishContent.tsxapps/web/src/components/get-item-dialog/index.tsxapps/web/src/components/tournament-error-dialog/index.tsxapps/web/src/hooks/useGetWishlist.ts
작업 요약
작업 세부 내용
1. 위시가 없으면 이동 대신 안내 모달
위시템 담기다이얼로그의 "위시에서 가져오기"는<Link>로 즉시 이동해서, 위시가 0개여도 by-wish 페이지의 빈 목록을 보게 됐습니다. 페이지 이동을 막고 모달로 안내합니다.href→onClick분기로 변경 (OptionButton이 두 방식을 이미 지원해 컴포넌트 수정은 없음)TournamentErrorDialog의NO_WISH_EXISTS타입 재사용 — 아직 어디서도 쓰이지 않던 타입이라 아이콘·문구를 시안에 맞춰 조정했고 다른 화면 영향은 없습니다isSubDialogOpen유니온에'no-wish'를 추가해ByLinkDialog·ByImageDialog와 같은 방식으로 렌더 (별도 state 없음)판단 기준은 위시리스트 전체 0개입니다. 시안 문구가 "위시를 먼저 추가해주세요" 라서, 위시는 있지만 전부 담긴 상황과는 안내가 달라야 한다고 봤습니다. 그 케이스는 아래 2번에서 다룹니다.
2. 담을 수 있는 위시가 없을 때 빈 상태
위시는 있지만 전부 후보에 담겼거나 파싱 실패·처리중이면 by-wish 화면이 아무 안내 없이 텅 빈 채로 보였습니다. 이를 해결하기 위해 빈 상태를 추가했습니다.
이 화면은 마운트 후 나머지 페이지를 이어서 불러오기 때문에,
!hasNextPage && !isFetchingNextPage && items.length === 0처럼 전체 로드가 끝난 뒤에만 판정합니다. 가드가 없으면 1페이지가 전부 필터에 걸리고 2페이지에 남아 있는 경우 빈 상태가 깜빡입니다.3. 위시 목록 쿼리 옵션 정리
담기 다이얼로그가 위시 목록을 구독하게 되면서
queryKey·queryFn·getNextPageParam설정이 세 곳(서버 prefetch, suspense 훅, 다이얼로그)으로 늘어났습니다. 한쪽만 바뀌면 캐시가 어긋나므로wishlistInfiniteQueryOptions로 묶었습니다.hooks/가 아니라apis/getWishlist.ts에 둔 이유는, 서버 컴포넌트인WishContent가 클라이언트 훅 모듈을 import 하지 않게 하기 위해서입니다.구현 노트 — 왜
useGetWishlist를 그대로 쓰지 않았나useGetWishlist는useSuspenseInfiniteQuery라서 다이얼로그에서 호출하면 응답이 올 때까지 서스펜드됩니다. 담기 화면은create/layout.tsx가 풀페이지 스켈레톤을 폴백으로 쓰기 때문에, 위시 조회 때문에 토너먼트 화면 전체가 스켈레톤으로 막힙니다.그래서 같은 쿼리 키를 non-suspense
useInfiniteQuery로 구독합니다. 캐시는 공유되므로 by-wish 페이지 진입도 함께 빨라집니다.enabled로 "위시에서 가져오기" 노출 조건과 동일하게 게이팅해, 게스트나 위시 화면에서는 요청이 나가지 않습니다.스크린샷
연관 이슈
closes #396
Summary by CodeRabbit
새로운 기능
개선 사항