stream-chat-react-native-core 9.4.0 → 9.5.0-beta.1

package/src/components/ChannelDetails/__tests__/members/useChannelAllMembers.test.tsx

@@ -1,234 +0,0 @@
-import React from 'react';
-
-import { act, renderHook, waitFor } from '@testing-library/react-native';
-import type { Channel, ChannelMemberResponse } from 'stream-chat';
-
-import { TranslationProvider } from '../../../../contexts/translationContext/TranslationContext';
-import { generateMember } from '../../../../mock-builders/generator/member';
-import { generateUser } from '../../../../mock-builders/generator/user';
-import { useNotificationApi } from '../../../Notifications/hooks/useNotificationApi';
-import { useChannelAllMembers } from '../../hooks/members/useChannelAllMembers';
-
-jest.mock('../../../Notifications/hooks/useNotificationApi', () => ({
-  useNotificationApi: jest.fn(() => ({ addNotification: jest.fn() })),
-}));
-
-const t = ((key: string) => key) as never;
-
-const translationWrapper = ({ children }: { children: React.ReactNode }) => (
-  <TranslationProvider
-    value={{ t, tDateTimeParser: ((input: unknown) => input) as never, userLanguage: 'en' }}
-  >
-    {children}
-  </TranslationProvider>
-);
-
-type QueryMembersMock = jest.Mock<
-  Promise<{ members: ChannelMemberResponse[] }>,
-  [unknown, unknown, unknown]
->;
-
-const buildChannel = ({
-  members,
-  memberCount,
-  queryMembers,
-}: {
-  members: ChannelMemberResponse[];
-  memberCount?: number;
-  queryMembers?: QueryMembersMock;
-}): Channel =>
-  ({
-    cid: 'messaging:test',
-    data: memberCount == null ? {} : { member_count: memberCount },
-    on: () => ({ unsubscribe: () => undefined }),
-    queryMembers: queryMembers ?? jest.fn(),
-    state: {
-      members: Object.fromEntries(
-        members.map((m) => [m.user?.id ?? m.user_id ?? '', m]).filter(([k]) => Boolean(k)),
-      ),
-    },
-  }) as unknown as Channel;
-
-const buildMembers = (count: number, prefix = 'u') =>
-  Array.from({ length: count }, (_, i) =>
-    generateMember({ user: generateUser({ id: `${prefix}-${i}`, name: `User ${i}` }) }),
-  );
-
-describe('useChannelAllMembers', () => {
-  let addNotification: jest.Mock;
-
-  beforeEach(() => {
-    addNotification = jest.fn();
-    (useNotificationApi as jest.Mock).mockReturnValue({ addNotification });
-  });
-
-  describe('local mode', () => {
-    it('returns local members when member_count matches the loaded count', () => {
-      const members = buildMembers(3);
-      const queryMembers: QueryMembersMock = jest.fn();
-      const channel = buildChannel({ memberCount: 3, members, queryMembers });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      expect(queryMembers).not.toHaveBeenCalled();
-      expect(result.current.results.map((m) => m.user?.id)).toEqual(['u-0', 'u-1', 'u-2']);
-      expect(result.current.hasMore).toBe(false);
-      expect(result.current.loading).toBe(false);
-    });
-
-    it('treats undefined member_count as fully loaded', () => {
-      const members = buildMembers(2);
-      const queryMembers: QueryMembersMock = jest.fn();
-      const channel = buildChannel({ members, queryMembers });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      expect(queryMembers).not.toHaveBeenCalled();
-      expect(result.current.results).toHaveLength(2);
-      expect(result.current.hasMore).toBe(false);
-    });
-
-    it('loadMore is a no-op in local mode', () => {
-      const members = buildMembers(1);
-      const queryMembers: QueryMembersMock = jest.fn();
-      const channel = buildChannel({ memberCount: 1, members, queryMembers });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      act(() => result.current.loadMore());
-      expect(queryMembers).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('paginated mode', () => {
-    it('fetches the first page on mount and exposes loading state', async () => {
-      const loaded = buildMembers(25, 'loaded');
-      const firstPage = buildMembers(25, 'page1');
-      const queryMembers: QueryMembersMock = jest.fn().mockResolvedValue({ members: firstPage });
-      const channel = buildChannel({ memberCount: 250, members: loaded, queryMembers });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      expect(result.current.loading).toBe(true);
-      expect(result.current.hasMore).toBe(true);
-
-      await waitFor(() => expect(queryMembers).toHaveBeenCalledTimes(1));
-      expect(queryMembers).toHaveBeenCalledWith({}, { created_at: 1 }, { limit: 25, offset: 0 });
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-      expect(result.current.results).toHaveLength(25);
-      expect(result.current.results[0]?.user?.id).toBe('page1-0');
-      expect(result.current.hasMore).toBe(true);
-    });
-
-    it('appends the next page on loadMore with the correct offset and dedupes', async () => {
-      const firstPage = buildMembers(25, 'page1');
-      const overlap = firstPage[firstPage.length - 1];
-      const secondPageFresh = buildMembers(10, 'page2');
-      const secondPage = overlap ? [overlap, ...secondPageFresh] : secondPageFresh;
-      const queryMembers: QueryMembersMock = jest
-        .fn()
-        .mockResolvedValueOnce({ members: firstPage })
-        .mockResolvedValueOnce({ members: secondPage });
-      const channel = buildChannel({
-        memberCount: 300,
-        members: buildMembers(25, 'loaded'),
-        queryMembers,
-      });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-      expect(result.current.results).toHaveLength(25);
-
-      act(() => result.current.loadMore());
-
-      await waitFor(() => expect(queryMembers).toHaveBeenCalledTimes(2));
-      expect(queryMembers).toHaveBeenNthCalledWith(
-        2,
-        {},
-        { created_at: 1 },
-        { limit: 25, offset: 25 },
-      );
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-      expect(result.current.results).toHaveLength(35);
-      expect(result.current.hasMore).toBe(false);
-    });
-
-    it('marks hasMore=false when the first page is shorter than PAGE_SIZE', async () => {
-      const firstPage = buildMembers(10, 'page1');
-      const queryMembers: QueryMembersMock = jest.fn().mockResolvedValue({ members: firstPage });
-      const channel = buildChannel({
-        memberCount: 200,
-        members: buildMembers(25, 'loaded'),
-        queryMembers,
-      });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-      expect(result.current.hasMore).toBe(false);
-
-      act(() => result.current.loadMore());
-      expect(queryMembers).toHaveBeenCalledTimes(1);
-    });
-
-    it('guards against concurrent loadMore calls', async () => {
-      let resolveSecond: ((value: { members: ChannelMemberResponse[] }) => void) | undefined;
-      const queryMembers: QueryMembersMock = jest
-        .fn()
-        .mockResolvedValueOnce({ members: buildMembers(25, 'page1') })
-        .mockReturnValueOnce(
-          new Promise<{ members: ChannelMemberResponse[] }>((resolve) => {
-            resolveSecond = resolve;
-          }),
-        );
-      const channel = buildChannel({
-        memberCount: 500,
-        members: buildMembers(25, 'loaded'),
-        queryMembers,
-      });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }));
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-
-      act(() => result.current.loadMore());
-      await waitFor(() => expect(result.current.loading).toBe(true));
-      expect(result.current.results.length).toBeGreaterThan(0);
-
-      act(() => result.current.loadMore());
-      act(() => result.current.loadMore());
-
-      expect(queryMembers).toHaveBeenCalledTimes(2);
-
-      act(() => resolveSecond?.({ members: buildMembers(25, 'page2') }));
-      await waitFor(() => expect(result.current.loading).toBe(false));
-    });
-
-    it('recovers from a queryMembers rejection and notifies the user', async () => {
-      const queryMembers: QueryMembersMock = jest.fn().mockRejectedValue(new Error('boom'));
-      const channel = buildChannel({
-        memberCount: 200,
-        members: buildMembers(25, 'loaded'),
-        queryMembers,
-      });
-
-      const { result } = renderHook(() => useChannelAllMembers({ channel }), {
-        wrapper: translationWrapper,
-      });
-
-      await waitFor(() => expect(result.current.loading).toBe(false));
-      expect(result.current.results).toEqual([]);
-      expect(addNotification).toHaveBeenCalledWith(
-        expect.objectContaining({
-          options: expect.objectContaining({
-            severity: 'error',
-            type: 'api:channel:query-members:failed',
-          }),
-        }),
-      );
-    });
-  });
-});

package/src/components/ChannelDetails/hooks/members/useChannelAllMembers.ts

@@ -1,131 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-
-import type { Channel, ChannelMemberResponse, MemberFilters, MemberSort } from 'stream-chat';
-
-import { useTranslationContext } from '../../../../contexts';
-import { getNotificationErrorOptions } from '../../../../hooks/actions/useChannelActions';
-import { useChannelMembersState } from '../../../ChannelList/hooks/useChannelMembersState';
-import { useNotificationApi } from '../../../Notifications/hooks/useNotificationApi';
-
-const PAGE_SIZE = 25;
-
-export type UseChannelAllMembersResult = {
-  hasMore: boolean;
-  loading: boolean;
-  loadMore: () => void;
-  results: ChannelMemberResponse[];
-};
-
-const noop = () => undefined;
-
-/**
- * @experimental This hook is experimental and is subject to change.
- */
-export const useChannelAllMembers = ({
-  channel,
-}: {
-  channel: Channel;
-}): UseChannelAllMembersResult => {
-  const { addNotification } = useNotificationApi();
-  const { t } = useTranslationContext();
-  const localMembers = useChannelMembersState(channel);
-
-  // Mode is decided once on mount (per channel). If member_count is unknown or matches
-  // the locally-loaded count, we return local state and stay reactive to member events.
-  // Otherwise we switch into paginated mode for the lifetime of the hook.
-  const [mode] = useState<'local' | 'paginated'>(() => {
-    const memberCount = channel.data?.member_count;
-    const loadedCount = Object.keys(channel.state.members).length;
-    return memberCount == null || loadedCount >= memberCount ? 'local' : 'paginated';
-  });
-
-  const [results, setResults] = useState<ChannelMemberResponse[]>([]);
-  const [loading, setLoading] = useState(mode === 'paginated');
-  const [hasMore, setHasMore] = useState(mode === 'paginated');
-
-  const offsetRef = useRef(0);
-  const requestIdRef = useRef(0);
-  const inFlightRef = useRef(false);
-
-  const fetchPage = useCallback(
-    async ({ append }: { append: boolean }) => {
-      const requestId = ++requestIdRef.current;
-      inFlightRef.current = true;
-      setLoading(true);
-      if (!append) {
-        offsetRef.current = 0;
-        setHasMore(true);
-      }
-
-      try {
-        const filter: MemberFilters = {};
-        const sort: MemberSort = { created_at: 1 };
-        const response = await channel.queryMembers(filter, sort, {
-          limit: PAGE_SIZE,
-          offset: offsetRef.current,
-        });
-
-        if (requestId !== requestIdRef.current) return;
-
-        const fetched = response.members ?? [];
-        setResults((prev) => {
-          if (!append) return fetched;
-          const seen = new Set(prev.map((m) => m.user_id ?? m.user?.id));
-          const deduped = fetched.filter((m) => !seen.has(m.user_id ?? m.user?.id));
-          return deduped.length ? [...prev, ...deduped] : prev;
-        });
-        offsetRef.current += fetched.length;
-        if (fetched.length < PAGE_SIZE) {
-          setHasMore(false);
-        }
-      } catch (err) {
-        if (requestId !== requestIdRef.current) return;
-        addNotification({
-          message: t('Failed to load members'),
-          options: {
-            ...getNotificationErrorOptions(err),
-            severity: 'error',
-            type: 'api:channel:query-members:failed',
-          },
-          origin: { context: { channel }, emitter: 'ChannelAllMembers' },
-        });
-      } finally {
-        if (requestId === requestIdRef.current) {
-          inFlightRef.current = false;
-          setLoading(false);
-        }
-      }
-    },
-    [addNotification, channel, t],
-  );
-
-  const fetchPageRef = useRef(fetchPage);
-  fetchPageRef.current = fetchPage;
-
-  useEffect(() => {
-    if (mode !== 'paginated') return;
-    fetchPageRef.current({ append: false });
-    return () => {
-      requestIdRef.current += 1;
-    };
-  }, [mode]);
-
-  const loadMore = useCallback(() => {
-    if (mode !== 'paginated') return;
-    if (inFlightRef.current || !hasMore || loading) return;
-    fetchPageRef.current({ append: true });
-  }, [mode, hasMore, loading]);
-
-  const localResults = useMemo(() => Object.values(localMembers), [localMembers]);
-
-  if (mode === 'local') {
-    return {
-      hasMore: false,
-      loading: false,
-      loadMore: noop,
-      results: localResults,
-    };
-  }
-
-  return { hasMore, loading, loadMore, results };
-};