[FE-15] 앱 내 신청 목록 + 취소 수수료 바텀시트 (A-R5/A-R6)
작업 내용 (설계 의도)
변경 사항
mobile/app/recruitments/me.tsx(내 신청 목록) + mobile/components/recruitment/CancelApplicationSheet.tsx(취소 수수료 고지) 신규.
- 내 신청 목록:
useMyApplications, 신청 카드(모집명·상태 배지·취소 CTA). 4상태(로딩/0건 “신청한 모집이 없어요”/에러/리스트). - 취소 시트(토스 환불 확인):
useCancellationPreview로 환불액·수수료율 표시 — 환불액 큰 숫자(textPrimary), 수수료 보조(warning), 마감 잔여기간 안내. 단계별 UI: 7일 초과=전액환불·수수료 없음(success) / 3~7일=5% / 3일 이내=10% / 마감 후=취소 불가(danger, CTA disabled).useCancelApplication실행, PG오류 시 “환불 처리 실패, 잠시 후 다시” 재시도 안내. - 색 토큰(surfaceElevated 시트 배경).
근거: design-fe-app A-R5/A-R6, 취소 수수료 고지 UI. 롤백: 상태 전이(취소)는 서버 확정 후 목록 무효화 — 낙관 미적용.
의존
- FE-08 (useMyApplications/useCancelApplication/useCancellationPreview)
다이어그램
처리 흐름 (취소)
sequenceDiagram participant M as recruitments/me participant S as CancelApplicationSheet participant H as useCancelApplication M->>S: open(application) S->>S: preview(환불액·수수료율) S->>H: 확정 취소 H-->>S: 성공→목록 무효화 / 422 마감후→불가 / PG오류→재시도
테스트 케이스
- 내 신청 목록이 상태 배지와 함께 렌더된다
- 0건 시 EmptyState가 렌더된다
- 취소 시트에서 마감 5일 전이면 “5% 수수료 · 4,750원 환불”을 표시한다
- 마감 7일 초과면 “전액 환불 · 수수료 없음”을 표시한다
- 마감 후 진입 시 “취소할 수 없어요” + CTA disabled
- PG오류(500) 시 재시도 안내가 노출된다
- 취소 성공 시 목록이 갱신된다
- 라이트/다크 렌더