[Refactor] 코드 스플리팅 적용, graph 관련 기능 개선 및 상수 변경

[yeynii]

개요

번들 경량화를 위해 라우트별로 코드 스플리팅을 적용했으며 graph 관련 기능 개선 및 citations scale 상수를 변경했습니다.

작업사항

• react lazy + suspence로 코드 스플리팅 적용
• paper info에 있는 reference 클릭시에도 노드 추가 이벤트 동일하게 적용
• citations -> color scale 범위 조정
• 자식노드 클릭시 api 호출 로직 react-query로 캐싱되게 수정 + suspence 해제
• doi 없는 논문 disabled 처리
• crossRef로 바로 요청을 보내는 경우, referenceList 내부 값들이 완전하지않은 경우를 고려해 변경된 로직
  1. 논문 key는 항상 소문자로 변환하여 저장합니다.
  2. 정보가 완전하지 않은 자식노드를 클릭했을 때, 해당 노드의 정보 전체가 갈아끼워집니다.

리뷰 요청사항

react-query로 요청을 보낼때마다(해당페이지에서 노드를 추가할 때마다) 깜빡이는 현상이 있어 suspence는 잠시 해제했습니다. 다만 이 경우 페이지 첫 진입시 loader가 돌지 않아 느린 네트워크 환경에서 로더없는 빈 화면이 잠시 노출되는 상황이 생길 수 있습니다. 이 때

1. optimistic update로 Ui만 제공하여 이 현상을 어느정도 절충할지
2. 첫 api 호출만 따로 axois 요청을보내 loader를 노출하는 로직을 작성할지
3. 혹은 새로운 키 하나를 더 만들어 react-query에서 분기처리를 할지 고민이 필요한데, 의견주시면 감사하겠습니다. 그 외 다른 의견도 좋습니다.