[AUD-100] TmapModule 과 WebSocket 간의 기능 연동

[RookieAND]

📃 변경사항

• WebSocket - TmapModule - React 간의 연계가 정상적으로 이루어지도록 로직을 대거 개선했습니다.
• React 컴포넌트 혹은 Tmap 내부에서 마커 추가 및 삭제 시, WebSocket Publish 를 먼저 진행하도록 했습니다.
• 이후 Websocket subscribe 를 통해 받은 데이터를 기반으로 지도를 수정하도록 플로우를 수정했습니다.
• 장소 검색으로 나온 곳을 코스에 추가 혹은 삭제할 수 있도록 기능을 개선했습니다.

🫨 고민한 부분 (optional)

• 백엔드 단에서 보낸 데이터와의 연동성을 강하게 가져가기 위해 TmapModule 내부에서 쓰이던 네이밍을 백엔드 단과 일치시켰습니다.
• 이로 인해 많은 breaking change 를 일으켜 죄송합니다. (사안이 급하다 보니 일단 수정했습니다)
• TmapModule 이 ref 로 관리되다 보니 PathView 단에서는 실제 Tmap 이 정상적으로 작동하는 시점을 알 수 없어 서버에서 받은 pinResList 를 기반으로 뷰를 그릴 수가 없었습니다. 따라서 이를 타파하기 위해 state 로 Module 을 관리했습니다.
• StompClient 또한 coursePage 에서만 사용하도록 Context API 기반의 아키텍쳐를 도입했습니다.
• 클러스터링 기능이 의도치 않은 동작으로 인하여 임시 비활성화 처리했습니다. 빠르게 수정하도록 하겠습니다.