@sendbird/uikit-react-native 3.2.0 → 3.4.0

package/src/components/FileViewer/FileViewerFooter.tsx

@@ -0,0 +1,73 @@
+import React from 'react';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+
+import {
+  Box,
+  Icon,
+  PressBox,
+  createStyleSheet,
+  useHeaderStyle,
+  useUIKitTheme,
+} from '@sendbird/uikit-react-native-foundation';
+
+type Props = {
+  bottomInset: number;
+  deleteShown: boolean;
+  onPressDelete: () => void;
+  onPressDownload: () => void;
+};
+
+const FileViewerFooter = ({ bottomInset, deleteShown, onPressDelete, onPressDownload }: Props) => {
+  const { palette } = useUIKitTheme();
+  const { defaultHeight } = useHeaderStyle();
+  const { left, right } = useSafeAreaInsets();
+
+  return (
+    <Box
+      style={[
+        styles.container,
+        {
+          paddingLeft: styles.container.paddingHorizontal + left,
+          paddingRight: styles.container.paddingHorizontal + right,
+          paddingBottom: bottomInset,
+          height: defaultHeight + bottomInset,
+          backgroundColor: palette.overlay01,
+        },
+      ]}
+    >
+      <PressBox activeOpacity={0.75} onPress={onPressDownload} style={styles.buttonContainer}>
+        <Icon icon={'download'} size={24} color={palette.onBackgroundDark01} />
+      </PressBox>
+      <Box style={styles.titleContainer} />
+      <PressBox activeOpacity={0.75} onPress={onPressDelete} style={styles.buttonContainer} disabled={!deleteShown}>
+        {deleteShown && <Icon icon={'delete'} size={24} color={palette.onBackgroundDark01} />}
+      </PressBox>
+    </Box>
+  );
+};
+
+const styles = createStyleSheet({
+  container: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: 12,
+  },
+  buttonContainer: {
+    width: 32,
+    height: 32,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  titleContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});
+
+export default FileViewerFooter;

package/src/components/FileViewer/FileViewerHeader.tsx

@@ -0,0 +1,86 @@
+import React from 'react';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+
+import {
+  Box,
+  Icon,
+  PressBox,
+  Text,
+  createStyleSheet,
+  useHeaderStyle,
+  useUIKitTheme,
+} from '@sendbird/uikit-react-native-foundation';
+import { truncate } from '@sendbird/uikit-utils';
+
+type Props = {
+  headerShown?: boolean;
+  topInset: number;
+  onClose: () => void;
+  title: string;
+  subtitle: string;
+};
+
+const FileViewerHeader = ({ headerShown = true, topInset, onClose, subtitle, title }: Props) => {
+  const { palette } = useUIKitTheme();
+  const { defaultHeight } = useHeaderStyle();
+  const { left, right } = useSafeAreaInsets();
+
+  if (!headerShown) return null;
+
+  return (
+    <Box
+      style={[
+        styles.container,
+        {
+          paddingLeft: styles.container.paddingHorizontal + left,
+          paddingRight: styles.container.paddingHorizontal + right,
+          paddingTop: topInset,
+          height: defaultHeight + topInset,
+          backgroundColor: palette.overlay01,
+        },
+      ]}
+    >
+      <PressBox activeOpacity={0.75} onPress={onClose} style={styles.buttonContainer}>
+        <Icon icon={'close'} size={24} color={palette.onBackgroundDark01} />
+      </PressBox>
+      <Box style={styles.titleContainer}>
+        <Text h2 color={palette.onBackgroundDark01} style={styles.title} numberOfLines={1}>
+          {truncate(title, { mode: 'mid', maxLen: 18 })}
+        </Text>
+        <Text caption2 color={palette.onBackgroundDark01} numberOfLines={1}>
+          {subtitle}
+        </Text>
+      </Box>
+      <Box style={styles.buttonContainer} />
+    </Box>
+  );
+};
+
+const styles = createStyleSheet({
+  container: {
+    top: 0,
+    left: 0,
+    right: 0,
+    position: 'absolute',
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: 12,
+  },
+  buttonContainer: {
+    width: 32,
+    height: 32,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  titleContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  title: {
+    marginBottom: 2,
+  },
+});
+
+export default FileViewerHeader;

package/src/components/FileViewer/index.tsx

@@ -0,0 +1,139 @@
+import React, { useEffect } from 'react';
+import { StatusBar } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+
+import { Box, useAlert, useHeaderStyle, useToast, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
+import type { SendbirdFileMessage } from '@sendbird/uikit-utils';
+import { Logger, getFileExtension, getFileType, isMyMessage, toMegabyte } from '@sendbird/uikit-utils';
+
+import { useLocalization, usePlatformService, useSendbirdChat } from '../../hooks/useContext';
+import FileViewerContent from './FileViewerContent';
+import FileViewerFooter from './FileViewerFooter';
+import FileViewerHeader from './FileViewerHeader';
+
+type Props = {
+  fileMessage: SendbirdFileMessage;
+  deleteMessage: () => Promise<void>;
+
+  onClose: () => void;
+  onPressDownload?: (message: SendbirdFileMessage) => void;
+  onPressDelete?: (message: SendbirdFileMessage) => void;
+
+  headerShown?: boolean;
+  headerTopInset?: number;
+
+  /** This prop is only available on the Image viewer */
+  minZoom?: number;
+  /** This prop is only available on the Image viewer */
+  maxZoom?: number;
+};
+
+const FileViewer = ({
+  headerShown = true,
+  maxZoom = 3,
+  minZoom = 1,
+  headerTopInset,
+  fileMessage,
+  onClose,
+  onPressDownload,
+  onPressDelete,
+  deleteMessage,
+}: Props) => {
+  const { topInset, statusBarTranslucent } = useHeaderStyle();
+  const { bottom } = useSafeAreaInsets();
+  const { palette } = useUIKitTheme();
+  const { alert } = useAlert();
+  const { show } = useToast();
+
+  const { fileService } = usePlatformService();
+  const { currentUser } = useSendbirdChat();
+  const { STRINGS } = useLocalization();
+
+  const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.url));
+  const canDelete = isMyMessage(fileMessage, currentUser?.userId);
+  const basicTopInset = statusBarTranslucent ? topInset : 0;
+
+  const onPressDeleteButton = () => {
+    if (!canDelete) return;
+
+    if (onPressDelete) {
+      onPressDelete(fileMessage);
+    } else {
+      alert({
+        title: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE,
+        buttons: [
+          {
+            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL,
+          },
+          {
+            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_OK,
+            style: 'destructive',
+            onPress: () => {
+              deleteMessage()
+                .then(() => {
+                  onClose();
+                })
+                .catch(() => {
+                  show(STRINGS.TOAST.DELETE_MSG_ERROR, 'error');
+                });
+            },
+          },
+        ],
+      });
+    }
+  };
+
+  const onPressDownloadButton = () => {
+    if (onPressDownload) {
+      onPressDownload(fileMessage);
+    } else {
+      if (toMegabyte(fileMessage.size) > 4) {
+        show(STRINGS.TOAST.DOWNLOAD_START, 'success');
+      }
+
+      fileService
+        .save({ fileUrl: fileMessage.url, fileName: fileMessage.name, fileType: fileMessage.type })
+        .then((response) => {
+          show(STRINGS.TOAST.DOWNLOAD_OK, 'success');
+          Logger.log('File saved to', response);
+        })
+        .catch((err) => {
+          show(STRINGS.TOAST.DOWNLOAD_ERROR, 'error');
+          Logger.log('File save failure', err);
+        });
+    }
+  };
+
+  useEffect(() => {
+    if (fileType === 'file') onClose();
+  }, []);
+
+  return (
+    <Box flex={1} backgroundColor={palette.background700}>
+      <StatusBar barStyle={'light-content'} animated />
+      <FileViewerHeader
+        topInset={headerTopInset ?? basicTopInset}
+        headerShown={headerShown}
+        title={STRINGS.FILE_VIEWER.TITLE(fileMessage)}
+        subtitle={STRINGS.FILE_VIEWER.SUBTITLE(fileMessage)}
+        onClose={onClose}
+      />
+      <FileViewerContent
+        topInset={headerTopInset ?? basicTopInset}
+        bottomInset={bottom}
+        type={fileType}
+        src={fileMessage.url}
+        maxZoom={maxZoom}
+        minZoom={minZoom}
+      />
+      <FileViewerFooter
+        bottomInset={bottom}
+        deleteShown={canDelete}
+        onPressDelete={onPressDeleteButton}
+        onPressDownload={onPressDownloadButton}
+      />
+    </Box>
+  );
+};
+
+export default FileViewer;

package/src/components/GroupChannelMessageRenderer/index.tsx

@@ -1,7 +1,13 @@
-import React, { useRef } from 'react';
+import React, { useContext, useEffect, useRef } from 'react';
 
 import type { GroupChannelMessageProps, RegexTextPattern } from '@sendbird/uikit-react-native-foundation';
-import { Box, GroupChannelMessage, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
+import {
+  Box,
+  GroupChannelMessage,
+  Text,
+  TypingIndicatorBubble,
+  useUIKitTheme,
+} from '@sendbird/uikit-react-native-foundation';
 import {
   SendbirdAdminMessage,
   SendbirdFileMessage,
@@ -17,9 +23,11 @@ import {
 } from '@sendbird/uikit-utils';
 
 import { VOICE_MESSAGE_META_ARRAY_DURATION_KEY } from '../../constants';
+import { GroupChannelContexts } from '../../domain/groupChannel/module/moduleContext';
 import type { GroupChannelProps } from '../../domain/groupChannel/types';
 import { useLocalization, usePlatformService, useSendbirdChat } from '../../hooks/useContext';
 import SBUUtils from '../../libs/SBUUtils';
+import { TypingIndicatorType } from '../../types';
 import { ReactionAddons } from '../ReactionAddons';
 import GroupChannelMessageDateSeparator from './GroupChannelMessageDateSeparator';
 import GroupChannelMessageFocusAnimation from './GroupChannelMessageFocusAnimation';
@@ -292,4 +300,28 @@ const GroupChannelMessageRenderer: GroupChannelProps['Fragment']['renderMessage'
   );
 };
 
+export const GroupChannelTypingIndicatorBubble = () => {
+  const { sbOptions } = useSendbirdChat();
+  const { publish } = useContext(GroupChannelContexts.PubSub);
+  const { typingUsers } = useContext(GroupChannelContexts.TypingIndicator);
+
+  const shouldRenderBubble = useIIFE(() => {
+    if (typingUsers.length === 0) return false;
+    if (!sbOptions.uikit.groupChannel.channel.enableTypingIndicator) return false;
+    if (!sbOptions.uikit.groupChannel.channel.typingIndicatorTypes.has(TypingIndicatorType.Bubble)) return false;
+    return true;
+  });
+
+  useEffect(() => {
+    if (shouldRenderBubble) publish({ type: 'TYPING_BUBBLE_RENDERED' });
+  }, [shouldRenderBubble]);
+
+  if (!shouldRenderBubble) return null;
+  return (
+    <Box paddingHorizontal={16} marginTop={4} marginBottom={16}>
+      <TypingIndicatorBubble typingUsers={typingUsers} />
+    </Box>
+  );
+};
+
 export default React.memo(GroupChannelMessageRenderer);

package/src/components/ReactionAddons/BottomSheetReactionAddon.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Pressable, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
+import type { BaseMessage } from '@sendbird/chat/message';
 import { useChannelHandler } from '@sendbird/uikit-chat-hooks';
 import { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { SendbirdBaseChannel, SendbirdBaseMessage, useUniqHandlerId } from '@sendbird/uikit-utils';
@@ -24,12 +25,12 @@ const BottomSheetReactionAddon = ({ onClose, message, channel }: Props) => {
   useChannelHandler(sdk, handlerId, {
     async onReactionUpdated(eventChannel, event) {
       if (channel?.url === eventChannel.url && event.messageId === message?.messageId) {
-        const msg = await sdk.message.getMessage({
+        const msg = (await sdk.message.getMessage({
           includeReactions: true,
           messageId: message.messageId,
           channelUrl: message.channelUrl,
           channelType: message.channelType,
-        });
+        })) as null | BaseMessage;
         if (msg) updateReactionFocusedItem({ message: msg });
       }
     },

package/src/domain/groupChannel/component/GroupChannelHeader.tsx

@@ -4,7 +4,8 @@ import { View } from 'react-native';
 import { Header, Icon, createStyleSheet, useHeaderStyle } from '@sendbird/uikit-react-native-foundation';
 
 import ChannelCover from '../../../components/ChannelCover';
-import { useLocalization } from '../../../hooks/useContext';
+import { useLocalization, useSendbirdChat } from '../../../hooks/useContext';
+import { TypingIndicatorType } from '../../../types';
 import { GroupChannelContexts } from '../module/moduleContext';
 import type { GroupChannelProps } from '../types';
 
@@ -13,11 +14,21 @@ const GroupChannelHeader = ({
   onPressHeaderLeft,
   onPressHeaderRight,
 }: GroupChannelProps['Header']) => {
+  const { sbOptions } = useSendbirdChat();
   const { headerTitle, channel } = useContext(GroupChannelContexts.Fragment);
   const { typingUsers } = useContext(GroupChannelContexts.TypingIndicator);
   const { STRINGS } = useLocalization();
   const { HeaderComponent } = useHeaderStyle();
-  const subtitle = STRINGS.LABELS.TYPING_INDICATOR_TYPINGS(typingUsers);
+
+  const renderSubtitle = () => {
+    const subtitle = STRINGS.LABELS.TYPING_INDICATOR_TYPINGS(typingUsers);
+
+    if (!subtitle) return null;
+    if (!sbOptions.uikit.groupChannel.channel.enableTypingIndicator) return null;
+    if (!sbOptions.uikit.groupChannel.channel.typingIndicatorTypes.has(TypingIndicatorType.Text)) return null;
+
+    return <Header.Subtitle style={styles.subtitle}>{subtitle}</Header.Subtitle>;
+  };
 
   const isHidden = shouldHideRight();
 
@@ -29,7 +40,7 @@ const GroupChannelHeader = ({
           <ChannelCover channel={channel} size={34} containerStyle={styles.avatarGroup} />
           <View style={{ flexShrink: 1 }}>
             <Header.Title h2>{headerTitle}</Header.Title>
-            {Boolean(subtitle) && subtitle && <Header.Subtitle style={styles.subtitle}>{subtitle}</Header.Subtitle>}
+            {renderSubtitle()}
           </View>
         </View>
       }

package/src/domain/groupChannel/component/GroupChannelMessageList.tsx

@@ -34,7 +34,9 @@ const GroupChannelMessageList = (props: GroupChannelProps['MessageList']) => {
         lazyScrollToIndex({ index: foundMessageIndex, animated: true, timeout });
       } else {
         if (props.channel.messageOffsetTimestamp <= createdAt) {
-          if (focusAnimated) props.onUpdateSearchItem({ startingPoint: createdAt });
+          if (focusAnimated) {
+            props.onUpdateSearchItem({ startingPoint: createdAt });
+          }
           props.onResetMessageListWithStartingPoint(createdAt);
         } else {
           return false;
@@ -44,15 +46,14 @@ const GroupChannelMessageList = (props: GroupChannelProps['MessageList']) => {
     },
   );
 
-  const scrollToBottom = useFreshCallback((animated = false) => {
+  const scrollToBottom = useFreshCallback(async (animated = false) => {
     if (props.hasNext()) {
       props.onUpdateSearchItem(undefined);
       props.onScrolledAwayFromBottom(false);
 
-      props.onResetMessageList(() => {
-        props.onScrolledAwayFromBottom(false);
-        lazyScrollToBottom({ animated });
-      });
+      await props.onResetMessageList();
+      props.onScrolledAwayFromBottom(false);
+      lazyScrollToBottom({ animated });
     } else {
       lazyScrollToBottom({ animated });
     }
@@ -73,6 +74,7 @@ const GroupChannelMessageList = (props: GroupChannelProps['MessageList']) => {
   useEffect(() => {
     return subscribe(({ type }) => {
       switch (type) {
+        case 'TYPING_BUBBLE_RENDERED':
         case 'MESSAGES_RECEIVED': {
           if (!props.scrolledAwayFromBottom) {
             scrollToBottom(true);

package/src/domain/groupChannel/types.ts

@@ -73,8 +73,8 @@ export interface GroupChannelProps {
     | 'hasNext'
     | 'searchItem'
   > & {
-    onResetMessageList: (callback?: () => void) => void;
-    onResetMessageListWithStartingPoint: (startingPoint: number, callback?: () => void) => void;
+    onResetMessageList: () => Promise<void>;
+    onResetMessageListWithStartingPoint: (startingPoint: number) => Promise<void>;
 
     // Changing the search item will trigger the focus animation on messages.
     onUpdateSearchItem: (searchItem?: GroupChannelProps['MessageList']['searchItem']) => void;
@@ -183,4 +183,8 @@ export type GroupChannelPubSubContextPayload =
       data: {
         messages: SendbirdMessage[];
       };
+    }
+  | {
+      type: 'TYPING_BUBBLE_RENDERED';
+      data?: undefined;
     };

package/src/domain/messageSearch/component/MessageSearchHeader.tsx

@@ -91,7 +91,10 @@ const styles = createStyleSheet({
     flex: 1,
     height: '100%',
     fontSize: 14,
-    padding: 0,
+    paddingLeft: 0,
+    paddingTop: 0,
+    paddingBottom: 0,
+    paddingRight: 0,
   },
 });
 

package/src/domain/openChannelCreate/component/OpenChannelCreateProfileInput.tsx

@@ -142,8 +142,10 @@ const styles = createStyleSheet({
   },
   input: {
     flex: 1,
-    paddingVertical: 0,
-    paddingHorizontal: 0,
+    paddingLeft: 0,
+    paddingRight: 0,
+    paddingTop: 0,
+    paddingBottom: 0,
   },
   removeButtonContainer: {
     alignItems: 'flex-end',

package/src/fragments/createGroupChannelFragment.tsx

@@ -1,20 +1,24 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 
 import { ReplyType } from '@sendbird/chat/message';
-import { useGroupChannelMessages } from '@sendbird/uikit-chat-hooks';
+import { Box } from '@sendbird/uikit-react-native-foundation';
+import { useGroupChannelMessages } from '@sendbird/uikit-tools';
 import {
   NOOP,
   PASS,
   SendbirdFileMessage,
   SendbirdGroupChannel,
   SendbirdUserMessage,
+  confirmAndMarkAsRead,
   messageComparator,
   useFreshCallback,
   useIIFE,
   useRefTracker,
 } from '@sendbird/uikit-utils';
 
-import GroupChannelMessageRenderer from '../components/GroupChannelMessageRenderer';
+import GroupChannelMessageRenderer, {
+  GroupChannelTypingIndicatorBubble,
+} from '../components/GroupChannelMessageRenderer';
 import NewMessagesButton from '../components/NewMessagesButton';
 import ScrollToBottomButton from '../components/ScrollToBottomButton';
 import StatusComposition from '../components/StatusComposition';
@@ -72,8 +76,8 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       messages,
       newMessages,
       resetNewMessages,
-      next,
-      prev,
+      loadNext,
+      loadPrevious,
       hasNext,
       sendFileMessage,
       sendUserMessage,
@@ -82,7 +86,7 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       resendMessage,
       deleteMessage,
       resetWithStartingPoint,
-    } = useGroupChannelMessages(sdk, channel, currentUser?.userId, {
+    } = useGroupChannelMessages(sdk, channel, {
       shouldCountNewMessages: () => scrolledAwayFromBottomRef.current,
       onMessagesReceived(messages) {
         groupChannelPubSub.publish({ type: 'MESSAGES_RECEIVED', data: { messages } });
@@ -90,12 +94,13 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       onMessagesUpdated(messages) {
         groupChannelPubSub.publish({ type: 'MESSAGES_UPDATED', data: { messages } });
       },
+      onChannelDeleted,
+      onCurrentUserBanned: onChannelDeleted,
       collectionCreator,
       sortComparator,
-      onChannelDeleted,
+      markAsRead: confirmAndMarkAsRead,
       replyType,
       startingPoint: internalSearchItem?.startingPoint,
-      enableCollectionWithoutLocalCache: true,
     });
 
     const onBlurFragment = () => {
@@ -123,8 +128,13 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
     }, []);
 
     const renderItem: GroupChannelProps['MessageList']['renderMessage'] = useFreshCallback((props) => {
-      if (renderMessage) return renderMessage(props);
-      return <GroupChannelMessageRenderer {...props} />;
+      const content = renderMessage ? renderMessage(props) : <GroupChannelMessageRenderer {...props} />;
+      return (
+        <Box>
+          {content}
+          {props.isFirstItem && !hasNext() && <GroupChannelTypingIndicatorBubble />}
+        </Box>
+      );
     });
 
     const memoizedFlatListProps = useMemo(
@@ -136,12 +146,12 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       [flatListProps],
     );
 
-    const onResetMessageList = useCallback((callback?: () => void) => {
-      resetWithStartingPoint(Number.MAX_SAFE_INTEGER, callback);
+    const onResetMessageList = useCallback(async () => {
+      return await resetWithStartingPoint(Number.MAX_SAFE_INTEGER);
     }, []);
 
-    const onResetMessageListWithStartingPoint = useCallback((startingPoint: number, callback?: () => void) => {
-      resetWithStartingPoint(startingPoint, callback);
+    const onResetMessageListWithStartingPoint = useCallback(async (startingPoint: number) => {
+      return await resetWithStartingPoint(startingPoint);
     }, []);
 
     // Changing the search item will trigger the focus animation on messages.
@@ -216,8 +226,8 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
             renderMessage={renderItem}
             messages={messages}
             newMessages={newMessages}
-            onTopReached={prev}
-            onBottomReached={next}
+            onTopReached={loadPrevious}
+            onBottomReached={loadNext}
             hasNext={hasNext}
             scrolledAwayFromBottom={scrolledAwayFromBottom}
             onScrolledAwayFromBottom={onScrolledAwayFromBottom}

package/src/index.ts

@@ -2,6 +2,8 @@ import { Platform } from 'react-native';
 
 import { Logger } from '@sendbird/uikit-utils';
 
+import { PromisePolyfill } from './utils/promise';
+
 /** Components **/
 export { default as ChannelInput } from './components/ChannelInput';
 export { default as ChannelMessageList } from './components/ChannelMessageList';
@@ -132,8 +134,10 @@ export { default as SendbirdUIKitContainer, SendbirdUIKit } from './containers/S
 export type { SendbirdUIKitContainerProps } from './containers/SendbirdUIKitContainer';
 export { default as SBUError } from './libs/SBUError';
 export { default as SBUUtils } from './libs/SBUUtils';
-
 export * from './types';
 
 Logger.setLogLevel(__DEV__ ? 'warn' : 'none');
 Logger.setTitle(`[UIKIT_${Platform.OS}]`);
+
+// NOTE: In Hermes, not all implementations of Promise are included
+PromisePolyfill.apply();

package/src/types.ts

@@ -28,3 +28,8 @@ export type Range = {
   start: number;
   end: number;
 };
+
+export enum TypingIndicatorType {
+  Text = 'text',
+  Bubble = 'bubble',
+}