Conversation
- applicationData를 tanstack으로 가져옴
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning
|
| Cohort / File(s) | Summary |
|---|---|
ApplicantDetailPage — 데이터 소스 전환 frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx |
useGetApplicants(applicationFormId) 도입으로 applicantsData를 새 훅에서 가져오도록 변경. useUpdateApplicant는 유지. applicants 관련 로딩/에러 플래그 분리(isApplicantsLoading, isApplicantsError) 및 early-return 조건과 navigation/selection 인덱스 계산을 새 데이터 소스로 전환. |
Import 정리 — ApplicantsListTab frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantsListTab/ApplicantsListTab.tsx |
React 기본 import React 제거 및 사용하지 않는 useQueryClient, updateApplicationStatus 임포트 삭제 (런타임 동작 변경 없음). |
Sequence Diagram(s)
(해당 변경은 컴포넌트 내부 데이터 소스 변경 및 간단한 로직 조정에 그치므로 시퀀스 다이어그램을 생략합니다.)
Estimated code review effort
🎯 2 (Simple) | ⏱️ ~10 minutes
Possibly related PRs
- [feature] 지원자 현황 디자인을 적용한다 #659: ApplicantDetailPage 컴포넌트 구조 및 스타일 변경과 동일 파일의 수정 지점이 겹칩니다.
- [hotfix] 지원자 상세 페이지에서 이전/다음 지원자 이동 시 흰 화면 표시 버그 #1033: ApplicantDetailPage의 navigation/selection 및 applicationFormId 경로 통합 관련 변경과 관련 있습니다.
- [Release] v1.0.9 #627:
useGetApplicants훅 도입/사용 및 ApplicantDetailPage의 applicants 데이터 흐름 변경과 직접 연관됩니다.
Suggested labels
🐞 Bug
Suggested reviewers
- lepitaaar
- oesnuj
- suhyun113
🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
| Check name | Status | Explanation |
|---|---|---|
| Description Check | ✅ Passed | Check skipped - CodeRabbit’s high-level summary is enabled. |
| Title 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
fix/#1224-application-page-error-MOA-671
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.
lepitaaar
left a comment
There was a problem hiding this comment.
작업수고하셨습니다. 상위컴포넌트에서 지원자 응답을 fetch후 컨텍스트로 내려주고있었던건간요?
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx (1)
56-56:applicationFormId ?? undefined표현식이 중복됩니다
useParams가 이미string | undefined를 반환하므로applicationFormId ?? undefined는 항등식입니다. 56번째 줄과 69번째 줄 모두 해당됩니다.♻️ 제안하는 수정 방법
- const { data: applicantsData } = useGetApplicants( - applicationFormId ?? undefined, - ); + const { data: applicantsData } = useGetApplicants(applicationFormId);- const { mutate: updateApplicant } = useUpdateApplicant( - applicationFormId ?? undefined, - ); + const { mutate: updateApplicant } = useUpdateApplicant(applicationFormId);Also applies to: 69-69
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx` at line 56, The expression "applicationFormId ?? undefined" is redundant because useParams already returns string | undefined; remove the "?? undefined" and pass applicationFormId directly wherever it's used (both occurrences in ApplicantDetailPage — e.g., the prop/argument that currently uses applicationFormId ?? undefined and the second occurrence further down). Ensure any function calls or props (references to applicationFormId) accept the existing type and update them to use applicationFormId without the nullish-coalescing fallback.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`:
- Around line 55-57: Destructure and use the loading/error flags from
useGetApplicants and reorder the guard checks in ApplicantDetailPage so that
loading is handled before the "no data" message: update the call to
useGetApplicants(...) to also pull out isLoading and isError, then in the render
flow check applicantsIsLoading first and show the spinner, then check
applicantsIsError to show an error message, and only after those checks use
!applicantsData to render the "no data" state; apply the same pattern where
useGetApplicants is used alongside useGetApplication (formData) to ensure each
hook's loading/error state is respected independently.
---
Nitpick comments:
In
`@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`:
- Line 56: The expression "applicationFormId ?? undefined" is redundant because
useParams already returns string | undefined; remove the "?? undefined" and pass
applicationFormId directly wherever it's used (both occurrences in
ApplicantDetailPage — e.g., the prop/argument that currently uses
applicationFormId ?? undefined and the second occurrence further down). Ensure
any function calls or props (references to applicationFormId) accept the
existing type and update them to use applicationFormId without the
nullish-coalescing fallback.
frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx
Outdated
Show resolved
Hide resolved
네네 그러합니다 정확히 말하자면 상위 컴포넌트는 아니고 다른 페이지에서 fetch 합니다 |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx (1)
167-171:⚠️ Potential issue | 🟡 Minor빈
answers배열에 대한 런타임 에러 가능성
a.answers[0].value는answers가 빈 배열인 지원자가 존재할 경우TypeError: Cannot read properties of undefined를 발생시킵니다.🛡️ 제안하는 수정 방법
- {a.answers[0].value} + {a.answers[0]?.value ?? '(이름 없음)'}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx` around lines 167 - 171, The map over applicantsData.applicants in ApplicantDetailPage accesses a.answers[0].value which will throw if answers is empty; update the mapping in the component to safely access the first answer (use optional chaining like a.answers?.[0]?.value) and provide a sensible fallback label (e.g., 'No answer' or empty string) so the <option> text never reads from undefined while keeping the option key/value as a.id.
🧹 Nitpick comments (1)
frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx (1)
54-54:clubId!비-null 단언 사용에 대한 개선 고려
useAdminClubContext가 컨텍스트 미존재 시 예외를 던지므로clubId는 런타임에 항상 존재하지만,clubId!는 TypeScript의 타입 검사를 우회합니다. 추후 로그인 연동으로clubId가 동적으로 로드되는 방식으로 변경될 예정이므로(retrieved learning 참조), 이때clubId가 비동기적으로undefined인 순간이 생기면useGetApplication에undefined가 전달될 수 있습니다.
applicationFormId와 동일하게clubId가드를 추가하는 것을 고려해보세요.♻️ 제안하는 수정 방법
+ if (!clubId) { + return <div>클럽 정보를 불러올 수 없습니다.</div>; + } if (!applicationFormId) { return <div>지원서 정보를 불러올 수 없습니다.</div>; }const { data: formData, isLoading, isError, - } = useGetApplication(clubId!, applicationFormId ?? undefined); + } = useGetApplication(clubId, applicationFormId ?? undefined);Based on learnings: "AdminPage.tsx에서 현재 하드코딩된 클럽 ID('67d2e3b9b15c136c6acbf20b')는 로그인 기능 구현 후 동적으로 가져오는 방식으로 수정될 예정입니다."
Also applies to: 69-69
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx` at line 54, 현재 ApplicantDetailPage에서 useAdminClubContext()로 가져온 clubId를 non-null 단언자로 우회하고 있는데, clubId가 비동기적으로 undefined가 될 수 있으므로 useGetApplication 호출(및 관련 로직) 전에 clubId 존재를 검사하도록 수정하세요: ApplicantDetailPage에서 useAdminClubContext와 useGetApplication 호출부를 찾아 clubId가 정의된 경우에만 useGetApplication을 호출하거나(예: conditional hook usage 패턴으로 대체) 컴포넌트 렌더에서 clubId가 없을 땐 로딩/빈 상태를 반환하도록 추가 가드를 넣어 applicationFormId와 동일한 방식으로 안전하게 처리합니다.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In
`@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`:
- Around line 167-171: The map over applicantsData.applicants in
ApplicantDetailPage accesses a.answers[0].value which will throw if answers is
empty; update the mapping in the component to safely access the first answer
(use optional chaining like a.answers?.[0]?.value) and provide a sensible
fallback label (e.g., 'No answer' or empty string) so the <option> text never
reads from undefined while keeping the option key/value as a.id.
---
Duplicate comments:
In
`@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`:
- Around line 55-59: The destructuring of useGetApplicants into
data/isLoading/isError and the corrected guard order (loading → applicants error
→ null applicants → formData error → null formData → null applicant) has been
fixed for the first occurrence; apply the identical fix to the second occurrence
referenced (lines 104-110) by updating that useGetApplicants call to destructure
isLoading and isError into isApplicantsLoading/isApplicantsError and reorder the
conditional guards in the same sequence as in ApplicantDetailPage
(useGetApplicants, applicantsData, applicationFormId, formData, and the null
applicant checks) so both spots behave consistently.
---
Nitpick comments:
In
`@frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`:
- Line 54: 현재 ApplicantDetailPage에서 useAdminClubContext()로 가져온 clubId를 non-null
단언자로 우회하고 있는데, clubId가 비동기적으로 undefined가 될 수 있으므로 useGetApplication 호출(및 관련 로직)
전에 clubId 존재를 검사하도록 수정하세요: ApplicantDetailPage에서 useAdminClubContext와
useGetApplication 호출부를 찾아 clubId가 정의된 경우에만 useGetApplication을 호출하거나(예:
conditional hook usage 패턴으로 대체) 컴포넌트 렌더에서 clubId가 없을 땐 로딩/빈 상태를 반환하도록 추가 가드를 넣어
applicationFormId와 동일한 방식으로 안전하게 처리합니다.
#️⃣연관된 이슈
📝작업 내용
에러 상황&원인
2026-02-22.12.24.22.mov
지원자 페이지 새로고침 시 지원자 데이터가 불러오지 않는 문제가 있었습니다.
원인은
applicationData를 Context api 기반인adminContext에서 가져오기 때문에 새로고침 시 데이터가 null이 되는 것이었습니다.해결
지원자 데이터를 tanstack훅인
useGetApplicants에서 직접 fetch하도록 했습니다.중점적으로 리뷰받고 싶은 부분(선택)
논의하고 싶은 부분(선택)
🫡 참고사항
Summary by CodeRabbit
개선 사항
코드 정리