Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (6)
✅ Files skipped from review due to trivial changes (1)
🚧 Files skipped from review as they are similar to previous changes (5)
WalkthroughTooltip compound 컴포넌트와 관련 타입, 컨텍스트, 스타일 토큰, Storybook 예시가 추가되었습니다. Root는 상태와 위치를 관리하고, Trigger/Content/Arrow가 연결되며, public export가 정리되었습니다. ChangesTooltip 컴포넌트 구현
Estimated code review effort: 3 (Moderate) | ~30 minutes 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
🧪 테스트 결과
|
🚦 CI 검증 결과
|
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
src/shared/ui/tooltip/Tooltip.stories.tsx (1)
78-140: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win
Placements스토리 중복 구조를 데이터 기반으로 정리 권장.top/left/right/bottom 4개 블록이
Tooltip.Trigger+Tooltip.Content+Tooltip.Arrow구조를 거의 동일하게 반복하고 있습니다.placement, 버튼 라벨, 안내 문구만 배열로 뽑아.map으로 렌더링하면 유지보수가 쉬워집니다.♻️ 리팩터링 제안
+const placements = [ + { placement: 'top', label: 'Top', description: '위에 표시됩니다.' }, + { placement: 'left', label: 'Left', description: '왼쪽에 표시됩니다.' }, + { placement: 'right', label: 'Right', description: '오른쪽에 표시됩니다.' }, + { placement: 'bottom', label: 'Bottom', description: '아래에 표시됩니다.' }, +] as const; + export const Placements: Story = { render: () => ( <div className="grid min-h-96 place-items-center bg-black p-16"> <div className="grid grid-cols-3 items-center gap-6"> <div /> - <Tooltip placement="top"> - <Tooltip.Trigger asChild> - <Button className="w-28" variant="secondary"> - Top - </Button> - </Tooltip.Trigger> - <Tooltip.Content> - 위에 표시됩니다. - <Tooltip.Arrow /> - </Tooltip.Content> - </Tooltip> + {placements + .filter(({ placement }) => placement === 'top') + .map(({ placement, label, description }) => ( + <Tooltip key={placement} placement={placement}> + <Tooltip.Trigger asChild> + <Button className="w-28" variant="secondary"> + {label} + </Button> + </Tooltip.Trigger> + <Tooltip.Content> + {description} + <Tooltip.Arrow /> + </Tooltip.Content> + </Tooltip> + ))} <div /> {/* ... 나머지 방향도 동일 패턴으로 정리 ... */}🤖 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 `@src/shared/ui/tooltip/Tooltip.stories.tsx` around lines 78 - 140, The Placements story in Tooltip.stories.tsx repeats the same Tooltip.Trigger, Tooltip.Content, and Tooltip.Arrow structure four times for top/left/right/bottom. Refactor this story into a data-driven render by moving the placement, button label, and message text into an array and mapping over it inside the Placements Story render function, keeping the existing Tooltip, Tooltip.Trigger, Tooltip.Content, Tooltip.Arrow, and Button usage intact.
🤖 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/shared/ui/tooltip/Tooltip.tsx`:
- Around line 142-184: The controlled open path in Tooltip can leave content
mounted but still hidden because position initialization only happens through
requestOpenChange and the current layout effect skips updates when open is
driven externally. Update Tooltip’s open-state syncing so external false -> true
changes also reset shouldRenderContent/isPositioned and trigger positioning,
using the existing requestOpenChange, updatePosition, and useLayoutEffect flow.
Make sure the controlled prop change follows the same mount/position setup as
the internal open request path so Tooltip.Content is shown with fresh
coordinates.
In `@src/shared/ui/tooltip/TooltipTrigger.tsx`:
- Around line 107-157: The TooltipTrigger logic is overwriting any existing
aria-describedby value with the tooltip content ID in both the asChild branch
and the button render path. Update TooltipTrigger and its helper usage so the
tooltip ID is merged with any existing aria-describedby on the trigger (for
example via the existing props/child attrs in getSlotProps, cloneSlot, and
getTriggerButtonProps) instead of replacing it, keeping both descriptions
accessible.
---
Nitpick comments:
In `@src/shared/ui/tooltip/Tooltip.stories.tsx`:
- Around line 78-140: The Placements story in Tooltip.stories.tsx repeats the
same Tooltip.Trigger, Tooltip.Content, and Tooltip.Arrow structure four times
for top/left/right/bottom. Refactor this story into a data-driven render by
moving the placement, button label, and message text into an array and mapping
over it inside the Placements Story render function, keeping the existing
Tooltip, Tooltip.Trigger, Tooltip.Content, Tooltip.Arrow, and Button usage
intact.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 215a2c4b-2aa7-4675-a3cb-ce9c6f9b234b
📒 Files selected for processing (10)
src/shared/styles/base/colors.csssrc/shared/styles/base/z-index.csssrc/shared/ui/tooltip/Tooltip.stories.tsxsrc/shared/ui/tooltip/Tooltip.tsxsrc/shared/ui/tooltip/Tooltip.types.tssrc/shared/ui/tooltip/TooltipArrow.tsxsrc/shared/ui/tooltip/TooltipContent.tsxsrc/shared/ui/tooltip/TooltipContext.tssrc/shared/ui/tooltip/TooltipTrigger.tsxsrc/shared/ui/tooltip/index.ts
#️⃣연관된 이슈
체크 사항
📝작업 내용
Tooltip 공통 컴포넌트 구현
Tooltip.Root,Tooltip.Trigger,Tooltip.Content,Tooltip.Arrowcompound 구조를 추가했습니다.top,right,bottom,left위치를 지원합니다.Content는 기본적으로 portal을 통해document.body에 렌더링되도록 구성했습니다.스타일 토큰 정리
--z-index-tooltip토큰으로 분리했습니다.--shadow-tooltip토큰으로 정리했습니다.스크린샷 (선택)
추가한 라이브러리 (선택)
💬리뷰 요구사항(선택)
Summary by CodeRabbit