npm - @sendbird/uikit-react-native - Versions diffs - 2.3.0 → 2.4.1 - Mend

@sendbird/uikit-react-native 2.3.0 → 2.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (723) hide show

package/lib/module/{domain/groupChannel/component/GroupChannelInput → components/ChannelInput}/SendInput.js RENAMED Viewed

@@ -2,21 +2,23 @@ import React, { forwardRef } from 'react';
 import { Platform, TouchableOpacity, View } from 'react-native';
 import { MentionType } from '@sendbird/chat/message';
 import { Icon, TextInput, createStyleSheet, useAlert, useBottomSheet, useToast, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
-import { conditionChaining, isImage, shouldCompressImage } from '@sendbird/uikit-utils';
-import { useLocalization, usePlatformService, useSendbirdChat } from '../../../../hooks/useContext';
-import SBUError from '../../../../libs/SBUError';
-import SBUUtils from '../../../../libs/SBUUtils';
+import { isImage, shouldCompressImage } from '@sendbird/uikit-utils';
+import { useLocalization, usePlatformService, useSendbirdChat } from '../../hooks/useContext';
+import SBUError from '../../libs/SBUError';
+import SBUUtils from '../../libs/SBUUtils';
 const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
   let {
+    onPressSendUserMessage,
+    onPressSendFileMessage,
     onSendUserMessage,
     onSendFileMessage,
     text,
     onChangeText,
-    disabled,
-    frozen,
-    muted,
     onSelectionChange,
-    mentionedUsers
+    mentionedUsers,
+    inputDisabled,
+    inputFrozen,
+    inputMuted
   } = _ref;
   const {
     mentionManager,
@@ -41,20 +43,45 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
   } = useAlert();
   const toast = useToast();
-  const onPressSend = () => {
-    const mention = {
-      userIds: mentionedUsers.map(it => it.user.userId),
-      messageTemplate: mentionManager.textToMentionedMessageTemplate(text, mentionedUsers),
-      type: MentionType.USERS
-    };
-    onSendUserMessage(text, mention).catch(() => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error'));
+  const sendUserMessage = () => {
+    const mentionType = MentionType.USERS;
+    const mentionedUserIds = mentionedUsers.map(it => it.user.userId);
+    const mentionedMessageTemplate = mentionManager.textToMentionedMessageTemplate(text, mentionedUsers);
+    if (onPressSendUserMessage) {
+      onPressSendUserMessage({
+        message: text,
+        mentionType,
+        mentionedUserIds,
+        mentionedMessageTemplate
+      }).catch(onFailureToSend);
+    } else if (onSendUserMessage) {
+      onSendUserMessage(text, {
+        type: mentionType,
+        userIds: mentionedUserIds,
+        messageTemplate: mentionedMessageTemplate
+      }).catch(onFailureToSend);
+    }
     onChangeText('');
   };
+  const sendFileMessage = file => {
+    if (onPressSendFileMessage) {
+      onPressSendFileMessage({
+        file
+      }).catch(onFailureToSend);
+    } else if (onSendFileMessage) {
+      onSendFileMessage(file).catch(onFailureToSend);
+    }
+  };
+  const onFailureToSend = () => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error');
   const onPressAttachment = () => {
     openSheet({
       sheetItems: [{
-        title: STRINGS.GROUP_CHANNEL.DIALOG_ATTACHMENT_CAMERA,
+        title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_CAMERA,
         icon: 'camera',
         onPress: async () => {
           const mediaFile = await fileService.openCamera({
@@ -77,7 +104,7 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
           if (mediaFile) {
             // Image compression
-            if (isImage(mediaFile.uri, mediaFile.type) && shouldCompressImage(mediaFile.uri, features.imageCompressionEnabled)) {
+            if (isImage(mediaFile.uri, mediaFile.type) && shouldCompressImage(mediaFile.type, features.imageCompressionEnabled)) {
               await SBUUtils.safeRun(async () => {
                 const compressed = await mediaService.compressImage({
                   uri: mediaFile.uri,
@@ -93,11 +120,11 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
               });
             }
-            onSendFileMessage(mediaFile).catch(() => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error'));
+            sendFileMessage(mediaFile);
           }
         }
       }, {
-        title: STRINGS.GROUP_CHANNEL.DIALOG_ATTACHMENT_PHOTO_LIBRARY,
+        title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_PHOTO_LIBRARY,
         icon: 'photo',
         onPress: async () => {
           const mediaFiles = await fileService.openMediaLibrary({
@@ -122,7 +149,7 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
           if (mediaFiles && mediaFiles[0]) {
             const mediaFile = mediaFiles[0]; // Image compression
-            if (isImage(mediaFile.uri, mediaFile.type) && shouldCompressImage(mediaFile.uri, features.imageCompressionEnabled)) {
+            if (isImage(mediaFile.uri, mediaFile.type) && shouldCompressImage(mediaFile.type, features.imageCompressionEnabled)) {
               await SBUUtils.safeRun(async () => {
                 const compressed = await mediaService.compressImage({
                   uri: mediaFile.uri,
@@ -138,11 +165,11 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
               });
             }
-            onSendFileMessage(mediaFiles[0]).catch(() => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error'));
+            sendFileMessage(mediaFile);
           }
         }
       }, {
-        title: STRINGS.GROUP_CHANNEL.DIALOG_ATTACHMENT_FILES,
+        title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_FILES,
         icon: 'document',
         onPress: async () => {
           const documentFile = await fileService.openDocument({
@@ -151,7 +178,7 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
           if (documentFile) {
             // Image compression
-            if (isImage(documentFile.uri, documentFile.type) && shouldCompressImage(documentFile.uri, features.imageCompressionEnabled)) {
+            if (isImage(documentFile.uri, documentFile.type) && shouldCompressImage(documentFile.type, features.imageCompressionEnabled)) {
               await SBUUtils.safeRun(async () => {
                 const compressed = await mediaService.compressImage({
                   uri: documentFile.uri,
@@ -167,20 +194,27 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
               });
             }
-            onSendFileMessage(documentFile).catch(() => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error'));
+            sendFileMessage(documentFile);
           }
         }
       }]
     });
   };
+  const getPlaceholder = () => {
+    if (!inputDisabled) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_ACTIVE;
+    if (inputFrozen) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_DISABLED;
+    if (inputMuted) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_MUTED;
+    return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_DISABLED;
+  };
   return /*#__PURE__*/React.createElement(View, {
     style: styles.sendInputContainer
   }, /*#__PURE__*/React.createElement(TouchableOpacity, {
     onPress: onPressAttachment,
-    disabled: disabled
+    disabled: inputDisabled
   }, /*#__PURE__*/React.createElement(Icon, {
-    color: disabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight,
+    color: inputDisabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight,
     icon: 'add',
     size: 24,
     containerStyle: styles.iconAttach
@@ -189,15 +223,15 @@ const SendInput = /*#__PURE__*/forwardRef(function SendInput(_ref, ref) {
     multiline: true,
     disableFullscreenUI: true,
     onSelectionChange: onSelectionChange,
-    editable: !disabled,
+    editable: !inputDisabled,
     onChangeText: onChangeText,
     style: styles.input,
-    placeholder: conditionChaining([frozen, muted], [STRINGS.GROUP_CHANNEL.INPUT_PLACEHOLDER_DISABLED, STRINGS.GROUP_CHANNEL.INPUT_PLACEHOLDER_MUTED, STRINGS.GROUP_CHANNEL.INPUT_PLACEHOLDER_ACTIVE])
+    placeholder: getPlaceholder()
   }, mentionManager.textToMentionedComponents(text, mentionedUsers)), Boolean(text.trim()) && /*#__PURE__*/React.createElement(TouchableOpacity, {
-    onPress: onPressSend,
-    disabled: disabled
+    onPress: sendUserMessage,
+    disabled: inputDisabled
   }, /*#__PURE__*/React.createElement(Icon, {
-    color: disabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight,
+    color: inputDisabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight,
     icon: 'send',
     size: 24,
     containerStyle: styles.iconSend

package/lib/module/components/ChannelInput/SendInput.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["React","forwardRef","Platform","TouchableOpacity","View","MentionType","Icon","TextInput","createStyleSheet","useAlert","useBottomSheet","useToast","useUIKitTheme","isImage","shouldCompressImage","useLocalization","usePlatformService","useSendbirdChat","SBUError","SBUUtils","SendInput","ref","onPressSendUserMessage","onPressSendFileMessage","onSendUserMessage","onSendFileMessage","text","onChangeText","onSelectionChange","mentionedUsers","inputDisabled","inputFrozen","inputMuted","mentionManager","imageCompressionConfig","features","STRINGS","fileService","mediaService","colors","openSheet","alert","toast","sendUserMessage","mentionType","USERS","mentionedUserIds","map","it","user","userId","mentionedMessageTemplate","textToMentionedMessageTemplate","message","catch","onFailureToSend","type","userIds","messageTemplate","sendFileMessage","file","show","TOAST","SEND_MSG_ERROR","onPressAttachment","sheetItems","title","LABELS","CHANNEL_INPUT_ATTACHMENT_CAMERA","icon","onPress","mediaFile","openCamera","mediaType","onOpenFailure","error","code","CODE","ERR_PERMISSIONS_DENIED","DIALOG","ALERT_PERMISSIONS_TITLE","ALERT_PERMISSIONS_MESSAGE","PERMISSION_CAMERA","PERMISSION_APP_NAME","buttons","ALERT_PERMISSIONS_OK","openSettings","OPEN_CAMERA_ERROR","uri","imageCompressionEnabled","safeRun","compressed","compressImage","maxWidth","width","maxHeight","height","compressionRate","size","CHANNEL_INPUT_ATTACHMENT_PHOTO_LIBRARY","mediaFiles","openMediaLibrary","selectionLimit","PERMISSION_DEVICE_STORAGE","OPEN_PHOTO_LIBRARY_ERROR","CHANNEL_INPUT_ATTACHMENT_FILES","documentFile","openDocument","OPEN_FILES_ERROR","getPlaceholder","CHANNEL_INPUT_PLACEHOLDER_ACTIVE","CHANNEL_INPUT_PLACEHOLDER_DISABLED","CHANNEL_INPUT_PLACEHOLDER_MUTED","styles","sendInputContainer","ui","input","default","disabled","highlight","active","iconAttach","textToMentionedComponents","Boolean","trim","iconSend","paddingVertical","paddingHorizontal","alignItems","flexDirection","flex","marginRight","minHeight","select","ios","borderRadius","padding","marginLeft"],"sources":["SendInput.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n NativeSyntheticEvent,\n Platform,\n TextInput as RNTextInput,\n TextInputSelectionChangeEventData,\n TouchableOpacity,\n View,\n} from 'react-native';\n\nimport { MentionType } from '@sendbird/chat/message';\nimport {\n Icon,\n TextInput,\n createStyleSheet,\n useAlert,\n useBottomSheet,\n useToast,\n useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport { isImage, shouldCompressImage } from '@sendbird/uikit-utils';\n\nimport { useLocalization, usePlatformService, useSendbirdChat } from '../../hooks/useContext';\nimport SBUError from '../../libs/SBUError';\nimport SBUUtils from '../../libs/SBUUtils';\nimport type { FileType } from '../../platform/types';\nimport type { MentionedUser } from '../../types';\nimport type { ChannelInputProps } from './index';\n\ninterface SendInputProps extends ChannelInputProps {\n text: string;\n onChangeText: (val: string) => void;\n onSelectionChange: (e: NativeSyntheticEvent<TextInputSelectionChangeEventData>) => void;\n mentionedUsers: MentionedUser[];\n}\n\nconst SendInput = forwardRef<RNTextInput, SendInputProps>(function SendInput(\n {\n onPressSendUserMessage,\n onPressSendFileMessage,\n onSendUserMessage,\n onSendFileMessage,\n text,\n onChangeText,\n onSelectionChange,\n mentionedUsers,\n inputDisabled,\n inputFrozen,\n inputMuted,\n },\n ref,\n) {\n const { mentionManager, imageCompressionConfig, features } = useSendbirdChat();\n const { STRINGS } = useLocalization();\n const { fileService, mediaService } = usePlatformService();\n const { colors } = useUIKitTheme();\n const { openSheet } = useBottomSheet();\n const { alert } = useAlert();\n const toast = useToast();\n\n const sendUserMessage = () => {\n const mentionType = MentionType.USERS;\n const mentionedUserIds = mentionedUsers.map((it) => it.user.userId);\n const mentionedMessageTemplate = mentionManager.textToMentionedMessageTemplate(text, mentionedUsers);\n\n if (onPressSendUserMessage) {\n onPressSendUserMessage({\n message: text,\n mentionType,\n mentionedUserIds,\n mentionedMessageTemplate,\n }).catch(onFailureToSend);\n } else if (onSendUserMessage) {\n onSendUserMessage(text, {\n type: mentionType,\n userIds: mentionedUserIds,\n messageTemplate: mentionedMessageTemplate,\n }).catch(onFailureToSend);\n }\n\n onChangeText('');\n };\n\n const sendFileMessage = (file: FileType) => {\n if (onPressSendFileMessage) {\n onPressSendFileMessage({ file }).catch(onFailureToSend);\n } else if (onSendFileMessage) {\n onSendFileMessage(file).catch(onFailureToSend);\n }\n };\n\n const onFailureToSend = () => toast.show(STRINGS.TOAST.SEND_MSG_ERROR, 'error');\n\n const onPressAttachment = () => {\n openSheet({\n sheetItems: [\n {\n title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_CAMERA,\n icon: 'camera',\n onPress: async () => {\n const mediaFile = await fileService.openCamera({\n mediaType: 'all',\n onOpenFailure: (error) => {\n if (error.code === SBUError.CODE.ERR_PERMISSIONS_DENIED) {\n alert({\n title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,\n message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(\n STRINGS.LABELS.PERMISSION_CAMERA,\n STRINGS.LABELS.PERMISSION_APP_NAME,\n ),\n buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],\n });\n } else {\n toast.show(STRINGS.TOAST.OPEN_CAMERA_ERROR, 'error');\n }\n },\n });\n\n if (mediaFile) {\n // Image compression\n if (\n isImage(mediaFile.uri, mediaFile.type) &&\n shouldCompressImage(mediaFile.type, features.imageCompressionEnabled)\n ) {\n await SBUUtils.safeRun(async () => {\n const compressed = await mediaService.compressImage({\n uri: mediaFile.uri,\n maxWidth: imageCompressionConfig.width,\n maxHeight: imageCompressionConfig.height,\n compressionRate: imageCompressionConfig.compressionRate,\n });\n\n if (compressed) {\n mediaFile.uri = compressed.uri;\n mediaFile.size = compressed.size;\n }\n });\n }\n\n sendFileMessage(mediaFile);\n }\n },\n },\n {\n title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_PHOTO_LIBRARY,\n icon: 'photo',\n onPress: async () => {\n const mediaFiles = await fileService.openMediaLibrary({\n selectionLimit: 1,\n mediaType: 'all',\n onOpenFailure: (error) => {\n if (error.code === SBUError.CODE.ERR_PERMISSIONS_DENIED) {\n alert({\n title: STRINGS.DIALOG.ALERT_PERMISSIONS_TITLE,\n message: STRINGS.DIALOG.ALERT_PERMISSIONS_MESSAGE(\n STRINGS.LABELS.PERMISSION_DEVICE_STORAGE,\n STRINGS.LABELS.PERMISSION_APP_NAME,\n ),\n buttons: [{ text: STRINGS.DIALOG.ALERT_PERMISSIONS_OK, onPress: () => SBUUtils.openSettings() }],\n });\n } else {\n toast.show(STRINGS.TOAST.OPEN_PHOTO_LIBRARY_ERROR, 'error');\n }\n },\n });\n\n if (mediaFiles && mediaFiles[0]) {\n const mediaFile = mediaFiles[0];\n\n // Image compression\n if (\n isImage(mediaFile.uri, mediaFile.type) &&\n shouldCompressImage(mediaFile.type, features.imageCompressionEnabled)\n ) {\n await SBUUtils.safeRun(async () => {\n const compressed = await mediaService.compressImage({\n uri: mediaFile.uri,\n maxWidth: imageCompressionConfig.width,\n maxHeight: imageCompressionConfig.height,\n compressionRate: imageCompressionConfig.compressionRate,\n });\n\n if (compressed) {\n mediaFile.uri = compressed.uri;\n mediaFile.size = compressed.size;\n }\n });\n }\n\n sendFileMessage(mediaFile);\n }\n },\n },\n {\n title: STRINGS.LABELS.CHANNEL_INPUT_ATTACHMENT_FILES,\n icon: 'document',\n onPress: async () => {\n const documentFile = await fileService.openDocument({\n onOpenFailure: () => toast.show(STRINGS.TOAST.OPEN_FILES_ERROR, 'error'),\n });\n\n if (documentFile) {\n // Image compression\n if (\n isImage(documentFile.uri, documentFile.type) &&\n shouldCompressImage(documentFile.type, features.imageCompressionEnabled)\n ) {\n await SBUUtils.safeRun(async () => {\n const compressed = await mediaService.compressImage({\n uri: documentFile.uri,\n maxWidth: imageCompressionConfig.width,\n maxHeight: imageCompressionConfig.height,\n compressionRate: imageCompressionConfig.compressionRate,\n });\n\n if (compressed) {\n documentFile.uri = compressed.uri;\n documentFile.size = compressed.size;\n }\n });\n }\n\n sendFileMessage(documentFile);\n }\n },\n },\n ],\n });\n };\n\n const getPlaceholder = () => {\n if (!inputDisabled) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_ACTIVE;\n if (inputFrozen) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_DISABLED;\n if (inputMuted) return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_MUTED;\n\n return STRINGS.LABELS.CHANNEL_INPUT_PLACEHOLDER_DISABLED;\n };\n\n return (\n <View style={styles.sendInputContainer}>\n <TouchableOpacity onPress={onPressAttachment} disabled={inputDisabled}>\n <Icon\n color={inputDisabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight}\n icon={'add'}\n size={24}\n containerStyle={styles.iconAttach}\n />\n </TouchableOpacity>\n <TextInput\n ref={ref}\n multiline\n disableFullscreenUI\n onSelectionChange={onSelectionChange}\n editable={!inputDisabled}\n onChangeText={onChangeText}\n style={styles.input}\n placeholder={getPlaceholder()}\n >\n {mentionManager.textToMentionedComponents(text, mentionedUsers)}\n </TextInput>\n\n {Boolean(text.trim()) && (\n <TouchableOpacity onPress={sendUserMessage} disabled={inputDisabled}>\n <Icon\n color={\n inputDisabled ? colors.ui.input.default.disabled.highlight : colors.ui.input.default.active.highlight\n }\n icon={'send'}\n size={24}\n containerStyle={styles.iconSend}\n />\n </TouchableOpacity>\n )}\n </View>\n );\n});\n\nconst styles = createStyleSheet({\n sendInputContainer: {\n paddingVertical: 10,\n paddingHorizontal: 12,\n alignItems: 'center',\n flexDirection: 'row',\n },\n input: {\n flex: 1,\n marginRight: 4,\n minHeight: 36,\n maxHeight: 36 * Platform.select({ ios: 2.5, default: 2 }),\n borderRadius: 20,\n },\n iconAttach: {\n marginRight: 8,\n padding: 4,\n },\n iconSend: {\n marginLeft: 4,\n padding: 4,\n },\n});\n\nexport default SendInput;\n"],"mappings":"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"}

package/lib/module/{domain/groupChannel/component/GroupChannelInput → components/ChannelInput}/index.js RENAMED Viewed

@@ -1,13 +1,12 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { useContext, useEffect, useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { KeyboardAvoidingView, Platform, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
-import { getGroupChannelChatAvailableState, replace, useIIFE } from '@sendbird/uikit-utils';
-import { useSendbirdChat } from '../../../../hooks/useContext';
-import useMentionTextInput from '../../../../hooks/useMentionTextInput';
-import { GroupChannelContexts } from '../../module/moduleContext';
+import { replace, useIIFE } from '@sendbird/uikit-utils';
+import { useSendbirdChat } from '../../hooks/useContext';
+import useMentionTextInput from '../../hooks/useMentionTextInput';
 import EditInput from './EditInput';
 import SendInput from './SendInput';
 const AUTO_FOCUS = Platform.select({
@@ -25,7 +24,13 @@ const KEYBOARD_AVOID_VIEW_BEHAVIOR = Platform.select({
 const GET_INPUT_KEY = shouldReset => shouldReset ? 'uikit-input-clear' : 'uikit-input'; // TODO: Refactor 'Edit' mode to clearly
-const GroupChannelInput = props => {
+const ChannelInput = props => {
+  const {
+    channel,
+    keyboardAvoidOffset,
+    messageToEdit,
+    setMessageToEdit
+  } = props;
   const {
     top,
     left,
@@ -39,20 +44,6 @@ const GroupChannelInput = props => {
     features,
     mentionManager
   } = useSendbirdChat();
-  const {
-    channel,
-    messageToEdit,
-    setMessageToEdit,
-    keyboardAvoidOffset = 0
-  } = useContext(GroupChannelContexts.Fragment);
-  const chatAvailableState = getGroupChannelChatAvailableState(channel);
-  const mentionAvailable = features.userMentionEnabled && channel.isGroupChannel() && !channel.isBroadcast;
-  const inputMode = useIIFE(() => {
-    if (!messageToEdit) return 'send';
-    if (messageToEdit.isFileMessage()) return 'send';
-    return 'edit';
-  });
-  const [inputHeight, setInputHeight] = useState(styles.inputDefault.height);
   const {
     selection,
     onSelectionChange,
@@ -61,10 +52,18 @@ const GroupChannelInput = props => {
     onChangeText,
     mentionedUsers
   } = useMentionTextInput({
-    messageToEdit: messageToEdit
+    messageToEdit
   });
+  const inputMode = useIIFE(() => {
+    if (!messageToEdit) return 'send';
+    if (messageToEdit.isFileMessage()) return 'send';
+    return 'edit';
+  });
+  const mentionAvailable = features.userMentionEnabled && channel.isGroupChannel() && !channel.isBroadcast;
+  const inputKeyToRemount = GET_INPUT_KEY(mentionAvailable ? mentionedUsers.length === 0 : false);
+  const [inputHeight, setInputHeight] = useState(styles.inputDefault.height);
   useTypingTrigger(text, channel);
-  useTextPersistenceOnDisabled(text, onChangeText, chatAvailableState.disabled);
+  useTextPersistenceOnDisabled(text, onChangeText, props.inputDisabled);
   useAutoFocusOnEditMode(textInputRef, messageToEdit);
   const onPressToMention = (user, searchStringRange) => {
@@ -97,27 +96,26 @@ const GroupChannelInput = props => {
   }, /*#__PURE__*/React.createElement(View, {
     onLayout: e => setInputHeight(e.nativeEvent.layout.height),
     style: styles.inputContainer
-  }, inputMode === 'send' && /*#__PURE__*/React.createElement(SendInput, _extends({}, props, chatAvailableState, {
-    key: GET_INPUT_KEY(mentionedUsers.length === 0),
+  }, inputMode === 'send' && /*#__PURE__*/React.createElement(SendInput, _extends({}, props, {
+    key: inputKeyToRemount,
     ref: textInputRef,
     text: text,
     onChangeText: onChangeText,
     onSelectionChange: onSelectionChange,
     mentionedUsers: mentionedUsers
   })), inputMode === 'edit' && messageToEdit && /*#__PURE__*/React.createElement(EditInput, _extends({}, props, {
-    key: GET_INPUT_KEY(mentionedUsers.length === 0),
+    key: inputKeyToRemount,
     ref: textInputRef,
-    autoFocus: AUTO_FOCUS,
     text: text,
     onChangeText: onChangeText,
-    messageToEdit: messageToEdit,
-    setMessageToEdit: setMessageToEdit,
-    disabled: chatAvailableState.disabled,
+    autoFocus: AUTO_FOCUS,
     onSelectionChange: onSelectionChange,
-    mentionedUsers: mentionedUsers
+    messageToEdit: messageToEdit,
+    mentionedUsers: mentionedUsers,
+    setMessageToEdit: setMessageToEdit
   }))), /*#__PURE__*/React.createElement(SafeAreaBottom, {
     height: bottom
-  }))), mentionAvailable && /*#__PURE__*/React.createElement(props.SuggestedMentionList, {
+  }))), mentionAvailable && props.SuggestedMentionList && /*#__PURE__*/React.createElement(props.SuggestedMentionList, {
     text: text,
     selection: selection,
     inputHeight: inputHeight,
@@ -129,9 +127,11 @@ const GroupChannelInput = props => {
 };
 const useTypingTrigger = (text, channel) => {
-  useEffect(() => {
-    if (text.length === 0) channel.endTyping();else channel.startTyping();
-  }, [text]);
+  if (channel.isGroupChannel()) {
+    useEffect(() => {
+      if (text.length === 0) channel.endTyping();else channel.startTyping();
+    }, [text]);
+  }
 };
 const useTextPersistenceOnDisabled = (text, setText, chatDisabled) => {
@@ -178,5 +178,5 @@ const styles = createStyleSheet({
     height: 56
   }
 });
-export default /*#__PURE__*/React.memo(GroupChannelInput);
+export default /*#__PURE__*/React.memo(ChannelInput);
 //# sourceMappingURL=index.js.map

package/lib/module/components/ChannelInput/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["React","useEffect","useRef","useState","KeyboardAvoidingView","Platform","View","useSafeAreaInsets","createStyleSheet","useUIKitTheme","replace","useIIFE","useSendbirdChat","useMentionTextInput","EditInput","SendInput","AUTO_FOCUS","select","ios","android","default","KEYBOARD_AVOID_VIEW_BEHAVIOR","undefined","GET_INPUT_KEY","shouldReset","ChannelInput","props","channel","keyboardAvoidOffset","messageToEdit","setMessageToEdit","top","left","right","bottom","colors","features","mentionManager","selection","onSelectionChange","textInputRef","text","onChangeText","mentionedUsers","inputMode","isFileMessage","mentionAvailable","userMentionEnabled","isGroupChannel","isBroadcast","inputKeyToRemount","length","inputHeight","setInputHeight","styles","inputDefault","height","useTypingTrigger","useTextPersistenceOnDisabled","inputDisabled","useAutoFocusOnEditMode","onPressToMention","user","searchStringRange","mentionedMessageText","asMentionedMessageText","range","start","end","shouldRenderInput","paddingLeft","paddingRight","backgroundColor","background","e","nativeEvent","layout","inputContainer","SuggestedMentionList","endTyping","startTyping","setText","chatDisabled","textTmpRef","current","isUserMessage","setTimeout","focus","SafeAreaBottom","justifyContent","width","memo"],"sources":["index.tsx"],"sourcesContent":["import React, { MutableRefObject, useEffect, useRef, useState } from 'react';\nimport { KeyboardAvoidingView, Platform, TextInput, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport {\n SendbirdBaseChannel,\n SendbirdBaseMessage,\n SendbirdFileMessage,\n SendbirdFileMessageCreateParams,\n SendbirdFileMessageUpdateParams,\n SendbirdMember,\n SendbirdUserMessage,\n SendbirdUserMessageCreateParams,\n SendbirdUserMessageUpdateParams,\n replace,\n useIIFE,\n} from '@sendbird/uikit-utils';\n\nimport { useSendbirdChat } from '../../hooks/useContext';\nimport useMentionTextInput from '../../hooks/useMentionTextInput';\nimport type { FileType } from '../../platform/types';\nimport type { MentionedUser, Range } from '../../types';\nimport EditInput from './EditInput';\nimport SendInput from './SendInput';\n\ntype UserMessageMentionParams = Required<{\n messageTemplate: SendbirdUserMessageCreateParams['mentionedMessageTemplate'];\n userIds: SendbirdUserMessageCreateParams['mentionedUserIds'];\n type: SendbirdUserMessageCreateParams['mentionType'];\n}>;\n\nexport type SuggestedMentionListProps = {\n text: string;\n selection: Range;\n topInset: number;\n bottomInset: number;\n inputHeight: number;\n onPressToMention: (user: SendbirdMember, searchStringRange: Range) => void;\n mentionedUsers: MentionedUser[];\n};\n\nexport type ChannelInputProps = {\n // default\n channel: SendbirdBaseChannel;\n shouldRenderInput: boolean;\n keyboardAvoidOffset: number;\n\n // default actions\n onPressSendUserMessage: (params: SendbirdUserMessageCreateParams) => Promise<void>;\n onPressSendFileMessage: (params: SendbirdFileMessageCreateParams) => Promise<void>;\n onPressUpdateUserMessage: (message: SendbirdUserMessage, params: SendbirdUserMessageUpdateParams) => Promise<void>;\n onPressUpdateFileMessage: (message: SendbirdFileMessage, params: SendbirdFileMessageUpdateParams) => Promise<void>;\n\n // input status\n inputFrozen: boolean;\n inputMuted: boolean;\n inputDisabled: boolean;\n\n // edit\n messageToEdit: undefined | SendbirdUserMessage | SendbirdFileMessage;\n setMessageToEdit: (message?: undefined | SendbirdUserMessage | SendbirdFileMessage) => void;\n\n // mention\n SuggestedMentionList?: (props: SuggestedMentionListProps) => JSX.Element | null;\n\n /** @deprecated Please use `onPressSendUserMessage` **/\n onSendFileMessage?: (file: FileType) => Promise<void>;\n /** @deprecated Please use `onPressSendFileMessage` **/\n onSendUserMessage?: (text: string, mention?: UserMessageMentionParams) => Promise<void>;\n /** @deprecated Please use `onPressUpdateUserMessage` **/\n onUpdateFileMessage?: (editedFile: FileType, message: SendbirdFileMessage) => Promise<void>;\n /** @deprecated Please use `onPressUpdateFileMessage` **/\n onUpdateUserMessage?: (\n editedText: string,\n message: SendbirdUserMessage,\n mention?: UserMessageMentionParams,\n ) => Promise<void>;\n};\n\nconst AUTO_FOCUS = Platform.select({ ios: false, android: true, default: false });\nconst KEYBOARD_AVOID_VIEW_BEHAVIOR = Platform.select({ ios: 'padding' as const, default: undefined });\n\n// FIXME(iOS): Dynamic style does not work properly when typing the CJK. (https://github.com/facebook/react-native/issues/26107)\n// To workaround temporarily, change the key for re-mount the component.\n// -> This will affect to keyboard blur when add/remove first mentioned user.\nconst GET_INPUT_KEY = (shouldReset: boolean) => (shouldReset ? 'uikit-input-clear' : 'uikit-input');\n\n// TODO: Refactor 'Edit' mode to clearly\nconst ChannelInput = (props: ChannelInputProps) => {\n const { channel, keyboardAvoidOffset, messageToEdit, setMessageToEdit } = props;\n\n const { top, left, right, bottom } = useSafeAreaInsets();\n const { colors } = useUIKitTheme();\n const { features, mentionManager } = useSendbirdChat();\n\n const { selection, onSelectionChange, textInputRef, text, onChangeText, mentionedUsers } = useMentionTextInput({\n messageToEdit,\n });\n const inputMode = useIIFE(() => {\n if (!messageToEdit) return 'send';\n if (messageToEdit.isFileMessage()) return 'send';\n return 'edit';\n });\n\n const mentionAvailable = features.userMentionEnabled && channel.isGroupChannel() && !channel.isBroadcast;\n const inputKeyToRemount = GET_INPUT_KEY(mentionAvailable ? mentionedUsers.length === 0 : false);\n\n const [inputHeight, setInputHeight] = useState(styles.inputDefault.height);\n\n useTypingTrigger(text, channel);\n useTextPersistenceOnDisabled(text, onChangeText, props.inputDisabled);\n useAutoFocusOnEditMode(textInputRef, messageToEdit);\n\n const onPressToMention = (user: SendbirdMember, searchStringRange: Range) => {\n const mentionedMessageText = mentionManager.asMentionedMessageText(user, true);\n const range = { start: searchStringRange.start, end: searchStringRange.start + mentionedMessageText.length - 1 };\n\n onChangeText(replace(text, searchStringRange.start, searchStringRange.end, mentionedMessageText), { user, range });\n };\n\n if (!props.shouldRenderInput) {\n return <SafeAreaBottom height={bottom} />;\n }\n\n return (\n <>\n <KeyboardAvoidingView\n keyboardVerticalOffset={-bottom + keyboardAvoidOffset}\n behavior={KEYBOARD_AVOID_VIEW_BEHAVIOR}\n >\n <View style={{ paddingLeft: left, paddingRight: right, backgroundColor: colors.background }}>\n <View onLayout={(e) => setInputHeight(e.nativeEvent.layout.height)} style={styles.inputContainer}>\n {inputMode === 'send' && (\n <SendInput\n {...props}\n key={inputKeyToRemount}\n ref={textInputRef as never}\n text={text}\n onChangeText={onChangeText}\n onSelectionChange={onSelectionChange}\n mentionedUsers={mentionedUsers}\n />\n )}\n {inputMode === 'edit' && messageToEdit && (\n <EditInput\n {...props}\n key={inputKeyToRemount}\n ref={textInputRef as never}\n text={text}\n onChangeText={onChangeText}\n autoFocus={AUTO_FOCUS}\n onSelectionChange={onSelectionChange}\n messageToEdit={messageToEdit}\n mentionedUsers={mentionedUsers}\n setMessageToEdit={setMessageToEdit}\n />\n )}\n </View>\n <SafeAreaBottom height={bottom} />\n </View>\n </KeyboardAvoidingView>\n {mentionAvailable && props.SuggestedMentionList && (\n <props.SuggestedMentionList\n text={text}\n selection={selection}\n inputHeight={inputHeight}\n topInset={top}\n bottomInset={bottom}\n onPressToMention={onPressToMention}\n mentionedUsers={mentionedUsers}\n />\n )}\n </>\n );\n};\n\nconst useTypingTrigger = (text: string, channel: SendbirdBaseChannel) => {\n if (channel.isGroupChannel()) {\n useEffect(() => {\n if (text.length === 0) channel.endTyping();\n else channel.startTyping();\n }, [text]);\n }\n};\n\nconst useTextPersistenceOnDisabled = (text: string, setText: (val: string) => void, chatDisabled: boolean) => {\n const textTmpRef = useRef('');\n\n useEffect(() => {\n if (chatDisabled) {\n textTmpRef.current = text;\n setText('');\n } else {\n setText(textTmpRef.current);\n }\n }, [chatDisabled]);\n};\n\nconst useAutoFocusOnEditMode = (\n textInputRef: MutableRefObject<TextInput | undefined>,\n messageToEdit?: SendbirdBaseMessage,\n) => {\n useEffect(() => {\n if (messageToEdit?.isUserMessage()) {\n if (!AUTO_FOCUS) setTimeout(() => textInputRef.current?.focus(), 500);\n }\n }, [messageToEdit]);\n};\n\nconst SafeAreaBottom = ({ height }: { height: number }) => {\n return <View style={{ height }} />;\n};\n\nconst styles = createStyleSheet({\n inputContainer: {\n justifyContent: 'center',\n width: '100%',\n },\n inputDefault: {\n height: 56,\n },\n});\n\nexport default React.memo(ChannelInput);\n"],"mappings":"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"}

package/lib/module/components/FileViewer.js CHANGED Viewed

@@ -91,11 +91,11 @@ const FileViewer = _ref => {
       onPressDelete(fileMessage);
     } else {
       alert({
-        title: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_TITLE,
+        title: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE,
         buttons: [{
-          text: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_CANCEL
+          text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL
         }, {
-          text: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_OK,
+          text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_OK,
           style: 'destructive',
           onPress: () => {
             deleteMessage().then(() => {

package/lib/module/components/FileViewer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useEffect","useState","StatusBar","StyleSheet","TouchableOpacity","View","useSafeAreaInsets","Icon","Image","LoadingSpinner","Text","createStyleSheet","useAlert","useHeaderStyle","useToast","useUIKitTheme","Logger","getFileExtension","getFileType","isMyMessage","toMegabyte","truncate","useIIFE","useLocalization","usePlatformService","useSendbirdChat","FileViewer","headerShown","deleteMessage","headerTopInset","fileMessage","onPressDownload","onPressDelete","onClose","loading","setLoading","bottom","currentUser","palette","topInset","statusBarTranslucent","defaultHeight","STRINGS","fileService","mediaService","toast","alert","basicTopInset","canDelete","userId","fileType","type","url","fileViewer","uri","absoluteFill","top","_onPressDelete","title","GROUP_CHANNEL","DIALOG_MESSAGE_DELETE_CONFIRM_TITLE","buttons","text","DIALOG_MESSAGE_DELETE_CONFIRM_CANCEL","DIALOG_MESSAGE_DELETE_CONFIRM_OK","style","onPress","then","catch","show","TOAST","DELETE_MSG_ERROR","_onPressDownload","size","DOWNLOAD_START","save","fileUrl","fileName","name","response","DOWNLOAD_OK","log","err","DOWNLOAD_ERROR","flex","backgroundColor","background700","alignItems","justifyContent","position","primary300","FILE_VIEWER","TITLE","SUBTITLE","FileViewerHeader","subtitle","left","right","styles","headerContainer","paddingLeft","paddingHorizontal","paddingRight","paddingTop","height","overlay01","barButton","onBackgroundDark01","barTitleContainer","headerTitle","mode","maxLen","FileViewerFooter","bottomInset","deleteShown","footerContainer","paddingBottom","flexDirection","width","marginBottom"],"sources":["FileViewer.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StatusBar, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport {\n Icon,\n Image,\n LoadingSpinner,\n Text,\n createStyleSheet,\n useAlert,\n useHeaderStyle,\n useToast,\n useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport {\n Logger,\n getFileExtension,\n getFileType,\n isMyMessage,\n toMegabyte,\n truncate,\n useIIFE,\n} from '@sendbird/uikit-utils';\n\nimport { useLocalization, usePlatformService, useSendbirdChat } from '../hooks/useContext';\n\ntype Props = {\n fileMessage: SendbirdFileMessage;\n deleteMessage: () => Promise<void>;\n\n onClose: () => void;\n onPressDownload?: (message: SendbirdFileMessage) => void;\n onPressDelete?: (message: SendbirdFileMessage) => void;\n\n headerShown?: boolean;\n headerTopInset?: number;\n};\nconst FileViewer = ({\n headerShown = true,\n deleteMessage,\n headerTopInset,\n fileMessage,\n onPressDownload,\n onPressDelete,\n onClose,\n}: Props) => {\n const [loading, setLoading] = useState(true);\n\n const { bottom } = useSafeAreaInsets();\n\n const { currentUser } = useSendbirdChat();\n const { palette } = useUIKitTheme();\n const { topInset, statusBarTranslucent, defaultHeight } = useHeaderStyle();\n const { STRINGS } = useLocalization();\n const { fileService, mediaService } = usePlatformService();\n const toast = useToast();\n const { alert } = useAlert();\n\n const basicTopInset = statusBarTranslucent ? topInset : 0;\n const canDelete = isMyMessage(fileMessage, currentUser?.userId);\n const fileType = getFileType(fileMessage.type \|\| getFileExtension(fileMessage.url));\n\n useEffect(() => {\n if (fileType === 'file') onClose();\n }, []);\n\n const fileViewer = useIIFE(() => {\n switch (fileType) {\n case 'image': {\n return (\n <Image\n source={{ uri: fileMessage.url }}\n style={StyleSheet.absoluteFill}\n resizeMode={'contain'}\n onLoadEnd={() => setLoading(false)}\n />\n );\n }\n\n case 'video':\n case 'audio': {\n return (\n <mediaService.VideoComponent\n source={{ uri: fileMessage.url }}\n style={[StyleSheet.absoluteFill, { top: basicTopInset + defaultHeight, bottom: defaultHeight + bottom }]}\n resizeMode={'contain'}\n onLoad={() => setLoading(false)}\n />\n );\n }\n\n default: {\n return null;\n }\n }\n });\n\n const _onPressDelete = () => {\n if (!canDelete) return;\n\n if (onPressDelete) {\n onPressDelete(fileMessage);\n } else {\n alert({\n title: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_TITLE,\n buttons: [\n {\n text: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_CANCEL,\n },\n {\n text: STRINGS.GROUP_CHANNEL.DIALOG_MESSAGE_DELETE_CONFIRM_OK,\n style: 'destructive',\n onPress: () => {\n deleteMessage()\n .then(() => {\n onClose();\n })\n .catch(() => {\n toast.show(STRINGS.TOAST.DELETE_MSG_ERROR, 'error');\n });\n },\n },\n ],\n });\n }\n };\n\n const _onPressDownload = () => {\n if (onPressDownload) {\n onPressDownload(fileMessage);\n } else {\n if (toMegabyte(fileMessage.size) > 4) {\n toast.show(STRINGS.TOAST.DOWNLOAD_START, 'success');\n }\n\n fileService\n .save({ fileUrl: fileMessage.url, fileName: fileMessage.name, fileType: fileMessage.type })\n .then((response) => {\n toast.show(STRINGS.TOAST.DOWNLOAD_OK, 'success');\n Logger.log('File saved to', response);\n })\n .catch((err) => {\n toast.show(STRINGS.TOAST.DOWNLOAD_ERROR, 'error');\n Logger.log('File save failure', err);\n });\n }\n };\n\n return (\n <View style={{ flex: 1, backgroundColor: palette.background700 }}>\n <StatusBar barStyle={'light-content'} animated />\n <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>\n {fileViewer}\n {loading && <LoadingSpinner style={{ position: 'absolute' }} size={40} color={palette.primary300} />}\n </View>\n {headerShown && (\n <FileViewerHeader\n title={STRINGS.FILE_VIEWER.TITLE(fileMessage)}\n subtitle={STRINGS.FILE_VIEWER.SUBTITLE(fileMessage)}\n topInset={headerTopInset ?? basicTopInset}\n onClose={onClose}\n />\n )}\n <FileViewerFooter\n bottomInset={bottom}\n deleteShown={canDelete}\n onPressDelete={_onPressDelete}\n onPressDownload={_onPressDownload}\n />\n </View>\n );\n};\n\ntype HeaderProps = {\n topInset: number;\n onClose: () => void;\n title: string;\n subtitle: string;\n};\nconst FileViewerHeader = ({ topInset, onClose, subtitle, title }: HeaderProps) => {\n const { palette } = useUIKitTheme();\n const { defaultHeight } = useHeaderStyle();\n const { left, right } = useSafeAreaInsets();\n\n return (\n <View\n style={[\n styles.headerContainer,\n {\n paddingLeft: styles.headerContainer.paddingHorizontal + left,\n paddingRight: styles.headerContainer.paddingHorizontal + right,\n },\n { paddingTop: topInset, height: defaultHeight + topInset, backgroundColor: palette.overlay01 },\n ]}\n >\n <TouchableOpacity onPress={onClose} style={styles.barButton}>\n <Icon icon={'close'} size={24} color={palette.onBackgroundDark01} />\n </TouchableOpacity>\n <View style={styles.barTitleContainer}>\n <Text h2 color={palette.onBackgroundDark01} style={styles.headerTitle} numberOfLines={1}>\n {truncate(title, { mode: 'mid', maxLen: 18 })}\n </Text>\n <Text caption2 color={palette.onBackgroundDark01} numberOfLines={1}>\n {subtitle}\n </Text>\n </View>\n <View style={styles.barButton} />\n </View>\n );\n};\n\ntype FooterProps = {\n bottomInset: number;\n deleteShown: boolean;\n onPressDelete: () => void;\n onPressDownload: () => void;\n};\nconst FileViewerFooter = ({ bottomInset, deleteShown, onPressDelete, onPressDownload }: FooterProps) => {\n const { palette } = useUIKitTheme();\n const { defaultHeight } = useHeaderStyle();\n const { left, right } = useSafeAreaInsets();\n\n return (\n <View\n style={[\n styles.footerContainer,\n {\n paddingLeft: styles.headerContainer.paddingHorizontal + left,\n paddingRight: styles.headerContainer.paddingHorizontal + right,\n },\n {\n paddingBottom: bottomInset,\n height: defaultHeight + bottomInset,\n backgroundColor: palette.overlay01,\n },\n ]}\n >\n <TouchableOpacity onPress={onPressDownload} style={styles.barButton}>\n <Icon icon={'download'} size={24} color={palette.onBackgroundDark01} />\n </TouchableOpacity>\n <View style={styles.barTitleContainer} />\n <TouchableOpacity onPress={onPressDelete} style={styles.barButton} disabled={!deleteShown}>\n {deleteShown && <Icon icon={'delete'} size={24} color={palette.onBackgroundDark01} />}\n </TouchableOpacity>\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n headerContainer: {\n top: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n paddingHorizontal: 12,\n },\n barButton: {\n width: 32,\n height: 32,\n alignItems: 'center',\n justifyContent: 'center',\n },\n barTitleContainer: {\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n },\n headerTitle: {\n marginBottom: 2,\n },\n footerContainer: {\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n paddingHorizontal: 12,\n },\n});\n\nexport default FileViewer;\n"],"mappings":"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"}
1	+ {"version":3,"names":["React","useEffect","useState","StatusBar","StyleSheet","TouchableOpacity","View","useSafeAreaInsets","Icon","Image","LoadingSpinner","Text","createStyleSheet","useAlert","useHeaderStyle","useToast","useUIKitTheme","Logger","getFileExtension","getFileType","isMyMessage","toMegabyte","truncate","useIIFE","useLocalization","usePlatformService","useSendbirdChat","FileViewer","headerShown","deleteMessage","headerTopInset","fileMessage","onPressDownload","onPressDelete","onClose","loading","setLoading","bottom","currentUser","palette","topInset","statusBarTranslucent","defaultHeight","STRINGS","fileService","mediaService","toast","alert","basicTopInset","canDelete","userId","fileType","type","url","fileViewer","uri","absoluteFill","top","_onPressDelete","title","LABELS","CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE","buttons","text","CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL","CHANNEL_MESSAGE_DELETE_CONFIRM_OK","style","onPress","then","catch","show","TOAST","DELETE_MSG_ERROR","_onPressDownload","size","DOWNLOAD_START","save","fileUrl","fileName","name","response","DOWNLOAD_OK","log","err","DOWNLOAD_ERROR","flex","backgroundColor","background700","alignItems","justifyContent","position","primary300","FILE_VIEWER","TITLE","SUBTITLE","FileViewerHeader","subtitle","left","right","styles","headerContainer","paddingLeft","paddingHorizontal","paddingRight","paddingTop","height","overlay01","barButton","onBackgroundDark01","barTitleContainer","headerTitle","mode","maxLen","FileViewerFooter","bottomInset","deleteShown","footerContainer","paddingBottom","flexDirection","width","marginBottom"],"sources":["FileViewer.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StatusBar, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport {\n Icon,\n Image,\n LoadingSpinner,\n Text,\n createStyleSheet,\n useAlert,\n useHeaderStyle,\n useToast,\n useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport {\n Logger,\n getFileExtension,\n getFileType,\n isMyMessage,\n toMegabyte,\n truncate,\n useIIFE,\n} from '@sendbird/uikit-utils';\n\nimport { useLocalization, usePlatformService, useSendbirdChat } from '../hooks/useContext';\n\ntype Props = {\n fileMessage: SendbirdFileMessage;\n deleteMessage: () => Promise<void>;\n\n onClose: () => void;\n onPressDownload?: (message: SendbirdFileMessage) => void;\n onPressDelete?: (message: SendbirdFileMessage) => void;\n\n headerShown?: boolean;\n headerTopInset?: number;\n};\nconst FileViewer = ({\n headerShown = true,\n deleteMessage,\n headerTopInset,\n fileMessage,\n onPressDownload,\n onPressDelete,\n onClose,\n}: Props) => {\n const [loading, setLoading] = useState(true);\n\n const { bottom } = useSafeAreaInsets();\n\n const { currentUser } = useSendbirdChat();\n const { palette } = useUIKitTheme();\n const { topInset, statusBarTranslucent, defaultHeight } = useHeaderStyle();\n const { STRINGS } = useLocalization();\n const { fileService, mediaService } = usePlatformService();\n const toast = useToast();\n const { alert } = useAlert();\n\n const basicTopInset = statusBarTranslucent ? topInset : 0;\n const canDelete = isMyMessage(fileMessage, currentUser?.userId);\n const fileType = getFileType(fileMessage.type \|\| getFileExtension(fileMessage.url));\n\n useEffect(() => {\n if (fileType === 'file') onClose();\n }, []);\n\n const fileViewer = useIIFE(() => {\n switch (fileType) {\n case 'image': {\n return (\n <Image\n source={{ uri: fileMessage.url }}\n style={StyleSheet.absoluteFill}\n resizeMode={'contain'}\n onLoadEnd={() => setLoading(false)}\n />\n );\n }\n\n case 'video':\n case 'audio': {\n return (\n <mediaService.VideoComponent\n source={{ uri: fileMessage.url }}\n style={[StyleSheet.absoluteFill, { top: basicTopInset + defaultHeight, bottom: defaultHeight + bottom }]}\n resizeMode={'contain'}\n onLoad={() => setLoading(false)}\n />\n );\n }\n\n default: {\n return null;\n }\n }\n });\n\n const _onPressDelete = () => {\n if (!canDelete) return;\n\n if (onPressDelete) {\n onPressDelete(fileMessage);\n } else {\n alert({\n title: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE,\n buttons: [\n {\n text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL,\n },\n {\n text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_OK,\n style: 'destructive',\n onPress: () => {\n deleteMessage()\n .then(() => {\n onClose();\n })\n .catch(() => {\n toast.show(STRINGS.TOAST.DELETE_MSG_ERROR, 'error');\n });\n },\n },\n ],\n });\n }\n };\n\n const _onPressDownload = () => {\n if (onPressDownload) {\n onPressDownload(fileMessage);\n } else {\n if (toMegabyte(fileMessage.size) > 4) {\n toast.show(STRINGS.TOAST.DOWNLOAD_START, 'success');\n }\n\n fileService\n .save({ fileUrl: fileMessage.url, fileName: fileMessage.name, fileType: fileMessage.type })\n .then((response) => {\n toast.show(STRINGS.TOAST.DOWNLOAD_OK, 'success');\n Logger.log('File saved to', response);\n })\n .catch((err) => {\n toast.show(STRINGS.TOAST.DOWNLOAD_ERROR, 'error');\n Logger.log('File save failure', err);\n });\n }\n };\n\n return (\n <View style={{ flex: 1, backgroundColor: palette.background700 }}>\n <StatusBar barStyle={'light-content'} animated />\n <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>\n {fileViewer}\n {loading && <LoadingSpinner style={{ position: 'absolute' }} size={40} color={palette.primary300} />}\n </View>\n {headerShown && (\n <FileViewerHeader\n title={STRINGS.FILE_VIEWER.TITLE(fileMessage)}\n subtitle={STRINGS.FILE_VIEWER.SUBTITLE(fileMessage)}\n topInset={headerTopInset ?? basicTopInset}\n onClose={onClose}\n />\n )}\n <FileViewerFooter\n bottomInset={bottom}\n deleteShown={canDelete}\n onPressDelete={_onPressDelete}\n onPressDownload={_onPressDownload}\n />\n </View>\n );\n};\n\ntype HeaderProps = {\n topInset: number;\n onClose: () => void;\n title: string;\n subtitle: string;\n};\nconst FileViewerHeader = ({ topInset, onClose, subtitle, title }: HeaderProps) => {\n const { palette } = useUIKitTheme();\n const { defaultHeight } = useHeaderStyle();\n const { left, right } = useSafeAreaInsets();\n\n return (\n <View\n style={[\n styles.headerContainer,\n {\n paddingLeft: styles.headerContainer.paddingHorizontal + left,\n paddingRight: styles.headerContainer.paddingHorizontal + right,\n },\n { paddingTop: topInset, height: defaultHeight + topInset, backgroundColor: palette.overlay01 },\n ]}\n >\n <TouchableOpacity onPress={onClose} style={styles.barButton}>\n <Icon icon={'close'} size={24} color={palette.onBackgroundDark01} />\n </TouchableOpacity>\n <View style={styles.barTitleContainer}>\n <Text h2 color={palette.onBackgroundDark01} style={styles.headerTitle} numberOfLines={1}>\n {truncate(title, { mode: 'mid', maxLen: 18 })}\n </Text>\n <Text caption2 color={palette.onBackgroundDark01} numberOfLines={1}>\n {subtitle}\n </Text>\n </View>\n <View style={styles.barButton} />\n </View>\n );\n};\n\ntype FooterProps = {\n bottomInset: number;\n deleteShown: boolean;\n onPressDelete: () => void;\n onPressDownload: () => void;\n};\nconst FileViewerFooter = ({ bottomInset, deleteShown, onPressDelete, onPressDownload }: FooterProps) => {\n const { palette } = useUIKitTheme();\n const { defaultHeight } = useHeaderStyle();\n const { left, right } = useSafeAreaInsets();\n\n return (\n <View\n style={[\n styles.footerContainer,\n {\n paddingLeft: styles.headerContainer.paddingHorizontal + left,\n paddingRight: styles.headerContainer.paddingHorizontal + right,\n },\n {\n paddingBottom: bottomInset,\n height: defaultHeight + bottomInset,\n backgroundColor: palette.overlay01,\n },\n ]}\n >\n <TouchableOpacity onPress={onPressDownload} style={styles.barButton}>\n <Icon icon={'download'} size={24} color={palette.onBackgroundDark01} />\n </TouchableOpacity>\n <View style={styles.barTitleContainer} />\n <TouchableOpacity onPress={onPressDelete} style={styles.barButton} disabled={!deleteShown}>\n {deleteShown && <Icon icon={'delete'} size={24} color={palette.onBackgroundDark01} />}\n </TouchableOpacity>\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n headerContainer: {\n top: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n paddingHorizontal: 12,\n },\n barButton: {\n width: 32,\n height: 32,\n alignItems: 'center',\n justifyContent: 'center',\n },\n barTitleContainer: {\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n },\n headerTitle: {\n marginBottom: 2,\n },\n footerContainer: {\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n paddingHorizontal: 12,\n },\n});\n\nexport default FileViewer;\n"],"mappings":"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"}

package/lib/module/components/MessageRenderer/FileMessage/BaseFileMessage.js CHANGED Viewed

@@ -23,7 +23,7 @@ const BaseFileMessage = _ref => {
   const {
     colors
   } = useUIKitTheme();
-  const color = colors.ui.message[variant][pressed ? 'pressed' : 'enabled'];
+  const color = colors.ui.groupChannelMessage[variant][pressed ? 'pressed' : 'enabled'];
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.bubbleContainer, {
       backgroundColor: color.background

package/lib/module/components/MessageRenderer/FileMessage/BaseFileMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","useLocalization","iconMapper","audio","image","video","file","BaseFileMessage","message","variant","pressed","type","children","STRINGS","colors","color","ui","styles","bubbleContainer","backgroundColor","background","container","padding","borderRadius","marginRight","textMsg","name","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink"],"sources":["BaseFileMessage.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Icon, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\n\nimport { useLocalization } from '../../../hooks/useContext';\nimport type { FileMessageProps } from './index';\n\nconst iconMapper = { audio: 'file-audio', image: 'photo', video: 'play', file: 'file-document' } as const;\n\ntype Props = FileMessageProps & {\n type: 'image' \| 'audio' \| 'video' \| 'file';\n};\nconst BaseFileMessage = ({ message, variant, pressed, type, children }: Props) => {\n const { STRINGS } = useLocalization();\n const { colors } = useUIKitTheme();\n const color = colors.ui.~~message~~[variant][pressed ? 'pressed' : 'enabled'];\n return (\n <View style={[styles.bubbleContainer, { backgroundColor: color.background }]}>\n <View style={styles.container}>\n <Icon\n icon={iconMapper[type]}\n size={24}\n containerStyle={{ backgroundColor: colors.background, padding: 2, borderRadius: 8, marginRight: 8 }}\n />\n <Text body3 ellipsizeMode={'middle'} numberOfLines={1} color={color.textMsg} style={styles.name}>\n {STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(message)}\n </Text>\n </View>\n {children}\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n bubbleContainer: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingHorizontal: 12,\n paddingVertical: 6,\n },\n name: {\n flexShrink: 1,\n },\n});\n\nexport default BaseFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,IAAT,EAAeC,IAAf,EAAqBC,gBAArB,EAAuCC,aAAvC,QAA4D,yCAA5D;AAEA,SAASC,eAAT,QAAgC,2BAAhC;AAGA,MAAMC,UAAU,GAAG;EAAEC,KAAK,EAAE,YAAT;EAAuBC,KAAK,EAAE,OAA9B;EAAuCC,KAAK,EAAE,MAA9C;EAAsDC,IAAI,EAAE;AAA5D,CAAnB;;AAKA,MAAMC,eAAe,GAAG,QAA0D;EAAA,IAAzD;IAAEC,OAAF;IAAWC,OAAX;IAAoBC,OAApB;IAA6BC,IAA7B;IAAmCC;EAAnC,CAAyD;EAChF,MAAM;IAAEC;EAAF,IAAcZ,eAAe,EAAnC;EACA,MAAM;IAAEa;EAAF,IAAad,aAAa,EAAhC;EACA,MAAMe,KAAK,GAAGD,MAAM,CAACE,EAAP,~~CAAUR~~,~~OAAV~~,~~CAAkBC~~,~~OAAlB~~,~~EAA2BC~~,OAAO,GAAG,SAAH,GAAe,~~SAAjD~~,CAAd;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,~~CAACO~~,MAAM,CAACC,eAAR,EAAyB;MAAEC,eAAe,~~EAAEJ~~,KAAK,~~CAACK~~;IAAzB,CAAzB;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEH,MAAM,CAACI;EAApB,gBACE,oBAAC,IAAD;IACE,IAAI,~~EAAEnB~~,UAAU,CAACS,IAAD,CADlB;IAEE,IAAI,EAAE,EAFR;IAGE,cAAc,EAAE;~~MAAEQ~~,eAAe,~~EAAEL~~,MAAM,~~CAACM~~,UAA1B;MAAsCE,OAAO,EAAE,CAA/C;MAAkDC,YAAY,EAAE,CAAhE;MAAmEC,WAAW,EAAE;IAAhF;EAHlB,EADF,eAME,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,aAAa,EAAE,QAA3B;IAAqC,aAAa,EAAE,CAApD;IAAuD,KAAK,~~EAAET~~,KAAK,~~CAACU~~,OAApE;IAA6E,KAAK,EAAER,MAAM,CAACS;EAA3F,~~GACGb~~,OAAO,~~CAACc~~,aAAR,CAAsBC,yBAAtB,~~CAAgDpB~~,OAAhD,CADH,CANF,CADF,EAWGI,QAXH,CADF;AAeD,CAnBD;;AAqBA,~~MAAMK~~,MAAM,~~GAAGlB~~,gBAAgB,CAAC;~~EAC9BmB~~,eAAe,EAAE;IACfK,YAAY,EAAE,EADC;IAEfM,QAAQ,EAAE;EAFK,CADa;EAK9BR,SAAS,EAAE;IACTS,aAAa,EAAE,KADN;IAETC,UAAU,EAAE,QAFH;IAGTC,iBAAiB,EAAE,EAHV;IAITC,eAAe,EAAE;EAJR,CALmB;EAW9BP,IAAI,EAAE;IACJQ,UAAU,EAAE;EADR;AAXwB,CAAD,CAA/B;AAgBA,~~eAAe3B~~,eAAf"}
1	+ {"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","useLocalization","iconMapper","audio","image","video","file","BaseFileMessage","message","variant","pressed","type","children","STRINGS","colors","color","ui","groupChannelMessage","styles","bubbleContainer","backgroundColor","background","container","padding","borderRadius","marginRight","textMsg","name","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink"],"sources":["BaseFileMessage.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Icon, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\n\nimport { useLocalization } from '../../../hooks/useContext';\nimport type { FileMessageProps } from './index';\n\nconst iconMapper = { audio: 'file-audio', image: 'photo', video: 'play', file: 'file-document' } as const;\n\ntype Props = FileMessageProps & {\n type: 'image' \| 'audio' \| 'video' \| 'file';\n};\nconst BaseFileMessage = ({ message, variant, pressed, type, children }: Props) => {\n const { STRINGS } = useLocalization();\n const { colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage[variant][pressed ? 'pressed' : 'enabled'];\n return (\n <View style={[styles.bubbleContainer, { backgroundColor: color.background }]}>\n <View style={styles.container}>\n <Icon\n icon={iconMapper[type]}\n size={24}\n containerStyle={{ backgroundColor: colors.background, padding: 2, borderRadius: 8, marginRight: 8 }}\n />\n <Text body3 ellipsizeMode={'middle'} numberOfLines={1} color={color.textMsg} style={styles.name}>\n {STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(message)}\n </Text>\n </View>\n {children}\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n bubbleContainer: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingHorizontal: 12,\n paddingVertical: 6,\n },\n name: {\n flexShrink: 1,\n },\n});\n\nexport default BaseFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,IAAT,EAAeC,IAAf,EAAqBC,gBAArB,EAAuCC,aAAvC,QAA4D,yCAA5D;AAEA,SAASC,eAAT,QAAgC,2BAAhC;AAGA,MAAMC,UAAU,GAAG;EAAEC,KAAK,EAAE,YAAT;EAAuBC,KAAK,EAAE,OAA9B;EAAuCC,KAAK,EAAE,MAA9C;EAAsDC,IAAI,EAAE;AAA5D,CAAnB;;AAKA,MAAMC,eAAe,GAAG,QAA0D;EAAA,IAAzD;IAAEC,OAAF;IAAWC,OAAX;IAAoBC,OAApB;IAA6BC,IAA7B;IAAmCC;EAAnC,CAAyD;EAChF,MAAM;IAAEC;EAAF,IAAcZ,eAAe,EAAnC;EACA,MAAM;IAAEa;EAAF,IAAad,aAAa,EAAhC;EACA,MAAMe,KAAK,GAAGD,MAAM,CAACE,EAAP,CAAUC,mBAAV,CAA8BR,OAA9B,EAAuCC,OAAO,GAAG,SAAH,GAAe,SAA7D,CAAd;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACQ,MAAM,CAACC,eAAR,EAAyB;MAAEC,eAAe,EAAEL,KAAK,CAACM;IAAzB,CAAzB;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEH,MAAM,CAACI;EAApB,gBACE,oBAAC,IAAD;IACE,IAAI,EAAEpB,UAAU,CAACS,IAAD,CADlB;IAEE,IAAI,EAAE,EAFR;IAGE,cAAc,EAAE;MAAES,eAAe,EAAEN,MAAM,CAACO,UAA1B;MAAsCE,OAAO,EAAE,CAA/C;MAAkDC,YAAY,EAAE,CAAhE;MAAmEC,WAAW,EAAE;IAAhF;EAHlB,EADF,eAME,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,aAAa,EAAE,QAA3B;IAAqC,aAAa,EAAE,CAApD;IAAuD,KAAK,EAAEV,KAAK,CAACW,OAApE;IAA6E,KAAK,EAAER,MAAM,CAACS;EAA3F,GACGd,OAAO,CAACe,aAAR,CAAsBC,yBAAtB,CAAgDrB,OAAhD,CADH,CANF,CADF,EAWGI,QAXH,CADF;AAeD,CAnBD;;AAqBA,MAAMM,MAAM,GAAGnB,gBAAgB,CAAC;EAC9BoB,eAAe,EAAE;IACfK,YAAY,EAAE,EADC;IAEfM,QAAQ,EAAE;EAFK,CADa;EAK9BR,SAAS,EAAE;IACTS,aAAa,EAAE,KADN;IAETC,UAAU,EAAE,QAFH;IAGTC,iBAAiB,EAAE,EAHV;IAITC,eAAe,EAAE;EAJR,CALmB;EAW9BP,IAAI,EAAE;IACJQ,UAAU,EAAE;EADR;AAXwB,CAAD,CAA/B;AAgBA,eAAe5B,eAAf"}

package/lib/module/components/MessageRenderer/FileMessage/ImageFileMessage.js CHANGED Viewed

@@ -46,7 +46,7 @@ const ImageFileMessage = _ref => {
   const key = useRetry(imageNotFound);
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.bubbleContainer, {
-      backgroundColor: imageNotFound ? colors.onBackground04 : colors.ui.message[variant].enabled.background
+      backgroundColor: imageNotFound ? colors.onBackground04 : colors.ui.groupChannelMessage[variant].enabled.background
     }]
   }, /*#__PURE__*/React.createElement(View, {
     style: style

package/lib/module/components/MessageRenderer/FileMessage/ImageFileMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useEffect","useRef","useState","Platform","StyleSheet","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","useForceUpdate","useRetry","hasError","retryCount","OS","forceUpdate","retryCountRef","retryTimeoutRef","reloadReservation","current","setTimeout","clearTimeout","ImageFileMessage","message","children","variant","colors","imageNotFound","setImageNotFound","fileUrl","style","styles","image","backgroundColor","onBackground04","key","bubbleContainer","ui","enabled","background","uri","absoluteFill","hide","onBackground02","borderRadius","overflow","width","maxWidth","height","display"],"sources":["ImageFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Platform, StyleSheet, View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage, useForceUpdate } from '@sendbird/uikit-utils';\n\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (hasError: boolean, retryCount = 5) => {\n if (Platform.OS === 'android') return '';\n\n const forceUpdate = useForceUpdate();\n const retryCountRef = useRef(1);\n const retryTimeoutRef = useRef<NodeJS.Timeout>();\n\n useEffect(() => {\n if (hasError) {\n const reloadReservation = () => {\n if (retryCountRef.current < retryCount) {\n retryTimeoutRef.current = setTimeout(() => {\n retryCountRef.current++;\n reloadReservation();\n forceUpdate();\n }, retryCountRef.current * 5000);\n }\n };\n\n return reloadReservation();\n } else {\n return clearTimeout(retryTimeoutRef.current);\n }\n }, [hasError]);\n\n return retryCountRef.current;\n};\n\nconst ImageFileMessage = ({ message, children, variant }: FileMessageProps) => {\n const { colors } = useUIKitTheme();\n const [imageNotFound, setImageNotFound] = useState(false);\n\n const fileUrl = getAvailableUriFromFileMessage(message);\n const style = [styles.image, { backgroundColor: colors.onBackground04 }];\n\n const key = useRetry(imageNotFound);\n\n return (\n <View\n style={[\n styles.bubbleContainer,\n { backgroundColor: imageNotFound ? colors.onBackground04 : colors.ui.~~message~~[variant].enabled.background },\n ]}\n >\n <View style={style}>\n <Image\n key={key}\n source={{ uri: fileUrl }}\n style={[StyleSheet.absoluteFill, imageNotFound && styles.hide]}\n resizeMode={'cover'}\n resizeMethod={'resize'}\n onError={() => setImageNotFound(true)}\n onLoad={() => setImageNotFound(false)}\n />\n {imageNotFound && (\n <Icon\n containerStyle={StyleSheet.absoluteFill}\n icon={'thumbnail-none'}\n size={48}\n color={colors.onBackground02}\n />\n )}\n </View>\n {children}\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n bubbleContainer: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n width: 240,\n maxWidth: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n hide: {\n display: 'none',\n },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,MAA3B,EAAmCC,QAAnC,QAAmD,OAAnD;AACA,SAASC,QAAT,EAAmBC,UAAnB,EAA+BC,IAA/B,QAA2C,cAA3C;AAEA,SAASC,IAAT,EAAeC,KAAf,EAAsBC,gBAAtB,EAAwCC,aAAxC,QAA6D,yCAA7D;AACA,SAASC,8BAAT,EAAyCC,cAAzC,QAA+D,uBAA/D;;AAIA,MAAMC,QAAQ,GAAG,UAACC,QAAD,EAAuC;EAAA,IAAnBC,UAAmB,uEAAN,CAAM;EACtD,IAAIX,QAAQ,CAACY,EAAT,KAAgB,SAApB,EAA+B,OAAO,EAAP;EAE/B,MAAMC,WAAW,GAAGL,cAAc,EAAlC;EACA,MAAMM,aAAa,GAAGhB,MAAM,CAAC,CAAD,CAA5B;EACA,MAAMiB,eAAe,GAAGjB,MAAM,EAA9B;EAEAD,SAAS,CAAC,MAAM;IACd,IAAIa,QAAJ,EAAc;MACZ,MAAMM,iBAAiB,GAAG,MAAM;QAC9B,IAAIF,aAAa,CAACG,OAAd,GAAwBN,UAA5B,EAAwC;UACtCI,eAAe,CAACE,OAAhB,GAA0BC,UAAU,CAAC,MAAM;YACzCJ,aAAa,CAACG,OAAd;YACAD,iBAAiB;YACjBH,WAAW;UACZ,CAJmC,EAIjCC,aAAa,CAACG,OAAd,GAAwB,IAJS,CAApC;QAKD;MACF,CARD;;MAUA,OAAOD,iBAAiB,EAAxB;IACD,CAZD,MAYO;MACL,OAAOG,YAAY,CAACJ,eAAe,CAACE,OAAjB,CAAnB;IACD;EACF,CAhBQ,EAgBN,CAACP,QAAD,CAhBM,CAAT;EAkBA,OAAOI,aAAa,CAACG,OAArB;AACD,CA1BD;;AA4BA,MAAMG,gBAAgB,GAAG,QAAsD;EAAA,IAArD;IAAEC,OAAF;IAAWC,QAAX;IAAqBC;EAArB,CAAqD;EAC7E,MAAM;IAAEC;EAAF,IAAalB,aAAa,EAAhC;EACA,MAAM,CAACmB,aAAD,EAAgBC,gBAAhB,IAAoC3B,QAAQ,CAAC,KAAD,CAAlD;EAEA,MAAM4B,OAAO,GAAGpB,8BAA8B,CAACc,OAAD,CAA9C;EACA,MAAMO,KAAK,GAAG,CAACC,MAAM,CAACC,KAAR,EAAe;IAAEC,eAAe,EAAEP,MAAM,CAACQ;EAA1B,CAAf,CAAd;EAEA,MAAMC,GAAG,GAAGxB,QAAQ,CAACgB,aAAD,CAApB;EAEA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLI,MAAM,CAACK,eADF,EAEL;~~MAAEH~~,eAAe,EAAEN,aAAa,~~GAAGD~~,MAAM,CAACQ,~~cAAV~~,~~GAA2BR~~,MAAM,CAACW,EAAP,~~CAAUd~~,~~OAAV~~,~~CAAkBE~~,~~OAAlB~~,~~EAA2Ba~~,~~OAA3B~~,~~CAAmCC~~;~~IAA9F~~,CAFK;EADT,~~gBAME~~,oBAAC,IAAD;IAAM,KAAK,~~EAAET~~;EAAb,gBACE,oBAAC,KAAD;IACE,GAAG,EAAEK,GADP;IAEE,MAAM,EAAE;~~MAAEK~~,GAAG,~~EAAEX~~;IAAP,CAFV;IAGE,KAAK,EAAE,CAAC1B,UAAU,~~CAACsC~~,YAAZ,~~EAA0Bd~~,aAAa,IAAII,MAAM,~~CAACW~~,IAAlD,CAHT;IAIE,UAAU,EAAE,OAJd;IAKE,YAAY,EAAE,QALhB;IAME,OAAO,EAAE,~~MAAMd~~,gBAAgB,CAAC,IAAD,CANjC;IAOE,MAAM,EAAE,MAAMA,gBAAgB,CAAC,KAAD;EAPhC,EADF,EAUGD,aAAa,iBACZ,oBAAC,IAAD;IACE,cAAc,EAAExB,UAAU,~~CAACsC~~,YAD7B;IAEE,IAAI,EAAE,gBAFR;IAGE,IAAI,EAAE,EAHR;IAIE,KAAK,~~EAAEf~~,MAAM,~~CAACiB~~;EAJhB,EAXJ,~~CANF~~,~~EAyBGnB~~,~~QAzBH~~,CADF;~~AA6BD~~,~~CAtCD~~;;~~AAwCA~~,MAAMO,MAAM,GAAGxB,gBAAgB,CAAC;EAC9B6B,eAAe,EAAE;~~IACfQ~~,YAAY,EAAE,EADC;IAEfC,QAAQ,EAAE;EAFK,CADa;~~EAK9Bb~~,KAAK,EAAE;~~IACLc~~,KAAK,EAAE,GADF;IAELC,QAAQ,EAAE,GAFL;IAGLC,MAAM,EAAE,GAHH;IAILJ,YAAY,EAAE,EAJT;IAKLC,QAAQ,EAAE;EALL,CALuB;EAY9BH,IAAI,EAAE;IACJO,OAAO,EAAE;EADL;AAZwB,CAAD,CAA/B;AAiBA,~~eAAe3B~~,gBAAf"}
1	+ {"version":3,"names":["React","useEffect","useRef","useState","Platform","StyleSheet","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","useForceUpdate","useRetry","hasError","retryCount","OS","forceUpdate","retryCountRef","retryTimeoutRef","reloadReservation","current","setTimeout","clearTimeout","ImageFileMessage","message","children","variant","colors","imageNotFound","setImageNotFound","fileUrl","style","styles","image","backgroundColor","onBackground04","key","bubbleContainer","ui","groupChannelMessage","enabled","background","uri","absoluteFill","hide","onBackground02","borderRadius","overflow","width","maxWidth","height","display"],"sources":["ImageFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Platform, StyleSheet, View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage, useForceUpdate } from '@sendbird/uikit-utils';\n\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (hasError: boolean, retryCount = 5) => {\n if (Platform.OS === 'android') return '';\n\n const forceUpdate = useForceUpdate();\n const retryCountRef = useRef(1);\n const retryTimeoutRef = useRef<NodeJS.Timeout>();\n\n useEffect(() => {\n if (hasError) {\n const reloadReservation = () => {\n if (retryCountRef.current < retryCount) {\n retryTimeoutRef.current = setTimeout(() => {\n retryCountRef.current++;\n reloadReservation();\n forceUpdate();\n }, retryCountRef.current * 5000);\n }\n };\n\n return reloadReservation();\n } else {\n return clearTimeout(retryTimeoutRef.current);\n }\n }, [hasError]);\n\n return retryCountRef.current;\n};\n\nconst ImageFileMessage = ({ message, children, variant }: FileMessageProps) => {\n const { colors } = useUIKitTheme();\n const [imageNotFound, setImageNotFound] = useState(false);\n\n const fileUrl = getAvailableUriFromFileMessage(message);\n const style = [styles.image, { backgroundColor: colors.onBackground04 }];\n\n const key = useRetry(imageNotFound);\n\n return (\n <View\n style={[\n styles.bubbleContainer,\n {\n backgroundColor: imageNotFound\n ? colors.onBackground04\n : colors.ui.groupChannelMessage[variant].enabled.background,\n },\n ]}\n >\n <View style={style}>\n <Image\n key={key}\n source={{ uri: fileUrl }}\n style={[StyleSheet.absoluteFill, imageNotFound && styles.hide]}\n resizeMode={'cover'}\n resizeMethod={'resize'}\n onError={() => setImageNotFound(true)}\n onLoad={() => setImageNotFound(false)}\n />\n {imageNotFound && (\n <Icon\n containerStyle={StyleSheet.absoluteFill}\n icon={'thumbnail-none'}\n size={48}\n color={colors.onBackground02}\n />\n )}\n </View>\n {children}\n </View>\n );\n};\n\nconst styles = createStyleSheet({\n bubbleContainer: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n width: 240,\n maxWidth: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n hide: {\n display: 'none',\n },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"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"}

package/lib/module/components/MessageRenderer/FileMessage/VideoFileMessage.js CHANGED Viewed

@@ -69,7 +69,7 @@ const VideoFileMessage = _ref => {
   if (loading) {
     return /*#__PURE__*/React.createElement(View, {
       style: [styles.bubbleContainer, {
-        backgroundColor: colors.ui.message[variant].enabled.background
+        backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
       }]
     }, /*#__PURE__*/React.createElement(View, {
       style: [styles.bubbleContainer, styles.bubbleInnerContainer]
@@ -80,7 +80,7 @@ const VideoFileMessage = _ref => {
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.bubbleContainer, {
-      backgroundColor: colors.ui.message[variant].enabled.background
+      backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
     }]
   }, /*#__PURE__*/React.createElement(View, {
     style: [styles.bubbleContainer, styles.bubbleInnerContainer]