Conversation
📝 WalkthroughWalkthrough클럽 멤버 애플리케이션 조회 기능이 추가되었습니다. API 레이어에 🚥 Pre-merge checks | ✅ 2✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
src/pages/Manager/ManagedApplicationList/index.tsx (1)
103-104: 빈 목록 상태 UI를 추가하면 UX가 좋아집니다.Line 103-104에서 항목이 0개면 영역이 비어 보입니다. 탭별 빈 상태 메시지를 넣는 것을 권장합니다.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/Manager/ManagedApplicationList/index.tsx` around lines 103 - 104, The view currently maps currentList?.applications to Card and shows nothing when the array is empty; update the ManagedApplicationList render to detect when currentList?.applications is empty (e.g., !currentList || currentList.applications.length === 0) and render a tab-specific empty state component or message instead of the map; locate the mapping code around currentList?.applications.map(...) and replace or wrap it with a conditional that renders a reusable Empty/Placeholder UI (with explanatory text and an action button if appropriate) so each tab shows a clear empty-state message.
🤖 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/pages/Manager/ManagedApplicationList/index.tsx`:
- Around line 26-27: The two hooks useGetManagedApplications and
useGetManagedMemberApplications are always invoked regardless of activeTab, so
if the inactive tab's useSuspenseQuery fails it blocks rendering; update the
component to only call each hook when its tab is active (or wrap each tab pane
in its own Suspense boundary) and add error handling for
useGetManagedMemberApplications (e.g., catch or error boundary) so
member-application API errors don't bubble up; specifically, conditionally
invoke useGetManagedApplications when activeTab === 'applications' (or render
its Suspense-wrapped pane) and conditionally invoke
useGetManagedMemberApplications when activeTab === 'members' (or wrap it with
its own Suspense/ErrorBoundary) to prevent inactive-tab API failures from
affecting the active tab.
---
Nitpick comments:
In `@src/pages/Manager/ManagedApplicationList/index.tsx`:
- Around line 103-104: The view currently maps currentList?.applications to Card
and shows nothing when the array is empty; update the ManagedApplicationList
render to detect when currentList?.applications is empty (e.g., !currentList ||
currentList.applications.length === 0) and render a tab-specific empty state
component or message instead of the map; locate the mapping code around
currentList?.applications.map(...) and replace or wrap it with a conditional
that renders a reusable Empty/Placeholder UI (with explanatory text and an
action button if appropriate) so each tab shows a clear empty-state message.
ℹ️ Review info
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
src/apis/club/index.tssrc/pages/Manager/ManagedApplicationList/index.tsxsrc/pages/Manager/hooks/useManagedMemberApplications.ts
| const { managedClubApplicationList, hasNoRecruitment } = useGetManagedApplications(clubId, pendingPage, limit); | ||
| const { managedClubMemberApplicationList } = useGetManagedMemberApplications(clubId, approvedPage, limit); |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
cat -n src/pages/Manager/ManagedApplicationList/index.tsx | head -50Repository: BCSDLab/KONECT_FRONT_END
Length of output: 2195
🏁 Script executed:
rg -n 'useGetManagedApplications|useGetManagedMemberApplications|activeTab' src/pages/Manager/ManagedApplicationList/index.tsx -B2 -A2Repository: BCSDLab/KONECT_FRONT_END
Length of output: 2207
🏁 Script executed:
fd -e ts -e tsx -path "*hooks*" | grep -i 'managed'Repository: BCSDLab/KONECT_FRONT_END
Length of output: 236
🏁 Script executed:
fd -type f -name "*useManagedApplications*"Repository: BCSDLab/KONECT_FRONT_END
Length of output: 238
🏁 Script executed:
fd -type f -name "*useManagedMemberApplications*"Repository: BCSDLab/KONECT_FRONT_END
Length of output: 238
🏁 Script executed:
fd "useManagedApplications" --extension ts --extension tsxRepository: BCSDLab/KONECT_FRONT_END
Length of output: 117
🏁 Script executed:
fd "useManagedMemberApplications" --extension ts --extension tsxRepository: BCSDLab/KONECT_FRONT_END
Length of output: 123
🏁 Script executed:
cat -n src/pages/Manager/hooks/useManagedApplications.tsRepository: BCSDLab/KONECT_FRONT_END
Length of output: 3858
🏁 Script executed:
cat -n src/pages/Manager/hooks/useManagedMemberApplications.tsRepository: BCSDLab/KONECT_FRONT_END
Length of output: 1060
비활성 탭 API 오류가 활성 탭 렌더링을 막고 있습니다
26-27줄에서 두 훅이 useSuspenseQuery를 사용하며 activeTab 상태와 무관하게 항상 호출되고 있습니다. 따라서 비활성 탭의 API가 실패하면 Suspense 경계로 인해 현재 탭 화면 렌더링까지 실패합니다. 각 탭을 독립적인 Suspense 경계로 분리하거나, 훅 호출을 탭별로 조건부 실행하도록 개선해주세요.
추가로 useGetManagedMemberApplications는 에러 핸들링이 없어서 더 취약합니다.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/pages/Manager/ManagedApplicationList/index.tsx` around lines 26 - 27, The
two hooks useGetManagedApplications and useGetManagedMemberApplications are
always invoked regardless of activeTab, so if the inactive tab's
useSuspenseQuery fails it blocks rendering; update the component to only call
each hook when its tab is active (or wrap each tab pane in its own Suspense
boundary) and add error handling for useGetManagedMemberApplications (e.g.,
catch or error boundary) so member-application API errors don't bubble up;
specifically, conditionally invoke useGetManagedApplications when activeTab ===
'applications' (or render its Suspense-wrapped pane) and conditionally invoke
useGetManagedMemberApplications when activeTab === 'members' (or wrap it with
its own Suspense/ErrorBoundary) to prevent inactive-tab API failures from
affecting the active tab.
Summary by CodeRabbit