Conversation
Closed
Walkthrough로딩 UI를 텍스트에서 재사용 가능한 Spinner로 통일하고, TopicHeader에 제안하기 네비게이션(gatheringId, meetingId) 로직을 추가하며 ProposedTopicList의 Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
🧪 Generate unit tests (beta)
No actionable comments were generated in the recent review. 🎉 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 |
Contributor
Author
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In `@src/shared/ui/Spinner.tsx`:
- Line 14: In Spinner.tsx the SVG group uses the invalid JSX attribute
`clip-path`; update it to the camelCase `clipPath` so React recognizes the
property and the clipping is applied (search for the <g clip-path=...>
occurrence and replace with <g clipPath=...>, and scan the file for any other
hyphenated SVG attributes to convert to camelCase).
- Around line 25-27: The hardcoded clipPath id in Spinner.tsx causes collisions
when multiple Spinner components render; modify the Spinner component to
generate a unique id (e.g., via React.useId() or a useId hook) and use that id
for both the <clipPath id=...> and any referencing attributes (e.g.,
clipPath="url(#...)" or maskHref) so each Spinner instance gets a unique
clipPath; update the Spinner component's JSX to compute const clipId =
`clip-${id}` (or similar) and substitute that symbol where the static
"clip0_3797_13505" was used.
🧹 Nitpick comments (2)
src/features/book/components/BookInfo.tsx (1)
17-23: 주석 처리된 코드가 남아있습니다.Line 17의
// if (isLoading) return <BookInfoSkeleton />— 향후 스켈레톤 구현 예정이라면 TODO 주석으로 명시하거나, 불필요하다면 제거하는 게 좋겠습니다.src/pages/Meetings/MeetingDetailPage.tsx (1)
66-77:alert()대신openError모달 패턴 사용을 권장합니다.다른 모든 페이지(
GatheringDetailPage,GatheringSettingPage,PreOpinionListPage등)에서는useGlobalModalStore의openError로 에러를 처리하고 있습니다. 이 파일만 브라우저alert()를 사용하면 UX 일관성이 깨집니다.또한 Line 76의 주석 처리된
navigate코드는 의도가 불분명하므로 정리가 필요합니다.♻️ openError 패턴으로 전환 제안
+import { useGlobalModalStore } from '@/store' + export default function MeetingDetailPage() { const { gatheringId, meetingId } = useParams<{ gatheringId: string; meetingId: string }>() + const { openError } = useGlobalModalStore() // 에러 처리 useEffect(() => { if (proposedError) { - alert(`제안된 주제 조회 실패: ${proposedError.userMessage}`) + openError('오류', `제안된 주제 조회 실패: ${proposedError.userMessage}`) } if (confirmedError) { - alert(`확정된 주제 조회 실패: ${confirmedError.userMessage}`) + openError('오류', `확정된 주제 조회 실패: ${confirmedError.userMessage}`) } if (meetingError) { - alert(`약속 조회 실패: ${meetingError.userMessage}`) + openError('오류', `약속 조회 실패: ${meetingError.userMessage}`) } - // navigate(ROUTES.GATHERING_DETAIL(gatheringId), { replace: true }) - }, [proposedError, confirmedError, meetingError]) + }, [proposedError, confirmedError, meetingError, openError])
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
3 participants
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.
🚀 풀 리퀘스트 제안
로딩(Spinner) 컴포넌트를 개발하고
로딩중 상태일때 로딩 UI를 적용합니다
📋 작업 내용
Spinner컴포넌트 신규 구현 및 전역 로딩 UI에 적용TopicSkeleton) 컴포넌트 추가<p>Loading...</p>) 을Spinner로 교체🔧 변경 사항
src/shared/ui/Spinner.tsx— SVG 기반 스피너 컴포넌트 신규 추가 (height: full | fit옵션 지원)src/features/topics/components/TopicSkeleton.tsx— 주제 영역 스켈레톤 컴포넌트 신규 추가src/routes/PrivateRoute.tsx— 인증 확인 중 로딩 UI를Spinner로 교체src/pages/Gatherings/*,src/pages/Meetings/*,src/pages/PreOpinions/*— 각 페이지 로딩 상태 UI 개선src/features/book,src/features/topics컴포넌트 로딩 처리 개선📸 스크린샷 (선택 사항)
📄 기타
Spinner의 height="full" 의 경우 페이지 레벨에서 header높이를 제외하고 중앙정렬을 지원합니다
기본값은 height="fit"입니다. 위치 조절이 필요하시면 div컴포넌트로 감싸서 사용하시면 됩니다
Summary by CodeRabbit
릴리스 노트
새로운 기능
UI 개선
주의 / 공개 API 변경