stream-chat-react-native-core 5.1.0-beta.1 → 5.2.0-beta.1

package/lib/commonjs/components/ImageGallery/components/ImageGalleryVideoControl.js

@@ -46,7 +46,6 @@ var styles = _reactNative.StyleSheet.create({
 var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   var duration = props.duration,
       onPlayPause = props.onPlayPause,
-      onProgressDrag = props.onProgressDrag,
       paused = props.paused,
       progress = props.progress;
   var videoDuration = duration ? duration / 3600 >= 1 ? _dayjs["default"].duration(duration, 'second').format('HH:mm:ss') : _dayjs["default"].duration(duration, 'second').format('mm:ss') : null;
@@ -56,6 +55,8 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   var _useTheme = (0, _ThemeContext.useTheme)(),
       _useTheme$theme = _useTheme.theme,
       _useTheme$theme$color = _useTheme$theme.colors,
+      accent_blue = _useTheme$theme$color.accent_blue,
+      black = _useTheme$theme$color.black,
       static_black = _useTheme$theme$color.static_black,
       static_white = _useTheme$theme$color.static_white,
       _useTheme$theme$image = _useTheme$theme.imageGallery.videoControl,
@@ -117,7 +118,7 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   }))), _react["default"].createElement(_reactNative.Text, {
     accessibilityLabel: "Progress Duration",
     style: [styles.durationTextStyle, durationTextStyle, {
-      color: static_white
+      color: black
     }],
     __self: _this,
     __source: {
@@ -127,9 +128,8 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
     }
   }, progressDuration ? progressDuration : '00:00'), _react["default"].createElement(_ProgressControl.ProgressControl, {
     duration: duration,
-    filledColor: static_white,
+    filledColor: accent_blue,
     onPlayPause: onPlayPause,
-    onProgressDrag: onProgressDrag,
     progress: progress,
     testID: 'progress-control',
     width: 180,
@@ -142,12 +142,12 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   }), _react["default"].createElement(_reactNative.Text, {
     accessibilityLabel: "Video Duration",
     style: [styles.durationTextStyle, durationTextStyle, {
-      color: static_white
+      color: black
     }],
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 99,
+      lineNumber: 98,
       columnNumber: 9
     }
   }, videoDuration ? videoDuration : '00:00'));

package/lib/commonjs/components/ImageGallery/components/ImageGalleryVideoControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryVideoControl.tsx"],"names":["styles","StyleSheet","create","durationTextStyle","fontWeight","roundedView","alignItems","borderRadius","display","elevation","height","justifyContent","width","videoContainer","backgroundColor","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","onProgressDrag","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","theme","colors","static_black","static_white","imageGallery","videoControl","color","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\nimport { ProgressControl } from '../../ProgressControl/ProgressControl';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, onProgressDrag, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        colors: { static_black, static_white },\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity\n          accessibilityLabel='Play Pause Button'\n          onPress={() => {\n            onPlayPause();\n          }}\n        >\n          <View style={[styles.roundedView, roundedView, { backgroundColor: static_white }]}>\n            {paused ? (\n              <Play accessibilityLabel='Play Icon' height={24} pathFill={static_black} width={24} />\n            ) : (\n              <Pause\n                accessibilityLabel='Pause Icon'\n                height={24}\n                pathFill={static_black}\n                width={24}\n              />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text\n          accessibilityLabel='Progress Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: static_white }]}\n        >\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          filledColor={static_white}\n          onPlayPause={onPlayPause}\n          onProgressDrag={onProgressDrag}\n          progress={progress}\n          testID={'progress-control'}\n          width={180}\n        />\n        <Text\n          accessibilityLabel='Video Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: static_white }]}\n        >\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"]}
+{"version":3,"sources":["ImageGalleryVideoControl.tsx"],"names":["styles","StyleSheet","create","durationTextStyle","fontWeight","roundedView","alignItems","borderRadius","display","elevation","height","justifyContent","width","videoContainer","backgroundColor","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","theme","colors","accent_blue","black","static_black","static_white","imageGallery","videoControl","color","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\nimport { ProgressControl } from '../../ProgressControl/ProgressControl';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        colors: { accent_blue, black, static_black, static_white },\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity\n          accessibilityLabel='Play Pause Button'\n          onPress={() => {\n            onPlayPause();\n          }}\n        >\n          <View style={[styles.roundedView, roundedView, { backgroundColor: static_white }]}>\n            {paused ? (\n              <Play accessibilityLabel='Play Icon' height={24} pathFill={static_black} width={24} />\n            ) : (\n              <Pause\n                accessibilityLabel='Pause Icon'\n                height={24}\n                pathFill={static_black}\n                width={24}\n              />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text\n          accessibilityLabel='Progress Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          filledColor={accent_blue}\n          onPlayPause={onPlayPause}\n          progress={progress}\n          testID={'progress-control'}\n          width={180}\n        />\n        <Text\n          accessibilityLabel='Video Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"]}

package/lib/commonjs/components/MessageList/MessageList.js

@@ -35,6 +35,8 @@ var _ChannelContext = require("../../contexts/channelContext/ChannelContext");
 
 var _ChatContext = require("../../contexts/chatContext/ChatContext");
 
+var _DebugContext = require("../../contexts/debugContext/DebugContext");
+
 var _ImageGalleryContext = require("../../contexts/imageGalleryContext/ImageGalleryContext");
 
 var _MessagesContext = require("../../contexts/messagesContext/MessagesContext");
@@ -334,7 +336,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 547,
+          lineNumber: 548,
           columnNumber: 11
         }
       }, _react["default"].createElement(MessageSystem, {
@@ -343,14 +345,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 548,
+          lineNumber: 549,
           columnNumber: 13
         }
       })), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 550,
+          lineNumber: 551,
           columnNumber: 43
         }
       }));
@@ -362,7 +364,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 558,
+        lineNumber: 559,
         columnNumber: 9
       }
     }, _react["default"].createElement(_reactNative.View, {
@@ -370,7 +372,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 559,
+        lineNumber: 560,
         columnNumber: 11
       }
     }, _react["default"].createElement(Message, {
@@ -386,7 +388,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 560,
+        lineNumber: 561,
         columnNumber: 13
       }
     }))), (0, _useMessageList.isMessageWithStylesReadByAndDateSeparator)(message) && message.dateSeparator && _react["default"].createElement(InlineDateSeparator, {
@@ -394,14 +396,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 576,
+        lineNumber: 577,
         columnNumber: 11
       }
     }), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 579,
+        lineNumber: 580,
         columnNumber: 41
       }
     })) : _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNative.View, {
@@ -409,7 +411,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 583,
+        lineNumber: 584,
         columnNumber: 9
       }
     }, _react["default"].createElement(Message, {
@@ -425,7 +427,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 584,
+        lineNumber: 585,
         columnNumber: 11
       }
     })), (0, _useMessageList.isMessageWithStylesReadByAndDateSeparator)(message) && message.dateSeparator && _react["default"].createElement(InlineDateSeparator, {
@@ -433,14 +435,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 603,
+        lineNumber: 604,
         columnNumber: 11
       }
     }), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 606,
+        lineNumber: 607,
         columnNumber: 41
       }
     }));
@@ -777,6 +779,17 @@ var MessageListWithContext = function MessageListWithContext(props) {
     }
   };
 
+  var debugRef = (0, _DebugContext.useDebugContext)();
+  var isDebugModeEnabled = __DEV__ && debugRef && debugRef.current;
+
+  if (isDebugModeEnabled) {
+    if (debugRef.current.setEventType) debugRef.current.setEventType('send');
+    if (debugRef.current.setSendEventParams) debugRef.current.setSendEventParams({
+      action: thread ? 'ThreadList' : 'Messages',
+      data: messageList
+    });
+  }
+
   var renderListEmptyComponent = function renderListEmptyComponent() {
     return _react["default"].createElement(_reactNative.View, {
       style: [styles.flex, styles.invert],
@@ -784,7 +797,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 940,
+        lineNumber: 955,
         columnNumber: 5
       }
     }, _react["default"].createElement(EmptyStateIndicator, {
@@ -792,7 +805,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 941,
+        lineNumber: 956,
         columnNumber: 7
       }
     }));
@@ -806,7 +819,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 949,
+        lineNumber: 964,
         columnNumber: 7
       }
     }, _react["default"].createElement(LoadingIndicator, {
@@ -814,7 +827,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 950,
+        lineNumber: 965,
         columnNumber: 9
       }
     }));
@@ -828,7 +841,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 956,
+      lineNumber: 971,
       columnNumber: 5
     }
   }, _react["default"].createElement(FlatList, (0, _extends2["default"])({
@@ -862,7 +875,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 960,
+      lineNumber: 975,
       columnNumber: 7
     }
   })), !loading && _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNative.View, {
@@ -870,7 +883,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 992,
+      lineNumber: 1007,
       columnNumber: 11
     }
   }, stickyHeaderDateToRender && (StickyHeader ? _react["default"].createElement(StickyHeader, {
@@ -878,7 +891,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 995,
+      lineNumber: 1010,
       columnNumber: 17
     }
   }) : messageListLengthAfterUpdate ? _react["default"].createElement(DateHeader, {
@@ -886,21 +899,21 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 997,
+      lineNumber: 1012,
       columnNumber: 17
     }
   }) : null)), !disableTypingIndicator && TypingIndicator && _react["default"].createElement(TypingIndicatorContainer, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1001,
+      lineNumber: 1016,
       columnNumber: 13
     }
   }, _react["default"].createElement(TypingIndicator, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1002,
+      lineNumber: 1017,
       columnNumber: 15
     }
   })), _react["default"].createElement(ScrollToBottomButton, {
@@ -910,14 +923,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1005,
+      lineNumber: 1020,
       columnNumber: 11
     }
   })), _react["default"].createElement(NetworkDownIndicator, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1012,
+      lineNumber: 1027,
       columnNumber: 7
     }
   }));
@@ -1036,7 +1049,7 @@ var MessageList = function MessageList(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1071,
+      lineNumber: 1086,
       columnNumber: 5
     }
   }));