refactor: make MessageReadStatus an enum and update docs

Author: madsroskar

package/src/components/ChannelPreview/ChannelPreviewMessenger.tsx

@@ -73,10 +73,16 @@ export type ChannelPreviewMessengerPropsWithContext<
      *    bold: true,
      *    text: 'This is the message preview text'
      *  },
-     *  status: 0 | 1 | 2 // read states of latest message.
+     *  status: 0 | 1 | 2 // read states of the latest message.
      * }
      * ```
      *
+     * The read status is either of the following:
+     *
+     * 0: The message was not sent by the current user
+     * 1: The message was sent by the current user and is unread
+     * 2: The message was sent by the current user and is read
+     *
      * @overrideType object
      */
     latestMessagePreview: LatestMessagePreview<StreamChatGenerics>;

package/src/components/ChannelPreview/ChannelPreviewStatus.tsx

@@ -2,8 +2,8 @@ import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 
 import type { ChannelPreviewProps } from './ChannelPreview';
-
 import type { ChannelPreviewMessengerPropsWithContext } from './ChannelPreviewMessenger';
+import { MessageReadStatus } from './hooks/useLatestMessagePreview';
 
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
 import { Check, CheckAll } from '../../icons';
@@ -48,9 +48,9 @@ export const ChannelPreviewStatus = <
 
   return (
     <View style={styles.flexRow}>
-      {status === 2 ? (
+      {status === MessageReadStatus.READ ? (
         <CheckAll pathFill={accent_blue} {...checkAllIcon} />
-      ) : status === 1 ? (
+      ) : status === MessageReadStatus.UNREAD ? (
         <Check pathFill={grey} {...checkIcon} />
       ) : null}
       <Text style={[styles.date, { color: grey }, date]}>

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

@@ -115,22 +115,24 @@ const getLatestMessageDisplayDate = <
   return parserOutput;
 };
 
-/**
- * set up enum
- * 0 = latest message is not current user's message
- * 1 = nobody has read latest message which is the current user's message
- * 2 = someone has read latest message which is the current user's message
- */
+export enum MessageReadStatus {
+  NOT_SENT_BY_CURRENT_USER = 0,
+  UNREAD = 1,
+  READ = 2,
+}
+
 const getLatestMessageReadStatus = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
   channel: Channel<StreamChatGenerics>,
   client: StreamChat<StreamChatGenerics>,
   message: LatestMessage<StreamChatGenerics> | undefined,
   readEvents: boolean,
-) => {
+): MessageReadStatus => {
   const currentUserId = client.userID;
-  if (!message || currentUserId !== message.user?.id || readEvents === false) return 0;
+  if (!message || currentUserId !== message.user?.id || readEvents === false) {
+    return MessageReadStatus.NOT_SENT_BY_CURRENT_USER;
+  }
 
   const readList = channel.state.read;
   if (currentUserId) {
@@ -146,8 +148,8 @@ const getLatestMessageReadStatus = <
   return Object.values(readList).some(
     ({ last_read }) => messageUpdatedAt && messageUpdatedAt < last_read,
   )
-    ? 2
-    : 1;
+    ? MessageReadStatus.READ
+    : MessageReadStatus.UNREAD;
 };
 
 const getLatestMessagePreview = <
@@ -176,7 +178,7 @@ const getLatestMessagePreview = <
           text: t('Nothing yet...'),
         },
       ],
-      status: 0,
+      status: MessageReadStatus.NOT_SENT_BY_CURRENT_USER,
     };
   }
   const message = lastMessage || messages.length ? messages[messages.length - 1] : undefined;
@@ -229,7 +231,7 @@ export const useLatestMessagePreview = <
         text: '',
       },
     ],
-    status: 0,
+    status: MessageReadStatus.NOT_SENT_BY_CURRENT_USER,
   });
 
   const readStatus = getLatestMessageReadStatus(