feat: /gatherings 페이지 무한스크롤 구현

✏️ 작업 내용

react-intersection-observer 의 내장함수인 useInview 를 사용했습니다.

다음 데이터의 존재 여부를 판단하는 hasMore state 를 만들었습니다. 데이터가 없는데도 지속적으로 request 하는 것을 방지하기 위함입니다.

ClientSideGatherings 컴포넌트에서 useEffect 를 사용하여 위의 두 요소가 변경되는 경우 loadMore 함수를 실행하도록 했습니다.

offset 을 변경하면서, 데이터가 있는 경우 그 데이터를 불러오는 기능을 수행하는 함수입니다.

useEffect 사용 시 계속 lint 오류가 발생하여 일단 무시해 놓은 상태입니다. 원인을 파악하면 수정하도록 하겠습니다.

filtering, sorting 도 잘 됩니다. 다만 너무 빠르게 filtering 하거나 sorting 하면 서버에서 에러가 발생하는 경우가 아주 드물게 존재했습니다. 확인 부탁드립니다.

무한 스크롤 시 로딩 스피너도 추가하면 좋을 것 같습니다!

보시고 피드백 부탁드립니다!