[feat] 일반 단체채팅방 멤버 목록 조회 및 초대 기능 추가#294
Conversation
|
Warning Rate limit exceeded
To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (11)
Walkthrough이 변경은 일반 단체채팅방에서 멤버 목록 조회 및 초대 기능을 추가합니다. 새로운 API 엔드포인트( Possibly related PRs
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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. Review rate limit: 0/1 reviews remaining, refill in 28 minutes and 40 seconds.Comment |
5c01c44 to
db5b10e
Compare
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (3)
src/components/layout/Header/components/ChatHeader.tsx (1)
30-34: 멤버 수 조회는useSuspenseQuery로 맞추는 편이 좋습니다.현재
useQuery라서 그룹 방에서 멤버 수가 잠깐0으로 보일 수 있습니다. 이 화면은 이미Suspense아래라서 서버 상태도 suspense query로 통일하는 게 더 자연스럽습니다.♻️ Proposed fix
-import { useQuery } from '@tanstack/react-query'; +import { useSuspenseQuery } from '@tanstack/react-query'; @@ - const { data: chatRoomMembersData } = useQuery( + const { data: chatRoomMembersData } = useSuspenseQuery( chatQueries.members(isGroup && chatRoom?.chatType === 'GROUP' ? numericRoomId : undefined) ); @@ - const memberCount = chatRoom?.chatType === 'GROUP' ? (chatRoomMembersData?.members.length ?? 0) : clubMembers.length; + const memberCount = chatRoom?.chatType === 'GROUP' ? chatRoomMembersData.members.length : clubMembers.length;🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/layout/Header/components/ChatHeader.tsx` around lines 30 - 34, The member count is fetched with useQuery which can briefly show 0 in a Suspense-wrapped screen; replace the useQuery call with useSuspenseQuery when calling chatQueries.members (i.e., change the hook that produces chatRoomMembersData to useSuspenseQuery and keep the same key/params logic), update any imports to bring in useSuspenseQuery, and ensure the downstream memberCount calculation still reads chatRoomMembersData?.members.length safely (falling back to 0) so the component uses the suspense-backed data source instead of the transient useQuery result.src/pages/Chat/ChatRoomInfo.tsx (1)
2-4: 멤버 조회도 Suspense 쿼리로 맞춰주세요.여기만
useQuery와 로컬isPending분기를 쓰면 같은 채팅 플로우 안에서 로딩/에러 처리 방식이 달라집니다. 이 화면도useSuspenseQuery로 올리고 fallback은 상위 경계에 맡기는 편이 일관됩니다. As per coding guidelines 'Use React QueryuseSuspenseQueryfor server state management'.Also applies to: 135-137
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/Chat/ChatRoomInfo.tsx` around lines 2 - 4, The ChatRoomInfo component currently uses useQuery and a local isPending branch for members; replace that call with the React Query useSuspenseQuery variant and remove the local loading/error conditional so the component relies on the upper Suspense/ErrorBoundary fallback; specifically, swap the useQuery call that fetches members (the invocation referencing chatQueries) to useSuspenseQuery (or your app's wrapper hook) and delete the isPending-based rendering branch so loading/error handling is delegated to the parent boundary.src/pages/Chat/AddChatRoom.tsx (1)
2-5: 이 화면의 서버 상태도 Suspense 패턴으로 통일해주세요.현재는 초대 목록과 기존 멤버 목록을 모두
useQuery로 받아서 로컬 로딩 분기를 직접 관리하고 있습니다. 이 플로우도useSuspenseQuery로 맞춰야 페이지 단위 처리 방식이 일관됩니다. As per coding guidelines 'Use React QueryuseSuspenseQueryfor server state management'.Also applies to: 85-90
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/Chat/AddChatRoom.tsx` around lines 2 - 5, The component AddChatRoom is using useQuery for server state (chatQueries.*) and local loading branches; replace those with the project's useSuspenseQuery variant so the page uses the Suspense pattern consistently: import and call useSuspenseQuery instead of useQuery for the invitableUsers/invitableSections and existing members queries (the chatQueries.* calls used in AddChatRoom), remove local isLoading/isFetching conditional rendering and rely on a Suspense boundary around AddChatRoom, and preserve options like keepPreviousData or query keys by passing the same parameters into useSuspenseQuery; ensure any error boundaries remain intact and adjust references to invitableUsersQuery / invitableSectionsQuery / membersQuery used in AddChatRoom (also update the other queries referenced at lines ~85-90) so they all use useSuspenseQuery.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/apis/chat/queries.ts`:
- Around line 41-52: Unify the validation for members(...) so queryKey, enabled,
and queryFn use the same check: use Number.isFinite(chatRoomId) as the canonical
truth test (instead of mixing truthy and != null). Update the queryKey to choose
chatQueryKeys.members(chatRoomId) only when Number.isFinite(chatRoomId)
(otherwise membersDisabled()), set enabled to Number.isFinite(chatRoomId), and
guard queryFn to throw or call getChatRoomMembers(chatRoomId) based on the same
Number.isFinite(chatRoomId) condition so all three (queryKey, enabled, queryFn)
are consistent.
In `@src/pages/Chat/AddChatRoom.tsx`:
- Around line 89-92: The invite flow allows selecting users before existing
members are loaded because currentRoomMemberIds is built from
chatRoomMembersData which can be undefined; update the logic in AddChatRoom so
when isInviteMode is true and chatRoomMembersData is not yet available (or query
isLoading), you show a loading/disabled state and avoid computing/using
currentRoomMemberIds and filteredSections until data arrives. Specifically,
guard the use of chatRoomMembersData/currentRoomMemberIds (created from
chatRoomMembersData?.members) and the selection logic that derives
filteredSections and the confirm button enabling (the code around
chatQueries.members, currentRoomMemberIds, filteredSections, and any
confirm/selection handlers) so selection UI and the confirm action are disabled
or replaced with a loader until members are loaded.
In `@src/pages/Chat/ChatRoomInfo.tsx`:
- Around line 160-174: isCurrentDisplayedMember currently infers the current
user from chatMessages (inferredCurrentUserId) and name matching
(currentUserNameMatchCount), which fails for users who haven't sent messages or
have duplicate names; change the logic to use authenticated userId from
currentUser (currentUser.userId) and the member.userId for primary comparison
inside isCurrentDisplayedMember, e.g. if currentUser?.userId is present return
member.userId === currentUser.userId (for both group and non-group cases), and
only fall back to comparing name and studentNumber when currentUser.userId is
unavailable; remove reliance on inferredCurrentUserId and chatMessages for
current-user detection.
---
Nitpick comments:
In `@src/components/layout/Header/components/ChatHeader.tsx`:
- Around line 30-34: The member count is fetched with useQuery which can briefly
show 0 in a Suspense-wrapped screen; replace the useQuery call with
useSuspenseQuery when calling chatQueries.members (i.e., change the hook that
produces chatRoomMembersData to useSuspenseQuery and keep the same key/params
logic), update any imports to bring in useSuspenseQuery, and ensure the
downstream memberCount calculation still reads
chatRoomMembersData?.members.length safely (falling back to 0) so the component
uses the suspense-backed data source instead of the transient useQuery result.
In `@src/pages/Chat/AddChatRoom.tsx`:
- Around line 2-5: The component AddChatRoom is using useQuery for server state
(chatQueries.*) and local loading branches; replace those with the project's
useSuspenseQuery variant so the page uses the Suspense pattern consistently:
import and call useSuspenseQuery instead of useQuery for the
invitableUsers/invitableSections and existing members queries (the chatQueries.*
calls used in AddChatRoom), remove local isLoading/isFetching conditional
rendering and rely on a Suspense boundary around AddChatRoom, and preserve
options like keepPreviousData or query keys by passing the same parameters into
useSuspenseQuery; ensure any error boundaries remain intact and adjust
references to invitableUsersQuery / invitableSectionsQuery / membersQuery used
in AddChatRoom (also update the other queries referenced at lines ~85-90) so
they all use useSuspenseQuery.
In `@src/pages/Chat/ChatRoomInfo.tsx`:
- Around line 2-4: The ChatRoomInfo component currently uses useQuery and a
local isPending branch for members; replace that call with the React Query
useSuspenseQuery variant and remove the local loading/error conditional so the
component relies on the upper Suspense/ErrorBoundary fallback; specifically,
swap the useQuery call that fetches members (the invocation referencing
chatQueries) to useSuspenseQuery (or your app's wrapper hook) and delete the
isPending-based rendering branch so loading/error handling is delegated to the
parent boundary.
🪄 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: 017794d4-7d68-4249-9e9d-201cc2a59948
📒 Files selected for processing (11)
src/App.tsxsrc/apis/chat/entity.tssrc/apis/chat/index.tssrc/apis/chat/mutations.tssrc/apis/chat/queries.tssrc/components/layout/Header/components/ChatHeader.tsxsrc/components/layout/Header/headerConfig.tssrc/components/layout/Header/routeTitles.tssrc/pages/Chat/AddChatRoom.tsxsrc/pages/Chat/ChatRoomInfo.tsxsrc/pages/Chat/hooks/useChatMutations.ts
✨ 요약
😎 해결한 이슈
Summary by CodeRabbit
릴리스 노트