회원 탈퇴 기능 구현

[goder-0]

관련 이슈

• close 회원 탈퇴 프로세스 페이지 및 컴포넌트 개발 #565

PR 설명

작업 내용

• 사이드 네비게이션 프로필 메뉴에 회원 탈퇴 진입점과 구분선을 추가했습니다.
• 탈퇴 주의 안내와 탈퇴 사유 선택으로 구성된 2단계 모달을 구현했습니다.
• 백엔드 회원 탈퇴 API 계약에 맞춰 confirmed, deleteReason, GA clientId를 전달하는 BFF를 추가했습니다.
• 탈퇴 성공 시 인증 쿠키와 클라이언트 상태를 정리하고 탈퇴 완료 페이지로 이동하도록 구현했습니다.
• 탈퇴 완료 페이지는 성공 쿠키를 통해 1회만 접근할 수 있도록 보호했습니다.
• 인증이 만료된 요청에서 401/403이 발생하면 세션을 정리하고 랜딩 페이지로 이동하도록 공통 처리했습니다.

문제 해결

• 탈퇴 직후 병렬 API 요청의 401/403 처리가 탈퇴 완료 페이지 이동을 랜딩 페이지로 덮어쓰는 경쟁 조건을 확인했습니다.
• 의도적인 세션 종료 상태에서는 공통 인증 오류 리다이렉트를 억제해 탈퇴 완료 흐름이 유지되도록 수정했습니다.

검증

• tsc --noEmit
• eslint .
• git diff --check
• 탈퇴 완료 페이지 비정상 접근 및 1회성 접근 E2E 시나리오 추가

Video

2026-08-13.12.49.01.mov

[coderabbitai]

Warning

Review limit reached

@goder-0, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 43 minutes

Limit details: You’ve used all 1 included review currently available under your plan.

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: d3449271-3b82-439d-94d2-840ab4b622ed

📥 Commits

Reviewing files that changed from the base of the PR and between 6cac294 and 2f648fc.

📒 Files selected for processing (5)

• src/app/layout-client.tsx
• src/components/layout/SideNavigation/components/Bottom/SideNavigationBottom.tsx
• src/components/layout/SideNavigation/components/SideNavModals.tsx
• src/hooks/useDeleteAccount.ts
• src/lib/client/apiClient.ts

Walkthrough

회원 탈퇴 메뉴와 2단계 AccountDeleteModal을 추가했습니다. 탈퇴 사유와 GA 클라이언트 ID를 포함한 DELETE /api/member 요청을 처리합니다. 서버는 요청을 검증하고 회원 삭제 후 관련 쿠키를 갱신합니다. 탈퇴 성공 시 인증 상태와 캐시를 정리하고 /account-deleted로 이동합니다. 완료 쿠키는 최초 접근 후 만료됩니다. 인증 오류는 공통 세션 정리 함수로 처리합니다. 관련 E2E 테스트도 추가했습니다.

Possibly related PRs

• Team-SoFa/linkiving#293: layout-client.tsx, middleware.ts, COOKIES_KEYS의 인증 인프라와 연결됩니다.
• Team-SoFa/linkiving#556: authApi.ts의 getGaClientId를 탈퇴 요청에서 사용합니다.

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	제목이 회원 탈퇴 기능 구현이라는 주요 변경 사항을 명확하고 간결하게 설명합니다.
Description check	✅ Passed	관련 이슈, 변경 내용, 문제 해결 방식, 검증 항목을 포함해 템플릿 요구 사항을 충족합니다.
Linked Issues check	✅ Passed	계정 메뉴 진입, 2단계 모달, API 연동, 상태 정리, 완료 페이지와 접근 제어 요구 사항을 구현했습니다. [#565]
Out of Scope Changes check	✅ Passed	변경 사항은 회원 탈퇴 흐름과 관련된 인증 오류 처리, 세션 정리, 응답 처리를 포함하며 제공된 목표 범위에 있습니다.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feature/#565-member-withdrawal

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@src/components/layout/SideNavigation/components/Bottom/SideNavigationBottom.tsx`:
- Around line 92-104: Update the 회원 탈퇴 Button in SideNavigationBottom to pass
disabled={isLoggingOut}, preventing it from opening the ACCOUNT_DELETE flow
while logout is in progress.

In `@src/hooks/useDeleteAccount.ts`:
- Around line 17-19: useDeleteAccount의 mutationFn에서
setIntentionalSessionTermination(true)를 제거하고, 탈퇴 성공 시 쿠키 정리 및 이동을 수행하는 onSuccess
흐름 직전에 설정하세요. onError에서는 플래그를 복원하는 대신 삭제 요청의 401/403이 표준
clearInvalidSessionAndRedirect() 경로로 처리되도록 유지하세요.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 0979db59-d2c3-49fd-a29c-7d7487a34204

📥 Commits

Reviewing files that changed from the base of the PR and between e71d17e and 6cac294.

📒 Files selected for processing (16)

• e2e/smoke.spec.ts
• public/images/account-deleted-background.webp
• src/apis/authApi.ts
• src/app/(route)/account-deleted/page.tsx
• src/app/api/member/route.ts
• src/app/layout-client.tsx
• src/components/basics/Modal/Modal.tsx
• src/components/layout/SideNavigation/components/Bottom/SideNavigationBottom.tsx
• src/components/wrappers/AccountDeleteModal/AccountDeleteModal.tsx
• src/hooks/useDeleteAccount.ts
• src/lib/client/apiClient.ts
• src/lib/client/backendClient.ts
• src/lib/constants/cookies.ts
• src/lib/server/apiClient.ts
• src/middleware.ts
• src/stores/modalStore.ts