[Feature] 채팅 프론트엔드-백엔드 API 연동 (mock 제거)

[yunkihong-dev]

🔥PURPOSE

현재 mock(MSW)로 동작하는 채팅을 실제 백엔드 채널/메시지 API에 연결한다.

📌DETAIL

• 작업 배경:
• 백엔드 채널/메시지 API([feat] 로그인 페이지 및 인증 흐름 구현, 로고 기반 CSS 색상 단순화 #49~feat(mock): MSW Mock 환경 전체 구축 #53)는 구현되어 있으나 프론트는 아직 MSW mock 핸들러로 동작한다.
• chatApi(getChannels/getMessages/sendMessage)와 백엔드 응답 스키마를 맞춰야 한다.
• 기대 결과:
• 실제 로그인 사용자가 서버의 채널/메시지를 조회·전송할 수 있다.
• 채널 목록·메시지 목록·텍스트/파일 전송이 실 서버 기준으로 동작한다.
• 참고 문서 / 링크:
• 백엔드: GET /api/v1/channels, GET·POST /api/v1/channels/{channelId}/messages
• 프론트: src/shared/api/chatApi.ts, src/features/chat/model/ChatProvider.tsx

📒TODO

• chat mock 핸들러 비활성화 / 실제 baseURL 연동
• ApiChannel/ApiMessage 타입을 백엔드 응답에 맞춰 정렬 (type GENERAL/TEAM/DIRECT, files[], senderId/senderName, createdAt)
• 메시지 목록 페이징 파라미터(page/size) 연동 및 최신순 정렬 처리
• 텍스트 전송(JSON) / 파일 전송(multipart/form-data) 분기 연동
• DM(dm-*) 처리 방식 정리 (백엔드 DIRECT 채널 매핑 또는 임시 분리)
• 로딩/에러 상태 및 인증 토큰 헤더 연동 확인

✅완료 조건

• 실제 백엔드를 통해 채널/메시지 조회·전송이 동작하고, mock 의존이 제거된다.