stream-chat-react-native-core 4.1.0-next.1 → 4.1.1-beta.2

package/lib/module/components/Avatar/GroupAvatar.js

@@ -17,6 +17,8 @@ var _reactNative = require("react-native");
 
 var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
 
+var _getResizedImageUrl = require("../../utils/getResizedImageUrl");
+
 var _this = this,
     _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/Avatar/GroupAvatar.tsx";
 
@@ -65,8 +67,6 @@ var GroupAvatar = function GroupAvatar(props) {
     var url = currentImage.startsWith('http') ? currentImage : "" + randomImageBaseUrl + (names ? "?name=" + getInitials(names[index]) + "&size=" + (imagesOrNames.length <= 2 ? size : size / 2) : '');
 
     if (imagesOrNames.length <= 2) {
-      _reactNative.Image.prefetch(imageError ? url : url.replace('h=%2A', "h=" + _reactNative.PixelRatio.getPixelSizeForLayoutSize(imagesOrNames.length <= 2 ? size : size / 2)))["catch"](function () {});
-
       returnArray[0] = [].concat((0, _toConsumableArray2["default"])(returnArray[0] || []), [{
         height: imagesOrNames.length === 1 ? size : size / 2,
         name: names ? names[index] : '',
@@ -74,8 +74,6 @@ var GroupAvatar = function GroupAvatar(props) {
         width: size
       }]);
     } else {
-      _reactNative.Image.prefetch(imageError ? url : url.replace('h=%2A', "h=" + _reactNative.PixelRatio.getPixelSizeForLayoutSize(size / 2)))["catch"](function () {});
-
       if (index < 2) {
         returnArray[0] = [].concat((0, _toConsumableArray2["default"])(returnArray[0] || []), [{
           height: size / 2,
@@ -105,7 +103,7 @@ var GroupAvatar = function GroupAvatar(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 127,
+      lineNumber: 109,
       columnNumber: 5
     }
   }, avatarImages.map(function (column, colIndex) {
@@ -117,7 +115,7 @@ var GroupAvatar = function GroupAvatar(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 137,
+        lineNumber: 119,
         columnNumber: 9
       }
     }, column.map(function (_ref, rowIndex) {
@@ -132,7 +130,11 @@ var GroupAvatar = function GroupAvatar(props) {
           return setImageError(true);
         },
         source: {
-          uri: imageError || url.includes(randomSvgBaseUrl) ? url.includes(streamCDN) ? url : "" + randomImageBaseUrl + (name ? "?name=" + getInitials(name) + "&size=" + height : '') : url.replace('h=%2A', "h=" + _reactNative.PixelRatio.getPixelSizeForLayoutSize(height))
+          uri: imageError || url.includes(randomSvgBaseUrl) ? url.includes(streamCDN) ? url : "" + randomImageBaseUrl + (name ? "?name=" + getInitials(name) + "&size=" + height : '') : (0, _getResizedImageUrl.getResizedImageUrl)({
+            height: height,
+            url: url,
+            width: width
+          })
         },
         style: [image, size ? {
           height: height,
@@ -142,7 +144,7 @@ var GroupAvatar = function GroupAvatar(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 147,
+          lineNumber: 129,
           columnNumber: 13
         }
       });

package/lib/module/components/Avatar/GroupAvatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["GroupAvatar.tsx"],"names":["randomImageBaseUrl","randomSvgBaseUrl","streamCDN","styles","StyleSheet","create","container","overflow","flex","getInitials","fullName","split","slice","map","name","charAt","join","GroupAvatar","props","containerStyle","images","names","size","testID","theme","groupAvatar","image","imageError","setImageError","imagesOrNames","avatarImages","reduce","returnArray","currentImage","index","url","startsWith","length","Image","prefetch","replace","PixelRatio","getPixelSizeForLayoutSize","height","width","borderRadius","column","colIndex","flexDirection","rowIndex","uri","includes","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { Image, PixelRatio, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\n\nconst randomImageBaseUrl = 'https://getstream.io/random_png/';\nconst randomSvgBaseUrl = 'https://getstream.io/random_svg/';\nconst streamCDN = 'stream-io-cdn.com';\n\nconst styles = StyleSheet.create({\n  container: {\n    overflow: 'hidden',\n  },\n  flex: { flex: 1 },\n});\n\nconst getInitials = (fullName: string) =>\n  fullName\n    .split(' ')\n    .slice(0, 2)\n    .map((name) => name.charAt(0))\n    .join(' ');\n\nexport type GroupAvatarProps = {\n  /** total size in pixels */\n  size: number;\n  containerStyle?: StyleProp<ViewStyle>;\n  /** image urls */\n  images?: string[];\n  /** name of the users, used for fallback */\n  names?: string[];\n  testID?: string;\n};\n\n/**\n * GroupAvatar - A round group of avatar images with fallbacks to users' initials\n */\nexport const GroupAvatar: React.FC<GroupAvatarProps> = (props) => {\n  const { containerStyle, images, names, size, testID } = props;\n  const {\n    theme: {\n      groupAvatar: { container, image },\n    },\n  } = useTheme();\n\n  const [imageError, setImageError] = useState(false);\n\n  /**\n   * [\n   *    [\n   *        { height: number; name: string; url: string; width: number },\n   *        { height: number; name: string; url: string; width: number },\n   *    ],\n   *    [\n   *        { height: number; name: string; url: string; width: number },\n   *        { height: number; name: string; url: string; width: number },\n   *    ],\n   * ]\n   */\n  const imagesOrNames = images || names || [];\n  const avatarImages = imagesOrNames.slice(0, 4).reduce((returnArray, currentImage, index) => {\n    const url = currentImage.startsWith('http')\n      ? currentImage\n      : `${randomImageBaseUrl}${\n          names\n            ? `?name=${getInitials(names[index])}&size=${\n                imagesOrNames.length <= 2 ? size : size / 2\n              }`\n            : ''\n        }`;\n    if (imagesOrNames.length <= 2) {\n      Image.prefetch(\n        imageError\n          ? url\n          : url.replace(\n              'h=%2A',\n              `h=${PixelRatio.getPixelSizeForLayoutSize(\n                imagesOrNames.length <= 2 ? size : size / 2,\n              )}`,\n            ),\n      ).catch(() => {\n        // do nothing, not a big deal that prefetch failed\n      });\n      returnArray[0] = [\n        ...(returnArray[0] || []),\n        {\n          height: imagesOrNames.length === 1 ? size : size / 2,\n          name: names ? names[index] : '',\n          url,\n          width: size,\n        },\n      ];\n    } else {\n      Image.prefetch(\n        imageError\n          ? url\n          : url.replace('h=%2A', `h=${PixelRatio.getPixelSizeForLayoutSize(size / 2)}`),\n      ).catch(() => {\n        // do nothing, not a big deal that prefetch failed\n      });\n      if (index < 2) {\n        returnArray[0] = [\n          ...(returnArray[0] || []),\n          {\n            height: size / 2,\n            name: names ? names[index] : '',\n            url,\n            width: size / 2,\n          },\n        ];\n      } else {\n        returnArray[1] = [\n          ...(returnArray[1] || []),\n          {\n            height: size / 2,\n            name: names ? names[index] : '',\n            url,\n            width: imagesOrNames.length === 3 ? size : size / 2,\n          },\n        ];\n      }\n    }\n    return returnArray;\n  }, [] as { height: number; name: string; url: string; width: number }[][]);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        { borderRadius: size / 2, height: size, width: size },\n        container,\n        containerStyle,\n      ]}\n      testID={testID || 'group-avatar'}\n    >\n      {avatarImages.map((column, colIndex) => (\n        <View\n          key={`avatar-column-${colIndex}`}\n          style={[\n            styles.flex,\n            {\n              flexDirection: imagesOrNames.length === 2 ? 'column' : 'row',\n            },\n          ]}\n        >\n          {column.map(({ height, name, url, width }, rowIndex) => (\n            <Image\n              accessibilityLabel={testID || 'avatar-image'}\n              key={`avatar-${url}-${rowIndex}`}\n              onError={() => setImageError(true)}\n              source={{\n                uri:\n                  imageError || url.includes(randomSvgBaseUrl)\n                    ? url.includes(streamCDN)\n                      ? url\n                      : `${randomImageBaseUrl}${\n                          name ? `?name=${getInitials(name)}&size=${height}` : ''\n                        }`\n                    : url.replace('h=%2A', `h=${PixelRatio.getPixelSizeForLayoutSize(height)}`),\n              }}\n              style={[\n                image,\n                size\n                  ? {\n                      height,\n                      width,\n                    }\n                  : {},\n              ]}\n              testID={`group-avatar-image-${colIndex}-${rowIndex}`}\n            />\n          ))}\n        </View>\n      ))}\n    </View>\n  );\n};\n\nGroupAvatar.displayName = 'GroupAvatar{groupAvatar}';\n"]}
+{"version":3,"sources":["GroupAvatar.tsx"],"names":["randomImageBaseUrl","randomSvgBaseUrl","streamCDN","styles","StyleSheet","create","container","overflow","flex","getInitials","fullName","split","slice","map","name","charAt","join","GroupAvatar","props","containerStyle","images","names","size","testID","theme","groupAvatar","image","imageError","setImageError","imagesOrNames","avatarImages","reduce","returnArray","currentImage","index","url","startsWith","length","height","width","borderRadius","column","colIndex","flexDirection","rowIndex","uri","includes","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { getResizedImageUrl } from '../../utils/getResizedImageUrl';\n\nconst randomImageBaseUrl = 'https://getstream.io/random_png/';\nconst randomSvgBaseUrl = 'https://getstream.io/random_svg/';\nconst streamCDN = 'stream-io-cdn.com';\n\nconst styles = StyleSheet.create({\n  container: {\n    overflow: 'hidden',\n  },\n  flex: { flex: 1 },\n});\n\nconst getInitials = (fullName: string) =>\n  fullName\n    .split(' ')\n    .slice(0, 2)\n    .map((name) => name.charAt(0))\n    .join(' ');\n\nexport type GroupAvatarProps = {\n  /** total size in pixels */\n  size: number;\n  containerStyle?: StyleProp<ViewStyle>;\n  /** image urls */\n  images?: string[];\n  /** name of the users, used for fallback */\n  names?: string[];\n  testID?: string;\n};\n\n/**\n * GroupAvatar - A round group of avatar images with fallbacks to users' initials\n */\nexport const GroupAvatar: React.FC<GroupAvatarProps> = (props) => {\n  const { containerStyle, images, names, size, testID } = props;\n  const {\n    theme: {\n      groupAvatar: { container, image },\n    },\n  } = useTheme();\n\n  const [imageError, setImageError] = useState(false);\n\n  /**\n   * [\n   *    [\n   *        { height: number; name: string; url: string; width: number },\n   *        { height: number; name: string; url: string; width: number },\n   *    ],\n   *    [\n   *        { height: number; name: string; url: string; width: number },\n   *        { height: number; name: string; url: string; width: number },\n   *    ],\n   * ]\n   */\n  const imagesOrNames = images || names || [];\n  const avatarImages = imagesOrNames.slice(0, 4).reduce((returnArray, currentImage, index) => {\n    const url = currentImage.startsWith('http')\n      ? currentImage\n      : `${randomImageBaseUrl}${\n          names\n            ? `?name=${getInitials(names[index])}&size=${\n                imagesOrNames.length <= 2 ? size : size / 2\n              }`\n            : ''\n        }`;\n    if (imagesOrNames.length <= 2) {\n      returnArray[0] = [\n        ...(returnArray[0] || []),\n        {\n          height: imagesOrNames.length === 1 ? size : size / 2,\n          name: names ? names[index] : '',\n          url,\n          width: size,\n        },\n      ];\n    } else {\n      if (index < 2) {\n        returnArray[0] = [\n          ...(returnArray[0] || []),\n          {\n            height: size / 2,\n            name: names ? names[index] : '',\n            url,\n            width: size / 2,\n          },\n        ];\n      } else {\n        returnArray[1] = [\n          ...(returnArray[1] || []),\n          {\n            height: size / 2,\n            name: names ? names[index] : '',\n            url,\n            width: imagesOrNames.length === 3 ? size : size / 2,\n          },\n        ];\n      }\n    }\n    return returnArray;\n  }, [] as { height: number; name: string; url: string; width: number }[][]);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        { borderRadius: size / 2, height: size, width: size },\n        container,\n        containerStyle,\n      ]}\n      testID={testID || 'group-avatar'}\n    >\n      {avatarImages.map((column, colIndex) => (\n        <View\n          key={`avatar-column-${colIndex}`}\n          style={[\n            styles.flex,\n            {\n              flexDirection: imagesOrNames.length === 2 ? 'column' : 'row',\n            },\n          ]}\n        >\n          {column.map(({ height, name, url, width }, rowIndex) => (\n            <Image\n              accessibilityLabel={testID || 'avatar-image'}\n              key={`avatar-${url}-${rowIndex}`}\n              onError={() => setImageError(true)}\n              source={{\n                uri:\n                  imageError || url.includes(randomSvgBaseUrl)\n                    ? url.includes(streamCDN)\n                      ? url\n                      : `${randomImageBaseUrl}${\n                          name ? `?name=${getInitials(name)}&size=${height}` : ''\n                        }`\n                    : getResizedImageUrl({\n                        height,\n                        url,\n                        width,\n                      }),\n              }}\n              style={[\n                image,\n                size\n                  ? {\n                      height,\n                      width,\n                    }\n                  : {},\n              ]}\n              testID={`group-avatar-image-${colIndex}-${rowIndex}`}\n            />\n          ))}\n        </View>\n      ))}\n    </View>\n  );\n};\n\nGroupAvatar.displayName = 'GroupAvatar{groupAvatar}';\n"]}