stream-chat-react-native-core 4.4.0 → 4.5.1-beta.1

package/lib/commonjs/components/MessageInput/FileUploadPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["FileUploadPreview.tsx"],"names":["FILE_PREVIEW_HEIGHT","styles","StyleSheet","create","dismiss","borderRadius","height","position","right","top","width","fileContainer","borderWidth","flexDirection","justifyContent","marginBottom","padding","fileContentContainer","filenameText","fontSize","fontWeight","paddingLeft","fileSizeText","fileTextContainer","flatList","maxHeight","overlay","marginLeft","marginRight","FileUploadPreviewWithContext","props","FileAttachmentIcon","fileUploads","removeFile","uploadFile","flatListRef","flatListWidth","setFlatListWidth","theme","colors","black","grey","grey_whisper","messageInput","fileUploadPreview","renderItem","index","item","indicatorType","state","FileState","UPLOADING","ProgressIndicatorTypes","IN_PROGRESS","UPLOAD_FAILED","RETRY","undefined","newFile","UPLOADED","FINISHED","length","borderColor","file","type","color","name","size","id","backgroundColor","fileUploadsLength","current","setTimeout","scrollToEnd","_","offset","nativeEvent","layout","areEqual","prevProps","nextProps","prevFileUploads","nextFileUploads","every","prevFileUpload","MemoizedFileUploadPreview","React","memo","FileUploadPreview","displayName"],"mappings":"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","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FlatList, StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport { UploadProgressIndicator } from './UploadProgressIndicator';\n\nimport {\n  FileUpload,\n  MessageInputContextValue,\n  useMessageInputContext,\n} from '../../contexts/messageInputContext/MessageInputContext';\nimport {\n  MessagesContextValue,\n  useMessagesContext,\n} from '../../contexts/messagesContext/MessagesContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { Close } from '../../icons/Close';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\nimport { FileState, ProgressIndicatorTypes } from '../../utils/utils';\n\nimport { getFileSizeDisplayText } from '../Attachment/FileAttachment';\n\nconst FILE_PREVIEW_HEIGHT = 60;\n\nconst styles = StyleSheet.create({\n  dismiss: {\n    borderRadius: 24,\n    height: 24,\n    position: 'absolute',\n    right: 14,\n    top: 4,\n    width: 24,\n  },\n  fileContainer: {\n    borderRadius: 12,\n    borderWidth: 1,\n    flexDirection: 'row',\n    height: FILE_PREVIEW_HEIGHT,\n    justifyContent: 'space-between',\n    marginBottom: 8,\n    padding: 8,\n  },\n  fileContentContainer: { flexDirection: 'row' },\n  filenameText: {\n    fontSize: 14,\n    fontWeight: 'bold',\n    paddingLeft: 10,\n  },\n  fileSizeText: {\n    fontSize: 12,\n    paddingLeft: 10,\n  },\n  fileTextContainer: {\n    height: '100%',\n    justifyContent: 'space-around',\n  },\n  flatList: { marginBottom: 12, maxHeight: FILE_PREVIEW_HEIGHT * 2.5 + 16 },\n  overlay: {\n    borderRadius: 12,\n    marginLeft: 8,\n    marginRight: 8,\n  },\n});\n\ntype FileUploadPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  MessageInputContextValue<StreamChatGenerics>,\n  'fileUploads' | 'removeFile' | 'uploadFile'\n> &\n  Pick<MessagesContextValue<StreamChatGenerics>, 'FileAttachmentIcon'>;\n\nconst FileUploadPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { FileAttachmentIcon, fileUploads, removeFile, uploadFile } = props;\n\n  const flatListRef = useRef<FlatList<FileUpload> | null>(null);\n  const [flatListWidth, setFlatListWidth] = useState(0);\n\n  const {\n    theme: {\n      colors: { black, grey, grey_whisper, overlay },\n      messageInput: {\n        fileUploadPreview: {\n          dismiss,\n          fileContainer,\n          fileContentContainer,\n          filenameText,\n          fileSizeText,\n          fileTextContainer,\n          flatList,\n        },\n      },\n    },\n  } = useTheme();\n\n  const renderItem = ({ index, item }: { index: number; item: FileUpload }) => {\n    const indicatorType =\n      item.state === FileState.UPLOADING\n        ? ProgressIndicatorTypes.IN_PROGRESS\n        : item.state === FileState.UPLOAD_FAILED\n        ? ProgressIndicatorTypes.RETRY\n        : undefined;\n\n    return (\n      <>\n        <UploadProgressIndicator\n          action={() => {\n            uploadFile({ newFile: item });\n          }}\n          active={item.state !== FileState.UPLOADED && item.state !== FileState.FINISHED}\n          style={styles.overlay}\n          type={indicatorType}\n        >\n          <View\n            style={[\n              styles.fileContainer,\n              index === fileUploads.length - 1\n                ? {\n                    marginBottom: 0,\n                  }\n                : {},\n              {\n                borderColor: grey_whisper,\n                width: flatListWidth - 16,\n              },\n              fileContainer,\n            ]}\n          >\n            <View style={[styles.fileContentContainer, fileContentContainer]}>\n              <FileAttachmentIcon mimeType={item.file.type} />\n              <View style={[styles.fileTextContainer, fileTextContainer]}>\n                <Text\n                  numberOfLines={1}\n                  style={[\n                    styles.filenameText,\n                    {\n                      color: black,\n                      width:\n                        flatListWidth -\n                        16 - // 16 = horizontal padding\n                        40 - // 40 = file icon size\n                        24 - // 24 = close icon size\n                        24, // 24 = internal padding\n                    },\n                    filenameText,\n                  ]}\n                >\n                  {item.file.name || ''}\n                </Text>\n                <Text style={[styles.fileSizeText, { color: grey }, fileSizeText]}>\n                  {getFileSizeDisplayText(item.file.size)}\n                </Text>\n              </View>\n            </View>\n          </View>\n        </UploadProgressIndicator>\n        <TouchableOpacity\n          onPress={() => {\n            removeFile(item.id);\n          }}\n          style={[styles.dismiss, { backgroundColor: overlay }, dismiss]}\n          testID='remove-file-upload-preview'\n        >\n          <Close />\n        </TouchableOpacity>\n      </>\n    );\n  };\n\n  const fileUploadsLength = fileUploads.length;\n\n  useEffect(() => {\n    if (fileUploadsLength && flatListRef.current) {\n      setTimeout(() => flatListRef.current?.scrollToEnd(), 1);\n    }\n  }, [fileUploadsLength]);\n\n  return fileUploadsLength ? (\n    <FlatList\n      data={fileUploads}\n      getItemLayout={(_, index) => ({\n        index,\n        length: FILE_PREVIEW_HEIGHT + 8,\n        offset: (FILE_PREVIEW_HEIGHT + 8) * index,\n      })}\n      keyExtractor={(item) => item.id}\n      onLayout={({\n        nativeEvent: {\n          layout: { width },\n        },\n      }) => {\n        setFlatListWidth(width);\n      }}\n      ref={flatListRef}\n      renderItem={renderItem}\n      style={[styles.flatList, flatList]}\n    />\n  ) : null;\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n  nextProps: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { fileUploads: prevFileUploads } = prevProps;\n  const { fileUploads: nextFileUploads } = nextProps;\n\n  return (\n    prevFileUploads.length === nextFileUploads.length &&\n    prevFileUploads.every(\n      (prevFileUpload, index) => prevFileUpload.state === nextFileUploads[index].state,\n    )\n  );\n};\n\nconst MemoizedFileUploadPreview = React.memo(\n  FileUploadPreviewWithContext,\n  areEqual,\n) as typeof FileUploadPreviewWithContext;\n\nexport type FileUploadPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<FileUploadPreviewPropsWithContext<StreamChatGenerics>>;\n\n/**\n * FileUploadPreview\n * UI Component to preview the files set for upload\n */\nexport const FileUploadPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: FileUploadPreviewProps<StreamChatGenerics>,\n) => {\n  const { fileUploads, removeFile, uploadFile } = useMessageInputContext<StreamChatGenerics>();\n  const { FileAttachmentIcon } = useMessagesContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedFileUploadPreview\n      {...{ FileAttachmentIcon, fileUploads, removeFile, uploadFile }}\n      {...props}\n    />\n  );\n};\n\nFileUploadPreview.displayName = 'FileUploadPreview{messageInput{fileUploadPreview}}';\n"]}
+{"version":3,"sources":["FileUploadPreview.tsx"],"names":["FILE_PREVIEW_HEIGHT","WARNING_ICON_SIZE","styles","StyleSheet","create","dismiss","borderRadius","height","position","right","top","width","fileContainer","borderWidth","flexDirection","justifyContent","marginBottom","padding","fileContentContainer","filenameText","fontSize","fontWeight","paddingLeft","fileSizeText","fileTextContainer","flatList","maxHeight","overlay","marginLeft","marginRight","unsupportedFile","unsupportedFileText","warningIconStyle","marginTop","UnsupportedFileTypeOrFileSizeIndicator","indicatorType","item","theme","colors","accent_red","grey","messageInput","fileUploadPreview","t","ProgressIndicatorTypes","NOT_SUPPORTED","color","file","size","FileUploadPreviewWithContext","props","FileAttachmentIcon","fileUploads","removeFile","uploadFile","flatListRef","flatListWidth","setFlatListWidth","black","grey_whisper","renderItem","index","state","newFile","length","borderColor","type","name","id","backgroundColor","fileUploadsLength","current","setTimeout","scrollToEnd","_","offset","nativeEvent","layout","areEqual","prevProps","nextProps","prevFileUploads","nextFileUploads","every","prevFileUpload","MemoizedFileUploadPreview","React","memo","FileUploadPreview","displayName"],"mappings":"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","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FlatList, StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport { UploadProgressIndicator } from './UploadProgressIndicator';\n\nimport {\n  FileUpload,\n  MessageInputContextValue,\n  useMessageInputContext,\n} from '../../contexts/messageInputContext/MessageInputContext';\nimport {\n  MessagesContextValue,\n  useMessagesContext,\n} from '../../contexts/messagesContext/MessagesContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../icons/Close';\nimport { Warning } from '../../icons/Warning';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\nimport { getIndicatorTypeForFileState, ProgressIndicatorTypes } from '../../utils/utils';\nimport { getFileSizeDisplayText } from '../Attachment/FileAttachment';\n\nconst FILE_PREVIEW_HEIGHT = 60;\nconst WARNING_ICON_SIZE = 16;\n\nconst styles = StyleSheet.create({\n  dismiss: {\n    borderRadius: 24,\n    height: 24,\n    position: 'absolute',\n    right: 14,\n    top: 4,\n    width: 24,\n  },\n  fileContainer: {\n    borderRadius: 12,\n    borderWidth: 1,\n    flexDirection: 'row',\n    height: FILE_PREVIEW_HEIGHT,\n    justifyContent: 'space-between',\n    marginBottom: 8,\n    padding: 8,\n  },\n  fileContentContainer: { flexDirection: 'row' },\n  filenameText: {\n    fontSize: 14,\n    fontWeight: 'bold',\n    paddingLeft: 10,\n  },\n  fileSizeText: {\n    fontSize: 12,\n    paddingLeft: 10,\n  },\n  fileTextContainer: {\n    height: '100%',\n    justifyContent: 'space-around',\n  },\n  flatList: { marginBottom: 12, maxHeight: FILE_PREVIEW_HEIGHT * 2.5 + 16 },\n  overlay: {\n    borderRadius: 12,\n    marginLeft: 8,\n    marginRight: 8,\n  },\n  unsupportedFile: {\n    flexDirection: 'row',\n    paddingLeft: 10,\n  },\n  unsupportedFileText: {\n    fontSize: 16,\n  },\n  warningIconStyle: {\n    borderRadius: 24,\n    marginTop: 4,\n  },\n});\n\nconst UnsupportedFileTypeOrFileSizeIndicator = ({\n  indicatorType,\n  item,\n}: {\n  indicatorType: typeof ProgressIndicatorTypes[keyof typeof ProgressIndicatorTypes];\n  item: FileUpload;\n}) => {\n  const {\n    theme: {\n      colors: { accent_red, grey },\n      messageInput: {\n        fileUploadPreview: { fileSizeText },\n      },\n    },\n  } = useTheme();\n\n  const { t } = useTranslationContext();\n  return indicatorType === ProgressIndicatorTypes.NOT_SUPPORTED ? (\n    <View style={styles.unsupportedFile}>\n      <Warning\n        height={WARNING_ICON_SIZE}\n        pathFill={accent_red}\n        style={styles.warningIconStyle}\n        width={WARNING_ICON_SIZE}\n      />\n      <Text style={[styles.unsupportedFileText, { color: grey }]}>\n        {t('File type not supported')}\n      </Text>\n    </View>\n  ) : (\n    <Text style={[styles.fileSizeText, { color: grey }, fileSizeText]}>\n      {getFileSizeDisplayText(item.file.size)}\n    </Text>\n  );\n};\n\ntype FileUploadPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  MessageInputContextValue<StreamChatGenerics>,\n  'fileUploads' | 'removeFile' | 'uploadFile'\n> &\n  Pick<MessagesContextValue<StreamChatGenerics>, 'FileAttachmentIcon'>;\n\nconst FileUploadPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { FileAttachmentIcon, fileUploads, removeFile, uploadFile } = props;\n\n  const flatListRef = useRef<FlatList<FileUpload> | null>(null);\n  const [flatListWidth, setFlatListWidth] = useState(0);\n\n  const {\n    theme: {\n      colors: { black, grey_whisper, overlay },\n      messageInput: {\n        fileUploadPreview: {\n          dismiss,\n          fileContainer,\n          fileContentContainer,\n          filenameText,\n          fileTextContainer,\n          flatList,\n        },\n      },\n    },\n  } = useTheme();\n\n  const renderItem = ({ index, item }: { index: number; item: FileUpload }) => {\n    const indicatorType = getIndicatorTypeForFileState(item.state);\n\n    return (\n      <>\n        <UploadProgressIndicator\n          action={() => {\n            uploadFile({ newFile: item });\n          }}\n          style={styles.overlay}\n          type={indicatorType}\n        >\n          <View\n            style={[\n              styles.fileContainer,\n              index === fileUploads.length - 1\n                ? {\n                    marginBottom: 0,\n                  }\n                : {},\n              {\n                borderColor: grey_whisper,\n                width: flatListWidth - 16,\n              },\n              fileContainer,\n            ]}\n          >\n            <View style={[styles.fileContentContainer, fileContentContainer]}>\n              <FileAttachmentIcon mimeType={item.file.type} />\n              <View style={[styles.fileTextContainer, fileTextContainer]}>\n                <Text\n                  numberOfLines={1}\n                  style={[\n                    styles.filenameText,\n                    {\n                      color: black,\n                      width:\n                        flatListWidth -\n                        16 - // 16 = horizontal padding\n                        40 - // 40 = file icon size\n                        24 - // 24 = close icon size\n                        24, // 24 = internal padding\n                    },\n                    filenameText,\n                  ]}\n                >\n                  {item.file.name || ''}\n                </Text>\n                {indicatorType !== null && (\n                  <UnsupportedFileTypeOrFileSizeIndicator\n                    indicatorType={indicatorType}\n                    item={item}\n                  />\n                )}\n              </View>\n            </View>\n          </View>\n        </UploadProgressIndicator>\n        <TouchableOpacity\n          onPress={() => {\n            removeFile(item.id);\n          }}\n          style={[styles.dismiss, { backgroundColor: overlay }, dismiss]}\n          testID='remove-file-upload-preview'\n        >\n          <Close />\n        </TouchableOpacity>\n      </>\n    );\n  };\n\n  const fileUploadsLength = fileUploads.length;\n\n  useEffect(() => {\n    if (fileUploadsLength && flatListRef.current) {\n      setTimeout(() => flatListRef.current?.scrollToEnd(), 1);\n    }\n  }, [fileUploadsLength]);\n\n  return fileUploadsLength ? (\n    <FlatList\n      data={fileUploads}\n      getItemLayout={(_, index) => ({\n        index,\n        length: FILE_PREVIEW_HEIGHT + 8,\n        offset: (FILE_PREVIEW_HEIGHT + 8) * index,\n      })}\n      keyExtractor={(item) => item.id}\n      onLayout={({\n        nativeEvent: {\n          layout: { width },\n        },\n      }) => {\n        setFlatListWidth(width);\n      }}\n      ref={flatListRef}\n      renderItem={renderItem}\n      style={[styles.flatList, flatList]}\n    />\n  ) : null;\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n  nextProps: FileUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { fileUploads: prevFileUploads } = prevProps;\n  const { fileUploads: nextFileUploads } = nextProps;\n\n  return (\n    prevFileUploads.length === nextFileUploads.length &&\n    prevFileUploads.every(\n      (prevFileUpload, index) => prevFileUpload.state === nextFileUploads[index].state,\n    )\n  );\n};\n\nconst MemoizedFileUploadPreview = React.memo(\n  FileUploadPreviewWithContext,\n  areEqual,\n) as typeof FileUploadPreviewWithContext;\n\nexport type FileUploadPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<FileUploadPreviewPropsWithContext<StreamChatGenerics>>;\n\n/**\n * FileUploadPreview\n * UI Component to preview the files set for upload\n */\nexport const FileUploadPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: FileUploadPreviewProps<StreamChatGenerics>,\n) => {\n  const { fileUploads, removeFile, uploadFile } = useMessageInputContext<StreamChatGenerics>();\n\n  const { FileAttachmentIcon } = useMessagesContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedFileUploadPreview\n      {...{ FileAttachmentIcon, fileUploads, removeFile, uploadFile }}\n      {...props}\n    />\n  );\n};\n\nFileUploadPreview.displayName = 'FileUploadPreview{messageInput{fileUploadPreview}}';\n"]}

package/lib/commonjs/components/MessageInput/ImageUploadPreview.js

@@ -17,14 +17,19 @@ var _MessageInputContext = require("../../contexts/messageInputContext/MessageIn
 
 var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
 
+var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
+
 var _Close = require("../../icons/Close");
 
+var _Warning = require("../../icons/Warning");
+
 var _utils = require("../../utils/utils");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/ImageUploadPreview.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/ImageUploadPreview.tsx";
 
 var IMAGE_PREVIEW_SIZE = 100;
+var WARNING_ICON_SIZE = 16;
 
 var styles = _reactNative.StyleSheet.create({
   dismiss: {
@@ -33,18 +38,46 @@ var styles = _reactNative.StyleSheet.create({
     right: 8,
     top: 8
   },
+  fileSizeText: {
+    fontSize: 12,
+    paddingLeft: 10
+  },
   flatList: {
     paddingBottom: 12
   },
+  iconContainer: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    justifyContent: 'center'
+  },
   itemContainer: {
     flexDirection: 'row',
     height: IMAGE_PREVIEW_SIZE,
     marginLeft: 8
   },
+  unsupportedImage: {
+    borderRadius: 20,
+    bottom: 8,
+    flexDirection: 'row',
+    marginLeft: 3,
+    position: 'absolute'
+  },
   upload: {
     borderRadius: 10,
     height: IMAGE_PREVIEW_SIZE,
     width: IMAGE_PREVIEW_SIZE
+  },
+  warningIconStyle: {
+    borderRadius: 24,
+    marginLeft: 4,
+    marginTop: 4
+  },
+  warningText: {
+    alignItems: 'center',
+    color: 'black',
+    fontSize: 10,
+    justifyContent: 'center',
+    paddingRight: 8
   }
 });
 
@@ -55,27 +88,81 @@ var ImageUploadPreviewWithContext = function ImageUploadPreviewWithContext(props
 
   var _useTheme = (0, _ThemeContext.useTheme)(),
       _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      overlay = _useTheme$theme$color.overlay,
-      white = _useTheme$theme$color.white,
+      overlay = _useTheme$theme.colors.overlay,
       _useTheme$theme$messa = _useTheme$theme.messageInput.imageUploadPreview,
       dismiss = _useTheme$theme$messa.dismiss,
       flatList = _useTheme$theme$messa.flatList,
       itemContainer = _useTheme$theme$messa.itemContainer,
       upload = _useTheme$theme$messa.upload;
 
-  var renderItem = function renderItem(_ref) {
-    var index = _ref.index,
-        item = _ref.item;
+  var UnsupportedImageTypeIndicator = function UnsupportedImageTypeIndicator(_ref) {
+    var indicatorType = _ref.indicatorType;
+
+    var _useTheme2 = (0, _ThemeContext.useTheme)(),
+        _useTheme2$theme$colo = _useTheme2.theme.colors,
+        accent_red = _useTheme2$theme$colo.accent_red,
+        overlay = _useTheme2$theme$colo.overlay,
+        white = _useTheme2$theme$colo.white;
+
+    var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
+        t = _useTranslationContex.t;
+
+    return indicatorType === _utils.ProgressIndicatorTypes.NOT_SUPPORTED ? _react["default"].createElement(_reactNative.View, {
+      style: [styles.unsupportedImage, {
+        backgroundColor: overlay
+      }],
+      __self: _this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 111,
+        columnNumber: 7
+      }
+    }, _react["default"].createElement(_reactNative.View, {
+      style: [styles.iconContainer],
+      __self: _this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 112,
+        columnNumber: 9
+      }
+    }, _react["default"].createElement(_Warning.Warning, {
+      height: WARNING_ICON_SIZE,
+      pathFill: accent_red,
+      style: styles.warningIconStyle,
+      width: WARNING_ICON_SIZE,
+      __self: _this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 113,
+        columnNumber: 11
+      }
+    }), _react["default"].createElement(_reactNative.Text, {
+      style: [styles.warningText, {
+        color: white
+      }],
+      __self: _this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 119,
+        columnNumber: 11
+      }
+    }, t('Not supported')))) : null;
+  };
+
+  var renderItem = function renderItem(_ref2) {
+    var index = _ref2.index,
+        item = _ref2.item;
+    var indicatorType = (0, _utils.getIndicatorTypeForFileState)(item.state);
+    var itemMarginForIndex = index === imageUploads.length - 1 ? {
+      marginRight: 8
+    } : {};
     return _react["default"].createElement(_reactNative.View, {
-      style: [styles.itemContainer, index === imageUploads.length - 1 ? {
-        marginRight: 8
-      } : {}, itemContainer],
+      style: [styles.itemContainer, itemMarginForIndex, itemContainer],
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 66,
-        columnNumber: 5
+        lineNumber: 130,
+        columnNumber: 7
       }
     }, _react["default"].createElement(_UploadProgressIndicator.UploadProgressIndicator, {
       action: function action() {
@@ -83,14 +170,13 @@ var ImageUploadPreviewWithContext = function ImageUploadPreviewWithContext(props
           newImage: item
         });
       },
-      active: item.state !== _utils.FileState.UPLOADED && item.state !== _utils.FileState.FINISHED,
       style: styles.upload,
-      type: item.state === _utils.FileState.UPLOADING ? _utils.ProgressIndicatorTypes.IN_PROGRESS : item.state === _utils.FileState.UPLOAD_FAILED ? _utils.ProgressIndicatorTypes.RETRY : undefined,
+      type: indicatorType,
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 73,
-        columnNumber: 7
+        lineNumber: 131,
+        columnNumber: 9
       }
     }, _react["default"].createElement(_reactNative.Image, {
       resizeMode: "cover",
@@ -101,8 +187,8 @@ var ImageUploadPreviewWithContext = function ImageUploadPreviewWithContext(props
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 87,
-        columnNumber: 9
+        lineNumber: 138,
+        columnNumber: 11
       }
     })), _react["default"].createElement(_reactNative.TouchableOpacity, {
       onPress: function onPress() {
@@ -115,18 +201,25 @@ var ImageUploadPreviewWithContext = function ImageUploadPreviewWithContext(props
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 93,
-        columnNumber: 7
+        lineNumber: 144,
+        columnNumber: 9
       }
     }, _react["default"].createElement(_Close.Close, {
-      pathFill: white,
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 100,
+        lineNumber: 151,
+        columnNumber: 11
+      }
+    })), _react["default"].createElement(UnsupportedImageTypeIndicator, {
+      indicatorType: indicatorType,
+      __self: _this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 153,
         columnNumber: 9
       }
-    })));
+    }));
   };
 
   return imageUploads.length > 0 ? _react["default"].createElement(_reactNative.FlatList, {
@@ -147,7 +240,7 @@ var ImageUploadPreviewWithContext = function ImageUploadPreviewWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 106,
+      lineNumber: 159,
       columnNumber: 5
     }
   }) : null;
@@ -177,7 +270,7 @@ var ImageUploadPreview = function ImageUploadPreview(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 152,
+      lineNumber: 205,
       columnNumber: 5
     }
   }));

package/lib/commonjs/components/MessageInput/ImageUploadPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageUploadPreview.tsx"],"names":["IMAGE_PREVIEW_SIZE","styles","StyleSheet","create","dismiss","borderRadius","position","right","top","flatList","paddingBottom","itemContainer","flexDirection","height","marginLeft","upload","width","ImageUploadPreviewWithContext","props","imageUploads","removeImage","uploadImage","theme","colors","overlay","white","messageInput","imageUploadPreview","renderItem","index","item","length","marginRight","newImage","state","FileState","UPLOADED","FINISHED","UPLOADING","ProgressIndicatorTypes","IN_PROGRESS","UPLOAD_FAILED","RETRY","undefined","uri","file","url","id","backgroundColor","_","offset","areEqual","prevProps","nextProps","prevImageUploads","nextImageUploads","every","prevImageUpload","MemoizedImageUploadPreviewWithContext","React","memo","ImageUploadPreview","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { FlatList, Image, StyleSheet, TouchableOpacity, View } from 'react-native';\n\nimport { UploadProgressIndicator } from './UploadProgressIndicator';\n\nimport {\n  ImageUpload,\n  MessageInputContextValue,\n  useMessageInputContext,\n} from '../../contexts/messageInputContext/MessageInputContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { Close } from '../../icons/Close';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\nimport { FileState, ProgressIndicatorTypes } from '../../utils/utils';\n\nconst IMAGE_PREVIEW_SIZE = 100;\n\nconst styles = StyleSheet.create({\n  dismiss: {\n    borderRadius: 24,\n    position: 'absolute',\n    right: 8,\n    top: 8,\n  },\n  flatList: { paddingBottom: 12 },\n  itemContainer: {\n    flexDirection: 'row',\n    height: IMAGE_PREVIEW_SIZE,\n    marginLeft: 8,\n  },\n  upload: {\n    borderRadius: 10,\n    height: IMAGE_PREVIEW_SIZE,\n    width: IMAGE_PREVIEW_SIZE,\n  },\n});\n\ntype ImageUploadPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  MessageInputContextValue<StreamChatGenerics>,\n  'imageUploads' | 'removeImage' | 'uploadImage'\n>;\n\nexport type ImageUploadPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<ImageUploadPreviewPropsWithContext<StreamChatGenerics>>;\n\nconst ImageUploadPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { imageUploads, removeImage, uploadImage } = props;\n\n  const {\n    theme: {\n      colors: { overlay, white },\n      messageInput: {\n        imageUploadPreview: { dismiss, flatList, itemContainer, upload },\n      },\n    },\n  } = useTheme();\n\n  const renderItem = ({ index, item }: { index: number; item: ImageUpload }) => (\n    <View\n      style={[\n        styles.itemContainer,\n        index === imageUploads.length - 1 ? { marginRight: 8 } : {},\n        itemContainer,\n      ]}\n    >\n      <UploadProgressIndicator\n        action={() => {\n          uploadImage({ newImage: item });\n        }}\n        active={item.state !== FileState.UPLOADED && item.state !== FileState.FINISHED}\n        style={styles.upload}\n        type={\n          item.state === FileState.UPLOADING\n            ? ProgressIndicatorTypes.IN_PROGRESS\n            : item.state === FileState.UPLOAD_FAILED\n            ? ProgressIndicatorTypes.RETRY\n            : undefined\n        }\n      >\n        <Image\n          resizeMode='cover'\n          source={{ uri: item.file.uri || item.url }}\n          style={[styles.upload, upload]}\n        />\n      </UploadProgressIndicator>\n      <TouchableOpacity\n        onPress={() => {\n          removeImage(item.id);\n        }}\n        style={[styles.dismiss, { backgroundColor: overlay }, dismiss]}\n        testID='remove-image-upload-preview'\n      >\n        <Close pathFill={white} />\n      </TouchableOpacity>\n    </View>\n  );\n\n  return imageUploads.length > 0 ? (\n    <FlatList\n      data={imageUploads}\n      getItemLayout={(_, index) => ({\n        index,\n        length: IMAGE_PREVIEW_SIZE + 8,\n        offset: (IMAGE_PREVIEW_SIZE + 8) * index,\n      })}\n      horizontal\n      keyExtractor={(item) => item.id}\n      renderItem={renderItem}\n      style={[styles.flatList, flatList]}\n    />\n  ) : null;\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n  nextProps: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { imageUploads: prevImageUploads } = prevProps;\n  const { imageUploads: nextImageUploads } = nextProps;\n\n  return (\n    prevImageUploads.length === nextImageUploads.length &&\n    prevImageUploads.every(\n      (prevImageUpload, index) => prevImageUpload.state === nextImageUploads[index].state,\n    )\n  );\n};\n\nconst MemoizedImageUploadPreviewWithContext = React.memo(\n  ImageUploadPreviewWithContext,\n  areEqual,\n) as typeof ImageUploadPreviewWithContext;\n\n/**\n * UI Component to preview the images set for upload\n */\nexport const ImageUploadPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageUploadPreviewProps<StreamChatGenerics>,\n) => {\n  const { imageUploads, removeImage, uploadImage } = useMessageInputContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedImageUploadPreviewWithContext\n      {...{ imageUploads, removeImage, uploadImage }}\n      {...props}\n    />\n  );\n};\n\nImageUploadPreview.displayName = 'ImageUploadPreview{messageInput{imageUploadPreview}}';\n"]}
+{"version":3,"sources":["ImageUploadPreview.tsx"],"names":["IMAGE_PREVIEW_SIZE","WARNING_ICON_SIZE","styles","StyleSheet","create","dismiss","borderRadius","position","right","top","fileSizeText","fontSize","paddingLeft","flatList","paddingBottom","iconContainer","alignItems","flexDirection","justifyContent","itemContainer","height","marginLeft","unsupportedImage","bottom","upload","width","warningIconStyle","marginTop","warningText","color","paddingRight","ImageUploadPreviewWithContext","props","imageUploads","removeImage","uploadImage","theme","overlay","colors","messageInput","imageUploadPreview","UnsupportedImageTypeIndicator","indicatorType","accent_red","white","t","ProgressIndicatorTypes","NOT_SUPPORTED","backgroundColor","renderItem","index","item","state","itemMarginForIndex","length","marginRight","newImage","uri","file","url","id","_","offset","areEqual","prevProps","nextProps","prevImageUploads","nextImageUploads","every","prevImageUpload","MemoizedImageUploadPreviewWithContext","React","memo","ImageUploadPreview","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { FlatList, Image, StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport { UploadProgressIndicator } from './UploadProgressIndicator';\n\nimport {\n  ImageUpload,\n  MessageInputContextValue,\n  useMessageInputContext,\n} from '../../contexts/messageInputContext/MessageInputContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../icons/Close';\nimport { Warning } from '../../icons/Warning';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\nimport { getIndicatorTypeForFileState, ProgressIndicatorTypes } from '../../utils/utils';\n\nconst IMAGE_PREVIEW_SIZE = 100;\nconst WARNING_ICON_SIZE = 16;\n\nconst styles = StyleSheet.create({\n  dismiss: {\n    borderRadius: 24,\n    position: 'absolute',\n    right: 8,\n    top: 8,\n  },\n  fileSizeText: {\n    fontSize: 12,\n    paddingLeft: 10,\n  },\n  flatList: { paddingBottom: 12 },\n  iconContainer: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    justifyContent: 'center',\n  },\n  itemContainer: {\n    flexDirection: 'row',\n    height: IMAGE_PREVIEW_SIZE,\n    marginLeft: 8,\n  },\n  unsupportedImage: {\n    borderRadius: 20,\n    bottom: 8,\n    flexDirection: 'row',\n    marginLeft: 3,\n    position: 'absolute',\n  },\n  upload: {\n    borderRadius: 10,\n    height: IMAGE_PREVIEW_SIZE,\n    width: IMAGE_PREVIEW_SIZE,\n  },\n  warningIconStyle: {\n    borderRadius: 24,\n    marginLeft: 4,\n    marginTop: 4,\n  },\n  warningText: {\n    alignItems: 'center',\n    color: 'black',\n    fontSize: 10,\n    justifyContent: 'center',\n    paddingRight: 8,\n  },\n});\n\ntype ImageUploadPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  MessageInputContextValue<StreamChatGenerics>,\n  'imageUploads' | 'removeImage' | 'uploadImage'\n>;\n\nexport type ImageUploadPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<ImageUploadPreviewPropsWithContext<StreamChatGenerics>>;\n\ntype ImageUploadPreviewItem = { index: number; item: ImageUpload };\n\nconst ImageUploadPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { imageUploads, removeImage, uploadImage } = props;\n\n  const {\n    theme: {\n      colors: { overlay },\n      messageInput: {\n        imageUploadPreview: { dismiss, flatList, itemContainer, upload },\n      },\n    },\n  } = useTheme();\n\n  const UnsupportedImageTypeIndicator = ({\n    indicatorType,\n  }: {\n    indicatorType: typeof ProgressIndicatorTypes[keyof typeof ProgressIndicatorTypes] | null;\n  }) => {\n    const {\n      theme: {\n        colors: { accent_red, overlay, white },\n      },\n    } = useTheme();\n\n    const { t } = useTranslationContext();\n    return indicatorType === ProgressIndicatorTypes.NOT_SUPPORTED ? (\n      <View style={[styles.unsupportedImage, { backgroundColor: overlay }]}>\n        <View style={[styles.iconContainer]}>\n          <Warning\n            height={WARNING_ICON_SIZE}\n            pathFill={accent_red}\n            style={styles.warningIconStyle}\n            width={WARNING_ICON_SIZE}\n          />\n          <Text style={[styles.warningText, { color: white }]}>{t('Not supported')}</Text>\n        </View>\n      </View>\n    ) : null;\n  };\n\n  const renderItem = ({ index, item }: ImageUploadPreviewItem) => {\n    const indicatorType = getIndicatorTypeForFileState(item.state);\n    const itemMarginForIndex = index === imageUploads.length - 1 ? { marginRight: 8 } : {};\n\n    return (\n      <View style={[styles.itemContainer, itemMarginForIndex, itemContainer]}>\n        <UploadProgressIndicator\n          action={() => {\n            uploadImage({ newImage: item });\n          }}\n          style={styles.upload}\n          type={indicatorType}\n        >\n          <Image\n            resizeMode='cover'\n            source={{ uri: item.file.uri || item.url }}\n            style={[styles.upload, upload]}\n          />\n        </UploadProgressIndicator>\n        <TouchableOpacity\n          onPress={() => {\n            removeImage(item.id);\n          }}\n          style={[styles.dismiss, { backgroundColor: overlay }, dismiss]}\n          testID='remove-image-upload-preview'\n        >\n          <Close />\n        </TouchableOpacity>\n        <UnsupportedImageTypeIndicator indicatorType={indicatorType} />\n      </View>\n    );\n  };\n\n  return imageUploads.length > 0 ? (\n    <FlatList\n      data={imageUploads}\n      getItemLayout={(_, index) => ({\n        index,\n        length: IMAGE_PREVIEW_SIZE + 8,\n        offset: (IMAGE_PREVIEW_SIZE + 8) * index,\n      })}\n      horizontal\n      keyExtractor={(item) => item.id}\n      renderItem={renderItem}\n      style={[styles.flatList, flatList]}\n    />\n  ) : null;\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n  nextProps: ImageUploadPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { imageUploads: prevImageUploads } = prevProps;\n  const { imageUploads: nextImageUploads } = nextProps;\n\n  return (\n    prevImageUploads.length === nextImageUploads.length &&\n    prevImageUploads.every(\n      (prevImageUpload, index) => prevImageUpload.state === nextImageUploads[index].state,\n    )\n  );\n};\n\nconst MemoizedImageUploadPreviewWithContext = React.memo(\n  ImageUploadPreviewWithContext,\n  areEqual,\n) as typeof ImageUploadPreviewWithContext;\n\n/**\n * UI Component to preview the images set for upload\n */\nexport const ImageUploadPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageUploadPreviewProps<StreamChatGenerics>,\n) => {\n  const { imageUploads, removeImage, uploadImage } = useMessageInputContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedImageUploadPreviewWithContext\n      {...{ imageUploads, removeImage, uploadImage }}\n      {...props}\n    />\n  );\n};\n\nImageUploadPreview.displayName = 'ImageUploadPreview{messageInput{imageUploadPreview}}';\n"]}

package/lib/commonjs/components/MessageInput/InputButtons.js

@@ -18,7 +18,7 @@ var _OwnCapabilitiesContext = require("../../contexts/ownCapabilitiesContext/Own
 var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/InputButtons.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/InputButtons.tsx";
 
 var styles = _reactNative.StyleSheet.create({
   attachButtonContainer: {

package/lib/commonjs/components/MessageInput/MessageInput.js

@@ -42,7 +42,7 @@ var _AttachmentSelectionBar = require("../AttachmentPicker/components/Attachment
 var _AutoCompleteInput = require("../AutoCompleteInput/AutoCompleteInput");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/MessageInput.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/MessageInput.tsx";
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 

package/lib/commonjs/components/MessageInput/MoreOptionsButton.js

@@ -18,7 +18,7 @@ var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
 var _CircleRight = require("../../icons/CircleRight");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/MoreOptionsButton.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/MoreOptionsButton.tsx";
 
 var MoreOptionsButtonWithContext = function MoreOptionsButtonWithContext(props) {
   var disabled = props.disabled,

package/lib/commonjs/components/MessageInput/SendButton.js

@@ -22,7 +22,7 @@ var _SendRight = require("../../icons/SendRight");
 var _SendUp = require("../../icons/SendUp");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/SendButton.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/SendButton.tsx";
 
 var SendButtonWithContext = function SendButtonWithContext(props) {
   var _props$disabled = props.disabled,

package/lib/commonjs/components/MessageInput/SendMessageDisallowedIndicator.js

@@ -14,7 +14,7 @@ var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
 var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/SendMessageDisallowedIndicator.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/SendMessageDisallowedIndicator.tsx";
 
 var styles = _reactNative.StyleSheet.create({
   container: {

package/lib/commonjs/components/MessageInput/ShowThreadMessageInChannelButton.js

@@ -22,7 +22,7 @@ var _TranslationContext = require("../../contexts/translationContext/Translation
 var _icons = require("../../icons");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/ShowThreadMessageInChannelButton.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/ShowThreadMessageInChannelButton.tsx";
 
 var styles = _reactNative.StyleSheet.create({
   checkBox: {

package/lib/commonjs/components/MessageInput/UploadProgressIndicator.js

@@ -16,7 +16,9 @@ var _icons = require("../../icons");
 var _utils = require("../../utils/utils");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/UploadProgressIndicator.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/UploadProgressIndicator.tsx";
+
+var REFRESH_ICON_SIZE = 18;
 
 var styles = _reactNative.StyleSheet.create({
   activityIndicatorContainer: {
@@ -59,21 +61,18 @@ var styles = _reactNative.StyleSheet.create({
 
 var UploadProgressIndicator = function UploadProgressIndicator(props) {
   var action = props.action,
-      active = props.active,
       children = props.children,
       style = props.style,
       type = props.type;
 
   var _useTheme = (0, _ThemeContext.useTheme)(),
       _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      overlayColor = _useTheme$theme$color.overlay,
-      white_smoke = _useTheme$theme$color.white_smoke,
+      overlayColor = _useTheme$theme.colors.overlay,
       _useTheme$theme$messa = _useTheme$theme.messageInput.uploadProgressIndicator,
       container = _useTheme$theme$messa.container,
       overlay = _useTheme$theme$messa.overlay;
 
-  return !active ? _react["default"].createElement(_reactNative.View, {
+  return type === _utils.ProgressIndicatorTypes.INACTIVE ? _react["default"].createElement(_reactNative.View, {
     style: [styles.overflowHidden, style],
     testID: "inactive-upload-progress-indicator",
     __self: _this,
@@ -102,22 +101,47 @@ var UploadProgressIndicator = function UploadProgressIndicator(props) {
       columnNumber: 7
     }
   }), _react["default"].createElement(_reactNative.View, {
-    style: [styles.container, {
+    style: [type === _utils.ProgressIndicatorTypes.NOT_SUPPORTED ? styles.overflowHidden : styles.container, {
       backgroundColor: overlayColor
     }, container],
+    testID: "not-supported-upload-progress-indicator",
     __self: _this,
     __source: {
       fileName: _jsxFileName,
       lineNumber: 86,
       columnNumber: 7
     }
-  }, type === _utils.ProgressIndicatorTypes.IN_PROGRESS && _react["default"].createElement(_reactNative.View, {
+  }, type === _utils.ProgressIndicatorTypes.IN_PROGRESS && _react["default"].createElement(InProgressIndicator, {
+    __self: _this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 94,
+      columnNumber: 57
+    }
+  }), type === _utils.ProgressIndicatorTypes.RETRY && _react["default"].createElement(RetryIndicator, {
+    action: action,
+    __self: _this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 95,
+      columnNumber: 51
+    }
+  })));
+};
+
+exports.UploadProgressIndicator = UploadProgressIndicator;
+
+var InProgressIndicator = function InProgressIndicator() {
+  var _useTheme2 = (0, _ThemeContext.useTheme)(),
+      white_smoke = _useTheme2.theme.colors.white_smoke;
+
+  return _react["default"].createElement(_reactNative.View, {
     style: styles.activityIndicatorContainer,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 88,
-      columnNumber: 11
+      lineNumber: 109,
+      columnNumber: 5
     }
   }, _react["default"].createElement(_reactNative.ActivityIndicator, {
     color: white_smoke,
@@ -125,32 +149,40 @@ var UploadProgressIndicator = function UploadProgressIndicator(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 89,
-      columnNumber: 13
+      lineNumber: 110,
+      columnNumber: 7
     }
-  })), type === _utils.ProgressIndicatorTypes.RETRY && _react["default"].createElement(_reactNative.TouchableOpacity, {
+  }));
+};
+
+var RetryIndicator = function RetryIndicator(_ref) {
+  var action = _ref.action;
+
+  var _useTheme3 = (0, _ThemeContext.useTheme)(),
+      white_smoke = _useTheme3.theme.colors.white_smoke;
+
+  return _react["default"].createElement(_reactNative.TouchableOpacity, {
     onPress: action,
     style: styles.retryButtonContainer,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 93,
-      columnNumber: 11
+      lineNumber: 123,
+      columnNumber: 5
     }
   }, _react["default"].createElement(_icons.Refresh, {
-    height: 18,
+    height: REFRESH_ICON_SIZE,
     pathFill: white_smoke,
     testID: "retry-upload-progress-indicator",
-    width: 18,
+    width: REFRESH_ICON_SIZE,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 94,
-      columnNumber: 13
+      lineNumber: 124,
+      columnNumber: 7
     }
-  }))));
+  }));
 };
 
-exports.UploadProgressIndicator = UploadProgressIndicator;
 UploadProgressIndicator.displayName = 'UploadProgressIndicator{messageInput{uploadProgressIndicator}}';
 //# sourceMappingURL=UploadProgressIndicator.js.map

package/lib/commonjs/components/MessageInput/UploadProgressIndicator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["UploadProgressIndicator.tsx"],"names":["styles","StyleSheet","create","activityIndicatorContainer","alignItems","bottom","justifyContent","left","position","right","top","container","height","width","overflowHidden","overflow","overlay","opacity","retryButtonContainer","UploadProgressIndicator","props","action","active","children","style","type","theme","colors","overlayColor","white_smoke","messageInput","uploadProgressIndicator","backgroundColor","ProgressIndicatorTypes","IN_PROGRESS","RETRY","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  ActivityIndicator,\n  GestureResponderEvent,\n  StyleProp,\n  StyleSheet,\n  TouchableOpacity,\n  View,\n  ViewStyle,\n} from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { Refresh } from '../../icons';\nimport { ProgressIndicatorTypes } from '../../utils/utils';\n\nconst styles = StyleSheet.create({\n  activityIndicatorContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    justifyContent: 'center',\n    left: 0,\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n  container: {\n    alignItems: 'center',\n    height: '100%',\n    justifyContent: 'center',\n    position: 'absolute',\n    width: '100%',\n  },\n  overflowHidden: {\n    overflow: 'hidden',\n  },\n  overlay: {\n    alignItems: 'center',\n    height: '100%',\n    justifyContent: 'center',\n    opacity: 0,\n    position: 'absolute',\n    width: '100%',\n  },\n  retryButtonContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    justifyContent: 'center',\n    left: 0,\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n});\n\nexport type UploadProgressIndicatorProps = {\n  /** Action triggered when clicked indicator */\n  action?: (event: GestureResponderEvent) => void;\n  /** Boolean status of upload progress */\n  active?: boolean;\n  /** style */\n  style?: StyleProp<ViewStyle>;\n  /** Type of active indicator */\n  type?: 'in_progress' | 'retry';\n};\n\nexport const UploadProgressIndicator: React.FC<UploadProgressIndicatorProps> = (props) => {\n  const { action, active, children, style, type } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor, white_smoke },\n      messageInput: {\n        uploadProgressIndicator: { container, overlay },\n      },\n    },\n  } = useTheme();\n\n  return !active ? (\n    <View style={[styles.overflowHidden, style]} testID='inactive-upload-progress-indicator'>\n      {children}\n    </View>\n  ) : (\n    <View style={[styles.overflowHidden, style]} testID='active-upload-progress-indicator'>\n      {children}\n      <View style={[styles.overlay, { backgroundColor: overlayColor }, overlay]} />\n      <View style={[styles.container, { backgroundColor: overlayColor }, container]}>\n        {type === ProgressIndicatorTypes.IN_PROGRESS && (\n          <View style={styles.activityIndicatorContainer}>\n            <ActivityIndicator color={white_smoke} testID='upload-progress-indicator' />\n          </View>\n        )}\n        {type === ProgressIndicatorTypes.RETRY && (\n          <TouchableOpacity onPress={action} style={styles.retryButtonContainer}>\n            <Refresh\n              height={18}\n              pathFill={white_smoke}\n              testID='retry-upload-progress-indicator'\n              width={18}\n            />\n          </TouchableOpacity>\n        )}\n      </View>\n    </View>\n  );\n};\n\nUploadProgressIndicator.displayName =\n  'UploadProgressIndicator{messageInput{uploadProgressIndicator}}';\n"]}
+{"version":3,"sources":["UploadProgressIndicator.tsx"],"names":["REFRESH_ICON_SIZE","styles","StyleSheet","create","activityIndicatorContainer","alignItems","bottom","justifyContent","left","position","right","top","container","height","width","overflowHidden","overflow","overlay","opacity","retryButtonContainer","UploadProgressIndicator","props","action","children","style","type","theme","overlayColor","colors","messageInput","uploadProgressIndicator","ProgressIndicatorTypes","INACTIVE","backgroundColor","NOT_SUPPORTED","IN_PROGRESS","RETRY","InProgressIndicator","white_smoke","RetryIndicator","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  ActivityIndicator,\n  GestureResponderEvent,\n  StyleProp,\n  StyleSheet,\n  TouchableOpacity,\n  View,\n  ViewStyle,\n} from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { Refresh } from '../../icons';\nimport { ProgressIndicatorTypes } from '../../utils/utils';\n\nconst REFRESH_ICON_SIZE = 18;\n\nconst styles = StyleSheet.create({\n  activityIndicatorContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    justifyContent: 'center',\n    left: 0,\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n  container: {\n    alignItems: 'center',\n    height: '100%',\n    justifyContent: 'center',\n    position: 'absolute',\n    width: '100%',\n  },\n  overflowHidden: {\n    overflow: 'hidden',\n  },\n  overlay: {\n    alignItems: 'center',\n    height: '100%',\n    justifyContent: 'center',\n    opacity: 0,\n    position: 'absolute',\n    width: '100%',\n  },\n  retryButtonContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    justifyContent: 'center',\n    left: 0,\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n});\n\nexport type UploadProgressIndicatorProps = {\n  /** Action triggered when clicked indicator */\n  action?: (event: GestureResponderEvent) => void;\n  /** style */\n  style?: StyleProp<ViewStyle>;\n  /** Type of active indicator */\n  type?: 'in_progress' | 'retry' | 'not_supported' | 'inactive' | null;\n};\n\nexport const UploadProgressIndicator: React.FC<UploadProgressIndicatorProps> = (props) => {\n  const { action, children, style, type } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor },\n      messageInput: {\n        uploadProgressIndicator: { container, overlay },\n      },\n    },\n  } = useTheme();\n\n  return type === ProgressIndicatorTypes.INACTIVE ? (\n    <View style={[styles.overflowHidden, style]} testID='inactive-upload-progress-indicator'>\n      {children}\n    </View>\n  ) : (\n    <View style={[styles.overflowHidden, style]} testID='active-upload-progress-indicator'>\n      {children}\n      <View style={[styles.overlay, { backgroundColor: overlayColor }, overlay]} />\n      <View\n        style={[\n          type === ProgressIndicatorTypes.NOT_SUPPORTED ? styles.overflowHidden : styles.container,\n          { backgroundColor: overlayColor },\n          container,\n        ]}\n        testID='not-supported-upload-progress-indicator'\n      >\n        {type === ProgressIndicatorTypes.IN_PROGRESS && <InProgressIndicator />}\n        {type === ProgressIndicatorTypes.RETRY && <RetryIndicator action={action} />}\n      </View>\n    </View>\n  );\n};\n\nconst InProgressIndicator = () => {\n  const {\n    theme: {\n      colors: { white_smoke },\n    },\n  } = useTheme();\n\n  return (\n    <View style={styles.activityIndicatorContainer}>\n      <ActivityIndicator color={white_smoke} testID='upload-progress-indicator' />\n    </View>\n  );\n};\n\nconst RetryIndicator = ({ action }: Pick<UploadProgressIndicatorProps, 'action'>) => {\n  const {\n    theme: {\n      colors: { white_smoke },\n    },\n  } = useTheme();\n\n  return (\n    <TouchableOpacity onPress={action} style={styles.retryButtonContainer}>\n      <Refresh\n        height={REFRESH_ICON_SIZE}\n        pathFill={white_smoke}\n        testID='retry-upload-progress-indicator'\n        width={REFRESH_ICON_SIZE}\n      />\n    </TouchableOpacity>\n  );\n};\n\nUploadProgressIndicator.displayName =\n  'UploadProgressIndicator{messageInput{uploadProgressIndicator}}';\n"]}

package/lib/commonjs/components/MessageInput/components/InputEditingStateHeader.js

@@ -20,7 +20,7 @@ var _TranslationContext = require("../../../contexts/translationContext/Translat
 var _icons = require("../../../icons");
 
 var _this = this,
-    _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/MessageInput/components/InputEditingStateHeader.tsx";
+    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageInput/components/InputEditingStateHeader.tsx";
 
 var styles = _reactNative.StyleSheet.create({
   editingBoxHeader: {