stream-chat-react-native-core 7.0.0-rc.9 → 7.0.0

package/src/contexts/debugContext/DebugContext.tsx

@@ -1,8 +1,6 @@
 import React, { PropsWithChildren, useContext, useRef } from 'react';
 
-import type { Channel, ChannelState, StreamChat } from 'stream-chat';
-
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
+import type { Channel, ChannelState, LocalMessage, StreamChat } from 'stream-chat';
 
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
 
@@ -12,7 +10,7 @@ export type DebugDataType =
       data: Channel['data'];
       members: ChannelState['members'];
     }[]
-  | MessageType[];
+  | LocalMessage[];
 
 export type DebugContextValue = {
   eventType?: string;

package/src/contexts/imageGalleryContext/ImageGalleryContext.tsx

@@ -1,6 +1,7 @@
 import React, { PropsWithChildren, useContext, useState } from 'react';
 
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
+import { LocalMessage } from 'stream-chat';
+
 import type { UnknownType } from '../../types/types';
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
 
@@ -12,8 +13,8 @@ type SelectedMessage = {
 };
 
 export type ImageGalleryContextValue = {
-  messages: MessageType[];
-  setMessages: React.Dispatch<React.SetStateAction<MessageType[]>>;
+  messages: LocalMessage[];
+  setMessages: React.Dispatch<React.SetStateAction<LocalMessage[]>>;
   setSelectedMessage: React.Dispatch<React.SetStateAction<SelectedMessage | undefined>>;
   selectedMessage?: SelectedMessage;
 };
@@ -23,7 +24,7 @@ export const ImageGalleryContext = React.createContext(
 );
 
 export const ImageGalleryProvider = ({ children }: PropsWithChildren<UnknownType>) => {
-  const [messages, setMessages] = useState<MessageType[]>([]);
+  const [messages, setMessages] = useState<LocalMessage[]>([]);
   const [selectedMessage, setSelectedMessage] = useState<SelectedMessage>();
 
   return (

package/src/contexts/messageContext/MessageContext.tsx

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren, useContext } from 'react';
 
-import type { Attachment } from 'stream-chat';
+import type { Attachment, LocalMessage } from 'stream-chat';
 
 import type { ActionHandler } from '../../components/Attachment/Attachment';
 import { ReactionSummary } from '../../components/Message/hooks/useProcessReactions';
@@ -8,7 +8,7 @@ import type {
   MessagePressableHandlerPayload,
   PressableHandlerPayload,
 } from '../../components/Message/Message';
-import type { GroupType, MessageType } from '../../components/MessageList/hooks/useMessageList';
+import type { GroupType } from '../../components/MessageList/hooks/useMessageList';
 import type { ChannelContextValue } from '../../contexts/channelContext/ChannelContext';
 import type { MessageContentType } from '../../contexts/messagesContext/MessagesContext';
 import type { DeepPartial } from '../../contexts/themeContext/ThemeContext';
@@ -48,13 +48,13 @@ export type MessageContextValue = {
   /**
    * A factory function that determines whether a message is AI generated or not.
    */
-  isMessageAIGenerated: (message: MessageType) => boolean;
+  isMessageAIGenerated: (message: LocalMessage) => boolean;
   /** Whether or not this is the active user's message */
   isMyMessage: boolean;
   /** Whether or not this is the last message in a group of messages */
   lastGroupMessage: boolean;
   /** Current [message object](https://getstream.io/chat/docs/#message_format) */
-  message: MessageType;
+  message: LocalMessage;
   /** Order to render the message content */
   messageContentOrder: MessageContentType[];
   /**
@@ -87,6 +87,8 @@ export type MessageContextValue = {
   /** The images attached to a message */
   otherAttachments: Attachment[];
   reactions: ReactionSummary[];
+  /** Whether or not the message has been read by the current user */
+  readBy: number | boolean;
   /** React set state function to set the state of `isEditedMessageOpen` */
   setIsEditedMessageOpen: React.Dispatch<React.SetStateAction<boolean>>;
   /**

package/src/contexts/messageInputContext/MessageInputContext.tsx

@@ -13,6 +13,7 @@ import { Alert, Keyboard, Linking, TextInput, TextInputProps } from 'react-nativ
 import uniq from 'lodash/uniq';
 import {
   Attachment,
+  LocalMessage,
   logChatPromiseExecution,
   Message,
   SendFileAPIResponse,
@@ -52,7 +53,6 @@ import type { MessageInputProps } from '../../components/MessageInput/MessageInp
 import type { MoreOptionsButtonProps } from '../../components/MessageInput/MoreOptionsButton';
 import type { SendButtonProps } from '../../components/MessageInput/SendButton';
 import type { UploadProgressIndicatorProps } from '../../components/MessageInput/UploadProgressIndicator';
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
 import type { Emoji } from '../../emoji-data';
 import {
   isDocumentPickerAvailable,
@@ -360,7 +360,7 @@ export type InputMessageInputContextValue = {
   SendButton: React.ComponentType<SendButtonProps>;
   sendImageAsync: boolean;
   sendMessage: (message: Partial<StreamMessage>) => Promise<void>;
-  setQuotedMessageState: (message: MessageType) => void;
+  setQuotedMessageState: (message: LocalMessage) => void;
   /**
    * Custom UI component to render checkbox with text ("Also send to channel") in Thread's input box.
    * When ticked, message will also be sent in parent channel.
@@ -439,7 +439,7 @@ export type InputMessageInputContextValue = {
    * Variable that tracks the editing state.
    * It is defined with message type if the editing state is true, else its undefined.
    */
-  editing?: MessageType;
+  editing?: LocalMessage;
   /**
    * Prop to override the default emoji search index in auto complete suggestion list.
    */
@@ -485,7 +485,7 @@ export type InputMessageInputContextValue = {
    */
   onChangeText?: (newText: string) => void;
   openPollCreationDialog?: ({ sendMessage }: Pick<LocalMessageInputContext, 'sendMessage'>) => void;
-  quotedMessage?: MessageType;
+  quotedMessage?: LocalMessage;
   SendMessageDisallowedIndicator?: React.ComponentType;
   /**
    * ref for input setter function
@@ -1036,7 +1036,7 @@ export const MessageInputProvider = ({
           /**
            * If the message is bounced by moderation, we firstly remove the message from message list and then send a new message.
            */
-          if (message && isBouncedMessage(message as MessageType)) {
+          if (message && isBouncedMessage(message)) {
             await removeMessage(message);
           }
           value.sendMessage({

package/src/contexts/messageInputContext/__tests__/sendMessage.test.tsx

@@ -3,7 +3,8 @@ import { act } from 'react-test-renderer';
 
 import { renderHook, waitFor } from '@testing-library/react-native';
 
-import type { MessageType } from '../../../components/MessageList/hooks/useMessageList';
+import { LocalMessage } from 'stream-chat';
+
 import {
   generateFileUploadPreview,
   generateImageUploadPreview,
@@ -40,7 +41,7 @@ describe("MessageInputContext's sendMessage", () => {
     setSelectedFiles: jest.fn(),
     setSelectedImages: jest.fn(),
   }));
-  const message: boolean | MessageType = generateMessage({
+  const message: LocalMessage | undefined = generateMessage({
     created_at: 'Sat Jul 02 2022 23:55:13 GMT+0530 (India Standard Time)',
     id: '7a85f744-cc89-4f82-a1d4-5456432cc8bf',
     updated_at: 'Sat Jul 02 2022 23:55:13 GMT+0530 (India Standard Time)',
@@ -49,7 +50,7 @@ describe("MessageInputContext's sendMessage", () => {
       image: 'fc86ddcb-bac4-400c-9afd-b0c0a1c0cd33',
       name: '50cbdd0e-ca7e-4478-9e2c-be0f1ac6a995',
     }),
-  }) as unknown as MessageType;
+  }) as unknown as LocalMessage;
 
   it('exit sendMessage when file upload status failed', async () => {
     const initialProps = {
@@ -223,7 +224,7 @@ describe("MessageInputContext's sendMessage", () => {
   it('exit sendMessage when image upload has an error and catch block is executed', () => {
     const setQuotedMessageStateMock = jest.fn();
     const clearQuotedMessageStateMock = jest.fn();
-    const generatedQuotedMessage: boolean | MessageType = message;
+    const generatedQuotedMessage: boolean | LocalMessage = message;
     const images = [
       generateImageUploadPreview({ state: FileState.UPLOADED }),
       generateImageUploadPreview({ state: FileState.FINISHED }),
@@ -268,7 +269,7 @@ describe("MessageInputContext's sendMessage", () => {
     const clearEditingStateMock = jest.fn();
     const editMessageMock = jest.fn().mockResolvedValue({ data: {} });
     const images = generateImageUploadPreview({ state: FileState.UPLOADED });
-    const generatedMessage: boolean | MessageType = message;
+    const generatedMessage: boolean | LocalMessage = message;
     const initialProps = {
       clearEditingState: clearEditingStateMock,
       clearQuotedMessageState: clearQuotedMessageStateMock,

package/src/contexts/messageInputContext/__tests__/updateMessage.test.tsx

@@ -3,9 +3,7 @@ import { act } from 'react-test-renderer';
 
 import { renderHook } from '@testing-library/react-native';
 
-import type { StreamChat } from 'stream-chat';
-
-import type { MessageType } from '../../../components/MessageList/hooks/useMessageList';
+import type { LocalMessage, StreamChat } from 'stream-chat';
 
 import { ChatContextValue, ChatProvider } from '../../../contexts/chatContext/ChatContext';
 import { generateMessage } from '../../../mock-builders/generator/message';
@@ -51,7 +49,7 @@ describe("MessageInputContext's updateMessage", () => {
     setSelectedImages: jest.fn(),
   }));
   const clearEditingStateMock = jest.fn();
-  const generatedMessage: boolean | MessageType = generateMessage({
+  const generatedMessage: boolean | LocalMessage = generateMessage({
     created_at: 'Sat Jul 02 2022 23:55:13 GMT+0530 (India Standard Time)',
     id: '7a85f744-cc89-4f82-a1d4-5456432cc8bf',
     text: 'hey',
@@ -61,7 +59,7 @@ describe("MessageInputContext's updateMessage", () => {
       image: 'fc86ddcb-bac4-400c-9afd-b0c0a1c0cd33',
       name: '50cbdd0e-ca7e-4478-9e2c-be0f1ac6a995',
     }),
-  }) as unknown as MessageType;
+  }) as unknown as LocalMessage;
 
   it('updateMessage throws error as clearEditingState is not available', async () => {
     const initialProps = {

package/src/contexts/messageInputContext/__tests__/useMessageDetailsForState.test.tsx

@@ -1,6 +1,6 @@
 import { renderHook } from '@testing-library/react-native';
 
-import type { MessageType } from '../../../components';
+import { LocalMessage } from 'stream-chat';
 
 import {
   generateFileAttachment,
@@ -13,24 +13,29 @@ import { generateUser } from '../../../mock-builders/generator/user';
 import { useMessageDetailsForState } from '../hooks/useMessageDetailsForState';
 
 describe('useMessageDetailsForState', () => {
-  it.each([[{ message: true }], [{ initialValue: '', message: true }]])(
+  const message = generateMessage({ text: 'Dummy text' });
+  it.each([[{ message }, { initialValue: '', message }]])(
     'test state of useMessageDetailsForState when initialProps differ',
     () => {
-      const { result } = renderHook(({ message }) => useMessageDetailsForState(message), {
-        initialProps: { message: true },
-      });
+      const { result } = renderHook(
+        ({ message }) => useMessageDetailsForState(message as unknown as LocalMessage),
+        {
+          initialProps: { message },
+        },
+      );
 
-      expect(result.current.text).toBe('');
+      expect(result.current.text).toBe(message.text);
     },
   );
 
   it('showMoreOptions is true when initialValue and text is same', () => {
     const { result } = renderHook(
-      ({ initialValue, message }) => useMessageDetailsForState(message, initialValue),
+      ({ initialValue, message }) =>
+        useMessageDetailsForState(message as unknown as LocalMessage, initialValue),
       {
         initialProps: {
           initialValue: 'Dummy text',
-          message: generateMessage({ text: 'Dummy text' }) as MessageType,
+          message: generateMessage({ text: 'Dummy text' }),
         },
       },
     );
@@ -41,7 +46,7 @@ describe('useMessageDetailsForState', () => {
   it('fileUploads, imageUploads and mentionedUsers are not empty when attachments are present in message', () => {
     const { result } = renderHook(
       ({ initialValue, message }) =>
-        useMessageDetailsForState(message as unknown as MessageType | boolean, initialValue),
+        useMessageDetailsForState(message as unknown as LocalMessage, initialValue),
       {
         initialProps: {
           initialValue: '',

package/src/contexts/messagesContext/MessagesContext.tsx

@@ -2,7 +2,7 @@ import React, { PropsWithChildren, useContext } from 'react';
 
 import { PressableProps, ViewProps } from 'react-native';
 
-import type { Attachment, ChannelState, MessageResponse } from 'stream-chat';
+import type { Attachment, ChannelState, LocalMessage, MessageResponse } from 'stream-chat';
 
 import type { PollContentProps, StreamingMessageViewProps } from '../../components';
 import type { AttachmentProps } from '../../components/Attachment/Attachment';
@@ -16,6 +16,7 @@ import type { GalleryProps } from '../../components/Attachment/Gallery';
 import type { GiphyProps } from '../../components/Attachment/Giphy';
 import type { ImageLoadingFailedIndicatorProps } from '../../components/Attachment/ImageLoadingFailedIndicator';
 import type { ImageLoadingIndicatorProps } from '../../components/Attachment/ImageLoadingIndicator';
+import { ImageReloadIndicatorProps } from '../../components/Attachment/ImageReloadIndicator';
 import type { VideoThumbnailProps } from '../../components/Attachment/VideoThumbnail';
 import type {
   MessagePressableHandlerPayload,
@@ -40,7 +41,6 @@ import type { ReactionListTopProps } from '../../components/Message/MessageSimpl
 import type { MarkdownRules } from '../../components/Message/MessageSimple/utils/renderText';
 import type { MessageActionsParams } from '../../components/Message/utils/messageActions';
 import type { DateHeaderProps } from '../../components/MessageList/DateHeader';
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
 import type { InlineDateSeparatorProps } from '../../components/MessageList/InlineDateSeparator';
 import type { MessageListProps } from '../../components/MessageList/MessageList';
 import type { MessageSystemProps } from '../../components/MessageList/MessageSystem';
@@ -107,7 +107,7 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    * Defaults to: [DateHeader](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageList/DateHeader.tsx)
    **/
   DateHeader: React.ComponentType<DateHeaderProps>;
-  deleteMessage: (message: MessageResponse) => Promise<void>;
+  deleteMessage: (message: LocalMessage) => Promise<void>;
   deleteReaction: (type: string, messageId: string) => Promise<void>;
 
   /** Should keyboard be dismissed when messaged is touched */
@@ -151,6 +151,11 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    */
   ImageLoadingFailedIndicator: React.ComponentType<ImageLoadingFailedIndicatorProps>;
 
+  /**
+   * The indicator rendered at the center of an image whenever its loading fails, used to trigger retries.
+   */
+  ImageReloadIndicator: React.ComponentType<ImageReloadIndicatorProps>;
+
   /**
    * The indicator rendered when image is loading. By default renders <ActivityIndicator/>
    */
@@ -289,15 +294,15 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
   /**
    * Override the api request for retry message functionality.
    */
-  retrySendMessage: (message: MessageType) => Promise<void>;
+  retrySendMessage: (message: LocalMessage) => Promise<void>;
   /**
    * UI component for ScrollToBottomButton
    * Defaults to: [ScrollToBottomButton](https://getstream.io/chat/docs/sdk/reactnative/ui-components/scroll-to-bottom-button/)
    */
   ScrollToBottomButton: React.ComponentType<ScrollToBottomButtonProps>;
   sendReaction: (type: string, messageId: string) => Promise<void>;
-  setEditingState: (message?: MessageType) => void;
-  setQuotedMessageState: (message?: MessageType) => void;
+  setEditingState: (message?: LocalMessage) => void;
+  setQuotedMessageState: (message?: LocalMessage) => void;
   /**
    * UI component for StreamingMessageView. Displays the text of a message with a typewriter animation.
    */
@@ -314,7 +319,7 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
   TypingIndicatorContainer: React.ComponentType<TypingIndicatorContainerProps>;
   UnreadMessagesNotification: React.ComponentType<UnreadMessagesNotificationProps>;
   updateMessage: (
-    updatedMessage: MessageResponse,
+    updatedMessage: MessageResponse | LocalMessage,
     extraState?: {
       commands?: SuggestionCommand[];
       messageInput?: string;
@@ -377,29 +382,29 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    * Handler to access when a ban user action is invoked.
    * @param message
    */
-  handleBan?: (message: MessageType) => Promise<void>;
+  handleBan?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a copy message action is invoked */
-  handleCopy?: (message: MessageType) => Promise<void>;
+  handleCopy?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a delete message action is invoked */
-  handleDelete?: (message: MessageType) => Promise<void>;
+  handleDelete?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when an edit message action is invoked */
-  handleEdit?: (message: MessageType) => void;
+  handleEdit?: (message: LocalMessage) => void;
   /** Handler to access when a flag message action is invoked */
-  handleFlag?: (message: MessageType) => Promise<void>;
+  handleFlag?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a mark unread action is invoked */
-  handleMarkUnread?: (message: MessageType) => Promise<void>;
+  handleMarkUnread?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a mute user action is invoked */
-  handleMute?: (message: MessageType) => Promise<void>;
+  handleMute?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a pin/unpin user action is invoked*/
-  handlePinMessage?: ((message: MessageType) => MessageActionType) | null;
+  handlePinMessage?: ((message: LocalMessage) => MessageActionType) | null;
   /** Handler to access when a quoted reply action is invoked */
-  handleQuotedReply?: (message: MessageType) => Promise<void>;
+  handleQuotedReply?: (message: LocalMessage) => Promise<void>;
   /** Handler to process a reaction */
-  handleReaction?: (message: MessageType, reactionType: string) => Promise<void>;
+  handleReaction?: (message: LocalMessage, reactionType: string) => Promise<void>;
   /** Handler to access when a retry action is invoked */
-  handleRetry?: (message: MessageType) => Promise<void>;
+  handleRetry?: (message: LocalMessage) => Promise<void>;
   /** Handler to access when a thread reply action is invoked */
-  handleThreadReply?: (message: MessageType) => Promise<void>;
+  handleThreadReply?: (message: LocalMessage) => Promise<void>;
   /** A flag specifying whether the poll creation button is available or not. */
   hasCreatePoll?: boolean;
   /** Handler to deal with custom memoization logic of Attachment */
@@ -587,7 +592,7 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    *
    * Please check [cookbook](https://github.com/GetStream/stream-chat-react-native/wiki/Cookbook-v3.0#override-or-intercept-message-actions-edit-delete-reaction-reply-etc) for details.
    * */
-  selectReaction?: (message: MessageType) => (reactionType: string) => Promise<void>;
+  selectReaction?: (message: LocalMessage) => (reactionType: string) => Promise<void>;
 
   /**
    * Boolean to enable/disable the message underlay background when there are unread messages in the Message List.

package/src/contexts/pollContext/pollContext.tsx

@@ -1,15 +1,13 @@
 import React, { PropsWithChildren, useContext } from 'react';
 
-import { Poll } from 'stream-chat';
-
-import { MessageType } from '../../components';
+import { LocalMessage, Poll } from 'stream-chat';
 
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
 
 import { isTestEnvironment } from '../utils/isTestEnvironment';
 
 export type PollContextValue = {
-  message: MessageType;
+  message: LocalMessage;
   poll: Poll;
 };
 

package/src/contexts/threadContext/ThreadContext.tsx

@@ -1,23 +1,21 @@
 import React, { PropsWithChildren, useContext } from 'react';
 
-import { ChannelState, Thread } from 'stream-chat';
-
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
+import { ChannelState, LocalMessage, Thread } from 'stream-chat';
 
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
 
 import { isTestEnvironment } from '../utils/isTestEnvironment';
 
-export type ThreadType = { thread: MessageType; threadInstance: Thread };
+export type ThreadType = { thread: LocalMessage; threadInstance: Thread };
 
 export type ThreadContextValue = {
   allowThreadMessagesInChannel: boolean;
   closeThread: () => void;
   loadMoreThread: () => Promise<void>;
-  openThread: (message: MessageType) => void;
+  openThread: (message: LocalMessage) => void;
   reloadThread: () => void;
   setThreadLoadingMore: React.Dispatch<React.SetStateAction<boolean>>;
-  thread: MessageType | null;
+  thread: LocalMessage | null;
   threadHasMore: boolean;
   threadMessages: ChannelState['threads'][string];
   loadMoreRecentThread?: (opts: { limit?: number }) => Promise<void>;

package/src/contexts/threadsContext/ThreadListItemContext.tsx

@@ -1,8 +1,6 @@
 import React, { PropsWithChildren, useContext } from 'react';
 
-import { Channel, Thread } from 'stream-chat';
-
-import { MessageType } from '../../components';
+import { Channel, LocalMessage, Thread } from 'stream-chat';
 
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
 
@@ -10,9 +8,9 @@ export type ThreadListItemContextValue = {
   channel: Channel;
   dateString: string | number | undefined;
   deletedAtDateString: string | number | undefined;
-  lastReply: MessageType | undefined;
+  lastReply: LocalMessage | undefined;
   ownUnreadMessageCount: number;
-  parentMessage: MessageType | undefined;
+  parentMessage: LocalMessage | undefined;
   thread: Thread;
 };
 

package/src/hooks/index.ts

@@ -4,3 +4,4 @@ export * from './useViewport';
 export * from './useScreenDimensions';
 export * from './useStateStore';
 export * from './useStableCallback';
+export * from './useLoadingImage';

package/src/i18n/en.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Reply",
   "1 Thread Reply": "1 Thread Reply",
   "Add a comment": "Add a comment",

package/src/i18n/es.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 respuesta",
   "1 Thread Reply": "1 respuesta de hilo",
   "Add a comment": "Agregar un comentario",

package/src/i18n/fr.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Réponse",
   "1 Thread Reply": "Réponse à 1 fil",
   "Add a comment": "Ajouter un commentaire",

package/src/i18n/he.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
+  "+{{count}}_two": "+{{count}}",
   "1 Reply": "תגובה אחת",
   "1 Thread Reply": "תגובה אחת לשרשור",
   "Add a comment": "הוסף תגובה",

package/src/i18n/hi.json

@@ -1,4 +1,6 @@
 {
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 रिप्लाई",
   "1 Thread Reply": "1 धागा उत्तर",
   "Add a comment": "एक टिप्पणी जोड़ें",

package/src/i18n/it.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Risposta",
   "1 Thread Reply": "1 Risposta alla Discussione",
   "Add a comment": "Aggiungi un commento",

package/src/i18n/ja.json

@@ -1,4 +1,5 @@
 {
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1件の返信",
   "1 Thread Reply": "1件のスレッド返信",
   "Add a comment": "コメントを追加",

package/src/i18n/ko.json

@@ -1,4 +1,5 @@
 {
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "답장 1개",
   "1 Thread Reply": "1개의 스레드\u3000답글",
   "Add a comment": "댓글 추가",

package/src/i18n/nl.json

@@ -1,4 +1,6 @@
 {
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Antwoord",
   "1 Thread Reply": "1 thread antwoord",
   "Add a comment": "Voeg een reactie toe",

package/src/i18n/pt-br.json

@@ -1,4 +1,7 @@
 {
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Resposta",
   "1 Thread Reply": "1 Resposta de Thread",
   "Add a comment": "Adicionar um comentário",

package/src/i18n/ru.json

@@ -1,4 +1,8 @@
 {
+  "+{{count}}_few": "+{{count}}",
+  "+{{count}}_many": "+{{count}}",
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Ответ",
   "1 Thread Reply": "1 тема Ответить",
   "Add a comment": "Добавить комментарий",

package/src/i18n/tr.json

@@ -1,4 +1,6 @@
 {
+  "+{{count}}_one": "+{{count}}",
+  "+{{count}}_other": "+{{count}}",
   "1 Reply": "1 Cevap",
   "1 Thread Reply": "1 Konu Yanıtı",
   "Add a comment": "Yorum ekle",

package/src/utils/removeReservedFields.ts

@@ -1,10 +1,8 @@
-import type { MessageResponse } from 'stream-chat';
-
-import type { MessageType } from '../components/MessageList/hooks/useMessageList';
+import type { LocalMessage, MessageResponse } from 'stream-chat';
 
 export const removeReservedFields = (
-  message: MessageType | MessageResponse,
-): MessageType | MessageResponse => {
+  message: LocalMessage | MessageResponse,
+): LocalMessage | MessageResponse => {
   const retryMessage = { ...message };
   const reserved = [
     'cid',