Merge branch 'fix-scroll-bug' into 'develop'

Fix infinite scroll bug with Group Search

See merge request soapbox-pub/soapbox!2414

app/soapbox/features/groups/components/discover/search/search.tsx

@@ -26,7 +26,7 @@ export default (props: Props) => {
   const debouncedValueToSave = debounce(searchValue as string, 1000);
 
   const groupSearchResult = useGroupSearch(debouncedValue);
-  const { groups, isFetching, isFetched, isError } = groupSearchResult;
+  const { groups, isLoading, isFetched, isError } = groupSearchResult;
 
   const hasSearchResults = isFetched && groups.length > 0;
   const hasNoSearchResults = isFetched && groups.length === 0;
@@ -37,7 +37,7 @@ export default (props: Props) => {
     }
   }, [debouncedValueToSave]);
 
-  if (isFetching) {
+  if (isLoading) {
     return (
       <Stack space={4}>
         <PlaceholderGroupSearch />

app/soapbox/queries/groups/search.ts

@@ -1,67 +0,0 @@
-import { useInfiniteQuery } from '@tanstack/react-query';
-
-import { getNextLink } from 'soapbox/api';
-import { useApi, useFeatures } from 'soapbox/hooks';
-import { normalizeGroup } from 'soapbox/normalizers';
-import { Group } from 'soapbox/types/entities';
-import { flattenPages, PaginatedResult } from 'soapbox/utils/queries';
-
-const GroupSearchKeys = {
-  search: (query?: string) => query ? ['groups', 'search', query] : ['groups', 'search'] as const,
-};
-
-type PageParam = {
-  link: string
-}
-
-const useGroupSearch = (search?: string) => {
-  const api = useApi();
-  const features = useFeatures();
-
-  const getSearchResults = async (pageParam: PageParam): Promise<PaginatedResult<Group>> => {
-    const nextPageLink = pageParam?.link;
-    const uri = nextPageLink || '/api/v1/groups/search';
-    const response = await api.get<Group[]>(uri, {
-      params: search ? {
-        q: search,
-      } : undefined,
-    });
-    const { data } = response;
-
-    const link = getNextLink(response);
-    const hasMore = !!link;
-    const result = data.map(normalizeGroup);
-
-    return {
-      result,
-      hasMore,
-      link,
-    };
-  };
-
-  const queryInfo = useInfiniteQuery(
-    GroupSearchKeys.search(search),
-    ({ pageParam }) => getSearchResults(pageParam),
-    {
-      keepPreviousData: true,
-      enabled: features.groups && !!search,
-      getNextPageParam: (config) => {
-        if (config.hasMore) {
-          return { link: config.link };
-        }
-
-        return undefined;
-      },
-    });
-
-  const data = flattenPages(queryInfo.data);
-
-  return {
-    ...queryInfo,
-    groups: data || [],
-  };
-};
-
-export {
-  useGroupSearch,
-};