fix: 견적 페이지 UI 및 TOP 버튼 접근성 개선 - #100
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Review limit reached
Next review available in: 39 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: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (5)
📝 WalkthroughWalkthrough인증 로딩 대체 UI를 제거했습니다. 견적 화면의 세로 레이아웃과 빈 상태 정렬을 조정했습니다. 상세 로딩 영웅의 프로필 표시와 이미지 preload 처리를 변경했습니다. 스크롤 버튼의 포커스 동작과 랜딩 이미지 클래스 순서를 변경했습니다. Changes견적 화면 레이아웃 및 인증 로딩
견적 상세 로딩 영웅
스크롤 버튼 포커스 동작
랜딩 이미지 클래스 정렬
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 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 `@src/components/common/ScrollToTopButton.tsx`:
- Around line 53-60: Reset isFocused whenever hiddenByRoute becomes true, before
the return-null route hiding branch removes the button DOM. Update the effect or
route-handling logic around shouldHideScrollToTop and the existing focus state
so returning to an allowed route cannot show the button solely from stale focus,
while preserving scroll-threshold visibility behavior.
- Around line 90-117: Update the scroll-to-top button element in
ScrollToTopButton to add aria-hidden={!show}, keeping the existing tabIndex
behavior unchanged. This must exclude the button from the accessibility tree
when show is false while preserving accessibility when show or isFocused makes
the button visible.
In `@src/components/estimate/requests/EstimateRequestsPageClient.tsx`:
- Line 78: Update the top-level div in EstimateRequestsPageClient to include the
flex utility alongside flex-1, flex-col, and items-center, enabling the intended
flex layout while preserving the existing responsive styling and
EstimateRequestsList centering behavior.
🪄 Autofix
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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 973589a1-f52e-4125-86c8-a1d748bb3046
📒 Files selected for processing (11)
src/app/estimates/received/page.tsxsrc/components/common/ScrollToTopButton.tsxsrc/components/estimate/pending/PendingEstimatesPageClient.tsxsrc/components/estimate/received/ReceivedEstimatesPageClient.tsxsrc/components/estimate/requests/EstimateRequestsList.tsxsrc/components/estimate/requests/EstimateRequestsPageClient.tsxsrc/components/landing/LandingBottomBanner.tsxsrc/components/landing/LandingFeatureCompare.tsxsrc/components/landing/LandingFeatureRequest.tsxsrc/components/landing/LandingHero.tsxsrc/components/landing/LandingMoveTypes.tsx
There was a problem hiding this comment.
작업하시느라 수고하셨습니다!
tap버튼의 접근성 경고와 보낸 견적 페이지에서 스켈레톤이 두 개 뜨던 문제는 해결된 것으로 보입니다!
다만 pc 사이즈에서 보낸 견적 페이지 스켈레톤은 화면의 가로 중앙에 잘 뜨다가 로딩이 끝난 본 카드는 화면 왼쪽에 딱 붙는 이슈가 있어 확인 후 수정이 필요해보입니다!
또한 견적 상세 페이지에서 기사님 프로필 이미지가 여전히 로딩 중에는 기본 이미지의 위 아래로 검정색이 나타나는 이슈가 있습니다. 해결이 되지 않는다면 기사님 상세 페이지와 프로필 이미지 스켈레톤을 동일하게 맞추는 것도 하나의 방법일 것 같습니다!
yooseohyeon
left a comment
yooseohyeon
left a comment
There was a problem hiding this comment.
또한 이번 pr 범위를 벗어나는 것이지만, 보낸 견적 요청에서는 "견적 관리를 불러오는 중입니다." 안내 문구가 한 번 표시된 후 스켈레톤이 표시되었다가 본 데이터가 표시되며, 받았던 견적에서는 "로그인 상태를 확인하는 중입니다." 안내 문구가 한 번 표시된 후 스켈레톤이 표시되었다가 본 데이터가 표시되는 이슈가 있습니다.
확인 후 스켈레톤 ui만 나타나도록 수정이 필요해보입니다.
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 `@src/components/common/DetailHeroBanner.tsx`:
- Around line 11-12: Update EstimateDetailLayoutProps to include
preloadProfileImage, then pass that option through the EstimateDetailLayout call
to DetailHeroBanner so the configured value is preserved instead of falling back
to false.
🪄 Autofix
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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: a7ab9847-da71-4b8f-bbcd-f1946565bd86
📒 Files selected for processing (5)
src/components/common/DetailHeroBanner.tsxsrc/components/estimate/detail/EstimateDetailLayout.tsxsrc/components/estimate/detail/EstimateDetailPageSkeleton.tsxsrc/components/estimate/requests/EstimateRequestLoadingSkeletons.tsxsrc/components/estimate/requests/EstimateRequestsPageClient.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- src/components/estimate/requests/EstimateRequestsPageClient.tsx
2 participants
📋 작업 내용
QA 과정에서 확인된 견적 페이지의 로딩/빈 상태 UI와 TOP 버튼 접근성 문제를 수정했습니다.
🔥 변경 사항
1. 견적 페이지 Skeleton 개선
2. 보낸 견적 요청 Empty State UI 개선
3. TOP 버튼 접근성 개선
✅ 체크리스트
📷 스크린샷 (선택)
🔗 관련 이슈
Closes #
💬 To Reviewer
Summary by CodeRabbit
버그 수정
스타일
개선