stream-chat-react-native-core 9.4.0-beta.5 → 9.4.0-beta.7

package/lib/typescript/utils/i18n/Streami18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Streami18n.d.ts","sourceRoot":"","sources":["../../../../src/utils/i18n/Streami18n.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Streami18n.d.ts","sourceRoot":"","sources":["../../../../src/utils/i18n/Streami18n.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-react-native-core",
   "description": "The official React Native and Expo components for Stream Chat, a service for building chat applications",
-  "version": "9.4.0-beta.5",
+  "version": "9.4.0-beta.7",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"

package/src/components/ChannelDetails/__tests__/useChannelDetailsActionItems.test.tsx

@@ -51,7 +51,11 @@ describe('useChannelDetailsActionItems', () => {
     renderHook(() => useChannelDetailsActionItems());
 
     expect(spy).toHaveBeenCalledTimes(1);
-    expect(spy).toHaveBeenCalledWith({ channel, getChannelActionItems: undefined });
+    expect(spy).toHaveBeenCalledWith({
+      channel,
+      getChannelActionItems: undefined,
+      surface: 'details',
+    });
   });
 
   it('forwards the getChannelActionItems prop from context unchanged', () => {
@@ -61,7 +65,7 @@ describe('useChannelDetailsActionItems', () => {
 
     renderHook(() => useChannelDetailsActionItems());
 
-    expect(spy).toHaveBeenCalledWith({ channel, getChannelActionItems });
+    expect(spy).toHaveBeenCalledWith({ channel, getChannelActionItems, surface: 'details' });
   });
 
   it('returns non-leave/non-delete items referentially unchanged', () => {

package/src/components/ChannelDetails/hooks/useChannelDetailsActionItems.ts

@@ -12,7 +12,7 @@ import {
 export const useChannelDetailsActionItems = (): ChannelActionItem[] => {
   const { channel, getChannelActionItems, onChannelDismiss } = useChannelDetailsContext();
 
-  const items = useChannelActionItems({ channel, getChannelActionItems });
+  const items = useChannelActionItems({ channel, getChannelActionItems, surface: 'details' });
 
   return useMemo(
     () =>

package/src/components/ChannelList/ChannelList.tsx

@@ -41,6 +41,7 @@ export type ChannelListProps = Partial<
     | 'maxUnreadCount'
     | 'numberOfSkeletons'
     | 'mutedStatusPosition'
+    | 'pinnedStatusPosition'
   >
 > & {
   /** Optional function to filter channels prior to rendering the list. Do not use any complex logic that would delay the loading of the ChannelList. We recommend using a pure function with array methods like filter/sort/reduce. */
@@ -252,6 +253,7 @@ export const ChannelList = (props: ChannelListProps) => {
     queryChannelsOverride,
     notificationHostId: notificationHostIdProp,
     mutedStatusPosition = 'inlineTitle',
+    pinnedStatusPosition = 'inlineTitle',
     swipeActionsEnabled = true,
   } = props;
 
@@ -375,6 +377,7 @@ export const ChannelList = (props: ChannelListProps) => {
       }
     },
     mutedStatusPosition,
+    pinnedStatusPosition,
   });
 
   return (

package/src/components/ChannelList/hooks/useCreateChannelsContext.ts

@@ -23,6 +23,7 @@ export const useCreateChannelsContext = ({
   reloadList,
   setFlatListRef,
   mutedStatusPosition,
+  pinnedStatusPosition,
 }: ChannelsContextValue) => {
   const channelValueString = channels
     ?.map(
@@ -56,6 +57,7 @@ export const useCreateChannelsContext = ({
       reloadList,
       setFlatListRef,
       mutedStatusPosition,
+      pinnedStatusPosition,
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
@@ -69,6 +71,7 @@ export const useCreateChannelsContext = ({
       swipeActionsEnabled,
       refreshing,
       mutedStatusPosition,
+      pinnedStatusPosition,
     ],
   );
 

package/src/components/ChannelPreview/ChannelPreview.tsx

@@ -30,19 +30,37 @@ export const ChannelPreview = (props: ChannelPreviewProps) => {
 
   const client = propClient || contextClient;
 
-  const { muted, unread, lastMessage } = useChannelPreviewData(channel, client, propForceUpdate);
+  const { muted, pinned, unread, lastMessage } = useChannelPreviewData(
+    channel,
+    client,
+    propForceUpdate,
+  );
 
   const translatedLastMessage = useTranslatedMessage(lastMessage);
 
   const message = translatedLastMessage ? translatedLastMessage : lastMessage;
 
   if (!swipeActionsEnabled) {
-    return <ChannelPreview channel={channel} muted={muted} unread={unread} lastMessage={message} />;
+    return (
+      <ChannelPreview
+        channel={channel}
+        muted={muted}
+        pinned={pinned}
+        unread={unread}
+        lastMessage={message}
+      />
+    );
   }
 
   return (
     <ChannelSwipableWrapper channel={channel} getChannelActionItems={getChannelActionItems}>
-      <ChannelPreview channel={channel} muted={muted} unread={unread} lastMessage={message} />
+      <ChannelPreview
+        channel={channel}
+        muted={muted}
+        pinned={pinned}
+        unread={unread}
+        lastMessage={message}
+      />
     </ChannelSwipableWrapper>
   );
 };

package/src/components/ChannelPreview/ChannelPreviewPinnedStatus.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+
+import { useA11yLabel } from '../../a11y/hooks/useA11yLabel';
+import { useTheme } from '../../contexts/themeContext/ThemeContext';
+import { Pin } from '../../icons';
+import { CompositeAccessibilityProbe } from '../Accessibility/CompositeAccessibilityProbe';
+
+/**
+ * This UI component displays a pinned indicator for a particular channel.
+ */
+export const ChannelPreviewPinnedStatus = () => {
+  const {
+    theme: {
+      channelPreview: { pinnedStatus },
+      semantics,
+    },
+  } = useTheme();
+  const accessibilityLabel = useA11yLabel('a11y/Pinned');
+
+  return (
+    <CompositeAccessibilityProbe label={accessibilityLabel}>
+      <Pin height={20} stroke={semantics.textTertiary} width={20} {...pinnedStatus} />
+    </CompositeAccessibilityProbe>
+  );
+};

package/src/components/ChannelPreview/ChannelPreviewView.tsx

@@ -17,7 +17,10 @@ import { useStableCallback } from '../../hooks';
 import { primitives } from '../../theme';
 
 export type ChannelPreviewViewPropsWithContext = Pick<ChannelPreviewProps, 'channel'> &
-  Pick<ChannelsContextValue, 'maxUnreadCount' | 'onSelect' | 'mutedStatusPosition'> & {
+  Pick<
+    ChannelsContextValue,
+    'maxUnreadCount' | 'onSelect' | 'mutedStatusPosition' | 'pinnedStatusPosition'
+  > & {
     /**
      * Formatter function for date of latest message.
      * @param date Message date
@@ -30,6 +33,8 @@ export type ChannelPreviewViewPropsWithContext = Pick<ChannelPreviewProps, 'chan
     formatLatestMessageDate?: (date: Date) => string;
     /** If the channel is muted. */
     muted?: boolean;
+    /** If the channel is pinned for the current user. */
+    pinned?: boolean;
     /** Number of unread messages on the channel */
     unread?: number;
     lastMessage?: LastMessageType;
@@ -42,14 +47,17 @@ const ChannelPreviewViewWithContext = (props: ChannelPreviewViewPropsWithContext
     maxUnreadCount,
     muted,
     onSelect,
+    pinned,
     unread,
     mutedStatusPosition,
+    pinnedStatusPosition,
     lastMessage,
   } = props;
   const {
     ChannelPreviewAvatar,
     ChannelPreviewMessage,
     ChannelPreviewMutedStatus,
+    ChannelPreviewPinnedStatus,
     ChannelPreviewStatus,
     ChannelPreviewTitle,
     ChannelPreviewUnreadCount,
@@ -111,6 +119,9 @@ const ChannelPreviewViewWithContext = (props: ChannelPreviewViewPropsWithContext
               {muted && mutedStatusPosition === 'inlineTitle' ? (
                 <ChannelPreviewMutedStatus />
               ) : null}
+              {pinned && pinnedStatusPosition === 'inlineTitle' ? (
+                <ChannelPreviewPinnedStatus />
+              ) : null}
             </View>
 
             <View style={[styles.statusContainer, statusContainer]}>
@@ -132,6 +143,9 @@ const ChannelPreviewViewWithContext = (props: ChannelPreviewViewPropsWithContext
             {muted && mutedStatusPosition === 'trailingBottom' ? (
               <ChannelPreviewMutedStatus />
             ) : null}
+            {pinned && pinnedStatusPosition === 'trailingBottom' ? (
+              <ChannelPreviewPinnedStatus />
+            ) : null}
           </View>
         </View>
       </Pressable>
@@ -151,7 +165,8 @@ const MemoizedChannelPreviewViewWithContext = React.memo(
  * from the ChannelPreview component.
  */
 export const ChannelPreviewView = (props: ChannelPreviewViewProps) => {
-  const { forceUpdate, maxUnreadCount, onSelect, mutedStatusPosition } = useChannelsContext();
+  const { forceUpdate, maxUnreadCount, onSelect, mutedStatusPosition, pinnedStatusPosition } =
+    useChannelsContext();
   return (
     <MemoizedChannelPreviewViewWithContext
       {...{
@@ -159,6 +174,7 @@ export const ChannelPreviewView = (props: ChannelPreviewViewProps) => {
         maxUnreadCount,
         onSelect,
         mutedStatusPosition,
+        pinnedStatusPosition,
       }}
       {...props}
     />

package/src/components/ChannelPreview/ChannelSwipableWrapper.tsx

@@ -41,7 +41,11 @@ export const ChannelSwipableWrapper = ({
 }>) => {
   const { ChannelDetailsBottomSheet: ChannelDetailsBottomSheetComponent } = useComponentsContext();
   const [channelDetailSheetOpen, setChannelDetailSheetOpen] = useState(false);
-  const channelActionItems = useChannelActionItems({ channel, getChannelActionItems });
+  const channelActionItems = useChannelActionItems({
+    channel,
+    getChannelActionItems,
+    surface: 'list',
+  });
   const sheetItems = useMemo(
     () => channelActionItems.filter((item) => item.placement !== 'swipe'),
     [channelActionItems],

package/src/components/ChannelPreview/hooks/__tests__/useIsChannelPinned.test.tsx

@@ -0,0 +1,35 @@
+import { renderHook } from '@testing-library/react-native';
+import { Channel } from 'stream-chat';
+
+import { useIsChannelPinned } from '../useIsChannelPinned';
+
+describe('useIsChannelPinned', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  const buildMockChannel = (membership: Record<string, unknown> = {}) =>
+    ({
+      initialized: true,
+      on: jest.fn().mockReturnValue({ unsubscribe: jest.fn() }),
+      state: { membership },
+    }) as unknown as Channel;
+
+  it('returns false when membership has no pinned_at', () => {
+    const channel = buildMockChannel({ pinned_at: null });
+    const { result } = renderHook(() => useIsChannelPinned(channel));
+    expect(result.current).toBe(false);
+  });
+
+  it('returns true when membership has a pinned_at timestamp', () => {
+    const channel = buildMockChannel({ pinned_at: '2026-06-15T08:00:00.000Z' });
+    const { result } = renderHook(() => useIsChannelPinned(channel));
+    expect(result.current).toBe(true);
+  });
+
+  it('subscribes to member.updated events', () => {
+    const channel = buildMockChannel({ pinned_at: null });
+    renderHook(() => useIsChannelPinned(channel));
+    expect(channel.on).toHaveBeenCalledWith('member.updated', expect.any(Function));
+  });
+});

package/src/components/ChannelPreview/hooks/index.ts

@@ -4,4 +4,5 @@ export * from './useChannelPreviewPollLabel';
 export * from './useChannelPreviewDisplayName';
 export * from './useChannelPreviewDisplayPresence';
 export * from './useIsChannelMuted';
+export * from './useIsChannelPinned';
 export * from './useChannelTypingState';

package/src/components/ChannelPreview/hooks/useChannelPreviewData.ts

@@ -4,6 +4,7 @@ import throttle from 'lodash/throttle';
 import type { Channel, Event, LocalMessage, MessageResponse, StreamChat } from 'stream-chat';
 
 import { useIsChannelMuted } from './useIsChannelMuted';
+import { useIsChannelPinned } from './useIsChannelPinned';
 
 import { useChannelsContext } from '../../../contexts';
 import { useStableCallback } from '../../../hooks';
@@ -39,6 +40,7 @@ export const useChannelPreviewData = (
   );
   const [unread, setUnread] = useState(channel.countUnread());
   const { muted } = useIsChannelMuted(channel);
+  const pinned = useIsChannelPinned(channel);
   const { forceUpdate: contextForceUpdate } = useChannelsContext();
   const channelListForceUpdate = forceUpdateOverride ?? contextForceUpdate;
 
@@ -170,5 +172,5 @@ export const useChannelPreviewData = (
     return () => listeners.forEach((l) => l.unsubscribe());
   }, [channel, refreshUnreadCount, forceUpdate, channelListForceUpdate, setLastMessage]);
 
-  return { lastMessage, muted, unread };
+  return { lastMessage, muted, pinned, unread };
 };

package/src/components/ChannelPreview/hooks/useIsChannelPinned.ts

@@ -0,0 +1,8 @@
+import type { Channel } from 'stream-chat';
+
+import { useChannelMembershipState } from '../../../hooks/useChannelMembershipState';
+
+export const useIsChannelPinned = (channel: Channel) => {
+  const membership = useChannelMembershipState(channel);
+  return Boolean(membership?.pinned_at);
+};

package/src/components/index.ts

@@ -56,6 +56,7 @@ export * from './ChannelPreview/ChannelPreview';
 export * from './ChannelPreview/ChannelPreviewMessage';
 export * from './ChannelPreview/ChannelPreviewView';
 export * from './ChannelPreview/ChannelPreviewMutedStatus';
+export * from './ChannelPreview/ChannelPreviewPinnedStatus';
 export * from './ChannelPreview/ChannelLastMessagePreview';
 export * from './ChannelPreview/ChannelPreviewStatus';
 export * from './ChannelPreview/ChannelPreviewTitle';

package/src/contexts/channelsContext/ChannelsContext.tsx

@@ -118,6 +118,7 @@ export type ChannelsContextValue = {
   swipeActionsEnabled?: boolean;
 
   mutedStatusPosition?: 'trailingBottom' | 'inlineTitle';
+  pinnedStatusPosition?: 'trailingBottom' | 'inlineTitle';
 };
 
 export const ChannelsContext = React.createContext(

package/src/contexts/componentsContext/defaultComponents.ts

@@ -53,6 +53,7 @@ import { ChannelLastMessagePreview } from '../../components/ChannelPreview/Chann
 import { ChannelMessagePreviewDeliveryStatus } from '../../components/ChannelPreview/ChannelMessagePreviewDeliveryStatus';
 import { ChannelPreviewMessage } from '../../components/ChannelPreview/ChannelPreviewMessage';
 import { ChannelPreviewMutedStatus } from '../../components/ChannelPreview/ChannelPreviewMutedStatus';
+import { ChannelPreviewPinnedStatus } from '../../components/ChannelPreview/ChannelPreviewPinnedStatus';
 import { ChannelPreviewStatus } from '../../components/ChannelPreview/ChannelPreviewStatus';
 import { ChannelPreviewTitle } from '../../components/ChannelPreview/ChannelPreviewTitle';
 import { ChannelPreviewTypingIndicator } from '../../components/ChannelPreview/ChannelPreviewTypingIndicator';
@@ -271,6 +272,7 @@ const components = {
   ChannelPreviewMessage,
   ChannelPreviewMessageDeliveryStatus: ChannelMessagePreviewDeliveryStatus,
   ChannelPreviewMutedStatus,
+  ChannelPreviewPinnedStatus,
   ChannelPreviewStatus,
   ChannelPreviewTitle,
   ChannelPreviewTypingIndicator,

package/src/contexts/themeContext/utils/theme.ts

@@ -299,6 +299,7 @@ export type Theme = {
     contentContainer: ViewStyle;
     date: TextStyle;
     mutedStatus: IconProps;
+    pinnedStatus: IconProps;
     messageDeliveryStatus: {
       container: ViewStyle;
       text: TextStyle;
@@ -1357,6 +1358,7 @@ export const defaultTheme: Theme = {
       timeIcon: {},
     },
     mutedStatus: {},
+    pinnedStatus: {},
     lowerRow: {},
     title: {},
     unreadContainer: {},