Skip to content

fix: msw 대신 구현된 api를 활용하도록 수정#1123

Merged
AHHYUNJU merged 6 commits intodevelopfrom
fix/changed-api-#1120
Apr 9, 2026
Merged

fix: msw 대신 구현된 api를 활용하도록 수정#1123
AHHYUNJU merged 6 commits intodevelopfrom
fix/changed-api-#1120

Conversation

@AHHYUNJU
Copy link
Copy Markdown
Contributor

@AHHYUNJU AHHYUNJU commented Apr 9, 2026

As-Is

To-Be

msw 대신 구현된 api를 활용하도록 수정

Check List

  • 테스트가 전부 통과되었나요?
  • 모든 commit이 push 되었나요?
  • merge할 branch를 확인했나요?
  • Assignee를 지정했나요?
  • Label을 지정했나요?

Test Screenshot

(Optional) Additional Description

Closes #1120

Summary by CodeRabbit

릴리스 노트

  • 버그 수정

    • WebSocket 연결 오류 및 종료 이벤트에 대한 상세 로깅 기능 추가
  • 개선 사항

    • 채팅 메시지에 발신자 역할 정보 추가
    • 메시지 전송 및 수신 프로토콜 최적화
    • WebSocket 통신 경로 및 메시지 형식 개선
    • 중복 메시지 처리 로직 강화

@github-actions github-actions Bot requested review from aydenote, jeongyou and ohgus April 9, 2026 04:12
@github-actions github-actions Bot added fix 버그 수정 frontend 프론트 작업 labels Apr 9, 2026
@meolichae meolichae moved this to In Progress in 2025-routie Apr 9, 2026
@AHHYUNJU
Copy link
Copy Markdown
Contributor Author

AHHYUNJU commented Apr 9, 2026

@coderabbitai 리뷰 부탁해

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Apr 9, 2026

@AHHYUNJU 네, PR 리뷰를 진행하겠습니다! 🐇

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Apr 9, 2026

📝 Walkthrough

Walkthrough

이 풀 리퀘스트는 MSW(Mock Service Worker) 인프라를 제거하고 채팅 시스템을 실제 WebSocket API로 마이그레이션합니다. WebSocket URL 경로를 /ws/chat/v1에서 /ws/v1로 변경하고, 구독 대상을 /room/을 포함하도록 업데이트합니다. 메시지 처리 로직을 재구성하여 tempId를 임시 메시지 조정에, senderRole 필드를 추가합니다. 채팅 타입 정의를 갱신하고 myRole 파라미터 요구사항을 추가합니다. 모든 모의 핸들러, 서버 설정 및 모킹 테스트를 제거합니다.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 주요 변경사항(MSW 제거 및 실제 API 사용)을 명확히 요약하고 있으며, 변경사항과 직접적으로 일치합니다.
Description check ✅ Passed PR 설명이 템플릿의 필수 섹션(As-Is, To-Be, Check List)을 포함하고 있으며, To-Be에서 변경목적을 명시하고 체크리스트를 완료했습니다.
Linked Issues check ✅ Passed PR의 모든 코드 변경사항이 #1120의 목표(MSW 제거, 실제 API 사용)와 완전히 일치하며, WebSocket 경로 변경, 메시지 타입 처리 변경, MSW 모킹 파일 삭제 등이 이슈 요구사항을 충족합니다.
Out of Scope Changes check ✅ Passed 모든 변경사항이 MSW 제거 및 API 통합 목표에 직접 관련이 있으며, WebSocket 디버깅 로깅 추가(useWebSocket.ts의 onWebSocketError/onWebSocketClose)도 API 전환 시 필요한 개선사항으로 적절합니다.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/changed-api-#1120

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

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (1)
frontend/src/libs/websocket/hooks/useWebSocket.ts (1)

67-72: WebSocket 오류 핸들러에서 onError 콜백 호출 검토 필요

onWebSocketError에서 WebSocket 레벨 오류 발생 시 onErrorRef.current를 호출하지 않습니다. onStompError에서는 onErrorRef.current를 호출하는데, WebSocket 오류도 클라이언트에게 알려야 할 수 있습니다.

의도적으로 구분한 것이라면 무시해도 됩니다.

선택적 개선 제안
       onWebSocketError: (event) => {
         console.error('[WS] WebSocket 오류:', event);
+        // WebSocket 레벨 오류도 클라이언트에 전파할 경우
+        // onErrorRef.current?.(event as never);
       },
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@frontend/src/libs/websocket/hooks/useWebSocket.ts` around lines 67 - 72, The
WebSocket-level error handler onWebSocketError currently only logs to console
but does not notify the consumer; update onWebSocketError to invoke the shared
error callback (onErrorRef.current) like onStompError does, e.g., check
onErrorRef.current and call it with the event (or a normalized Error object) so
client code receives WebSocket errors; use the same safety pattern used
elsewhere (null-check/optional chaining and try/catch) as in onStompError to
avoid throwing from the handler.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@frontend/src/libs/websocket/hooks/useWebSocket.ts`:
- Around line 67-72: The WebSocket-level error handler onWebSocketError
currently only logs to console but does not notify the consumer; update
onWebSocketError to invoke the shared error callback (onErrorRef.current) like
onStompError does, e.g., check onErrorRef.current and call it with the event (or
a normalized Error object) so client code receives WebSocket errors; use the
same safety pattern used elsewhere (null-check/optional chaining and try/catch)
as in onStompError to avoid throwing from the handler.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: e11b1429-da3a-4012-a0ac-58fe037d8f61

📥 Commits

Reviewing files that changed from the base of the PR and between 2639127 and b0885ff.

📒 Files selected for processing (13)
  • frontend/src/domains/chat/hooks/useChat.ts
  • frontend/src/domains/chat/types/api.types.ts
  • frontend/src/domains/chat/types/chat.types.ts
  • frontend/src/index.tsx
  • frontend/src/libs/websocket/hooks/__tests__/useWebSocket.test.ts
  • frontend/src/libs/websocket/hooks/useWebSocket.ts
  • frontend/src/mocks/browser.ts
  • frontend/src/mocks/handlers.ts
  • frontend/src/mocks/handlers/chat.ts
  • frontend/src/mocks/node.ts
  • frontend/src/pages/RoutieSpace/RoutieSpace.tsx
  • frontend/src/pages/RoutieSpace/components/ChatView/ChatView.tsx
  • frontend/src/pages/RoutieSpace/components/ChatView/ChatView.types.ts
💤 Files with no reviewable changes (5)
  • frontend/src/mocks/browser.ts
  • frontend/src/mocks/handlers.ts
  • frontend/src/mocks/node.ts
  • frontend/src/libs/websocket/hooks/tests/useWebSocket.test.ts
  • frontend/src/mocks/handlers/chat.ts

@AHHYUNJU AHHYUNJU merged commit 0ffce0c into develop Apr 9, 2026
4 checks passed
@github-project-automation github-project-automation Bot moved this from In Progress to Done in 2025-routie Apr 9, 2026
@AHHYUNJU AHHYUNJU deleted the fix/changed-api-#1120 branch April 9, 2026 04:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

fix 버그 수정 frontend 프론트 작업

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

[TASK] msw를 제거하고 실제 api로 변경

2 participants