stream-chat-react-native-core 9.12.1 → 10.0.0-beta.1

package/src/hooks/actions/__tests__/useChannelMemberActionItems.test.tsx

@@ -1,10 +1,10 @@
 import React, { PropsWithChildren } from 'react';
 import { Alert } from 'react-native';
 
+import { StateStore } from '@stream-io/state-store';
 import { renderHook } from '@testing-library/react-native';
-import type { Channel, ChannelMemberResponse, Mute } from 'stream-chat';
+import type { Channel, ChannelMemberResponse, UserMuteResponse } from 'stream-chat';
 
-import * as useMutedUsersModule from '../../../components/ChannelList/hooks/useMutedUsers';
 import { ChatProvider } from '../../../contexts/chatContext/ChatContext';
 import { defaultIcons } from '../../../contexts/componentsContext/defaultComponents';
 import type { TranslationContextValue } from '../../../contexts/translationContext/TranslationContext';
@@ -35,15 +35,15 @@ const createMemberMock = (userId = 'target-user-id'): ChannelMemberResponse =>
     user_id: userId,
   }) as ChannelMemberResponse;
 
-const createChannelMock = (params?: { blockedUserIds?: string[]; userID?: string }): Channel => {
-  const { blockedUserIds = [], userID = 'current-user-id' } = params ?? {};
+const createChannelMock = (params?: { blockedUserIds?: string[]; userId?: string }): Channel => {
+  const { blockedUserIds = [], userId = 'current-user-id' } = params ?? {};
   return {
     getClient: () => ({
       blockedUsers: {
         getLatestValue: () => ({ userIds: blockedUserIds }),
         subscribeWithSelector: () => () => {},
       },
-      userID,
+      userId,
     }),
   } as unknown as Channel;
 };
@@ -55,12 +55,12 @@ describe('useChannelMemberActionItems', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
-    jest
-      .spyOn(TranslationContext, 'useTranslationContext')
-      .mockImplementation(
-        () => ({ t: (value: string) => value }) as unknown as TranslationContextValue,
-      );
-    jest.spyOn(useMutedUsersModule, 'useMutedUsers').mockReturnValue([] as Mute[]);
+    jest.spyOn(TranslationContext, 'useTranslationContext').mockImplementation(
+      () =>
+        ({
+          t: (value: string, d?: unknown) => (typeof d === 'string' ? d : value),
+        }) as unknown as TranslationContextValue,
+    );
     jest.spyOn(useUserActionsModule, 'useUserActions').mockReturnValue(userActions);
     jest.spyOn(useChannelActionsModule, 'useChannelActions').mockReturnValue(channelActions);
     jest.spyOn(useChannelOwnCapabilitiesModule, 'useChannelOwnCapabilities').mockReturnValue([]);
@@ -84,7 +84,7 @@ describe('useChannelMemberActionItems', () => {
   });
 
   it('returns no action items when the member is the current user', () => {
-    const currentUserChannel = createChannelMock({ userID: 'target-user-id' });
+    const currentUserChannel = createChannelMock({ userId: 'target-user-id' });
 
     const { result } = renderHook(() =>
       useChannelMemberActionItems({ channel: currentUserChannel, member }),
@@ -94,14 +94,14 @@ describe('useChannelMemberActionItems', () => {
   });
 
   it('toggles muteUser to unmuteUser when the member is already muted', () => {
-    jest
-      .spyOn(useMutedUsersModule, 'useMutedUsers')
-      .mockReturnValue([
+    const mutedUsersStore = new StateStore<{ mutedUsers: UserMuteResponse[] }>({
+      mutedUsers: [
         { target: { id: 'target-user-id' }, user: { id: 'current-user-id' } },
-      ] as Mute[]);
+      ] as UserMuteResponse[],
+    });
 
     const wrapper = ({ children }: PropsWithChildren) => (
-      <ChatProvider value={{ client: { userID: 'current-user-id' } } as never}>
+      <ChatProvider value={{ client: { mutedUsersStore, userId: 'current-user-id' } } as never}>
         {children}
       </ChatProvider>
     );
@@ -166,7 +166,7 @@ describe('useChannelMemberActionItems', () => {
     jest
       .spyOn(useChannelOwnCapabilitiesModule, 'useChannelOwnCapabilities')
       .mockReturnValue(['update-channel-members']);
-    const currentUserChannel = createChannelMock({ userID: 'target-user-id' });
+    const currentUserChannel = createChannelMock({ userId: 'target-user-id' });
 
     const { result } = renderHook(() =>
       useChannelMemberActionItems({ channel: currentUserChannel, member }),
@@ -256,7 +256,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: undefined,
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: false,
     });
@@ -277,7 +278,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: undefined,
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: false,
     });
@@ -295,7 +297,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: ['update-channel-members'],
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: false,
     });
@@ -316,7 +319,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: undefined,
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: true,
     });
@@ -336,7 +340,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: undefined,
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: true,
     });
@@ -355,7 +360,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
       member,
       ownCapabilities: undefined,
       icons: defaultIcons,
-      t: ((value: string) => value) as TranslationContextValue['t'],
+      t: ((value: string, d?: unknown) =>
+        typeof d === 'string' ? d : value) as TranslationContextValue['t'],
       userActions: actions,
       userMuteActive: false,
     });
@@ -369,7 +375,8 @@ describe('buildDefaultChannelMemberActionItems', () => {
         member,
         ownCapabilities: undefined,
         icons: defaultIcons,
-        t: ((value: string) => value) as TranslationContextValue['t'],
+        t: ((value: string, d?: unknown) =>
+          typeof d === 'string' ? d : value) as TranslationContextValue['t'],
         userActions: actions,
         userMuteActive: false,
       },

package/src/hooks/actions/__tests__/useUserActions.test.tsx

@@ -18,34 +18,34 @@ describe('useUserActions', () => {
   const muteUser = jest.fn();
   const unmuteUser = jest.fn();
   const blockUser = jest.fn();
-  const unBlockUser = jest.fn();
+  const unblockUser = jest.fn();
   const addNotification = jest.fn();
 
   const setUpMocks = () => {
     muteUser.mockResolvedValue(undefined);
     unmuteUser.mockResolvedValue(undefined);
     blockUser.mockResolvedValue(undefined);
-    unBlockUser.mockResolvedValue(undefined);
+    unblockUser.mockResolvedValue(undefined);
 
     jest.spyOn(ChatContext, 'useChatContext').mockImplementation(
       () =>
         ({
           client: {
             blockUser,
-            muteUser,
-            unBlockUser,
-            unmuteUser,
+            moderation: { mute: muteUser, unmute: unmuteUser },
+            unblockUser,
           },
         }) as unknown as ChatContext.ChatContextValue,
     );
     jest
       .spyOn(useNotificationApiModule, 'useNotificationApi')
       .mockReturnValue({ addNotification } as unknown as useNotificationApiModule.NotificationApi);
-    jest
-      .spyOn(TranslationContext, 'useTranslationContext')
-      .mockImplementation(
-        () => ({ t: (value: string) => value }) as unknown as TranslationContextValue,
-      );
+    jest.spyOn(TranslationContext, 'useTranslationContext').mockImplementation(
+      () =>
+        ({
+          t: (value: string, d?: unknown) => (typeof d === 'string' ? d : value),
+        }) as unknown as TranslationContextValue,
+    );
   };
 
   beforeEach(() => {
@@ -74,7 +74,7 @@ describe('useUserActions', () => {
 
       await result.current.muteUser({ onSuccess });
 
-      expect(muteUser).toHaveBeenCalledWith('target-user-id');
+      expect(muteUser).toHaveBeenCalledWith({ target_ids: ['target-user-id'] });
       expect(onSuccess).toHaveBeenCalledTimes(1);
       expect(addNotification).toHaveBeenCalledWith(
         expect.objectContaining({
@@ -118,7 +118,7 @@ describe('useUserActions', () => {
 
       await result.current.unmuteUser({ onSuccess });
 
-      expect(unmuteUser).toHaveBeenCalledWith('target-user-id');
+      expect(unmuteUser).toHaveBeenCalledWith({ target_ids: ['target-user-id'] });
       expect(onSuccess).toHaveBeenCalledTimes(1);
       expect(addNotification).toHaveBeenCalledWith(
         expect.objectContaining({
@@ -199,7 +199,7 @@ describe('useUserActions', () => {
 
       await result.current.unblockUser({ onSuccess });
 
-      expect(unBlockUser).toHaveBeenCalledWith('target-user-id');
+      expect(unblockUser).toHaveBeenCalledWith('target-user-id');
       expect(onSuccess).toHaveBeenCalledTimes(1);
       expect(addNotification).toHaveBeenCalledWith(
         expect.objectContaining({
@@ -213,7 +213,7 @@ describe('useUserActions', () => {
     });
 
     it('emits an error notification when the client rejects', async () => {
-      unBlockUser.mockRejectedValueOnce(new Error('boom'));
+      unblockUser.mockRejectedValueOnce(new Error('boom'));
       const user = createUser();
       const { result } = renderHook(() => useUserActions(user));
 
@@ -244,7 +244,7 @@ describe('useUserActions', () => {
       expect(muteUser).not.toHaveBeenCalled();
       expect(unmuteUser).not.toHaveBeenCalled();
       expect(blockUser).not.toHaveBeenCalled();
-      expect(unBlockUser).not.toHaveBeenCalled();
+      expect(unblockUser).not.toHaveBeenCalled();
       expect(addNotification).not.toHaveBeenCalled();
     });
   });

package/src/hooks/actions/useChannelActionItems.tsx

@@ -22,10 +22,8 @@ import { useChannelMembershipState } from '../useChannelMembershipState';
 import { useIsDirectChat } from '../useIsDirectChat';
 import { useStateStore } from '../useStateStore';
 
-// Lazily resolved to avoid a static import cycle with defaultComponents.ts
-// (defaultComponents → ChannelDetails*/ChannelPreview* → this file). Statically
-// importing defaultIcons corrupts module-init order; require it at call time
-// instead. Same pattern as ComponentsContext's getDefaults().
+// Required lazily: a static import of defaultComponents.ts would form a cycle
+// (defaultComponents -> ChannelDetails*/ChannelPreview* -> this file) and corrupt init order.
 let cachedDefaultIcons: IconsMap | undefined;
 const getDefaultIcons = (): IconsMap => {
   if (!cachedDefaultIcons) {
@@ -40,37 +38,22 @@ export type ChannelActionItem = ActionItem<
   'mute' | 'muteUser' | 'block' | 'leave' | 'deleteChannel' | 'pin' | string
 > & {
   /**
-   * Per item routing **within a channel preview interaction** (swipe row vs
-   * the sheet that opens from it). Only meaningful when the items are consumed
-   * from `<ChannelSwipableWrapper>`:
-   *
-   * - `'swipe'`: shown only in the swipe-row chips.
-   * - `'sheet'`: shown only in the swipe-triggered options sheet.
-   * - `'both'`: shown in both swipe row and sheet.
-   *
-   * The standalone Channel Details screen does **not** filter by `placement` -
-   * use {@link ChannelActionSurface} (`surface`) instead to vary items between
-   * the channel list and the Channel Details screen.
+   * Where the item shows in a channel preview: `'swipe'` (swipe-row chips only), `'sheet'` (the
+   * options sheet opened from the swipe row only) or `'both'`. Only `<ChannelSwipableWrapper>`
+   * reads it; the Channel Details screen does not, so use `surface` to vary items there.
    */
   placement: 'both' | 'sheet' | 'swipe';
 };
 
 /**
- * Identifies which top level UI surface is requesting channel action items.
- * Passed verbatim into {@link ChannelActionItemsParams} so the default builder
- * and any integrator supplied `getChannelActionItems` can branch on it - i.e.
- * to drop or relabel an item on a specific surface or to provide an entirely
- * different builder per surface.
+ * The UI surface requesting channel action items, passed through to `getChannelActionItems` so it
+ * can drop or relabel items per surface.
  *
- * - `'list'`: anything driven by a ChannelList interaction, the swipe row
- *   chips on a channel preview and the bottom sheet that opens from them.
- *   Subrouting between the swipe row and the sheet is handled by the per item
- *   {@link ChannelActionItem.placement} field.
- * - `'details'`: items for the standalone Channel Details screen.
+ * - `'list'`: ChannelList interactions, the swipe row of a channel preview and its options sheet
+ *   (routed between the two by {@link ChannelActionItem.placement}).
+ * - `'details'`: the standalone Channel Details screen.
  *
- * `surface` operates at the call site level (which UI is asking). It is
- * optional and when omitted, the default builder applies no surface specific
- * filtering and returns every item it would otherwise produce.
+ * When omitted, the default builder applies no surface filtering.
  */
 export type ChannelActionSurface = 'list' | 'details';
 
@@ -129,7 +112,7 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
     t,
     channel,
   } = channelActionItemsParams;
-  const ownUserId = channel.getClient().userID;
+  const ownUserId = channel.getClient().userId;
 
   const actionItems: ChannelActionItem[] = [
     {
@@ -149,11 +132,11 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
       id: 'mute',
       label: isDirectChat
         ? channelMuteActive
-          ? t('Unmute Chat')
-          : t('Mute Chat')
+          ? t('channel.unmuteChat.label', 'Unmute Chat')
+          : t('channel.muteChat.label', 'Mute Chat')
         : channelMuteActive
-          ? t('Unmute Group')
-          : t('Mute Group'),
+          ? t('channel.unmuteGroup.label', 'Unmute Group')
+          : t('channel.muteGroup.label', 'Mute Group'),
       placement: 'swipe',
       type: 'standard',
     },
@@ -166,11 +149,11 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
       id: 'pin',
       label: isDirectChat
         ? isPinned
-          ? t('Unpin Chat')
-          : t('Pin Chat')
+          ? t('channel.unpinChat.label', 'Unpin Chat')
+          : t('channel.pinChat.label', 'Pin Chat')
         : isPinned
-          ? t('Unpin Group')
-          : t('Pin Group'),
+          ? t('channel.unpinGroup.label', 'Unpin Group')
+          : t('channel.pinGroup.label', 'Pin Group'),
       placement: 'sheet',
       type: 'standard',
     });
@@ -191,7 +174,9 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
           />
         ),
       id: 'muteUser',
-      label: userMuteActive ? t('Unmute User') : t('Mute User'),
+      label: userMuteActive
+        ? t('message.unmuteUser.label', 'Unmute User')
+        : t('message.muteUser.label', 'Mute User'),
       placement: 'sheet',
       type: 'standard',
     });
@@ -201,19 +186,22 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
       const name = otherUser?.name || otherUser?.id || '';
 
       Alert.alert(
-        t('Block {{ name }}', { name }),
-        t("They won't be able to message or call you. You can unblock them later."),
+        t('message.blockUserConfirm.title', 'Block {{ name }}', { name }),
+        t(
+          'message.blockUserConfirm.text',
+          "They won't be able to message or call you. You can unblock them later.",
+        ),
         [
           {
             style: 'cancel',
-            text: t('Cancel'),
+            text: t('common.cancel.label', 'Cancel'),
           },
           {
             onPress: async () => {
               await blockUser(...args);
             },
             style: 'destructive',
-            text: t('Block'),
+            text: t('message.blockUserConfirm.label', 'Block'),
           },
         ],
       );
@@ -223,14 +211,16 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
       action: isBlocked ? unblockUser : blockUserWithConfirmation,
       Icon: (props) => <ChannelActionsIcon Icon={icons.BlockUser} {...props} />,
       id: 'block',
-      label: isBlocked ? t('Unblock User') : t('Block User'),
+      label: isBlocked
+        ? t('message.unblockUser.label', 'Unblock User')
+        : t('message.blockUser.label', 'Block User'),
       placement: 'sheet',
       type: isBlocked ? 'standard' : 'destructive',
     });
   }
 
   const leaveWithConfirmation = (...args: Parameters<ChannelActionHandler>) => {
-    const channelName = channel.data?.name;
+    const channelName = channel.data?.custom?.name;
     let name: string;
     if (channelName) {
       name = channelName;
@@ -238,23 +228,29 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
       const otherUser = getOtherUserInDirectChannel(channel)?.user;
       name = otherUser?.name || otherUser?.id || '';
     } else {
-      name = t('group');
+      name = t('channel.leave.confirm.groupName.text', 'this group');
     }
 
     Alert.alert(
-      isDirectChat ? t('Leave Chat') : t('Leave Group'),
-      t("You'll stop receiving messages from {{ name }}. You can rejoin anytime.", { name }),
+      isDirectChat
+        ? t('channel.leaveChat.label', 'Leave Chat')
+        : t('channel.leaveGroup.label', 'Leave Group'),
+      t(
+        'channel.leave.confirm.text',
+        "You'll stop receiving messages from {{ name }}. You can rejoin anytime.",
+        { name },
+      ),
       [
         {
           style: 'cancel',
-          text: t('Cancel'),
+          text: t('common.cancel.label', 'Cancel'),
         },
         {
           onPress: async () => {
             await leave(...args);
           },
           style: 'destructive',
-          text: t('Leave'),
+          text: t('channel.leave.confirm.label', 'Leave'),
         },
       ],
     );
@@ -264,7 +260,9 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
     action: leaveWithConfirmation,
     Icon: (props) => <ChannelActionsIcon Icon={icons.ArrowBoxLeft} {...props} />,
     id: 'leave',
-    label: isDirectChat ? t('Leave Chat') : t('Leave Group'),
+    label: isDirectChat
+      ? t('channel.leaveChat.label', 'Leave Chat')
+      : t('channel.leaveGroup.label', 'Leave Group'),
     placement: 'sheet',
     type: 'destructive',
   });
@@ -272,28 +270,38 @@ export const buildDefaultChannelActionItems: BuildDefaultChannelActionItems = (
   if (channel.data?.created_by?.id === ownUserId) {
     actionItems.push({
       action: (...args: Parameters<ChannelActionHandler>) => {
-        const title = isDirectChat ? t('Delete chat') : t('Delete group');
+        const title = isDirectChat
+          ? t('channel.deleteChat.title', 'Delete chat')
+          : t('channel.deleteGroup.title', 'Delete group');
         const message = isDirectChat
-          ? t("Are you sure you want to delete this chat? This can't be undone.")
-          : t("Are you sure you want to delete this group? This can't be undone.");
+          ? t(
+              'channel.deleteChat.confirm.text',
+              "Are you sure you want to delete this chat? This can't be undone.",
+            )
+          : t(
+              'channel.deleteGroup.confirm.text',
+              "Are you sure you want to delete this group? This can't be undone.",
+            );
 
         Alert.alert(title, message, [
           {
             style: 'cancel',
-            text: t('Cancel'),
+            text: t('common.cancel.label', 'Cancel'),
           },
           {
             onPress: async () => {
               await deleteChannel(...args);
             },
             style: 'destructive',
-            text: t('Delete'),
+            text: t('message.deleteMessageConfirm.label', 'Delete'),
           },
         ]);
       },
       Icon: (props) => <ChannelActionsIcon Icon={icons.Delete} {...props} />,
       id: 'deleteChannel',
-      label: isDirectChat ? t('Delete Chat') : t('Delete Group'),
+      label: isDirectChat
+        ? t('channel.deleteChat.label', 'Delete Chat')
+        : t('channel.deleteGroup.label', 'Delete Group'),
       placement: 'sheet',
       type: 'destructive',
     });
@@ -328,8 +336,8 @@ export const useChannelActionItems = ({
   const membership = useChannelMembershipState(channel);
   const channelActions = useChannelActions(channel);
   const isDirectChat = useIsDirectChat(channel);
-  const isPinned = Boolean(membership?.pinned_at);
-  const isArchived = Boolean(membership?.archived_at);
+  const isPinned = membership?.pinned_at != null;
+  const isArchived = membership?.archived_at != null;
 
   const { muted: channelMuteActive } = useIsChannelMuted(channel);
   const otherUser = isDirectChat ? getOtherUserInDirectChannel(channel)?.user : undefined;