Merge pull request #3064 from GetStream/remove-messagetype-type

fix: remove MessageType type from the SDK

Author: isekovanic

examples/SampleApp/App.tsx

@@ -6,7 +6,6 @@ import { createStackNavigator } from '@react-navigation/stack';
 import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context';
 import {
   Chat,
-  MessageType,
   OverlayProvider,
   SqliteClient,
   ThemeProvider,
@@ -36,7 +35,7 @@ import { SharedGroupsScreen } from './src/screens/SharedGroupsScreen';
 import { ThreadScreen } from './src/screens/ThreadScreen';
 import { UserSelectorScreen } from './src/screens/UserSelectorScreen';
 
-import type { StreamChat } from 'stream-chat';
+import type { LocalMessage, StreamChat } from 'stream-chat';
 
 if (__DEV__) {
   DevSettings.addMenuItem('Reset local DB (offline storage)', () => {
@@ -45,10 +44,7 @@ if (__DEV__) {
   });
 }
 
-import type {
-  StackNavigatorParamList,
-  UserSelectorParamList,
-} from './src/types';
+import type { StackNavigatorParamList, UserSelectorParamList } from './src/types';
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import { navigateToChannel, RootNavigationRef } from './src/utils/RootNavigation';
 import FastImage from 'react-native-fast-image';
@@ -106,18 +102,16 @@ const App = () => {
         }
       }
     });
-    messaging
-      .getInitialNotification()
-      .then((remoteMessage) => {
-        if (remoteMessage) {
-          // Notification caused app to open from quit state on iOS
-          const channelId = remoteMessage.data?.channel_id as string;
-          if (channelId) {
-            // this will make the app to start with the channel screen with this channel id
-            initialChannelIdGlobalRef.current = channelId;
-          }
+    messaging.getInitialNotification().then((remoteMessage) => {
+      if (remoteMessage) {
+        // Notification caused app to open from quit state on iOS
+        const channelId = remoteMessage.data?.channel_id as string;
+        if (channelId) {
+          // this will make the app to start with the channel screen with this channel id
+          initialChannelIdGlobalRef.current = channelId;
         }
-      });
+      }
+    });
     return () => {
       unsubscribeOnNotificationOpen();
       unsubscribeForegroundEvent();
@@ -170,7 +164,7 @@ const DrawerNavigator: React.FC = () => (
   </Drawer.Navigator>
 );
 
-const isMessageAIGenerated = (message: MessageType) => !!message.ai_generated;
+const isMessageAIGenerated = (message: LocalMessage) => !!message.ai_generated;
 
 const DrawerNavigatorWrapper: React.FC<{
   chatClient: StreamChat;

examples/SampleApp/src/screens/ThreadScreen.tsx

@@ -3,7 +3,6 @@ import { StyleSheet, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import {
   Channel,
-  MessageType,
   Thread,
   ThreadType,
   useAttachmentPickerContext,
@@ -17,7 +16,7 @@ import { ScreenHeader } from '../components/ScreenHeader';
 import type { RouteProp } from '@react-navigation/native';
 
 import type { StackNavigatorParamList } from '../types';
-import { ThreadState, UserResponse } from 'stream-chat';
+import { LocalMessage, ThreadState, UserResponse } from 'stream-chat';
 
 const selector = (nextValue: ThreadState) => ({ parentMessage: nextValue.parentMessage }) as const;
 
@@ -34,12 +33,12 @@ type ThreadScreenProps = {
 };
 
 export type ThreadHeaderProps = {
-  thread: MessageType | ThreadType;
+  thread: LocalMessage | ThreadType;
 };
 
 const ThreadHeader: React.FC<ThreadHeaderProps> = ({ thread }) => {
   const typing = useTypingString();
-  let subtitleText = ((thread as MessageType)?.user as UserResponse)?.name;
+  let subtitleText = ((thread as LocalMessage)?.user as UserResponse)?.name;
   const { parentMessage } =
     useStateStore((thread as ThreadType)?.threadInstance?.state, selector) || {};
 

examples/SampleApp/src/types.ts

@@ -1,5 +1,5 @@
-import type { Channel, UserResponse } from 'stream-chat';
-import type { MessageType, ThreadType } from 'stream-chat-react-native';
+import type { Channel, LocalMessage, UserResponse } from 'stream-chat';
+import type { ThreadType } from 'stream-chat-react-native';
 import type { Theme } from '@react-navigation/native';
 
 export type DrawerNavigatorParamList = {
@@ -38,7 +38,7 @@ export type StackNavigatorParamList = {
   };
   ThreadScreen: {
     channel: Channel;
-    thread: MessageType | ThreadType;
+    thread: LocalMessage | ThreadType;
   };
 };
 

package/src/components/Attachment/Gallery.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
 
-import type { Attachment } from 'stream-chat';
+import type { Attachment, LocalMessage } from 'stream-chat';
 
 import { GalleryImage } from './GalleryImage';
 import { ImageReloadIndicator } from './ImageReloadIndicator';
@@ -12,7 +12,6 @@ import { getGalleryImageBorderRadius } from './utils/getGalleryImageBorderRadius
 
 import { openUrlSafely } from './utils/openUrlSafely';
 
-import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
 import { useChatConfigContext } from '../../contexts/chatConfigContext/ChatConfigContext';
 import {
   ImageGalleryContextValue,
@@ -76,7 +75,7 @@ export type GalleryPropsWithContext = Pick<
      *
      * TODO: Fix circular dependencies of imports
      */
-    message?: MessageType;
+    message?: LocalMessage;
   };
 
 const GalleryWithContext = (props: GalleryPropsWithContext) => {
@@ -241,7 +240,7 @@ type GalleryThumbnailProps = {
   colIndex: number;
   imagesAndVideos: Attachment[];
   invertedDirections: boolean;
-  message: MessageType;
+  message: LocalMessage;
   numOfColumns: number;
   numOfRows: number;
   rowIndex: number;

package/src/components/Channel/Channel.tsx

@@ -170,7 +170,6 @@ import { ShowThreadMessageInChannelButton as ShowThreadMessageInChannelButtonDef
 import { StopMessageStreamingButton as DefaultStopMessageStreamingButton } from '../MessageInput/StopMessageStreamingButton';
 import { UploadProgressIndicator as UploadProgressIndicatorDefault } from '../MessageInput/UploadProgressIndicator';
 import { DateHeader as DateHeaderDefault } from '../MessageList/DateHeader';
-import type { MessageType } from '../MessageList/hooks/useMessageList';
 import { InlineDateSeparator as InlineDateSeparatorDefault } from '../MessageList/InlineDateSeparator';
 import { InlineUnreadIndicator as InlineUnreadIndicatorDefault } from '../MessageList/InlineUnreadIndicator';
 import { MessageList as MessageListDefault } from '../MessageList/MessageList';
@@ -685,12 +684,12 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     },
   } = useTheme();
   const [deleted, setDeleted] = useState<boolean>(false);
-  const [editing, setEditing] = useState<MessageType | undefined>(undefined);
+  const [editing, setEditing] = useState<LocalMessage | undefined>(undefined);
   const [error, setError] = useState<Error | boolean>(false);
   const [lastRead, setLastRead] = useState<Date | undefined>();
 
-  const [quotedMessage, setQuotedMessage] = useState<MessageType | undefined>(undefined);
-  const [thread, setThread] = useState<MessageType | null>(threadProps || null);
+  const [quotedMessage, setQuotedMessage] = useState<LocalMessage | undefined>(undefined);
+  const [thread, setThread] = useState<LocalMessage | null>(threadProps || null);
   const [threadHasMore, setThreadHasMore] = useState(true);
   const [threadLoadingMore, setThreadLoadingMore] = useState(false);
   const [channelUnreadState, setChannelUnreadState] = useState<ChannelUnreadState | undefined>(
@@ -1583,7 +1582,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
         const updatedMessage = {
           ...message,
           cid: channel.cid,
-          deleted_at: new Date().toISOString(),
+          deleted_at: new Date(),
           type: 'deleted' as MessageLabel,
         };
         updateMessage(updatedMessage);
@@ -2035,7 +2034,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
 
 export type ChannelProps = Partial<Omit<ChannelPropsWithContext, 'channel' | 'thread'>> &
   Pick<ChannelPropsWithContext, 'channel'> & {
-    thread?: MessageType | ThreadType | null;
+    thread?: LocalMessage | ThreadType | null;
   };
 
 /**
@@ -2054,7 +2053,7 @@ export const Channel = (props: PropsWithChildren<ChannelProps>) => {
   const threadInstance = (threadFromProps as ThreadType)?.threadInstance as Thread;
   const threadMessage = (
     threadInstance ? (threadFromProps as ThreadType).thread : threadFromProps
-  ) as MessageType;
+  ) as LocalMessage;
 
   const thread: ThreadType = {
     thread: threadMessage,

package/src/components/Channel/hooks/useChannelDataState.ts

@@ -1,8 +1,6 @@
 import { useCallback, useState } from 'react';
 
-import { Channel, ChannelState as StreamChannelState } from 'stream-chat';
-
-import { MessageType } from '../../MessageList/hooks/useMessageList';
+import { Channel, LocalMessage, ChannelState as StreamChannelState } from 'stream-chat';
 
 export const channelInitialState = {
   hasMore: true,
@@ -38,7 +36,7 @@ export type ChannelMessagesState = {
  * The ChannelThreadState object
  */
 export type ChannelThreadState = {
-  thread: MessageType | null;
+  thread: LocalMessage | null;
   threadHasMore?: boolean;
   threadLoadingMore?: boolean;
   threadMessages?: StreamChannelState['messages'];

package/src/components/Chat/Chat.tsx

@@ -308,15 +308,6 @@ const ChatWithContext = (props: PropsWithChildren<ChatProps>) => {
  * - connectionRecovering - whether or not websocket is reconnecting
  * - isOnline - whether or not set user is active
  * - setActiveChannel - function to set the currently active channel
- *
- * The Chat Component takes the following generics in order:
- * - At (AttachmentType) - custom Attachment object extension
- * - Ct (ChannelType) - custom Channel object extension
- * - Co (CommandType) - custom Command string union extension
- * - Ev (EventType) - custom Event object extension
- * - Me (MessageType) - custom Message object extension
- * - Re (ReactionType) - custom Reaction object extension
- * - Us (UserType) - custom User object extension
  */
 export const Chat = (props: PropsWithChildren<ChatProps>) => {
   const { style } = useOverlayContext();

package/src/components/ImageGallery/__tests__/ImageGallery.test.tsx

@@ -4,6 +4,8 @@ import type { SharedValue } from 'react-native-reanimated';
 
 import { act, fireEvent, render, screen, waitFor } from '@testing-library/react-native';
 
+import { LocalMessage } from 'stream-chat';
+
 import {
   ImageGalleryContext,
   ImageGalleryContextValue,
@@ -18,7 +20,6 @@ import {
 } from '../../../mock-builders/generator/attachment';
 import { generateMessage } from '../../../mock-builders/generator/message';
 
-import type { MessageType } from '../../MessageList/hooks/useMessageList';
 import { ImageGallery } from '../ImageGallery';
 
 jest.mock('../../../native.ts', () => {
@@ -56,7 +57,7 @@ describe('ImageGallery', () => {
               generateVideoAttachment({ type: 'video' }),
             ],
           }),
-        ] as unknown as MessageType[],
+        ] as unknown as LocalMessage[],
       }),
     );
 
@@ -73,7 +74,7 @@ describe('ImageGallery', () => {
     });
     render(
       getComponent({
-        messages: [message] as unknown as MessageType[],
+        messages: [message] as unknown as LocalMessage[],
       }),
     );
 
@@ -102,7 +103,7 @@ describe('ImageGallery', () => {
           generateMessage({
             attachments: [generateVideoAttachment({ type: 'video' })],
           }),
-        ] as unknown as MessageType[],
+        ] as unknown as LocalMessage[],
       }),
     );
 
@@ -128,7 +129,7 @@ describe('ImageGallery', () => {
 
     render(
       getComponent({
-        messages: [message] as unknown as MessageType[],
+        messages: [message] as unknown as LocalMessage[],
       }),
     );
 
@@ -163,7 +164,7 @@ describe('ImageGallery', () => {
           generateMessage({
             attachments: [generateVideoAttachment({ type: 'video' })],
           }),
-        ] as unknown as MessageType[],
+        ] as unknown as LocalMessage[],
       }),
     );
 
@@ -193,7 +194,7 @@ describe('ImageGallery', () => {
     });
     render(
       getComponent({
-        messages: [message] as unknown as MessageType[],
+        messages: [message] as unknown as LocalMessage[],
       }),
     );
 

package/src/components/ImageGallery/__tests__/ImageGalleryFooter.test.tsx

@@ -7,6 +7,8 @@ import { ReactTestInstance } from 'react-test-renderer';
 
 import { render, screen, userEvent, waitFor } from '@testing-library/react-native';
 
+import { LocalMessage } from 'stream-chat';
+
 import { Chat } from '../../../components/Chat/Chat';
 import {
   ImageGalleryContext,
@@ -20,7 +22,6 @@ import {
 import { generateMessage } from '../../../mock-builders/generator/message';
 import { getTestClientWithUser } from '../../../mock-builders/mock';
 import { NativeHandlers } from '../../../native';
-import type { MessageType } from '../../MessageList/hooks/useMessageList';
 import { ImageGallery, ImageGalleryCustomComponents } from '../ImageGallery';
 
 jest.mock('../../../native.ts', () => {
@@ -76,7 +77,7 @@ describe('ImageGalleryFooter', () => {
                 generateMessage({
                   attachments: [generateVideoAttachment({ type: 'video' })],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >
@@ -131,7 +132,7 @@ describe('ImageGalleryFooter', () => {
                 generateMessage({
                   attachments: [generateVideoAttachment({ type: 'video' })],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >
@@ -174,7 +175,7 @@ describe('ImageGalleryFooter', () => {
                 generateMessage({
                   attachments: [generateImageAttachment()],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >

package/src/components/ImageGallery/__tests__/ImageGalleryHeader.test.tsx

@@ -7,6 +7,8 @@ import { act } from 'react-test-renderer';
 
 import { render, screen, userEvent, waitFor } from '@testing-library/react-native';
 
+import { LocalMessage } from 'stream-chat';
+
 import { Chat } from '../../../components/Chat/Chat';
 import {
   ImageGalleryContext,
@@ -24,7 +26,6 @@ import {
 import { generateMessage } from '../../../mock-builders/generator/message';
 import { getTestClientWithUser } from '../../../mock-builders/mock';
 
-import type { MessageType } from '../../MessageList/hooks/useMessageList';
 import { ImageGallery, ImageGalleryCustomComponents } from '../ImageGallery';
 
 jest.mock('../../../native.ts', () => {
@@ -71,7 +72,7 @@ describe('ImageGalleryHeader', () => {
                 generateMessage({
                   attachments: [generateImageAttachment()],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >
@@ -118,7 +119,7 @@ describe('ImageGalleryHeader', () => {
                 generateMessage({
                   attachments: [generateVideoAttachment({ type: 'video' })],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >
@@ -158,7 +159,7 @@ describe('ImageGalleryHeader', () => {
                 generateMessage({
                   attachments: [generateImageAttachment()],
                 }),
-              ] as unknown as MessageType[],
+              ] as unknown as LocalMessage[],
             } as unknown as ImageGalleryContextValue
           }
         >