Skip to content

Latest commit

 

History

History
88 lines (69 loc) · 3.02 KB

File metadata and controls

88 lines (69 loc) · 3.02 KB

유저 차단 기능 설계 문서

상태: ✅ 구현 완료 작성일: 2026-01-27 기술 스택: Supabase, React Query, Expo Router


1. 개요

  • 사용자가 다른 사용자를 차단하는 기능
  • 차단 시 blocks 테이블에 기록, matches 상태를 unmatched로 변경
  • 채팅 목록에서 차단된 유저의 대화 제거
  • 채팅 화면에서 차단 상태 배너 표시 및 메시지 전송 차단
  • 추천 대상에서 제외 (기존 구현)

2. 파일 구조

신규 생성 파일

  • api/blocks.ts - Block API 함수 (blockUser, unblockUser, checkIsBlocked)
  • hooks/queries/use-blocks.ts - React Query 훅 (useBlockUser, useUnblockUser, useIsBlocked)

수정된 파일

  • lib/query-keys.ts - isBlocked 쿼리 키 추가
  • api/chat.ts - getConversations에서 차단 유저 대화 필터링
  • app/chat/[id].tsx - 차단 상태 배너 + 메시지 전송 차단 + 입력 비활성화
  • app/user/[id].tsx - 히어로 이미지 More(⋯) 드롭다운 메뉴에서 차단하기 접근 (매칭 상태일 때만 노출)

3. 데이터 흐름

[차단하기 버튼] → blockUser()
  ├→ blocks INSERT
  ├→ matches UPDATE (status → "unmatched")
  └→ invalidate: conversations, recommendations, isBlocked, matchStatus

[채팅 목록] → getConversations()
  └→ blocks 조회 → 차단 유저 대화 필터링

[채팅 상세] → useIsBlocked()
  ├→ 차단 시: 배너 표시 + 입력 비활성화
  └→ 전송 시도: Alert 표시 + 전송 차단

4. 핵심 코드

API 함수 (api/blocks.ts)

  • blockUser(blockerId, blockedId, reason?) - blocks INSERT + matches UPDATE
  • unblockUser(blockerId, blockedId) - blocks DELETE
  • checkIsBlocked(userId, targetUserId) - 양방향 차단 확인 → { isBlocked, blockedByMe, blockedByThem }

React Query 훅 (hooks/queries/use-blocks.ts)

  • useBlockUser(userId) - useMutation, 성공 시 conversations/recommendations/isBlocked/matchStatus invalidate
  • useUnblockUser(userId) - useMutation
  • useIsBlocked(userId, targetId) - useQuery

5. 의존성

  • 기존 패키지만 사용 (추가 설치 없음)
  • @tanstack/react-query
  • @supabase/supabase-js

6. 외부 서비스 설정

blocks 테이블 (Supabase)

  • id (uuid, PK)
  • blocker_id (uuid, FK → profiles.id)
  • blocked_id (uuid, FK → profiles.id)
  • reason (text, nullable)
  • created_at (timestamptz)
  • UNIQUE(blocker_id, blocked_id)

7. TODO

  • 차단 목록 관리 화면 (설정에서 차단 해제)

8. 테스트 방법

  • 유저 프로필에서 차단 → blocks 레코드 생성 확인
  • 채팅 목록에서 차단된 유저 대화 사라짐 확인
  • 채팅 상세 진입 시 차단 배너 표시 확인
  • 메시지 전송 시도 시 Alert 표시 확인
  • 추천에서 차단 유저 미노출 확인 (기존 로직)

9. 참고 파일 경로

  • api/blocks.ts
  • hooks/queries/use-blocks.ts
  • lib/query-keys.ts
  • api/chat.ts
  • app/chat/[id].tsx
  • app/user/[id].tsx
  • api/recommendations.ts (기존 차단 필터링)