fix/reduced-motion-coverage#302
Conversation
reduced-motion 블록이 핵심 모션만 끄고 인접 전환을 놓쳤다(coderabbit 리뷰 반영): - button: .button::before 오버레이 배경 전환 추가 - tabs: .tabs_tab 전환 추가 - sidebar: 본체(width)/header/header_layer/item/item_label 전환까지 포함 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
useState+useEffect matchMedia 구독을 React 표준 useSyncExternalStore 로 교체 (gemini 리뷰 반영). getServerSnapshot 으로 SSR 초기값을 선언적으로 정의해 hydration-safe 하고, 서버/클라이언트 동일 시 마운트 리렌더가 제거된다. 동작과 공개 시그니처는 불변(boolean 반환). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
Warning Review limit reached
More reviews will be available in 6 minutes and 4 seconds. Learn how PR review limits work. To continue reviewing without waiting, enable usage-based billing in the billing tab. ⌛ How to resolve this issue?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 credits. 🚦 How do rate limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan refill rate. 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, the refill rate gradually slows as usage increases. The highest same-day bursts are limited more strictly. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (4)
✨ 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 |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request expands reduced-motion CSS rules across buttons, sidebars, and tabs, and refactors the useReducedMotion hook to use React's useSyncExternalStore for hydration-safe media query subscriptions. The feedback recommends caching the MediaQueryList instance in the module scope to avoid redundant window.matchMedia calls on every getSnapshot execution, preventing potential performance overhead.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
Coverage Report
File Coverage
|
||||||||||||||||||||||||||||||||||||||
getSnapshot 이 렌더마다 window.matchMedia() 를 새로 호출하던 것을 모듈 스코프에 1회 생성·재사용하도록 캐싱(gemini 리뷰). window.matchMedia 참조가 바뀌면 캐시를 무효화해 테스트 격리/SSR 도 안전하게 유지한다. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
1 participant
작업 개요
PR #301 리뷰(gemini·coderabbit)에서 나온 reduced-motion 후속 보강.
작업한 내용
.button::before오버레이 배경 전환도 reduced-motion 에서 끔 (coderabbit).tabs_tab전환 추가 (indicator 만 끄던 것 → 탭 전환까지) (coderabbit)width)/header/header_layer/item/item_label전환까지 포함 (coderabbit). 실제 존재 클래스만 타겟(소스 검증).useState+useEffect구독을 React 표준useSyncExternalStore로 교체 (gemini).getServerSnapshot=false 로 hydration-safe, 마운트 리렌더 제거. 공개 시그니처 불변.검증
pnpm test605 passed (훅 회귀 5개 포함) /pnpm buildOK /pnpm lint:css0