stream-chat-react-native-core 4.0.0-beta.3 → 4.0.0-beta.7

package/src/components/Message/MessageSimple/MessageSimple.tsx

@@ -11,16 +11,7 @@ import {
 } from '../../../contexts/messagesContext/MessagesContext';
 import { useTheme } from '../../../contexts/themeContext/ThemeContext';
 
-import type {
-  DefaultAttachmentType,
-  DefaultChannelType,
-  DefaultCommandType,
-  DefaultEventType,
-  DefaultMessageType,
-  DefaultReactionType,
-  DefaultUserType,
-  UnknownType,
-} from '../../../types/types';
+import type { DefaultStreamChatGenerics } from '../../../types/types';
 
 const styles = StyleSheet.create({
   container: {
@@ -30,19 +21,13 @@ const styles = StyleSheet.create({
 });
 
 export type MessageSimplePropsWithContext<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = Pick<
-  MessageContextValue<At, Ch, Co, Ev, Me, Re, Us>,
+  MessageContextValue<StreamChatGenerics>,
   'alignment' | 'channel' | 'groupStyles' | 'hasReactions' | 'message'
 > &
   Pick<
-    MessagesContextValue<At, Ch, Co, Ev, Me, Re, Us>,
+    MessagesContextValue<StreamChatGenerics>,
     | 'enableMessageGroupingByUser'
     | 'MessageAvatar'
     | 'MessageContent'
@@ -51,15 +36,9 @@ export type MessageSimplePropsWithContext<
   >;
 
 const MessageSimpleWithContext = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageSimplePropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageSimplePropsWithContext<StreamChatGenerics>,
 ) => {
   const {
     alignment,
@@ -116,17 +95,9 @@ const MessageSimpleWithContext = <
   );
 };
 
-const areEqual = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
->(
-  prevProps: MessageSimplePropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
-  nextProps: MessageSimplePropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(
+  prevProps: MessageSimplePropsWithContext<StreamChatGenerics>,
+  nextProps: MessageSimplePropsWithContext<StreamChatGenerics>,
 ) => {
   const {
     channel: prevChannel,
@@ -205,42 +176,30 @@ const MemoizedMessageSimple = React.memo(
 ) as typeof MessageSimpleWithContext;
 
 export type MessageSimpleProps<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
-> = Partial<MessageSimplePropsWithContext<At, Ch, Co, Ev, Me, Re, Us>>;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = Partial<MessageSimplePropsWithContext<StreamChatGenerics>>;
 
 /**
  *
  * Message UI component
  */
 export const MessageSimple = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageSimpleProps<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageSimpleProps<StreamChatGenerics>,
 ) => {
   const { alignment, channel, groupStyles, hasReactions, message } =
-    useMessageContext<At, Ch, Co, Ev, Me, Re, Us>();
+    useMessageContext<StreamChatGenerics>();
   const {
     enableMessageGroupingByUser,
     MessageAvatar,
     MessageContent,
     MessagePinnedHeader,
     ReactionList,
-  } = useMessagesContext<At, Ch, Co, Ev, Me, Re, Us>();
+  } = useMessagesContext<StreamChatGenerics>();
 
   return (
-    <MemoizedMessageSimple<At, Ch, Co, Ev, Me, Re, Us>
+    <MemoizedMessageSimple<StreamChatGenerics>
       {...{
         alignment,
         channel,

package/src/components/Message/MessageSimple/MessageStatus.tsx

@@ -9,16 +9,7 @@ import { useTheme } from '../../../contexts/themeContext/ThemeContext';
 import { Check } from '../../../icons/Check';
 import { CheckAll } from '../../../icons/CheckAll';
 import { Time } from '../../../icons/Time';
-import type {
-  DefaultAttachmentType,
-  DefaultChannelType,
-  DefaultCommandType,
-  DefaultEventType,
-  DefaultMessageType,
-  DefaultReactionType,
-  DefaultUserType,
-  UnknownType,
-} from '../../../types/types';
+import type { DefaultStreamChatGenerics } from '../../../types/types';
 import { MessageStatusTypes } from '../../../utils/utils';
 
 import { isMessageWithStylesReadByAndDateSeparator } from '../../MessageList/hooks/useMessageList';
@@ -38,25 +29,13 @@ const styles = StyleSheet.create({
 });
 
 export type MessageStatusPropsWithContext<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends DefaultUserType = DefaultUserType,
-> = Pick<MessageContextValue<At, Ch, Co, Ev, Me, Re, Us>, 'message' | 'threadList'>;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = Pick<MessageContextValue<StreamChatGenerics>, 'message' | 'threadList'>;
 
 const MessageStatusWithContext = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends DefaultUserType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageStatusPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageStatusPropsWithContext<StreamChatGenerics>,
 ) => {
   const { message, threadList } = props;
 
@@ -112,17 +91,9 @@ const MessageStatusWithContext = <
   return null;
 };
 
-const areEqual = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
->(
-  prevProps: MessageStatusPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
-  nextProps: MessageStatusPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(
+  prevProps: MessageStatusPropsWithContext<StreamChatGenerics>,
+  nextProps: MessageStatusPropsWithContext<StreamChatGenerics>,
 ) => {
   const { message: prevMessage, threadList: prevThreadList } = prevProps;
   const { message: nextMessage, threadList: nextThreadList } = nextProps;
@@ -146,27 +117,15 @@ const MemoizedMessageStatus = React.memo(
 ) as typeof MessageStatusWithContext;
 
 export type MessageStatusProps<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends DefaultUserType = DefaultUserType,
-> = Partial<MessageStatusPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>>;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = Partial<MessageStatusPropsWithContext<StreamChatGenerics>>;
 
 export const MessageStatus = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends DefaultUserType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageStatusProps<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageStatusProps<StreamChatGenerics>,
 ) => {
-  const { message, threadList } = useMessageContext<At, Ch, Co, Ev, Me, Re, Us>();
+  const { message, threadList } = useMessageContext<StreamChatGenerics>();
 
   return <MemoizedMessageStatus {...{ message, threadList }} {...props} />;
 };

package/src/components/Message/MessageSimple/MessageTextContainer.tsx

@@ -14,47 +14,26 @@ import {
 import { useTheme } from '../../../contexts/themeContext/ThemeContext';
 
 import type { MarkdownStyle, Theme } from '../../../contexts/themeContext/utils/theme';
-import type {
-  DefaultAttachmentType,
-  DefaultChannelType,
-  DefaultCommandType,
-  DefaultEventType,
-  DefaultMessageType,
-  DefaultReactionType,
-  DefaultUserType,
-  UnknownType,
-} from '../../../types/types';
+import type { DefaultStreamChatGenerics } from '../../../types/types';
 
 const styles = StyleSheet.create({
   textContainer: { maxWidth: 250, paddingHorizontal: 16 },
 });
 
 export type MessageTextProps<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
-> = MessageTextContainerProps<At, Ch, Co, Ev, Me, Re, Us> & {
-  renderText: (params: RenderTextParams<At, Ch, Co, Ev, Me, Re, Us>) => JSX.Element | null;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = MessageTextContainerProps<StreamChatGenerics> & {
+  renderText: (params: RenderTextParams<StreamChatGenerics>) => JSX.Element | null;
   theme: { theme: Theme };
 };
 
 export type MessageTextContainerPropsWithContext<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = Pick<
-  MessageContextValue<At, Ch, Co, Ev, Me, Re, Us>,
+  MessageContextValue<StreamChatGenerics>,
   'message' | 'onLongPress' | 'onlyEmojis' | 'onPress' | 'preventPress'
 > &
-  Pick<MessagesContextValue<At, Ch, Co, Ev, Me, Re, Us>, 'markdownRules' | 'MessageText'> & {
+  Pick<MessagesContextValue<StreamChatGenerics>, 'markdownRules' | 'MessageText'> & {
     markdownStyles?: MarkdownStyle;
     messageOverlay?: boolean;
     messageTextNumberOfLines?: number;
@@ -64,15 +43,9 @@ export type MessageTextContainerPropsWithContext<
   };
 
 const MessageTextContainerWithContext = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageTextContainerPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageTextContainerPropsWithContext<StreamChatGenerics>,
 ) => {
   const theme = useTheme();
 
@@ -114,7 +87,7 @@ const MessageTextContainerWithContext = <
       {MessageText ? (
         <MessageText {...props} renderText={renderText} theme={theme} />
       ) : (
-        renderText<At, Ch, Co, Ev, Me, Re, Us>({
+        renderText<StreamChatGenerics>({
           colors,
           markdownRules,
           markdownStyles: {
@@ -134,17 +107,9 @@ const MessageTextContainerWithContext = <
   );
 };
 
-const areEqual = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
->(
-  prevProps: MessageTextContainerPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
-  nextProps: MessageTextContainerPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(
+  prevProps: MessageTextContainerPropsWithContext<StreamChatGenerics>,
+  nextProps: MessageTextContainerPropsWithContext<StreamChatGenerics>,
 ) => {
   const { message: prevMessage, onlyEmojis: prevOnlyEmojis } = prevProps;
   const { message: nextMessage, onlyEmojis: nextOnlyEmojis } = nextProps;
@@ -172,29 +137,17 @@ const MemoizedMessageTextContainer = React.memo(
 ) as typeof MessageTextContainerWithContext;
 
 export type MessageTextContainerProps<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
-> = Partial<MessageTextContainerPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>>;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = Partial<MessageTextContainerPropsWithContext<StreamChatGenerics>>;
 
 export const MessageTextContainer = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: MessageTextContainerProps<At, Ch, Co, Ev, Me, Re, Us>,
+  props: MessageTextContainerProps<StreamChatGenerics>,
 ) => {
   const { message, onLongPress, onlyEmojis, onPress, preventPress } =
-    useMessageContext<At, Ch, Co, Ev, Me, Re, Us>();
-  const { markdownRules, MessageText } = useMessagesContext<At, Ch, Co, Ev, Me, Re, Us>();
+    useMessageContext<StreamChatGenerics>();
+  const { markdownRules, MessageText } = useMessagesContext<StreamChatGenerics>();
   const { messageTextNumberOfLines } = props;
 
   return (

package/src/components/Message/MessageSimple/ReactionList.tsx

@@ -17,16 +17,7 @@ import { useTheme } from '../../../contexts/themeContext/ThemeContext';
 import { Unknown } from '../../../icons/Unknown';
 
 import type { IconProps } from '../../../icons/utils/base';
-import type {
-  DefaultAttachmentType,
-  DefaultChannelType,
-  DefaultCommandType,
-  DefaultEventType,
-  DefaultMessageType,
-  DefaultReactionType,
-  DefaultUserType,
-  UnknownType,
-} from '../../../types/types';
+import type { DefaultStreamChatGenerics } from '../../../types/types';
 import type { ReactionData } from '../../../utils/utils';
 
 const styles = StyleSheet.create({
@@ -69,15 +60,9 @@ const Icon: React.FC<
 };
 
 export type ReactionListPropsWithContext<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = Pick<
-  MessageContextValue<At, Ch, Co, Ev, Me, Re, Us>,
+  MessageContextValue<StreamChatGenerics>,
   | 'alignment'
   | 'message'
   | 'onLongPress'
@@ -87,7 +72,7 @@ export type ReactionListPropsWithContext<
   | 'reactions'
   | 'showMessageOverlay'
 > &
-  Pick<MessagesContextValue<At, Ch, Co, Ev, Me, Re, Us>, 'targetedMessage'> & {
+  Pick<MessagesContextValue<StreamChatGenerics>, 'targetedMessage'> & {
     messageContentWidth: number;
     supportedReactions: ReactionData[];
     fill?: string;
@@ -98,15 +83,9 @@ export type ReactionListPropsWithContext<
   };
 
 const ReactionListWithContext = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: ReactionListPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+  props: ReactionListPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
     alignment,
@@ -198,34 +177,7 @@ const ReactionListWithContext = <
       : x2 - (reactionSize * reactions.length) / 2 - strokeSize;
 
   return (
-    <TouchableOpacity
-      disabled={preventPress}
-      onLongPress={(event) => {
-        if (onLongPress) {
-          onLongPress({
-            emitter: 'reactionList',
-            event,
-          });
-        }
-      }}
-      onPress={(event) => {
-        if (onPress) {
-          onPress({
-            defaultHandler: () => showMessageOverlay(true),
-            emitter: 'reactionList',
-            event,
-          });
-        }
-      }}
-      onPressIn={(event) => {
-        if (onPressIn) {
-          onPressIn({
-            defaultHandler: () => showMessageOverlay(true),
-            emitter: 'reactionList',
-            event,
-          });
-        }
-      }}
+    <View
       style={[
         styles.container,
         {
@@ -266,7 +218,34 @@ const ReactionListWithContext = <
               <Circle cx={x2} cy={y2} fill={alignmentLeft ? fill : white} r={radius * 2} />
             </Svg>
           </View>
-          <View
+          <TouchableOpacity
+            disabled={preventPress}
+            onLongPress={(event) => {
+              if (onLongPress) {
+                onLongPress({
+                  emitter: 'reactionList',
+                  event,
+                });
+              }
+            }}
+            onPress={(event) => {
+              if (onPress) {
+                onPress({
+                  defaultHandler: () => showMessageOverlay(true),
+                  emitter: 'reactionList',
+                  event,
+                });
+              }
+            }}
+            onPressIn={(event) => {
+              if (onPressIn) {
+                onPressIn({
+                  defaultHandler: () => showMessageOverlay(true),
+                  emitter: 'reactionList',
+                  event,
+                });
+              }
+            }}
             style={[
               styles.reactionBubble,
               {
@@ -290,24 +269,16 @@ const ReactionListWithContext = <
                 type={reaction.type}
               />
             ))}
-          </View>
+          </TouchableOpacity>
         </View>
       ) : null}
-    </TouchableOpacity>
+    </View>
   );
 };
 
-const areEqual = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
->(
-  prevProps: ReactionListPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
-  nextProps: ReactionListPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>,
+const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(
+  prevProps: ReactionListPropsWithContext<StreamChatGenerics>,
+  nextProps: ReactionListPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
     message: prevMessage,
@@ -351,29 +322,17 @@ const MemoizedReactionList = React.memo(
 ) as typeof ReactionListWithContext;
 
 export type ReactionListProps<
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
-> = Partial<Omit<ReactionListPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>, 'messageContentWidth'>> &
-  Pick<ReactionListPropsWithContext<At, Ch, Co, Ev, Me, Re, Us>, 'messageContentWidth'>;
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+> = Partial<Omit<ReactionListPropsWithContext<StreamChatGenerics>, 'messageContentWidth'>> &
+  Pick<ReactionListPropsWithContext<StreamChatGenerics>, 'messageContentWidth'>;
 
 /**
  * ReactionList - A high level component which implements all the logic required for a message reaction list
  */
 export const ReactionList = <
-  At extends UnknownType = DefaultAttachmentType,
-  Ch extends UnknownType = DefaultChannelType,
-  Co extends string = DefaultCommandType,
-  Ev extends UnknownType = DefaultEventType,
-  Me extends UnknownType = DefaultMessageType,
-  Re extends UnknownType = DefaultReactionType,
-  Us extends UnknownType = DefaultUserType,
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
-  props: ReactionListProps<At, Ch, Co, Ev, Me, Re, Us>,
+  props: ReactionListProps<StreamChatGenerics>,
 ) => {
   const {
     alignment,
@@ -384,8 +343,8 @@ export const ReactionList = <
     preventPress,
     reactions,
     showMessageOverlay,
-  } = useMessageContext<At, Ch, Co, Ev, Me, Re, Us>();
-  const { supportedReactions, targetedMessage } = useMessagesContext<At, Ch, Co, Ev, Me, Re, Us>();
+  } = useMessageContext<StreamChatGenerics>();
+  const { supportedReactions, targetedMessage } = useMessagesContext<StreamChatGenerics>();
 
   return (
     <MemoizedReactionList

package/src/components/Message/MessageSimple/utils/renderText.test.tsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import { Text } from 'react-native';
+
+import { render, waitFor } from '@testing-library/react-native';
+
+// @ts-ignore
+import { ASTNode, SingleASTNode } from 'simple-markdown';
+
+import { ListOutput, ListOutputProps } from './renderText';
+
+describe('list', () => {
+  const createNode = ({
+    amount,
+    ordered = false,
+    start = 1,
+  }: {
+    amount: number;
+    ordered?: boolean;
+    start?: number;
+  }): SingleASTNode => ({
+    items: Array.from(Array(amount).keys()),
+    ordered,
+    start,
+    type: 'text',
+  });
+
+  const mockOutput = (node: ASTNode) => <Text>{node}</Text>;
+  const MockText = ({ node, output, state }: ListOutputProps) => (
+    <>
+      <ListOutput node={node} output={output} state={state} styles={{}} />
+    </>
+  );
+
+  it('renders numbered items', async () => {
+    const node = createNode({ amount: 3, ordered: true, start: 1 });
+    const { getByText } = render(<MockText node={node} output={mockOutput} state={{}} />);
+
+    await waitFor(() => expect(getByText('1. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('2. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('3. ')).toBeTruthy());
+  });
+
+  it('renders numbered items from a start index', async () => {
+    const node = createNode({ amount: 3, ordered: true, start: 3 });
+    const { getByText } = render(<MockText node={node} output={mockOutput} state={{}} />);
+
+    await waitFor(() => expect(getByText('3. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('4. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('5. ')).toBeTruthy());
+  });
+
+  it('does not throw an error if an item is empty', async () => {
+    const node = {
+      ...createNode({ amount: 3, ordered: true }),
+      items: ['Not empty', null, 'Not empty'],
+    };
+    const { getByText } = render(<MockText node={node} output={mockOutput} state={{}} />);
+
+    await waitFor(() => expect(getByText('1. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('2. ')).toBeTruthy());
+    await waitFor(() => expect(getByText('3. ')).toBeTruthy());
+  });
+
+  it('renders an unordered list', async () => {
+    const node = createNode({ amount: 3 });
+    const { getAllByText } = render(<MockText node={node} output={mockOutput} state={{}} />);
+
+    await waitFor(() => expect(getAllByText('\u2022 ')).toHaveLength(3));
+  });
+});