@sendbird/uikit-react-native 3.1.2 → 3.3.0

package/src/fragments/createGroupChannelFragment.tsx

@@ -1,7 +1,8 @@
-import React, { useCallback, useMemo, useState } from 'react';
+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 {
   NOOP,
   PASS,
@@ -14,7 +15,9 @@ import {
   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';
@@ -25,7 +28,7 @@ import type {
   GroupChannelProps,
   GroupChannelPubSubContextPayload,
 } from '../domain/groupChannel/types';
-import { useSendbirdChat } from '../hooks/useContext';
+import { usePlatformService, useSendbirdChat } from '../hooks/useContext';
 import pubsub from '../utils/pubsub';
 
 const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): GroupChannelFragment => {
@@ -52,6 +55,7 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
     sortComparator = messageComparator,
     flatListProps,
   }) => {
+    const { playerService, recorderService } = usePlatformService();
     const { sdk, currentUser, sbOptions } = useSendbirdChat();
 
     const [internalSearchItem, setInternalSearchItem] = useState(searchItem);
@@ -97,9 +101,38 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       enableCollectionWithoutLocalCache: true,
     });
 
+    const onBlurFragment = () => {
+      return Promise.allSettled([playerService.reset(), recorderService.reset()]);
+    };
+    const _onPressHeaderLeft = useFreshCallback(async () => {
+      await onBlurFragment();
+      onPressHeaderLeft();
+    });
+    const _onPressHeaderRight = useFreshCallback(async () => {
+      await onBlurFragment();
+      onPressHeaderRight();
+    });
+    const _onPressMediaMessage: NonNullable<GroupChannelProps['MessageList']['onPressMediaMessage']> = useFreshCallback(
+      async (message, deleteMessage, uri) => {
+        await onBlurFragment();
+        onPressMediaMessage(message, deleteMessage, uri);
+      },
+    );
+
+    useEffect(() => {
+      return () => {
+        onBlurFragment();
+      };
+    }, []);
+
     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(
@@ -171,11 +204,13 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
         groupChannelPubSub={groupChannelPubSub}
         enableTypingIndicator={enableTypingIndicator ?? sbOptions.uikit.groupChannel.channel.enableTypingIndicator}
         keyboardAvoidOffset={keyboardAvoidOffset}
+        messages={messages}
+        onUpdateSearchItem={onUpdateSearchItem}
       >
         <GroupChannelModule.Header
           shouldHideRight={navigateFromMessageSearch}
-          onPressHeaderLeft={onPressHeaderLeft}
-          onPressHeaderRight={onPressHeaderRight}
+          onPressHeaderLeft={_onPressHeaderLeft}
+          onPressHeaderRight={_onPressHeaderRight}
         />
         <StatusComposition loading={loading} LoadingComponent={<GroupChannelModule.StatusLoading />}>
           <GroupChannelModule.MessageList
@@ -198,7 +233,7 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
             renderScrollToBottomButton={renderScrollToBottomButton}
             onResendFailedMessage={resendMessage}
             onDeleteMessage={deleteMessage}
-            onPressMediaMessage={onPressMediaMessage}
+            onPressMediaMessage={_onPressMediaMessage}
             flatListProps={memoizedFlatListProps}
           />
           <GroupChannelModule.Input

package/src/fragments/createMessageSearchFragment.tsx

@@ -104,7 +104,7 @@ const useMessageSearch = (
     const query = getMessageSearchQuery(sdk, {
       keyword,
       channelUrl: channel.url,
-      messageTimestampFrom: Math.max(channel.joinedAt, channel.invitedAt),
+      messageTimestampFrom: channel.messageOffsetTimestamp,
       order: MessageSearchOrder.TIMESTAMP,
       queryCreator,
     });

package/src/hooks/useChannelInputItems.ts

@@ -0,0 +1,215 @@
+import { BottomSheetItem, useAlert, useToast } from '@sendbird/uikit-react-native-foundation';
+import { SendbirdChannel, isImage, shouldCompressImage, useIIFE } from '@sendbird/uikit-utils';
+
+import SBUError from '../libs/SBUError';
+import SBUUtils from '../libs/SBUUtils';
+import { FileType } from '../platform/types';
+import { useLocalization, usePlatformService, useSendbirdChat } from './useContext';
+
+export const useChannelInputItems = (channel: SendbirdChannel, sendFileMessage: (file: FileType) => void) => {
+  const { sbOptions, imageCompressionConfig } = useSendbirdChat();
+  const { STRINGS } = useLocalization();
+  const { fileService, mediaService } = usePlatformService();
+  const { alert } = useAlert();
+  const toast = useToast();
+
+  const sheetItems: BottomSheetItem['sheetItems'] = [];
+  const input = useIIFE(() => {
+    switch (true) {
+      case channel.isOpenChannel():
+        return sbOptions.uikit.openChannel.channel.input;
+      case channel.isGroupChannel():
+        return sbOptions.uikit.groupChannel.channel.input;
+      default:
+        return {
+          enableDocument: true,
+          camera: { enablePhoto: true, enableVideo: true },
+          gallery: { enablePhoto: true, enableVideo: true },
+        };
+    }
+  });
+
+  if (input.camera.enablePhoto) {
+    sheetItems.push({
+      title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_CAMERA_PHOTO,
+      icon: 'camera',
+      onPress: async () => {
+        const mediaFile = await fileService.openCamera({
+          mediaType: 'photo',
+          onOpenFailure: (error) => {
+            if (error.code === SBUError.CODE.ERR_PERMISSIONS_DENIED) {
+              alert({
+                title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,
+                message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(
+                  STRINGS.LABELS.PERMISSION_CAMERA,
+                  STRINGS.LABELS.PERMISSION_APP_NAME,
+                ),
+                buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],
+              });
+            } else {
+              toast.show(STRINGS.TOAST.OPEN_CAMERA_ERROR, 'error');
+            }
+          },
+        });
+
+        if (mediaFile) {
+          // Image compression
+          if (
+            isImage(mediaFile.uri, mediaFile.type) &&
+            shouldCompressImage(mediaFile.type, sbOptions.chat.imageCompressionEnabled)
+          ) {
+            await SBUUtils.safeRun(async () => {
+              const compressed = await mediaService.compressImage({
+                uri: mediaFile.uri,
+                maxWidth: imageCompressionConfig.width,
+                maxHeight: imageCompressionConfig.height,
+                compressionRate: imageCompressionConfig.compressionRate,
+              });
+
+              if (compressed) {
+                mediaFile.uri = compressed.uri;
+                mediaFile.size = compressed.size;
+              }
+            });
+          }
+
+          sendFileMessage(mediaFile);
+        }
+      },
+    });
+  }
+
+  if (input.camera.enableVideo) {
+    sheetItems.push({
+      title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_CAMERA_VIDEO,
+      icon: 'camera',
+      onPress: async () => {
+        const mediaFile = await fileService.openCamera({
+          mediaType: 'video',
+          onOpenFailure: (error) => {
+            if (error.code === SBUError.CODE.ERR_PERMISSIONS_DENIED) {
+              alert({
+                title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,
+                message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(
+                  STRINGS.LABELS.PERMISSION_CAMERA,
+                  STRINGS.LABELS.PERMISSION_APP_NAME,
+                ),
+                buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],
+              });
+            } else {
+              toast.show(STRINGS.TOAST.OPEN_CAMERA_ERROR, 'error');
+            }
+          },
+        });
+
+        if (mediaFile) {
+          sendFileMessage(mediaFile);
+        }
+      },
+    });
+  }
+
+  if (input.gallery.enablePhoto || input.gallery.enableVideo) {
+    const mediaType = (() => {
+      switch (true) {
+        case input.gallery.enablePhoto && input.gallery.enableVideo:
+          return 'all';
+        case input.gallery.enablePhoto && !input.gallery.enableVideo:
+          return 'photo';
+        case !input.gallery.enablePhoto && input.gallery.enableVideo:
+          return 'video';
+        default:
+          return 'all';
+      }
+    })();
+
+    sheetItems.push({
+      title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_PHOTO_LIBRARY,
+      icon: 'photo',
+      onPress: async () => {
+        const mediaFiles = await fileService.openMediaLibrary({
+          selectionLimit: 1,
+          mediaType,
+          onOpenFailure: (error) => {
+            if (error.code === SBUError.CODE.ERR_PERMISSIONS_DENIED) {
+              alert({
+                title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,
+                message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(
+                  STRINGS.LABELS.PERMISSION_DEVICE_STORAGE,
+                  STRINGS.LABELS.PERMISSION_APP_NAME,
+                ),
+                buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],
+              });
+            } else {
+              toast.show(STRINGS.TOAST.OPEN_PHOTO_LIBRARY_ERROR, 'error');
+            }
+          },
+        });
+
+        if (mediaFiles && mediaFiles[0]) {
+          const mediaFile = mediaFiles[0];
+
+          // Image compression
+          if (
+            isImage(mediaFile.uri, mediaFile.type) &&
+            shouldCompressImage(mediaFile.type, sbOptions.chat.imageCompressionEnabled)
+          ) {
+            await SBUUtils.safeRun(async () => {
+              const compressed = await mediaService.compressImage({
+                uri: mediaFile.uri,
+                maxWidth: imageCompressionConfig.width,
+                maxHeight: imageCompressionConfig.height,
+                compressionRate: imageCompressionConfig.compressionRate,
+              });
+
+              if (compressed) {
+                mediaFile.uri = compressed.uri;
+                mediaFile.size = compressed.size;
+              }
+            });
+          }
+
+          sendFileMessage(mediaFile);
+        }
+      },
+    });
+  }
+
+  if (input.enableDocument) {
+    sheetItems.push({
+      title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_FILES,
+      icon: 'document',
+      onPress: async () => {
+        const documentFile = await fileService.openDocument({
+          onOpenFailure: () => toast.show(STRINGS.TOAST.OPEN_FILES_ERROR, 'error'),
+        });
+
+        if (documentFile) {
+          // Image compression
+          if (
+            isImage(documentFile.uri, documentFile.type) &&
+            shouldCompressImage(documentFile.type, sbOptions.chat.imageCompressionEnabled)
+          ) {
+            await SBUUtils.safeRun(async () => {
+              const compressed = await mediaService.compressImage({
+                uri: documentFile.uri,
+                maxWidth: imageCompressionConfig.width,
+                maxHeight: imageCompressionConfig.height,
+                compressionRate: imageCompressionConfig.compressionRate,
+              });
+
+              if (compressed) {
+                documentFile.uri = compressed.uri;
+                documentFile.size = compressed.size;
+              }
+            });
+          }
+
+          sendFileMessage(documentFile);
+        }
+      },
+    });
+  }
+
+  return sheetItems;
+};

package/src/hooks/useConnection.ts

@@ -67,7 +67,7 @@ const useConnection = () => {
             Logger.warn('[useConnection]', 'clear cached-data');
             await sdk.clearCachedData().catch((e) => Logger.warn('[useConnection]', 'clear cached-data failure', e));
           } else if (sdk.currentUser) {
-            await initEmoji(sdk, emojiManager);
+            await Promise.allSettled([initEmoji(sdk, emojiManager), initDashboardConfigs(sdk)]);
 
             Logger.debug('[useConnection]', 'connected! (offline)');
             setCurrentUser(sdk.currentUser);

package/src/hooks/useVoiceMessageInput.ts

@@ -0,0 +1,237 @@
+import { useRef, useState } from 'react';
+
+import { useAlert } from '@sendbird/uikit-react-native-foundation';
+import { Logger, getVoiceMessageFileObject, matchesOneOf } from '@sendbird/uikit-utils';
+
+import SBUUtils from '../libs/SBUUtils';
+import { FileType } from '../platform/types';
+import { useLocalization, usePlatformService } from './useContext';
+
+type State = {
+  /**
+   * Status
+   *
+   * idle:
+   *   - cancel(): idle
+   *   - startRecording(): recording
+   * recording:
+   *   - cancel(): idle
+   *   - stopRecording(): recording_completed
+   *   - send(): recording_completed > idle
+   * recording_completed:
+   *   - cancel(): idle
+   *   - playPlayer(): playing
+   *   - send(): idle
+   * playing:
+   *   - cancel(): idle
+   *   - pausePlayer(): playing_paused
+   *   - send(): idle
+   * playing_paused:
+   *   - cancel(): idle
+   *   - playPlayer(): playing
+   *   - send(): idle
+   * */
+  status: 'idle' | 'recording' | 'recording_completed' | 'playing' | 'playing_paused';
+  recordingTime: {
+    currentTime: number;
+    minDuration: number;
+    maxDuration: number;
+  };
+  playingTime: {
+    currentTime: number;
+    duration: number;
+  };
+};
+
+export interface VoiceMessageInputResult {
+  actions: {
+    cancel: () => Promise<void>;
+    startRecording: () => Promise<void>;
+    stopRecording: () => Promise<void>;
+    playPlayer: () => Promise<void>;
+    pausePlayer: () => Promise<void>;
+    send: () => Promise<void>;
+  };
+  state: State;
+}
+
+type Props = {
+  onClose: () => Promise<void>;
+  onSend: (voiceFile: FileType, duration: number) => void;
+};
+
+const useVoiceMessageInput = ({ onSend, onClose }: Props): VoiceMessageInputResult => {
+  const { alert } = useAlert();
+  const { STRINGS } = useLocalization();
+  const { recorderService, playerService, fileService } = usePlatformService();
+  const [status, setStatus] = useState<State['status']>('idle');
+
+  const [recordingTime, setRecordingTime] = useState({
+    currentTime: 0,
+    minDuration: recorderService.options.minDuration,
+    maxDuration: recorderService.options.maxDuration,
+  });
+  const [playingTime, setPlayingTime] = useState({
+    currentTime: 0,
+    duration: 0,
+  });
+
+  const recordingPath = useRef<{ recordFilePath: string; uri: string }>();
+  const getVoiceMessageRecordingPath = () => {
+    if (!recordingPath.current) throw new Error('No recording path');
+    return recordingPath.current;
+  };
+  const setVoiceMessageRecordingPath = (path: { recordFilePath: string; uri: string }) => {
+    recordingPath.current = path;
+  };
+
+  const clear = async () => {
+    recordingPath.current = undefined;
+    await playerService.reset();
+    await recorderService.reset();
+    setRecordingTime({
+      currentTime: 0,
+      minDuration: recorderService.options.minDuration,
+      maxDuration: recorderService.options.maxDuration,
+    });
+    setPlayingTime({
+      currentTime: 0,
+      duration: 0,
+    });
+    setStatus('idle');
+  };
+
+  return {
+    state: {
+      status,
+      recordingTime,
+      playingTime,
+    },
+    actions: {
+      async cancel() {
+        await clear();
+      },
+      async startRecording() {
+        const granted = await recorderService.requestPermission();
+        if (!granted) {
+          await onClose();
+          alert({
+            title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,
+            message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(
+              STRINGS.LABELS.PERMISSION_MICROPHONE,
+              STRINGS.LABELS.PERMISSION_APP_NAME,
+            ),
+            buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],
+          });
+          Logger.error('Failed to request permission for recorder');
+          return;
+        }
+
+        if (matchesOneOf(status, ['idle'])) {
+          // Before start recording, if player is not idle, reset it.
+          if (playerService.state !== 'idle') {
+            await playerService.reset();
+          }
+
+          const unsubscribeRecording = recorderService.addRecordingListener(({ currentTime }) => {
+            setRecordingTime({
+              currentTime,
+              maxDuration: recorderService.options.maxDuration,
+              minDuration: recorderService.options.minDuration,
+            });
+            setPlayingTime((prev) => ({ ...prev, duration: currentTime }));
+          });
+
+          const unsubscribeState = recorderService.addStateListener((state) => {
+            switch (state) {
+              case 'recording':
+                setStatus('recording');
+                break;
+              case 'completed':
+                setStatus('recording_completed');
+                unsubscribeRecording();
+                unsubscribeState();
+                break;
+            }
+          });
+
+          if (SBUUtils.isExpo()) {
+            await recorderService.record();
+            if (recorderService.uri) {
+              setVoiceMessageRecordingPath({ recordFilePath: recorderService.uri, uri: recorderService.uri });
+            }
+          } else {
+            setVoiceMessageRecordingPath(fileService.createRecordFilePath(recorderService.options.extension));
+            await recorderService.record(getVoiceMessageRecordingPath().recordFilePath);
+          }
+        }
+      },
+      async stopRecording() {
+        if (matchesOneOf(status, ['recording'])) {
+          await recorderService.stop();
+        }
+      },
+      async playPlayer() {
+        const granted = await playerService.requestPermission();
+        if (!granted) {
+          alert({
+            title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,
+            message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(
+              STRINGS.LABELS.PERMISSION_DEVICE_STORAGE,
+              STRINGS.LABELS.PERMISSION_APP_NAME,
+            ),
+            buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],
+          });
+          Logger.error('Failed to request permission for player');
+          return;
+        }
+
+        if (matchesOneOf(status, ['recording_completed', 'playing_paused'])) {
+          const unsubscribePlayback = playerService.addPlaybackListener(({ currentTime, duration }) => {
+            setPlayingTime({ currentTime, duration });
+          });
+
+          const unsubscribeState = playerService.addStateListener((state) => {
+            switch (state) {
+              case 'playing':
+                setStatus('playing');
+                break;
+              case 'paused': {
+                setStatus('playing_paused');
+                unsubscribeState();
+                unsubscribePlayback();
+                break;
+              }
+              case 'stopped': {
+                setStatus('playing_paused');
+                unsubscribeState();
+                unsubscribePlayback();
+                setPlayingTime((prev) => ({ ...prev, currentTime: 0 }));
+                break;
+              }
+            }
+          });
+
+          await playerService.play(getVoiceMessageRecordingPath().recordFilePath);
+        }
+      },
+      async pausePlayer() {
+        if (matchesOneOf(status, ['playing'])) {
+          await playerService.pause();
+        }
+      },
+      async send() {
+        if (
+          matchesOneOf(status, ['recording', 'recording_completed', 'playing', 'playing_paused']) &&
+          recordingPath.current
+        ) {
+          const voiceFile = getVoiceMessageFileObject(recordingPath.current.uri, recorderService.options.extension);
+          onSend(voiceFile, Math.floor(recordingTime.currentTime));
+          await clear();
+        }
+      },
+    },
+  };
+};
+
+export default useVoiceMessageInput;

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';
@@ -69,10 +71,14 @@ export { default as createNativeFileService } from './platform/createFileService
 export { default as createNativeClipboardService } from './platform/createClipboardService.native';
 export { default as createNativeNotificationService } from './platform/createNotificationService.native';
 export { default as createNativeMediaService } from './platform/createMediaService.native';
+export { default as createNativePlayerService } from './platform/createPlayerService.native';
+export { default as createNativeRecorderService } from './platform/createRecorderService.native';
 export { default as createExpoFileService } from './platform/createFileService.expo';
 export { default as createExpoClipboardService } from './platform/createClipboardService.expo';
 export { default as createExpoNotificationService } from './platform/createNotificationService.expo';
 export { default as createExpoMediaService } from './platform/createMediaService.expo';
+export { default as createExpoPlayerService } from './platform/createPlayerService.expo';
+export { default as createExpoRecorderService } from './platform/createRecorderService.expo';
 export * from './platform/types';
 
 /** Feature - shared **/
@@ -128,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/libs/MentionManager.tsx

@@ -142,7 +142,7 @@ class MentionManager {
             ],
           };
         },
-        { leftText: text, components: [] as (string | JSX.Element)[] },
+        { leftText: text, components: [] as (string | React.ReactNode)[] },
       );
 
     return [leftText, ...components];

package/src/libs/SBUUtils.ts

@@ -37,4 +37,9 @@ export default class SBUUtils {
       await callback();
     } catch (e) {}
   }
+
+  static isExpo() {
+    const _g = global ?? window;
+    return typeof _g === 'object' && 'expo' in _g;
+  }
 }

package/src/libs/VoiceMessageConfig.ts

@@ -0,0 +1,28 @@
+export interface VoiceMessageConfigInterface {
+  recorder: {
+    minDuration: number;
+    maxDuration: number;
+  };
+}
+
+class VoiceMessageConfig {
+  static DEFAULT = {
+    RECORDER: {
+      MIN_DURATION: 1000,
+      MAX_DURATION: 600 * 1000,
+      EXTENSION: 'm4a',
+
+      BIT_RATE: 12000,
+      SAMPLE_RATE: 11025,
+      CHANNELS: 1,
+    },
+  };
+
+  constructor(private _config: VoiceMessageConfigInterface) {}
+
+  get recorder() {
+    return this._config.recorder;
+  }
+}
+
+export default VoiceMessageConfig;