refactor: useGatherings 훅 내부를 여러 훅으로 분리

✏️ 작업 내용

훅 생성하여 useGatherings.ts 리팩토링

useFetchFilteredGatherings.ts

필터링된 모임 데이터를 가져오는 훅

useHandler.ts

핸들러 함수들을 관리하는 훅

useLoadMore.ts

더 많은 데이터를 가져오는 훅

useUpdateQueryParams.ts

쿼리 파라미터를 업데이트 하는 훅

📷 스크린샷

✍️ 사용법

useFetchFilteredGatherings

const { fetchFilteredGatherings } = useFetchFilteredGatherings(
    selectedChip,
    activeTab,
    selectedDate,
    selectedLocation,
    sortOption,
  );

useHandler

const {
    handleTabClick,
    handleChipClick,
    handleLocationChange,
    handleDateChange,
    handleSortChange,
  } = useHandlers(
    setActiveTab,
    setSelectedChip,
    setSelectedLocation,
    setSelectedDate,
    setSortOption,
    resetFilters,
    updateFilteredData,
  );

useLoadMore

const { loadMore, isLoading, hasMore, setHasMore } = useLoadMore(
    fetchFilteredGatherings,
    offset,
    setOffset,
    setFilteredData,
  );

useUpdateQueryParams

  const updateQueryParams = useUpdateQueryParams();

  updateQueryParams({
      type: filters.type,
      location: filters.location,
      date: filters.date ? formatCalendarDate(filters.date) : undefined,
      sortBy: filters.sortBy,
    });

🎸 기타

여러 훅으로 나눠 관리하기 위해 작성한 PR 입니다!

다른 팀원분들도 사용할 수 있도록 재사용성을 고려해서 만들었는데, 불편한 점이 있으면 말씀해주세요!

metadata 변경

스크린샷 2024-09-30 15 51 54

favicon, title 이 설정되어 있지 않아 임의로 설정해 주었습니다! 다른 의견있으시면 꼭 말씀해주세요!

확인 후 피드백 부탁드립니다!

INtiful / SootheWithMe

refactor: useGatherings 훅 내부를 여러 훅으로 분리 #109