fix: QA 통합 — 영수증 공유/친구 목록 모달/홈·보관함·로그인 보정#210
Merged
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Review limit reached
More reviews will be available in 42 minutes and 40 seconds. Learn how PR review limits work. Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file). ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (4)
Walkthrough토너먼트 카드에 ChangesTournament Friend List & Receipt Share Refactor
Sequence Diagram(s)sequenceDiagram
participant User as 사용자
participant MorePopover
participant FriendListDialog
participant useGetGroupResult
participant ResultClient
participant shareReceiptImage as shareReceiptImage (html-to-image)
rect rgba(100, 149, 237, 0.5)
note over User, FriendListDialog: 친구 목록 보기 흐름 (COMPLETED, participantCount >= 2)
User->>MorePopover: "친구 목록 보기" 클릭
MorePopover->>FriendListDialog: open=true, tournamentId 전달
FriendListDialog->>useGetGroupResult: enabled=true 로 그룹 결과 조회
useGetGroupResult-->>FriendListDialog: items[].chosenBy 반환
FriendListDialog-->>User: userId 중복 제거·isMe 우선 정렬된 친구 목록 표시
end
rect rgba(144, 238, 144, 0.5)
note over User, shareReceiptImage: 영수증 공유 자동 실행 흐름 (?action=share-receipt)
User->>ResultClient: 페이지 진입 (share-receipt 액션)
ResultClient->>ResultClient: 2초 대기 (슬라이드 종료 타이밍)
ResultClient->>shareReceiptImage: getReceiptPaperElement().firstElementChild 전달
shareReceiptImage->>shareReceiptImage: html-to-image toBlob(element, pixelRatio)
shareReceiptImage-->>User: 다운로드 or Web Share API 실행
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
apps/web/src/app/archive/_components/TournamentHistoryContent.tsx (1)
9-11: ⚡ Quick win
isGeneratedAvatar헬퍼 중복 정의 → 공통 유틸로 추출 권장
TournamentHistoryContent.tsx와TournamentList.tsx두 파일 모두에서 동일한isGeneratedAvatar유틸리티 함수를 정의하고 있습니다. 공통 유틸 파일로 추출하면 일관성과 유지보수성이 향상됩니다.
apps/web/src/app/archive/_components/TournamentHistoryContent.tsx#L9-L11: 공통 유틸로 이동 후 importapps/web/src/app/home/_components/TournamentList.tsx#L7-L9: 공통 유틸로 이동 후 import♻️ 제안: `@/utils/avatar.ts` 생성 및 양쪽 파일에서 import
// apps/web/src/utils/avatar.ts /** 비회원의 서버 생성 Dicebear 아바타 URL 여부 판별 */ export const isGeneratedAvatar = (url: string) => url.includes('api.dicebear.com');양쪽 파일 수정:
- const isGeneratedAvatar = (url: string) => url.includes('api.dicebear.com'); + import { isGeneratedAvatar } from '`@/utils/avatar`';🤖 Prompt for 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. In `@apps/web/src/app/archive/_components/TournamentHistoryContent.tsx` around lines 9 - 11, The isGeneratedAvatar function is currently defined in two separate files: apps/web/src/app/archive/_components/TournamentHistoryContent.tsx (lines 9-11) and apps/web/src/app/home/_components/TournamentList.tsx (lines 7-9). Extract this duplicate function into a shared utility file at apps/web/src/utils/avatar.ts, then replace both local function definitions with imports from this new utility file. This will ensure consistency and improve maintainability across the codebase.apps/web/src/app/tournament/[id]/result/_components/ReceiptDrawMachine.tsx (1)
34-36: ⚡ Quick win타입을
HTMLElement로 변경해 안정성을 높이세요.현재
HTMLDivElement로 타입 단언하고 있지만,ReceiptPaper컴포넌트가 항상div를 루트로 렌더링한다는 보장이 없습니다. 실제 소비측(shareReceiptImage)은HTMLElement만 필요하므로, 더 일반적인 타입을 사용하는 것이 안전합니다.♻️ 제안하는 수정
/** 외부에서 영수증 종이 DOM 을 캡처할 때 사용 (예: 영수증 이미지 공유) */ export type ReceiptDrawMachineHandleT = { - getReceiptPaperElement: () => HTMLDivElement | null; + getReceiptPaperElement: () => HTMLElement | null; };() => ({ // 캡처 대상은 wrapper(transform 으로 애니메이션 / clip-path 마스크 영향) 가 아니라 // 그 안의 실제 영수증 종이 element. getReceiptPaperElement: () => - (receiptPaperRef.current?.firstElementChild as HTMLDivElement | null) ?? null, + (receiptPaperRef.current?.firstElementChild as HTMLElement | null) ?? null, }),Also applies to: 48-51
🤖 Prompt for 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. In `@apps/web/src/app/tournament/`[id]/result/_components/ReceiptDrawMachine.tsx around lines 34 - 36, Change the return type of the getReceiptPaperElement method in the ReceiptDrawMachineHandleT type definition from HTMLDivElement to HTMLElement to improve type stability and flexibility, since the ReceiptPaper component does not guarantee that a div element will be the root element, and the actual consumer (shareReceiptImage) only requires the more general HTMLElement type. This change should be applied wherever ReceiptDrawMachineHandleT is defined or used to ensure type consistency.
🤖 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/app/tournament/`[id]/result/_components/ResultClient.tsx:
- Around line 62-67: The setTimeout in the useQueryAction onAction callback is
not being cleaned up when the component unmounts, which can cause
handleShareReceiptImage to be called after unmount. Fix this by either creating
a mounted state ref (isMountedRef) that tracks component lifecycle and checking
it before calling handleShareReceiptImage inside the setTimeout callback, or by
moving the timer management logic into a separate useEffect hook where the
timeout can be properly canceled in the cleanup function. The current
implementation in the ResultClient component has no mechanism to prevent the
queued timeout from executing after unmount.
---
Nitpick comments:
In `@apps/web/src/app/archive/_components/TournamentHistoryContent.tsx`:
- Around line 9-11: The isGeneratedAvatar function is currently defined in two
separate files:
apps/web/src/app/archive/_components/TournamentHistoryContent.tsx (lines 9-11)
and apps/web/src/app/home/_components/TournamentList.tsx (lines 7-9). Extract
this duplicate function into a shared utility file at
apps/web/src/utils/avatar.ts, then replace both local function definitions with
imports from this new utility file. This will ensure consistency and improve
maintainability across the codebase.
In `@apps/web/src/app/tournament/`[id]/result/_components/ReceiptDrawMachine.tsx:
- Around line 34-36: Change the return type of the getReceiptPaperElement method
in the ReceiptDrawMachineHandleT type definition from HTMLDivElement to
HTMLElement to improve type stability and flexibility, since the ReceiptPaper
component does not guarantee that a div element will be the root element, and
the actual consumer (shareReceiptImage) only requires the more general
HTMLElement type. This change should be applied wherever
ReceiptDrawMachineHandleT is defined or used to ensure type consistency.
🪄 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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b747b779-40e2-4de1-8a69-2b386689956b
⛔ Files ignored due to path filters (2)
apps/web/src/assets/icons/outline/profile-circled-filled.svgis excluded by!**/*.svgpnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (15)
apps/app/hooks/useSplashScreenController.tsxapps/web/package.jsonapps/web/src/app/archive/_components/TournamentHistoryContent.tsxapps/web/src/app/home/_components/TournamentList.tsxapps/web/src/app/login/page.tsxapps/web/src/app/tournament/[id]/create/_components/TournamentCreateClient.tsxapps/web/src/app/tournament/[id]/result/_components/ReceiptDrawMachine.tsxapps/web/src/app/tournament/[id]/result/_components/ResultClient.tsxapps/web/src/app/tournament/[id]/result/_hooks/useGetGroupResult.tsapps/web/src/app/tournament/[id]/result/_utils/shareReceiptImage.tsapps/web/src/assets/icons/outline/index.tsapps/web/src/components/tournament-card/FriendListDialog.tsxapps/web/src/components/tournament-card/MorePopover.tsxapps/web/src/components/tournament-card/index.tsxapps/web/src/consts/queryAction.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
작업 내용
QA 라운드에서 발견된 이슈들을 카테고리별로 묶어 처리.
영수증 결과 페이지
html2canvas→html-to-image교체 — Tailwind v4 의lab()컬러 미지원 이슈 해결Button컴포넌트로 교체보관함 / 더보기 메뉴
group-result기반 lazy fetch (모달 열릴 때만 호출)홈 / 로그인
min-h-dvh통일기타
profile-circled-filled아이콘 추가 (친구 목록 본인 배지용)연관 이슈
closes #202
Summary by CodeRabbit
새로운 기능
버그 수정
UI/UX 개선