Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 Walkthrough워크스루멤버 목록 아코디언 컴포넌트의 높이를 동적으로 조정할 수 있도록 변경하는 리팩토링입니다. 고정된 Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes 코드 품질 검토✅ 긍정적인 측면
|
| Check name | Status | Explanation |
|---|---|---|
| Description Check | ✅ Passed | Check skipped - CodeRabbit’s high-level summary is enabled. |
| Title check | ✅ Passed | PR 제목은 주요 변경사항인 아코디언 높이 정책 추가를 명확하게 요약하고 있으며, 실제 코드 변경과 일치합니다. |
| Linked Issues check | ✅ Passed | PR이 연결된 이슈 #564의 요구사항을 완전히 충족합니다: 아코디언 높이를 동적으로 주입받도록 변경하고, 페이지 크기도 20으로 조정했습니다. |
| Out of Scope Changes check | ✅ Passed | 모든 변경사항이 아코디언 높이 정책 추가라는 명확한 범위 내에 있으며, 범위를 벗어난 변경은 없습니다. |
| Description check | ✅ Passed | PR 설명은 변경 목적, 동기, 구체적인 변경사항을 명확하게 기술하고 있습니다. |
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
✏️ Tip: You can configure your own custom pre-merge checks in the settings.
✨ Finishing Touches
- 📝 Generate docstrings (stacked PR)
- 📝 Generate docstrings (commit on current branch)
🧪 Generate unit tests (beta)
- Create PR with unit tests
- Post copyable unit tests in a comment
- Commit unit tests in branch
chore/member-accordion
Tip
Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs).
Share your feedback on Discord.
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 help to get the list of available commands and usage tips.
![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
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@apps/admin/src/features/member-by-generation/ui/MemberGenerationAccordion.tsx`:
- Around line 18-27: MemberGenerationAccordion's optional prop contentMaxHeight
has no default, causing maxHeight to be undefined and allowing uncontrolled
expansion; restore the prior default by treating contentMaxHeight as
contentMaxHeight ?? '36vh' inside MemberGenerationAccordion (and interpret a
literal "none" as the opt‑in to disable the cap) so the rendered style uses the
default 36vh unless contentMaxHeight === 'none'; update the call sites (e.g.,
MemberSearchAccordionList.tsx) and the test MemberGenerationAccordion.test.tsx
as needed to rely on the component default rather than passing the prop
everywhere.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 5fd59f45-4ad0-47ee-ba44-f371873df9c7
📒 Files selected for processing (3)
apps/admin/src/features/member-by-generation/model/useMembersByGenerationInfiniteQuery.tsapps/admin/src/features/member-by-generation/ui/MemberGenerationAccordion.tsxapps/admin/src/widgets/member-directory/ui/MemberGenerationAccordionList.tsx
| contentMaxHeight?: string; | ||
| }; | ||
|
|
||
| export const MemberGenerationAccordion = ({ generation, label, keyword, renderItem }: Props) => { | ||
| export const MemberGenerationAccordion = ({ | ||
| generation, | ||
| label, | ||
| keyword, | ||
| renderItem, | ||
| contentMaxHeight, | ||
| }: Props) => { |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Search for MemberGenerationAccordion usages in the codebase
rg "MemberGenerationAccordion" -t tsx -t ts -A 3 -B 1Repository: Tave-Makers/SURF-FE
Length of output: 90
🏁 Script executed:
#!/bin/bash
# Run the Python script from the review to check for usages without contentMaxHeight
python3 - <<'PY'
from pathlib import Path
import re
pattern = re.compile(r"<MemberGenerationAccordion\b(?P<body>.*?)(?:/>|</MemberGenerationAccordion>)", re.S)
found = False
for path in Path(".").rglob("*.tsx"):
if "node_modules" in path.parts or ".next" in path.parts:
continue
try:
text = path.read_text(encoding="utf-8")
except:
continue
for match in pattern.finditer(text):
block = match.group(0)
if "contentMaxHeight=" not in block:
found = True
line = text.count("\n", 0, match.start()) + 1
print(f"{path}:{line}")
print(block[:300].strip())
print("-" * 80)
if not found:
print("All MemberGenerationAccordion call sites explicitly pass contentMaxHeight.")
PYRepository: Tave-Makers/SURF-FE
Length of output: 773
🏁 Script executed:
#!/bin/bash
# Check the component implementation to see the actual style application
cat -n apps/admin/src/features/member-by-generation/ui/MemberGenerationAccordion.tsx | head -80Repository: Tave-Makers/SURF-FE
Length of output: 2834
🏁 Script executed:
cat -n apps/admin/src/widgets/group-management/ui/MemberSearchAccordionList.tsx | head -50Repository: Tave-Makers/SURF-FE
Length of output: 1843
🏁 Script executed:
# Also check if there's a git history or any recent changes to understand the original default
git log --oneline -20 -- apps/admin/src/features/member-by-generation/ui/MemberGenerationAccordion.tsx 2>/dev/null || echo "Git history not available"Repository: Tave-Makers/SURF-FE
Length of output: 101
기본 높이 정책이 사라져 실제 코드에 회귀가 발생합니다.
검증 결과, 제시하신 우려가 정당합니다. apps/admin/src/widgets/group-management/ui/MemberSearchAccordionList.tsx:27의 실제 프로덕션 코드에서 contentMaxHeight prop을 전달하지 않고 있습니다. 이로 인해 이 컴포넌트의 아코디언 높이 제약이 사라지고 무제한 확장됩니다(이전 기본값 36vh → 현재 undefined).
또한 MemberGenerationAccordion.test.tsx:12의 테스트 코드도 동일한 문제가 있습니다.
원인: contentMaxHeight가 optional prop이면서 컴포넌트 내 기본값이 없어서, prop을 전달하지 않으면 style={{ maxHeight: undefined }}가 되어 높이 제약이 적용되지 않습니다.
권장 해결책:
- 방법 A (권장): 컴포넌트 내 기본값 복원 →
contentMaxHeight ?? '36vh'로 처리하되, full-height가 필요한 경우만contentMaxHeight="none"으로 opt-in - 방법 B: 기존 모든 호출부에
contentMaxHeight="36vh"명시 추가 (더 번거로움)
방법 A가 기존 화면 회귀를 막으면서도 새로운 요구사항을 충족하는 안전한 선택입니다.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In
`@apps/admin/src/features/member-by-generation/ui/MemberGenerationAccordion.tsx`
around lines 18 - 27, MemberGenerationAccordion's optional prop contentMaxHeight
has no default, causing maxHeight to be undefined and allowing uncontrolled
expansion; restore the prior default by treating contentMaxHeight as
contentMaxHeight ?? '36vh' inside MemberGenerationAccordion (and interpret a
literal "none" as the opt‑in to disable the cap) so the rendered style uses the
default 36vh unless contentMaxHeight === 'none'; update the call sites (e.g.,
MemberSearchAccordionList.tsx) and the test MemberGenerationAccordion.test.tsx
as needed to rely on the component default rather than passing the prop
everywhere.
1 participant
✅ 체크리스트
🔗 관련 이슈
📌 작업 목적
🔨 주요 작업 내용
MemberGenerationAccordion에 하드코딩되어 있던 maxHeight 제거, 최대 높이를 동적으로 주입받도록 변경☑️ 해결 방법 (선택)
MemberGenerationAccordion에 하드코딩되어 있던 maxHeight 제거, 최대 높이를 동적으로 주입받도록 변경Summary by CodeRabbit
릴리스 노트