refactor: 마커 렌더링 방식을 개선한다 (#924)

* feat: 마커 렌더링 훅 추가

- 기본 마커 렌더링
- 카페인 마커 렌더링

[#914]

* feat: useLayoutEffect를 사용한 방식 적용

- 다음의 복잡한 처리들을 리액트에 위임하는 구조로 변경 (기존에는 훅이 이를 대체했음)
  - 중복 마커 생성 방지
  - 영역 밖 마커 삭제

[#914]

* refactor: 마커 렌더러 컴포넌트 폴더 위치 수정

[#914]

* comment: TODO 주석 추가

- 현재는 infoWindow를 특정 메서드를 통해 직접 제어하는 방식을 사용했지만, 마커 컴포넌트에 isOpen props를 넘겨 이를 제어하는 방식으로 해보고자 함.

[#914]

* refactor: 검색 결과 마커 생성 방식 수정

- 검색 결과로 화면에 존재하지 않는 마커를 생성할 때의 과정 수정
- 마커가 렌더링 될 때 마커 인스턴스 전역 상태에 지금 렌더링 하려는 마커가 포함되어 있다면 재생성을 하지 않는 로직 추가

[#914]

* feat: 클러스터 마커 렌더링 기능 추가

[#914]

* refactor: 클러스터 마커 렌더링 방식 수정

[#914]

* refactor: 마커 컴포넌트 폴더 구조 개선

[#914]

* refactor: 지역 마커 렌더링 훅 변경

[#914]

* refactor: 리액트 쿼리 사용 훅 이름 수정

[#914]

* refactor: 변수명 개선

[#914]

* refactor: animation 관련 함수 공통 함수로 분리

[#914]

* refactor: getChargerCountsAndAvailability 함수에 availableCount 추가

[#914]

* rename: 파일 이름 변경

[#914]

* refactor: index에서 접근할 수 있게 변경

[#914]

* rename: useRenderMarker -> useMarker 이름 변경

[#914]

* comment: 필요없는 주석 제거

[#914]

---------

Co-authored-by: feb-dain <[email protected]>

frontend/src/components/google-maps/map/CarFfeineMap.tsx

@@ -5,7 +5,7 @@ import DataDownloader from '@ui/DataDownloader';
 import CarFfeineMapListener from './CarFfeineListener';
 
 const UserFilterListener = lazy(() => import('./UserFilterListener'));
-const MarkersContainers = lazy(() => import('@marker/MarkerContainers'));
+const MarkersContainers = lazy(() => import('@marker/components/MarkerContainers'));
 const ToastContainer = lazy(() => import('@ui/ToastContainer'));
 const ClientStationFilters = lazy(() => import('@ui/ClientStationFilters'));
 const MapController = lazy(() => import('@ui/MapController'));