회원 탈퇴 기능 UI 및 API 연동 (DELETE /users/me)

[parkjuyeong0312]

설명

• 백엔드 PR #131에서 DELETE /users/me 신규 엔드포인트가 추가됨.
• 성공: 204 No Content + Set-Cookie로 access_token/refresh_token 즉시 만료.
• 거절: 422 WITHDRAWAL_REQUIRES_HOST_DELEGATION — 응답 본문에 위임이 필요한 방 목록(roomsRequiringDelegation: [{ roomId, title }]) 포함.
• 탈퇴 후 잔존 RTK는 서버 측에서 일괄 폐기되며, 탈퇴 유저의 POST /api/auth/refresh는 REFRESH_TOKEN_NOT_FOUND로 차단됨.

기대 동작

• 설정 페이지에 "회원 탈퇴" 진입점 추가 + 되돌릴 수 없음/익명화 안내 확인 모달.
• src/lib/api/auth.ts 혹은 신규 src/lib/api/user.ts에 withdrawAccount() 추가(DELETE, credentials: "include").
• 204 응답 시 클라이언트 상태(react-query 캐시, 전역 store) 클린업 후 로그인 화면으로 라우팅(쿠키는 서버가 만료시키므로 클라이언트 토큰 제거 코드 불필요).
• 422 응답 시 roomsRequiringDelegation을 받아 위임이 필요한 방 목록 모달 노출, 방 제목 클릭 시 해당 방 호스트 위임 화면으로 딥링크.
• src/lib/api/errors.ts에 WITHDRAWAL_REQUIRES_HOST_DELEGATION 코드 인식 헬퍼 추가.

참고

• 백엔드 PR: feat: 회원 탈퇴(DELETE /users/me) 구현 backend-server#131
• 관련 파일: src/components/settings/, src/lib/api/auth.ts, src/lib/api/errors.ts

[song9252]

프론트 반영 요약 (회원 탈퇴 — DELETE /users/me)

진입점

• 홈 화면 우측 상단 프로필 아이콘 → 드롭다운에 회원 탈퇴 메뉴 추가 (로그아웃 아래, 빨간색 강조)

탈퇴 확인

• 회원 탈퇴 선택 시 확인 모달 표시
• 되돌릴 수 없음, 개인정보 익명화, 여행 멤버십 정리 안내
• 방장인 여행에 다른 멤버가 남아 있으면 위임이 필요하다는 안내 포함
• 탈퇴하기 / 취소 선택 가능

탈퇴 성공

• 탈퇴 완료 후 로그인 화면으로 이동
• 앱 내 저장된 사용자·방 관련 상태와 데이터 캐시 정리 (쿠키 만료는 서버 처리)

방장 위임이 필요한 경우

• 방장인 채 다른 멤버가 있는 여행이 있으면 탈퇴가 막히고, 방장 위임이 필요해요 안내 모달 표시
• 위임이 필요한 여행 이름 목록 표시
• 여행 이름을 누르면 해당 여행의 멤버 설정으로 이동해 방장 위임 가능

확인해 보면 좋은 시나리오

1. 일반 멤버 탈퇴 → 로그인 화면으로 이동, 재접속 시 비로그인
2. 다인 여행의 방장이 탈퇴 시도 → 위임 필요 모달 → 여행 선택 → 멤버 설정에서 위임 후 재시도
3. 확인 모달에서 취소 시 탈퇴 진행 안 됨