refactor: 홈 화면 개선 - #365
Merged
Merged
Conversation
Closed
7 tasks
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Discord 스레드 연동용 메타데이터입니다. discord-pr-bot 워크플로가 자동 생성하며, 수정·삭제하면 PR 과 Discord 알림 연동이 끊깁니다. |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (4)
🚧 Files skipped from review as they are similar to previous changes (3)
📝 WalkthroughWalkthrough홈 토너먼트 목록에 조회 제한, 썸네일, 빈 상태, 로딩 스켈레톤이 추가되었습니다. 홈 CTA와 초대 흐름, 카드·프로필 표시, 로고·타이포그래피·결과 화면 스타일도 함께 변경되었습니다. Changes홈 토너먼트 목록 및 카드
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant HomePage
participant TournamentListClient
participant useGetTournamentList
participant getTournamentList
HomePage->>TournamentListClient: render tournament section
TournamentListClient->>useGetTournamentList: request statuses and limit=3
useGetTournamentList->>getTournamentList: pass status and limit
getTournamentList-->>TournamentListClient: return tournament data with thumbnailUrls
Possibly related PRs
Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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: 5
🧹 Nitpick comments (1)
apps/web/src/components/tournament-card/ItemImageThumbnails.tsx (1)
9-12: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win컴포넌트별 Props 타입명을 사용하세요.
Props와 익명 props 타입 대신ItemImageThumbnailsProps,ThumbnailProps를 선언해 컴포넌트 소유권을 명확히 하세요. As per coding guidelines, component props must use{ComponentName}Props.Also applies to: 43-48
🤖 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/components/tournament-card/ItemImageThumbnails.tsx` around lines 9 - 12, Rename the component-specific props types in ItemImageThumbnails and its thumbnail component from generic or anonymous Props definitions to ItemImageThumbnailsProps and ThumbnailProps, and update the corresponding component annotations and references to use those names.Source: Coding guidelines
🤖 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/home/_components/AddWishHomeDialog.tsx`:
- Around line 25-33: In the AddWishHomeDialog image block, update the Image
using AddWishBg to be decorative by removing the duplicated Korean label from
its alt text and using the framework’s decorative-image convention. Keep the
visible “위시 담기” span unchanged as the sole accessible label.
In `@apps/web/src/app/home/_components/InviteTournamentDialog.tsx`:
- Around line 51-63: Update the error-handling branches in
InviteTournamentDialog so closing the dialog on status 400 or 409 also resets
the invitation-code state. Reuse the existing dialog-close/reset flow rather
than calling setOpen(false) directly, while preserving the corresponding error
dialog behavior.
In `@apps/web/src/app/home/_components/tournament-list/client.tsx`:
- Around line 24-26: Update both tournament history Link elements in
apps/web/src/app/home/_components/tournament-list/client.tsx lines 24-26 and
apps/web/src/app/home/_components/tournament-list/TournamentListSkeleton.tsx
lines 38-40 to include aria-label="토너먼트 히스토리 보기" and the cursor-pointer class.
In `@apps/web/src/components/tournament-card/index.tsx`:
- Around line 44-73: Restructure the tournament card so MorePopover is rendered
outside the Link anchor as a sibling action, preventing the interactive button
from being nested inside the card link. Preserve the existing showMorePopover
condition, positioning, and tournament/status/count props while keeping the card
content itself linked.
In `@apps/web/src/components/tournament-card/ItemImageThumbnails.tsx`:
- Around line 20-26: Update ItemImageThumbnails so the back Thumbnail is
rendered only when backImageUrl exists, since thumbnailUrls may contain a single
image. Replace its LoaderIconFill fallback with the component’s image fallback
behavior, ensuring missing or failed back images never leave a persistent
loader.
---
Nitpick comments:
In `@apps/web/src/components/tournament-card/ItemImageThumbnails.tsx`:
- Around line 9-12: Rename the component-specific props types in
ItemImageThumbnails and its thumbnail component from generic or anonymous Props
definitions to ItemImageThumbnailsProps and ThumbnailProps, and update the
corresponding component annotations and references to use those names.
🪄 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: 7c88c381-4255-478d-af4f-e96e9ae53ff6
⛔ Files ignored due to path filters (4)
apps/web/src/app/home/_assets/add-wish-bg.pngis excluded by!**/*.pngapps/web/src/assets/images/piki-logo-cart.svgis excluded by!**/*.svgapps/web/src/assets/images/piki-logo-text.svgis excluded by!**/*.svgapps/web/src/assets/images/piki-receipt-logo.svgis excluded by!**/*.svg
📒 Files selected for processing (40)
apps/web/e2e/mocks/tournament.tsapps/web/src/apis/getTournamentList.tsapps/web/src/app/_components/SplashClient.tsxapps/web/src/app/archive/tournament/_components/TournamentHistoryList.tsxapps/web/src/app/design-system/button/page.tsxapps/web/src/app/design-system/typography/page.tsxapps/web/src/app/home/_components/AddWishHomeDialog.tsxapps/web/src/app/home/_components/CreateTournamentDialog.tsxapps/web/src/app/home/_components/InviteTournamentButton.tsxapps/web/src/app/home/_components/InviteTournamentDialog.tsxapps/web/src/app/home/_components/tournament-list/TournamentListSkeleton.tsxapps/web/src/app/home/_components/tournament-list/client.tsxapps/web/src/app/home/_components/tournament-list/index.tsxapps/web/src/app/home/page.tsxapps/web/src/app/login/page.tsxapps/web/src/app/mypage/edit/_components/NicknameField.tsxapps/web/src/app/mypage/withdraw/page.tsxapps/web/src/app/notification/_components/NotificationEmptyState.tsxapps/web/src/app/notification/_components/NotificationErrorState.tsxapps/web/src/app/tournament/[id]/_common/_utils/parseTournamentId.tsapps/web/src/app/tournament/[id]/create/_components/product-image/fallback/LgErrorFallback.tsxapps/web/src/app/tournament/[id]/create/by-wish/_components/WishSelectHeader.tsxapps/web/src/app/tournament/[id]/match/_components/RoundBadge.tsxapps/web/src/app/tournament/[id]/match/_components/RoundTransition.tsxapps/web/src/app/tournament/[id]/match/_components/RoundTransitionSheet.tsxapps/web/src/app/tournament/[id]/match/_components/TournamentClient.tsxapps/web/src/app/tournament/[id]/result/_components/ReceiptPaper.tsxapps/web/src/app/tournament/[id]/result/group/_components/GroupResultClient.tsxapps/web/src/app/tournament/[id]/result/group/page.tsxapps/web/src/components/common/wish-card/index.tsxapps/web/src/components/status-chip/index.tsxapps/web/src/components/tournament-card/ItemImageThumbnails.tsxapps/web/src/components/tournament-card/MorePopover.tsxapps/web/src/components/tournament-card/index.tsxapps/web/src/components/user-profile-group/index.tsxapps/web/src/hooks/useGetTournamentList.tsapps/web/src/styles/globals.cssapps/web/src/styles/typography.cssapps/web/src/types/tournament.tsapps/web/src/utils/tournament.ts
💤 Files with no reviewable changes (3)
- apps/web/src/app/tournament/[id]/_common/_utils/parseTournamentId.ts
- apps/web/src/app/home/_components/InviteTournamentButton.tsx
- apps/web/src/utils/tournament.ts
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
apps/web/src/components/common/wish-login-required/index.tsx (1)
21-30: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win부수 효과 없는 이동은
Link로 처리하세요.로그인 이동과
onGoHome미지정 시 홈 이동은 단순 내비게이션입니다.onGoHome이 주입된 경우에만 현재 콜백을 유지하고, 나머지는Link기반으로 렌더링하세요.As per coding guidelines,
router.push는 다이얼로그 종료나 API 완료 등 부수 효과가 동반될 때만 사용해야 합니다.🤖 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/components/common/wish-login-required/index.tsx` around lines 21 - 30, Replace router.push navigation in handleLoginClick and the default branch of handleGoHomeClick with Link-based rendering for the login and home destinations. Preserve the onGoHome callback path unchanged when it is provided, and update the corresponding clickable elements to use the generated login path and ROUTES.HOME hrefs.Source: Coding guidelines
apps/web/src/components/common/tournament-empty-state/tournamentEmptyState.style.ts (1)
51-51: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win공유 타입 이름에
T접미사를 붙여 주세요.
TournamentEmptyStateVariantProps는 외부 파일에서 import하는 공유 타입이므로TournamentEmptyStateVariantPropsT로 변경하고index.tsx의 import도 함께 갱신하세요.As per coding guidelines, shared type names must use the
Tsuffix.🤖 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/components/common/tournament-empty-state/tournamentEmptyState.style.ts` at line 51, Rename the shared type TournamentEmptyStateVariantProps to TournamentEmptyStateVariantPropsT in tournamentEmptyState.style.ts, and update the corresponding import and usages in index.tsx to match.Source: Coding guidelines
🤖 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/home/_components/AddWishHomeDialog.tsx`:
- Around line 39-43: Update the isLoginRequiredOpen rendering in
AddWishHomeDialog to use the project’s established accessible modal or
page-navigation pattern instead of a plain overlay div. Ensure the guest login
view provides modal semantics, traps focus, disables interaction with the
underlying home content, and preserves the existing onGoHome behavior.
---
Nitpick comments:
In
`@apps/web/src/components/common/tournament-empty-state/tournamentEmptyState.style.ts`:
- Line 51: Rename the shared type TournamentEmptyStateVariantProps to
TournamentEmptyStateVariantPropsT in tournamentEmptyState.style.ts, and update
the corresponding import and usages in index.tsx to match.
In `@apps/web/src/components/common/wish-login-required/index.tsx`:
- Around line 21-30: Replace router.push navigation in handleLoginClick and the
default branch of handleGoHomeClick with Link-based rendering for the login and
home destinations. Preserve the onGoHome callback path unchanged when it is
provided, and update the corresponding clickable elements to use the generated
login path and ROUTES.HOME hrefs.
🪄 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: b7eefb43-695b-4bab-89db-c4c86f08825a
⛔ Files ignored due to path filters (1)
apps/web/src/assets/images/basket-empty.svgis excluded by!**/*.svg
📒 Files selected for processing (47)
apps/web/e2e/specs/home/home.spec.tsapps/web/src/app/archive/layout.tsxapps/web/src/app/archive/tournament/_components/TournamentHistoryList.tsxapps/web/src/app/archive/wish/[id]/_components/EditContent.tsxapps/web/src/app/design-system/typography/page.tsxapps/web/src/app/error.tsxapps/web/src/app/home/_components/AddWishHomeDialog.tsxapps/web/src/app/home/_components/CreateTournamentDialog.tsxapps/web/src/app/home/_components/InviteTournamentDialog.tsxapps/web/src/app/home/_components/invite-code-dialog/InvalidCodeDialog.tsxapps/web/src/app/home/_components/tournament-list/TournamentListSkeleton.tsxapps/web/src/app/home/_components/tournament-list/client.tsxapps/web/src/app/home/_components/tournament-list/index.tsxapps/web/src/app/home/page.tsxapps/web/src/app/invite/[id]/_components/InviteClient.tsxapps/web/src/app/mypage/_components/LogoutMenuItem.tsxapps/web/src/app/mypage/withdraw/_components/WithdrawConfirmDialog.tsxapps/web/src/app/not-found.tsxapps/web/src/app/play/[id]/_components/PlayClient.tsxapps/web/src/app/tournament/[id]/create/_components/add-by-link-dialog/AddByLinkDialog.tsxapps/web/src/app/tournament/[id]/create/_components/deposit-closed-dialog/DepositClosedDialog.tsxapps/web/src/app/tournament/[id]/create/_components/invite-friends/InviteExpiresPicker.tsxapps/web/src/app/tournament/[id]/create/_components/invite-friends/InviteFriendsDialog.tsxapps/web/src/app/tournament/[id]/create/_components/member-join-confirm-dialog/MemberJoinConfirmDialog.tsxapps/web/src/app/tournament/[id]/create/_components/owner-started-dialog/OwnerStartedDialog.tsxapps/web/src/app/tournament/[id]/create/_components/tournament-header/ConfirmExitDialog.tsxapps/web/src/app/tournament/[id]/create/_components/tournament-header/TournamentGuidePopover.tsxapps/web/src/app/tournament/[id]/create/_components/tournament-item-basket/TournamentItemFailedDrawer.tsxapps/web/src/app/tournament/[id]/create/_components/tournament-start-button/ByeWarningDialog.tsxapps/web/src/app/tournament/[id]/create/_components/tournament-start-button/ConfirmStartDialog.tsxapps/web/src/app/tournament/[id]/create/_components/welcome-join-dialog/WelcomeJoinDialog.tsxapps/web/src/app/tournament/[id]/item/[itemId]/_components/EditContent.tsxapps/web/src/app/tournament/[id]/result/_components/ResultClient.tsxapps/web/src/app/tournament/[id]/result/_components/plate-share-dialog/PlateShareDialog.tsxapps/web/src/app/tournament/[id]/result/group/_components/GroupResultClient.tsxapps/web/src/app/tournament/join/[id]/_components/JoinPreviewClient.tsxapps/web/src/components/common/tournament-empty-state/index.tsxapps/web/src/components/common/tournament-empty-state/tournamentEmptyState.style.tsapps/web/src/components/common/wish-login-required/index.tsxapps/web/src/components/get-item-dialog/ByImageDialog.tsxapps/web/src/components/get-item-dialog/ByLinkDialog.tsxapps/web/src/components/get-item-dialog/index.tsxapps/web/src/components/tournament-card/FriendListDialog.tsxapps/web/src/components/tournament-card/TournamentDeleteDialog.tsxapps/web/src/components/tournament-card/index.tsxapps/web/src/components/tournament-error-dialog/index.tsxapps/web/src/styles/typography.css
🚧 Files skipped from review as they are similar to previous changes (6)
- apps/web/src/app/archive/tournament/_components/TournamentHistoryList.tsx
- apps/web/src/app/home/_components/CreateTournamentDialog.tsx
- apps/web/src/app/tournament/[id]/result/group/_components/GroupResultClient.tsx
- apps/web/src/app/home/page.tsx
- apps/web/src/app/home/_components/tournament-list/index.tsx
- apps/web/src/app/home/_components/InviteTournamentDialog.tsx
This was referenced Jul 21, 2026
This was referenced Aug 1, 2026
Merged
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.
작업 요약
작업 세부 내용
홈 CTA 영역 개편
위시 담기카드: 아이콘 → 배경 이미지(add-wish-bg.png) 기반 카드로 변경 (2행 차지)새 토너먼트 만들기카드:BasketIconFill+ 좌측 정렬 타이틀 구성으로 변경InviteTournamentButton제거 →InviteTournamentDialog로 통합 (내부에서open상태와DialogTrigger를 직접 관리)grid grid-cols-2레이아웃으로 재배치참여 중인 토너먼트 리스트
ItemImageThumbnails컴포넌트 추가 — 토너먼트 아이템 썸네일 최대 2장을 겹쳐서 노출 (로딩/에러 fallback 포함)TournamentCard구조 개편: 날짜(date) 제거, 썸네일(imageUrls) 추가,showMorePopoverprop으로 더보기 노출 제어limit) 하고참여 중인 토너먼트헤더에 히스토리 이동 링크 추가getTournamentList/useGetTournamentList에limit파라미터 추가,GetTournamentListResponseT에thumbnailUrls필드 추가UI / 리팩토링
StatusChip: 아이콘 제거, 고정 너비 제거,플레이→플레이 중라벨 변경heading-2→heading-2-semibold)piki-logo.svg→piki-logo-cart.svg,piki-logo-text.svg추가,piki-receipt-logo.svg제거)CreateTournamentDialog에sr-onlyDialogDescription추가 (접근성)TournamentT타입 및parseTournamentId유틸 제거스크린샷
연관 이슈
closes #336
Summary by CodeRabbit
새 기능
개선 사항