[feature] 지원서 활성화 버튼 기능 구현 by seongje973 · Pull Request #866 · Moadong/moadong

seongje973 · 2025-11-19T11:25:17Z

#️⃣연관된 이슈

ex) #이슈번호, #이슈번호
#848

📝작업 내용

이번 PR에서 작업한 내용을 간략히 설명해주세요(이미지/동영상 첨부 가능)

기본 지원서로 설정 클릭시 지원서 활성화
활성화된 지원서는 기본 지원서 해제로 버튼 문구 변경
활성화 전

활성화 후

기본지원서가 두개 이상일 경우 정상적으로 지원 모달이 뜨는 모습도 확인

중점적으로 리뷰받고 싶은 부분(선택)

리뷰어가 특별히 봐주었으면 하는 부분이 있다면 작성해주세요

ex) 메서드 XXX의 이름을 더 잘 짓고 싶은데 혹시 좋은 명칭이 있을까요?

논의하고 싶은 부분(선택)

논의하고 싶은 부분이 있다면 작성해주세요.

🫡 참고사항

Summary by CodeRabbit

릴리스 노트

새로운 기능
- 지원 관리 인터페이스 개선: 계층적 경로 구조 및 상세 리스트 뷰 추가
- 지원서 관리 기능 확대: 학기 정보 및 활성화 상태 관리 기능 추가
- 지원서 상태 전환 기능 구현
스타일
- UI 컴포넌트 개선: 로고, 태그, 카드 스타일 최적화
- 반응형 디자인 강화: 모바일 화면 대응 개선

vercel · 2025-11-19T11:25:22Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
moadong	Ready	Preview	Comment	Nov 19, 2025 11:25am

coderabbitai · 2025-11-19T11:25:28Z

Caution

Review failed

Failed to post review comments

Warning

`.coderabbit.yaml` has a parsing error

The CodeRabbit configuration file in this repository has a parsing error and default settings were used instead. Please fix the error(s) in the configuration file. You can initialize chat with CodeRabbit to get help with the configuration file.

💥 Parsing errors (1)

Validation error: Invalid regex pattern for base branch. Received: "**" at "reviews.auto_review.base_branches[0]"

⚙️ Configuration instructions

Please see the configuration documentation for more information.
You can also validate your configuration using the online YAML validator.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Walkthrough

관리자 페이지의 지원 관리 기능을 재구조화하여 clubId 기반 API 호출을 applicationFormId 기반으로 변경하고, 새로운 /admin/applicants-list 라우팅 구조를 도입했습니다. 새로운 지원서 목록 관리 컴포넌트와 상태 토글 기능을 추가하며, 지원서 관련 API 및 타입 정의를 업데이트했습니다.

Changes

코호트 / 파일(들)	변경 요약
라우팅 및 앱 구조 `frontend/src/App.tsx`	/admin 하위 라우팅을 /admin/applicants-list 구조로 재편성. ApplicantsListTab 임포트 추가. /admin/applicants-list/:applicationFormId/:questionId로 상세 페이지 라우팅 변경.
지원자 API 레이어 `frontend/src/apis/applicants/deleteApplicants.ts`, `frontend/src/apis/applicants/getClubApplicants.ts`	함수 시그니처를 clubId → applicationFormId로 변경. API 엔드포인트 경로 업데이트.
지원서 API 레이어 `frontend/src/apis/application/applyToClub.ts`, `frontend/src/apis/application/createApplication.ts`, `frontend/src/apis/application/updateApplication.ts`, `frontend/src/apis/application/updateApplicantDetail.ts`, `frontend/src/apis/application/getActiveApplications.ts`, `frontend/src/apis/application/getAllApplications.ts`, `frontend/src/apis/application/deleteApplication.ts`	새로운 API 함수 추가 (getActiveApplications, getAllApplications, updateApplicationStatus). 함수 시그니처 업데이트 및 엔드포인트 경로 수정.
상수 및 타입 정의 `frontend/src/constants/INITIAL_FORM_DATA.ts`, `frontend/src/types/applicants.ts`, `frontend/src/types/application.ts`, `frontend/src/mocks/data/mockData.ts`	새로운 필드 추가: semesterYear, semesterTerm, active. ApplicationFormItem, SemesterGroup 타입 추가. applicationFormId 프로퍼티 추가.
React Query 훅 `frontend/src/hooks/queries/applicants/useDeleteApplicants.ts`, `frontend/src/hooks/queries/applicants/useGetApplicants.ts`, `frontend/src/hooks/queries/applicants/useUpdateApplicant.ts`, `frontend/src/hooks/queries/application/useGetApplication.ts`, `frontend/src/hooks/queries/application/useGetApplicationlist.ts`, `frontend/src/hooks/queries/application/useDeleteApplication.ts`	훅 시그니처 업데이트: clubId → applicationFormId. 새로운 훅 추가 (useGetApplicationlist). enabled 조건부 실행 추가.
컨텍스트 `frontend/src/context/AdminClubContext.tsx`	포매팅 조정. applicationFormId 및 setApplicationFormId 프로퍼티 유지.
관리자 페이지 컴포넌트 `frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantsTab.tsx`, `frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.tsx`, `frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantsListTab/ApplicantsListTab.tsx`, `frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantsListTab/ApplicantsListTab.styles.ts`	ApplicantsTab 업데이트: applicationFormId 사용, 데이터 동기화. ApplicantDetailPage: navigationPath 업데이트 (/admin/applicants-list로 변경). 새로운 ApplicantsListTab 컴포넌트 및 스타일 추가.
지원서 관리 컴포넌트 `frontend/src/pages/AdminPage/tabs/ApplicationListTab/ApplicationListTab.tsx`, `frontend/src/pages/AdminPage/tabs/ApplicationListTab/ApplicationMenu.tsx`, `frontend/src/pages/AdminPage/tabs/ApplicationEditTab/ApplicationEditTab.tsx`	ApplicationListTab: 원격 데이터 로드, 상태 토글 워크플로우 추가. ApplicationMenu: onToggleStatus 콜백 추가. ApplicationEditTab: React Query 기반 로드 및 뮤테이션으로 마이그레이션.
내비게이션 및 페이지 `frontend/src/pages/AdminPage/components/SideBar/SideBar.tsx`, `frontend/src/pages/ApplicationFormPage/ApplicationFormPage.tsx`, `frontend/src/pages/AdminPage/auth/PrivateRoute/PrivateRoute.tsx`	SideBar: 라우트 경로 /admin/applicants → /admin/applicants-list로 변경. ApplicationFormPage: applyToClub 호출에 applicationFormId 추가. PrivateRoute: useGetApplicants 통합 제거.
스타일 업데이트 `frontend/src/components/ClubLogo/ClubLogo.tsx`, `frontend/src/components/ClubStateBox/ClubStateBox.tsx`, `frontend/src/components/ClubTag/ClubTag.tsx`, `frontend/src/components/application/QuestionTitle/QuestionTitle.tsx`, `frontend/src/pages/MainPage/MainPage.styles.ts`, `frontend/src/pages/MainPage/components/ClubCard/ClubCard.styles.ts`	border-radius, padding, font-size 값 조정. 반응형 디자인 상수화. ClubName: h2 → p 엘리먼트로 변경. QuestionTitle: placeholder 속성 추가, 따옴표 스타일 변경.

Sequence Diagram(s)

sequenceDiagram
    participant User as 사용자
    participant UI as 지원서 목록 UI
    participant API as API
    participant Context as AdminClubContext

    rect rgb(200, 220, 250)
    Note over User,Context: 지원서 목록 조회 및 상태 토글
    User->>UI: 지원서 목록 페이지 접속
    UI->>API: getAllApplicationForms()
    API-->>UI: 지원서 목록 (semesterYear, semesterTerm, active)
    UI->>Context: setApplicationFormId 호출
    UI->>User: 지원서 목록 렌더링
    end

    rect rgb(220, 250, 220)
    Note over User,Context: 지원서 활성화/비활성화 토글
    User->>UI: "More" 버튼 클릭 → 상태 토글 선택
    UI->>API: updateApplicationStatus(applicationFormId, currentStatus)
    API-->>UI: 상태 업데이트 완료
    UI->>API: getAllApplicationForms() (캐시 무효화)
    API-->>UI: 갱신된 지원서 목록
    UI->>User: 목록 새로고침
    end

    rect rgb(250, 230, 200)
    Note over User,Context: 지원자 상세 조회
    User->>UI: 지원자 목록에서 항목 클릭
    UI->>API: getClubApplicants(applicationFormId)
    API-->>UI: 지원자 데이터
    UI->>Context: setApplicantsData 호출
    UI->>User: 지원자 상세 페이지 표시
    end

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

검토 시 특별히 주의할 영역:

API 시그니처 변경: 여러 파일에서 clubId → applicationFormId로의 전환이 일관되게 적용되었는지 확인 필요 (deleteApplicants, getClubApplicants, applyToClub, updateApplicantDetail, updateApplication 등)
라우팅 경로 변경: /admin/applicants → /admin/applicants-list로의 전환이 모든 네비게이션 호출에서 일관되게 적용되었는지 확인
ApplicantsListTab 신규 컴포넌트: 새로운 컴포넌트의 데이터 페칭, 상태 관리, 메뉴 로직 검증
ApplicationListTab 마이그레이션: 기존 하드코딩된 데이터에서 원격 데이터 로드로의 전환 및 상태 토글 워크플로우
useGetApplication 훅: 파라미터 타입 변경 (optional → undefined) 및 enabled 조건부 실행 로직
타입 정의: ApplicationFormItem, SemesterGroup 등 신규 타입 추가 및 기존 ApplicationFormData 확장

Possibly related issues

[feature] MOA-346 지원서 활성화 버튼 기능 구현 #848: 지원서 활성화/비활성화 버튼 기능 구현 요청으로, 본 PR에서 추가된 updateApplicationStatus API 호출 및 ApplicationMenu onToggleStatus 워크플로우가 이 이슈의 목표를 직접 구현합니다.

Possibly related PRs

[feature] 동아리 관리자는 지원자를 확인할 수 있다. #612: App.tsx의 admin 라우팅 및 ApplicantDetailPage 경로 변경 등 지원 관리 기능의 라우팅 수정으로 연관됨
[feature] 다중 지원서 API 연결 #783: 지원자 관련 API 및 훅을 clubId에서 applicationFormId로 전환하고, /admin/applicants-list/* 라우팅을 추가하는 동일한 변경사항 포함
[feature] 활성화된 동아리 지원서만 보여준다 #769: 백엔드에서 status/active 필드 및 엔드포인트 추가로, 본 PR의 새로운 application-list API, ApplicationFormItem/status 타입, applicationFormId 및 active 상태 사용 흐름을 지원

Suggested labels

✨ Feature, 📬 API, 💻 FE

Suggested reviewers

Zepelown
lepitaaar
seongwon030

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Out of Scope Changes check	⚠️ Warning	ClubLogo, ClubStateBox, ClubTag 컴포넌트의 스타일 변경과 MainPage 레이아웃 조정은 지원서 활성화 기능 구현과 무관한 범위 밖의 변경사항입니다.	UI 스타일 및 레이아웃 변경 사항들을 별도의 PR로 분리하거나, 이들 변경의 필요성을 PR 설명에 명시하고 정당화하세요.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	PR 제목이 변경 사항의 주요 내용과 일치합니다. '지원서 활성화 버튼 기능 구현'은 API 엔드포인트 변경, 라우팅 구조 개선, 그리고 지원서 활성화/비활성화 토글 기능 구현을 포함한 PR의 핵심 목적을 명확하게 설명합니다.
Linked Issues check	✅ Passed	PR의 모든 코딩 관련 요구사항이 충족됩니다. MOA-346에서 요청한 '< > 버튼 클릭 시 지원서 활성화' 및 '활성화된 지원서 버튼 클릭 시 비활성화' 기능이 구현되었습니다.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch feature/#848-toggle-application-status-MOA-346

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

Provide your own instructions using the high_level_summary_instructions setting.
Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

📝 Description — Summarize the main change in 50–60 words, explaining what was done.

📓 References — List relevant issues, discussions, documentation, or related PRs.

📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.

📊 Contributor Summary — Include a Markdown table showing contributions:
| Contributor | Lines Added | Lines Removed | Files Changed |

✔️ Additional Notes — Add any extra reviewer context.
Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

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.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

lepitaaar

지원서활성화 수고하셨습니다~

lepitaaar · 2025-11-26T01:24:40Z

frontend/src/pages/AdminPage/tabs/ApplicationListTab/ApplicationListTab.tsx

+      applicationFormId,
+      currentStatus
+    );
+    queryClient.invalidateQueries({ queryKey: ['applicationForm'] });


캐시 무효화 좋네요

감사합니당!

feature: 지원서 활성화 기능 구현

9066cf5

channeltalk bot assigned seongje973 Nov 19, 2025

seongje973 requested review from Zepelown, lepitaaar, oesnuj, seongwon030 and suhyun113 and removed request for Zepelown November 19, 2025 11:26

seongje973 changed the base branch from main to develop-fe November 19, 2025 11:28

seongje973 removed request for oesnuj, seongwon030 and suhyun113 November 26, 2025 01:24

lepitaaar approved these changes Nov 26, 2025

View reviewed changes

seongje973 merged commit efe41aa into develop-fe Nov 26, 2025
3 checks passed

seongje973 deleted the feature/#848-toggle-application-status-MOA-346 branch November 26, 2025 01:28

This was referenced Nov 28, 2025

[refactor] 선택한 지원서 양식 id 새로고침해도 저장된다 #902

Merged

[feature] 대표 지원서 모아보기를 추가한다. #878

Merged

coderabbitai bot mentioned this pull request Jan 14, 2026

[hotfix] 지원자 상세 페이지에서 이전/다음 지원자 이동 시 흰 화면 표시 버그 #1033

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[feature] 지원서 활성화 버튼 기능 구현#866

[feature] 지원서 활성화 버튼 기능 구현#866
seongje973 merged 1 commit intodevelop-fefrom
feature/#848-toggle-application-status-MOA-346

seongje973 commented Nov 19, 2025 •

edited

Loading

Uh oh!

vercel bot commented Nov 19, 2025

Uh oh!

coderabbitai bot commented Nov 19, 2025 •

edited

Loading

Review failed

`.coderabbit.yaml` has a parsing error

Uh oh!

lepitaaar left a comment

Uh oh!

lepitaaar Nov 26, 2025

Uh oh!

seongje973 Nov 26, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Comments

Conversation

seongje973 commented Nov 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

#️⃣연관된 이슈

📝작업 내용

중점적으로 리뷰받고 싶은 부분(선택)

논의하고 싶은 부분(선택)

🫡 참고사항

Summary by CodeRabbit

릴리스 노트

Uh oh!

vercel bot commented Nov 19, 2025

Uh oh!

coderabbitai bot commented Nov 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review failed

.coderabbit.yaml has a parsing error

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

검토 시 특별히 주의할 영역:

Possibly related issues

Possibly related PRs

Suggested labels

Suggested reviewers

Pre-merge checks and finishing touches

Uh oh!

lepitaaar left a comment

Choose a reason for hiding this comment

Uh oh!

lepitaaar Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

seongje973 Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Comments

seongje973 commented Nov 19, 2025 •

edited

Loading

coderabbitai bot commented Nov 19, 2025 •

edited

Loading

`.coderabbit.yaml` has a parsing error