@plusscommunities/pluss-core-app 7.0.1 → 7.0.2

package/dist/module/components/DocumentUploader.js

@@ -0,0 +1,236 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React, { Component } from 'react';
+import { View, TouchableOpacity, Text, StyleSheet, ActivityIndicator } from 'react-native';
+import { Icon } from 'react-native-elements';
+import * as DocumentPicker from 'expo-document-picker';
+import { connect } from 'react-redux';
+import Config from '../config';
+import { fileActions } from '../apis';
+import { getValueOrDefault } from '../helper';
+import { TEXT_DARK, getMainBrandingColourFromState } from '../colours';
+const DEFAULT_DOCUMENT_NAME = 'document';
+class DocumentUploader extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "state", {
+      isUploading: false,
+      uploadProgress: 0
+    });
+    _defineProperty(this, "pickDocument", async () => {
+      const {
+        allowedTypes,
+        multiple
+      } = this.props;
+      try {
+        const result = await DocumentPicker.getDocumentAsync({
+          type: allowedTypes,
+          copyToCacheDirectory: true,
+          multiple: multiple || false
+        });
+        // console.log('pickDocument', JSON.stringify(result, null, 2));
+
+        if (!result.canceled) {
+          await this.handleDocumentPicked(result);
+        }
+      } catch (error) {
+        console.log('Document picker error:', error);
+        this.props.onUploadFailed(null, error.message);
+      }
+    });
+    _defineProperty(this, "handleDocumentPicked", async documentResult => {
+      const {
+        assets
+      } = documentResult;
+      const {
+        userId
+      } = this.props;
+      try {
+        this.setState({
+          isUploading: true,
+          uploadProgress: 0
+        });
+
+        // Process each asset in parallel
+        const uploadPromises = assets.map(async asset => {
+          const {
+            name,
+            uri
+          } = asset;
+
+          // Generate a unique filename if not provided
+          const [file, fileExt] = name.split('.');
+          const fileName = `${getValueOrDefault(this.props.fileName, DEFAULT_DOCUMENT_NAME)}_${Date.now()}.${fileExt}`;
+          const uploadUri = fileActions.getUploadUrl(userId, fileName);
+          // console.log('handleDocumentPicked', JSON.stringify({ uploadUri, uri, name, fileName }, null, 2));
+
+          try {
+            // Notify parent component that upload has started for this file
+            this.props.onUploadStarted(uploadUri, uri, file, fileExt.toUpperCase());
+            const res = await fileActions.uploadUserMediaWithProgress(uri, uploadUri, progress => {
+              if (this.props.onUploadProgress) this.props.onUploadProgress(progress);
+            });
+            const fileUrl = Config.env.baseUploadsUrl + res.key;
+            this.props.onUploadSuccess(fileUrl, uploadUri);
+            console.log('Upload success', fileUrl);
+            return {
+              success: true,
+              url: fileUrl,
+              uploadUri
+            };
+          } catch (error) {
+            console.error(`Upload failed for ${name}:`, error);
+            this.props.onUploadFailed(uploadUri, error.message);
+            return {
+              success: false,
+              error,
+              uploadUri
+            };
+          }
+        });
+
+        // Wait for all uploads to complete
+        const results = await Promise.all(uploadPromises);
+        return results;
+      } catch (error) {
+        console.error('Document upload error:', error);
+        return [];
+      } finally {
+        this.setState({
+          isUploading: false,
+          uploadProgress: 0
+        });
+      }
+    });
+    _defineProperty(this, "renderUploadButton", () => {
+      const {
+        buttonTitle,
+        buttonStyle,
+        buttonTextStyle,
+        disabled
+      } = this.props;
+      const {
+        isUploading
+      } = this.state;
+      const mainColor = getMainBrandingColourFromState(this.props);
+      return /*#__PURE__*/React.createElement(TouchableOpacity, {
+        style: [styles.uploadButton, {
+          borderColor: mainColor
+        }, buttonStyle],
+        onPress: this.pickDocument,
+        disabled: isUploading || disabled,
+        activeOpacity: 0.7
+      }, /*#__PURE__*/React.createElement(View, {
+        style: styles.buttonContent
+      }, isUploading ? /*#__PURE__*/React.createElement(ActivityIndicator, {
+        color: mainColor
+      }) : /*#__PURE__*/React.createElement(Icon, {
+        name: "attachment",
+        type: "entypo",
+        color: mainColor,
+        size: 18,
+        style: styles.icon
+      }), /*#__PURE__*/React.createElement(Text, {
+        style: [styles.buttonText, {
+          color: mainColor
+        }, buttonTextStyle]
+      }, buttonTitle)));
+    });
+    _defineProperty(this, "renderProgress", () => {
+      const {
+        uploadProgress
+      } = this.state;
+      if (uploadProgress <= 0 || uploadProgress >= 1) return null;
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles.progressContainer
+      }, /*#__PURE__*/React.createElement(View, {
+        style: styles.progressBar
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [styles.progressFill, {
+          width: `${uploadProgress * 100}%`
+        }]
+      })), /*#__PURE__*/React.createElement(Text, {
+        style: styles.progressText
+      }, Math.round(uploadProgress * 100), "%"));
+    });
+  }
+  render() {
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.container
+    }, this.renderUploadButton(), this.renderProgress());
+  }
+}
+_defineProperty(DocumentUploader, "defaultProps", {
+  allowedTypes: ['application/pdf'],
+  buttonTitle: 'Upload Document',
+  buttonStyle: {},
+  buttonTextStyle: {},
+  onUploadStarted: () => {},
+  onUploadSuccess: () => {},
+  onUploadFailed: () => {},
+  onUploadProgress: null,
+  userId: null,
+  fileName: null,
+  disabled: false
+});
+const styles = StyleSheet.create({
+  container: {
+    marginVertical: 10
+  },
+  uploadButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingVertical: 8,
+    paddingHorizontal: 16,
+    borderRadius: 6,
+    backgroundColor: '#fff',
+    borderWidth: 1,
+    borderColor: '#007AFF'
+  },
+  buttonContent: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  buttonText: {
+    color: '#fff',
+    fontSize: 16,
+    fontWeight: '500',
+    marginLeft: 8
+  },
+  icon: {
+    marginRight: 8
+  },
+  progressContainer: {
+    marginTop: 8,
+    alignItems: 'center'
+  },
+  progressBar: {
+    height: 4,
+    width: '100%',
+    backgroundColor: '#E0E0E0',
+    borderRadius: 2,
+    overflow: 'hidden'
+  },
+  progressFill: {
+    height: '100%',
+    backgroundColor: '#4CAF50'
+  },
+  progressText: {
+    marginTop: 4,
+    fontSize: 12,
+    color: TEXT_DARK
+  }
+});
+const mapStateToProps = state => {
+  const {
+    user
+  } = state;
+  return {
+    user,
+    colourBrandingMain: getMainBrandingColourFromState(state)
+  };
+};
+export default connect(mapStateToProps)(DocumentUploader);
+//# sourceMappingURL=DocumentUploader.js.map

package/dist/module/components/DocumentUploader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Component","View","TouchableOpacity","Text","StyleSheet","ActivityIndicator","Icon","DocumentPicker","connect","Config","fileActions","getValueOrDefault","TEXT_DARK","getMainBrandingColourFromState","DEFAULT_DOCUMENT_NAME","DocumentUploader","constructor","args","_defineProperty","isUploading","uploadProgress","allowedTypes","multiple","props","result","getDocumentAsync","type","copyToCacheDirectory","canceled","handleDocumentPicked","error","console","log","onUploadFailed","message","documentResult","assets","userId","setState","uploadPromises","map","asset","name","uri","file","fileExt","split","fileName","Date","now","uploadUri","getUploadUrl","onUploadStarted","toUpperCase","res","uploadUserMediaWithProgress","progress","onUploadProgress","fileUrl","env","baseUploadsUrl","key","onUploadSuccess","success","url","results","Promise","all","buttonTitle","buttonStyle","buttonTextStyle","disabled","state","mainColor","createElement","style","styles","uploadButton","borderColor","onPress","pickDocument","activeOpacity","buttonContent","color","size","icon","buttonText","progressContainer","progressBar","progressFill","width","progressText","Math","round","render","container","renderUploadButton","renderProgress","create","marginVertical","flexDirection","alignItems","justifyContent","paddingVertical","paddingHorizontal","borderRadius","backgroundColor","borderWidth","fontSize","fontWeight","marginLeft","marginRight","marginTop","height","overflow","mapStateToProps","user","colourBrandingMain"],"sources":["DocumentUploader.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, TouchableOpacity, Text, StyleSheet, ActivityIndicator } from 'react-native';\nimport { Icon } from 'react-native-elements';\nimport * as DocumentPicker from 'expo-document-picker';\nimport { connect } from 'react-redux';\nimport Config from '../config';\nimport { fileActions } from '../apis';\nimport { getValueOrDefault } from '../helper';\nimport { TEXT_DARK, getMainBrandingColourFromState } from '../colours';\n\nconst DEFAULT_DOCUMENT_NAME = 'document';\n\nclass DocumentUploader extends Component {\n  static defaultProps = {\n    allowedTypes: ['application/pdf'],\n    buttonTitle: 'Upload Document',\n    buttonStyle: {},\n    buttonTextStyle: {},\n    onUploadStarted: () => {},\n    onUploadSuccess: () => {},\n    onUploadFailed: () => {},\n    onUploadProgress: null,\n    userId: null,\n    fileName: null,\n    disabled: false,\n  };\n\n  state = {\n    isUploading: false,\n    uploadProgress: 0,\n  };\n\n  pickDocument = async () => {\n    const { allowedTypes, multiple } = this.props;\n\n    try {\n      const result = await DocumentPicker.getDocumentAsync({\n        type: allowedTypes,\n        copyToCacheDirectory: true,\n        multiple: multiple || false,\n      });\n      // console.log('pickDocument', JSON.stringify(result, null, 2));\n\n      if (!result.canceled) {\n        await this.handleDocumentPicked(result);\n      }\n    } catch (error) {\n      console.log('Document picker error:', error);\n      this.props.onUploadFailed(null, error.message);\n    }\n  };\n\n  handleDocumentPicked = async documentResult => {\n    const { assets } = documentResult;\n    const { userId } = this.props;\n\n    try {\n      this.setState({ isUploading: true, uploadProgress: 0 });\n\n      // Process each asset in parallel\n      const uploadPromises = assets.map(async asset => {\n        const { name, uri } = asset;\n\n        // Generate a unique filename if not provided\n        const [file, fileExt] = name.split('.');\n        const fileName = `${getValueOrDefault(this.props.fileName, DEFAULT_DOCUMENT_NAME)}_${Date.now()}.${fileExt}`;\n        const uploadUri = fileActions.getUploadUrl(userId, fileName);\n        // console.log('handleDocumentPicked', JSON.stringify({ uploadUri, uri, name, fileName }, null, 2));\n\n        try {\n          // Notify parent component that upload has started for this file\n          this.props.onUploadStarted(uploadUri, uri, file, fileExt.toUpperCase());\n\n          const res = await fileActions.uploadUserMediaWithProgress(uri, uploadUri, progress => {\n            if (this.props.onUploadProgress) this.props.onUploadProgress(progress);\n          });\n\n          const fileUrl = Config.env.baseUploadsUrl + res.key;\n          this.props.onUploadSuccess(fileUrl, uploadUri);\n          console.log('Upload success', fileUrl);\n          return { success: true, url: fileUrl, uploadUri };\n        } catch (error) {\n          console.error(`Upload failed for ${name}:`, error);\n          this.props.onUploadFailed(uploadUri, error.message);\n          return { success: false, error, uploadUri };\n        }\n      });\n\n      // Wait for all uploads to complete\n      const results = await Promise.all(uploadPromises);\n      return results;\n    } catch (error) {\n      console.error('Document upload error:', error);\n      return [];\n    } finally {\n      this.setState({ isUploading: false, uploadProgress: 0 });\n    }\n  };\n\n  renderUploadButton = () => {\n    const { buttonTitle, buttonStyle, buttonTextStyle, disabled } = this.props;\n    const { isUploading } = this.state;\n    const mainColor = getMainBrandingColourFromState(this.props);\n\n    return (\n      <TouchableOpacity\n        style={[styles.uploadButton, { borderColor: mainColor }, buttonStyle]}\n        onPress={this.pickDocument}\n        disabled={isUploading || disabled}\n        activeOpacity={0.7}\n      >\n        <View style={styles.buttonContent}>\n          {isUploading ? (\n            <ActivityIndicator color={mainColor} />\n          ) : (\n            <Icon name=\"attachment\" type=\"entypo\" color={mainColor} size={18} style={styles.icon} />\n          )}\n          <Text style={[styles.buttonText, { color: mainColor }, buttonTextStyle]}>{buttonTitle}</Text>\n        </View>\n      </TouchableOpacity>\n    );\n  };\n\n  renderProgress = () => {\n    const { uploadProgress } = this.state;\n    if (uploadProgress <= 0 || uploadProgress >= 1) return null;\n\n    return (\n      <View style={styles.progressContainer}>\n        <View style={styles.progressBar}>\n          <View style={[styles.progressFill, { width: `${uploadProgress * 100}%` }]} />\n        </View>\n        <Text style={styles.progressText}>{Math.round(uploadProgress * 100)}%</Text>\n      </View>\n    );\n  };\n\n  render() {\n    return (\n      <View style={styles.container}>\n        {this.renderUploadButton()}\n        {this.renderProgress()}\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    marginVertical: 10,\n  },\n  uploadButton: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingVertical: 8,\n    paddingHorizontal: 16,\n    borderRadius: 6,\n    backgroundColor: '#fff',\n    borderWidth: 1,\n    borderColor: '#007AFF',\n  },\n  buttonContent: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  buttonText: {\n    color: '#fff',\n    fontSize: 16,\n    fontWeight: '500',\n    marginLeft: 8,\n  },\n  icon: {\n    marginRight: 8,\n  },\n  progressContainer: {\n    marginTop: 8,\n    alignItems: 'center',\n  },\n  progressBar: {\n    height: 4,\n    width: '100%',\n    backgroundColor: '#E0E0E0',\n    borderRadius: 2,\n    overflow: 'hidden',\n  },\n  progressFill: {\n    height: '100%',\n    backgroundColor: '#4CAF50',\n  },\n  progressText: {\n    marginTop: 4,\n    fontSize: 12,\n    color: TEXT_DARK,\n  },\n});\n\nconst mapStateToProps = state => {\n  const { user } = state;\n  return {\n    user,\n    colourBrandingMain: getMainBrandingColourFromState(state),\n  };\n};\n\nexport default connect(mapStateToProps)(DocumentUploader);\n"],"mappings":"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","ignoreList":[]}

package/dist/module/components/ImagePopup.js

@@ -4,9 +4,10 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 import React, { Component } from 'react';
 import _ from 'lodash';
 import moment from 'moment';
-import { Dimensions, Modal, TouchableOpacity, StyleSheet, View, ImageBackground, Text } from 'react-native';
+import { Dimensions, Modal, TouchableOpacity, StyleSheet, View, Text } from 'react-native';
 import ImageViewer from 'react-native-image-zoom-viewer';
 import { Icon } from '@rneui/themed';
+import AutoHeightImage from 'react-native-auto-height-image';
 import { TEXT_DARK } from '../colours';
 import { StatusBarHeight, isVideo, get1400 } from '../helper';
 import { Pl60Icon } from '../fonts';
@@ -53,26 +54,17 @@ class ImagePopup extends Component {
         currentVideoUrl: url
       });
     });
-    _defineProperty(this, "renderImage", props => {
+    _defineProperty(this, "renderImageFooter", (media, style) => {
       var _media$user, _media$user2;
-      const media = this.state.images.find(image => image.url === props.source.uri);
-      const isVideo = !_.isNil(media) && media.isVideo;
+      if (!media.user || !media.date) return null;
       let dateText, timeText;
       if (!_.isNil(media.date)) {
         const imageDate = moment(media.date);
         dateText = imageDate.format('MMMM D, YYYY');
         timeText = imageDate.format('hh:mm A');
       }
-      return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(ImageBackground, props, isVideo && /*#__PURE__*/React.createElement(View, {
-        style: styles.videoOverlay
-      }, /*#__PURE__*/React.createElement(TouchableOpacity, {
-        onPress: this.toggleFullscreenVideo.bind(this, media.original)
-      }, /*#__PURE__*/React.createElement(Icon, {
-        name: "play",
-        type: "font-awesome",
-        iconStyle: styles.videoPlayIcon
-      })))), (!_.isNil(media.user) || !_.isNil(media.date)) && /*#__PURE__*/React.createElement(View, {
-        style: styles.imageInfoContainer
+      return /*#__PURE__*/React.createElement(View, {
+        style: [styles.imageInfoContainer, style]
       }, /*#__PURE__*/React.createElement(ProfilePic, {
         Diameter: 42,
         ProfilePic: media === null || media === void 0 || (_media$user = media.user) === null || _media$user === void 0 ? void 0 : _media$user.profilePic
@@ -83,7 +75,28 @@ class ImagePopup extends Component {
       }, media === null || media === void 0 || (_media$user2 = media.user) === null || _media$user2 === void 0 ? void 0 : _media$user2.displayName), /*#__PURE__*/React.createElement(Text, {
         numberOfLines: 2,
         style: styles.iamgeTextDate
-      }, `Uploaded ${dateText} • ${timeText}`))));
+      }, `Uploaded ${dateText} • ${timeText}`)));
+    });
+    _defineProperty(this, "renderImage", props => {
+      const media = this.state.images.find(image => image.url === props.source.uri);
+      const isVideo = !_.isNil(media) && media.isVideo;
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles.imageContainer
+      }, /*#__PURE__*/React.createElement(AutoHeightImage, {
+        source: {
+          uri: media.url
+        },
+        width: SCREEN_WIDTH,
+        resizeMode: "contain"
+      }), isVideo && /*#__PURE__*/React.createElement(View, {
+        style: styles.videoOverlay
+      }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+        onPress: this.toggleFullscreenVideo.bind(this, media.original)
+      }, /*#__PURE__*/React.createElement(Icon, {
+        name: "play",
+        type: "font-awesome",
+        iconStyle: styles.videoPlayIcon
+      }))), this.renderImageFooter(media));
     });
     this.state = {
       index: 0,
@@ -144,6 +157,15 @@ class ImagePopup extends Component {
     if (_.isEmpty(images)) {
       return null;
     }
+
+    // This is required for the ImageViewer to render the image info section properly
+    const imagesWithSizes = images.map(image => {
+      return {
+        ...image,
+        width: SCREEN_WIDTH,
+        height: SCREEN_HEIGHT
+      };
+    });
     return /*#__PURE__*/React.createElement(Modal, {
       visible: visible,
       animationType: "slide",
@@ -155,7 +177,7 @@ class ImagePopup extends Component {
       onChange: this.onChange,
       onSwipeDown: onClose,
       enableSwipeDown: true,
-      imageUrls: images,
+      imageUrls: imagesWithSizes,
       saveToLocalByLongPress: false,
       renderImage: this.renderImage
     }), this.renderClose(), /*#__PURE__*/React.createElement(SharingTools, {
@@ -172,10 +194,10 @@ const styles = StyleSheet.create({
     height: SCREEN_HEIGHT,
     backgroundColor: '#000'
   },
-  image: {
-    width: SCREEN_WIDTH,
-    height: SCREEN_HEIGHT,
-    backgroundColor: '#000'
+  imageContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
   },
   menuIconContainer: {
     position: 'absolute',

package/dist/module/components/ImagePopup.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Component","_","moment","Dimensions","Modal","TouchableOpacity","StyleSheet","View","ImageBackground","Text","ImageViewer","Icon","TEXT_DARK","StatusBarHeight","isVideo","get1400","Pl60Icon","SharingTools","VideoPopup","ProfilePic","SCREEN_WIDTH","get","width","SCREEN_HEIGHT","height","ImagePopup","constructor","props","_defineProperty","images","map","image","url","original","uri","date","user","setState","index","state","showFullscreenVideo","length","currentVideoUrl","_media$user","_media$user2","media","find","source","isNil","dateText","timeText","imageDate","format","createElement","style","styles","videoOverlay","onPress","toggleFullscreenVideo","bind","name","type","iconStyle","videoPlayIcon","imageInfoContainer","Diameter","profilePic","imageTextContainer","imageTextName","displayName","numberOfLines","iamgeTextDate","componentDidMount","setupUrls","componentDidUpdate","prevProps","visible","scrollTo","renderClose","menuIconContainer","onClose","activeOpacity","menuIcon","renderVideoPlayerPopup","render","isEmpty","animationType","onRequestClose","modal","scrollable","onChange","onSwipeDown","enableSwipeDown","imageUrls","saveToLocalByLongPress","renderImage","create","backgroundColor","position","top","right","zIndex","fontSize","padding","textAlign","color","left","bottom","alignItems","justifyContent","textShadowColor","textShadowOffset","flexDirection","paddingHorizontal","marginLeft","flex","fontFamily"],"sources":["ImagePopup.js"],"sourcesContent":["import React, { Component } from 'react';\nimport _ from 'lodash';\nimport moment from 'moment';\nimport { Dimensions, Modal, TouchableOpacity, StyleSheet, View, ImageBackground, Text } from 'react-native';\nimport ImageViewer from 'react-native-image-zoom-viewer';\nimport { Icon } from '@rneui/themed';\nimport { TEXT_DARK } from '../colours';\nimport { StatusBarHeight, isVideo, get1400 } from '../helper';\nimport { Pl60Icon } from '../fonts';\nimport { SharingTools } from './SharingTools';\nimport { VideoPopup } from './VideoPopup';\nimport { ProfilePic } from './ProfilePic';\n\nconst SCREEN_WIDTH = Dimensions.get('window').width;\nconst SCREEN_HEIGHT = Dimensions.get('window').height;\n\nclass ImagePopup extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      index: 0,\n      images: [],\n      showFullscreenVideo: false,\n      currentVideoUrl: '',\n    };\n  }\n\n  componentDidMount() {\n    this.setupUrls();\n  }\n\n  componentDidUpdate(prevProps) {\n    const { visible, index } = this.props;\n    if (!prevProps.visible && visible) this.setupUrls();\n    if (prevProps.index !== index) this.setState({ index });\n  }\n\n  setupUrls = () => {\n    if (!this.props.images) return;\n\n    const images = this.props.images.map(image => {\n      if (typeof image === 'string') {\n        return { url: get1400(image), original: image, isVideo: isVideo(image) };\n      }\n      return { url: get1400(image?.uri), original: image?.uri, isVideo: isVideo(image?.uri), date: image?.date, user: image?.user };\n    });\n\n    this.setState({ images, index: this.state.index || this.props.index || 0 });\n  };\n\n  onChange = index => {\n    this.setState({ index });\n  };\n\n  scrollTo(index) {\n    this.setState({\n      index,\n    });\n  }\n\n  toggleFullscreenVideo = url => {\n    if (typeof url !== 'string') url = '';\n    this.setState({ showFullscreenVideo: url.length > 0, currentVideoUrl: url });\n  };\n\n  renderClose() {\n    return (\n      <TouchableOpacity style={styles.menuIconContainer} onPress={this.props.onClose} activeOpacity={0.6}>\n        <Pl60Icon name=\"close\" style={[styles.menuIcon]} />\n      </TouchableOpacity>\n    );\n  }\n\n  renderImage = props => {\n    const media = this.state.images.find(image => image.url === props.source.uri);\n    const isVideo = !_.isNil(media) && media.isVideo;\n\n    let dateText, timeText;\n    if (!_.isNil(media.date)) {\n      const imageDate = moment(media.date);\n      dateText = imageDate.format('MMMM D, YYYY');\n      timeText = imageDate.format('hh:mm A');\n    }\n\n    return (\n      <View>\n        <ImageBackground {...props}>\n          {isVideo && (\n            <View style={styles.videoOverlay}>\n              <TouchableOpacity onPress={this.toggleFullscreenVideo.bind(this, media.original)}>\n                <Icon name=\"play\" type=\"font-awesome\" iconStyle={styles.videoPlayIcon} />\n              </TouchableOpacity>\n            </View>\n          )}\n        </ImageBackground>\n        {(!_.isNil(media.user) || !_.isNil(media.date)) && (\n          <View style={styles.imageInfoContainer}>\n            <ProfilePic Diameter={42} ProfilePic={media?.user?.profilePic} />\n            <View style={styles.imageTextContainer}>\n              <Text style={styles.imageTextName}>{media?.user?.displayName}</Text>\n              <Text numberOfLines={2} style={styles.iamgeTextDate}>{`Uploaded ${dateText} • ${timeText}`}</Text>\n            </View>\n          </View>\n        )}\n      </View>\n    );\n  };\n\n  renderVideoPlayerPopup() {\n    const { showFullscreenVideo, currentVideoUrl } = this.state;\n    if (!currentVideoUrl) return;\n\n    return <VideoPopup uri={currentVideoUrl} visible={showFullscreenVideo} onClose={this.toggleFullscreenVideo} />;\n  }\n\n  render() {\n    const { visible, onClose } = this.props;\n    const { index, images } = this.state;\n\n    if (_.isEmpty(images)) {\n      return null;\n    }\n    return (\n      <Modal visible={visible} animationType=\"slide\" onRequestClose={onClose} style={styles.modal}>\n        <ImageViewer\n          style={styles.scrollable}\n          index={index}\n          onChange={this.onChange}\n          onSwipeDown={onClose}\n          enableSwipeDown\n          imageUrls={images}\n          saveToLocalByLongPress={false}\n          renderImage={this.renderImage}\n        />\n        {this.renderClose()}\n        <SharingTools uri={images[index].original} />\n        {this.renderVideoPlayerPopup()}\n      </Modal>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  modal: {\n    backgroundColor: '#000',\n  },\n  scrollable: {\n    width: SCREEN_WIDTH,\n    height: SCREEN_HEIGHT,\n    backgroundColor: '#000',\n  },\n  image: {\n    width: SCREEN_WIDTH,\n    height: SCREEN_HEIGHT,\n    backgroundColor: '#000',\n  },\n  menuIconContainer: {\n    position: 'absolute',\n    top: StatusBarHeight(0),\n    right: 0,\n    width: 55,\n    height: 55,\n    zIndex: 3,\n  },\n  menuIcon: {\n    fontSize: 25,\n    padding: 15,\n    width: 55,\n    textAlign: 'center',\n    color: '#fff',\n    zIndex: 3,\n  },\n  videoOverlay: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  videoPlayIcon: {\n    color: '#fff',\n    fontSize: 30,\n    textShadowColor: 'rgba(0,0,0,0.3)',\n    textShadowOffset: { width: 2, height: 2 },\n  },\n  imageInfoContainer: {\n    flexDirection: 'row',\n    paddingHorizontal: 12,\n    height: 70,\n    backgroundColor: '#fff',\n    alignItems: 'center',\n  },\n  imageTextContainer: {\n    marginLeft: 12,\n    flexDirection: 'column',\n    flex: 1,\n    height: 42,\n    justifyContent: 'space-around',\n  },\n  imageTextName: {\n    fontFamily: 'sf-semibold',\n    fontSize: 14,\n    color: TEXT_DARK,\n  },\n  iamgeTextDate: {\n    fontFamily: 'sf-regular',\n    fontSize: 12,\n    color: TEXT_DARK,\n  },\n});\n\nexport { ImagePopup };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Component","_","moment","Dimensions","Modal","TouchableOpacity","StyleSheet","View","Text","ImageViewer","Icon","AutoHeightImage","TEXT_DARK","StatusBarHeight","isVideo","get1400","Pl60Icon","SharingTools","VideoPopup","ProfilePic","SCREEN_WIDTH","get","width","SCREEN_HEIGHT","height","ImagePopup","constructor","props","_defineProperty","images","map","image","url","original","uri","date","user","setState","index","state","showFullscreenVideo","length","currentVideoUrl","media","style","_media$user","_media$user2","dateText","timeText","isNil","imageDate","format","createElement","styles","imageInfoContainer","Diameter","profilePic","imageTextContainer","imageTextName","displayName","numberOfLines","iamgeTextDate","find","source","imageContainer","resizeMode","videoOverlay","onPress","toggleFullscreenVideo","bind","name","type","iconStyle","videoPlayIcon","renderImageFooter","componentDidMount","setupUrls","componentDidUpdate","prevProps","visible","scrollTo","renderClose","menuIconContainer","onClose","activeOpacity","menuIcon","renderVideoPlayerPopup","render","isEmpty","imagesWithSizes","animationType","onRequestClose","modal","scrollable","onChange","onSwipeDown","enableSwipeDown","imageUrls","saveToLocalByLongPress","renderImage","create","backgroundColor","flex","justifyContent","alignItems","position","top","right","zIndex","fontSize","padding","textAlign","color","left","bottom","textShadowColor","textShadowOffset","flexDirection","paddingHorizontal","marginLeft","fontFamily"],"sources":["ImagePopup.js"],"sourcesContent":["import React, { Component } from 'react';\nimport _ from 'lodash';\nimport moment from 'moment';\nimport { Dimensions, Modal, TouchableOpacity, StyleSheet, View, Text } from 'react-native';\nimport ImageViewer from 'react-native-image-zoom-viewer';\nimport { Icon } from '@rneui/themed';\nimport AutoHeightImage from 'react-native-auto-height-image';\nimport { TEXT_DARK } from '../colours';\nimport { StatusBarHeight, isVideo, get1400 } from '../helper';\nimport { Pl60Icon } from '../fonts';\nimport { SharingTools } from './SharingTools';\nimport { VideoPopup } from './VideoPopup';\nimport { ProfilePic } from './ProfilePic';\n\nconst SCREEN_WIDTH = Dimensions.get('window').width;\nconst SCREEN_HEIGHT = Dimensions.get('window').height;\n\nclass ImagePopup extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      index: 0,\n      images: [],\n      showFullscreenVideo: false,\n      currentVideoUrl: '',\n    };\n  }\n\n  componentDidMount() {\n    this.setupUrls();\n  }\n\n  componentDidUpdate(prevProps) {\n    const { visible, index } = this.props;\n    if (!prevProps.visible && visible) this.setupUrls();\n    if (prevProps.index !== index) this.setState({ index });\n  }\n\n  setupUrls = () => {\n    if (!this.props.images) return;\n\n    const images = this.props.images.map(image => {\n      if (typeof image === 'string') {\n        return { url: get1400(image), original: image, isVideo: isVideo(image) };\n      }\n      return { url: get1400(image?.uri), original: image?.uri, isVideo: isVideo(image?.uri), date: image?.date, user: image?.user };\n    });\n\n    this.setState({ images, index: this.state.index || this.props.index || 0 });\n  };\n\n  onChange = index => {\n    this.setState({ index });\n  };\n\n  scrollTo(index) {\n    this.setState({\n      index,\n    });\n  }\n\n  toggleFullscreenVideo = url => {\n    if (typeof url !== 'string') url = '';\n    this.setState({ showFullscreenVideo: url.length > 0, currentVideoUrl: url });\n  };\n\n  renderClose() {\n    return (\n      <TouchableOpacity style={styles.menuIconContainer} onPress={this.props.onClose} activeOpacity={0.6}>\n        <Pl60Icon name=\"close\" style={[styles.menuIcon]} />\n      </TouchableOpacity>\n    );\n  }\n\n  renderImageFooter = (media, style) => {\n    if (!media.user || !media.date) return null;\n\n    let dateText, timeText;\n    if (!_.isNil(media.date)) {\n      const imageDate = moment(media.date);\n      dateText = imageDate.format('MMMM D, YYYY');\n      timeText = imageDate.format('hh:mm A');\n    }\n\n    return (\n      <View style={[styles.imageInfoContainer, style]}>\n        <ProfilePic Diameter={42} ProfilePic={media?.user?.profilePic} />\n        <View style={styles.imageTextContainer}>\n          <Text style={styles.imageTextName}>{media?.user?.displayName}</Text>\n          <Text numberOfLines={2} style={styles.iamgeTextDate}>{`Uploaded ${dateText} • ${timeText}`}</Text>\n        </View>\n      </View>\n    );\n  };\n\n  renderImage = props => {\n    const media = this.state.images.find(image => image.url === props.source.uri);\n    const isVideo = !_.isNil(media) && media.isVideo;\n\n    return (\n      <View style={styles.imageContainer}>\n        <AutoHeightImage source={{ uri: media.url }} width={SCREEN_WIDTH} resizeMode=\"contain\" />\n        {isVideo && (\n          <View style={styles.videoOverlay}>\n            <TouchableOpacity onPress={this.toggleFullscreenVideo.bind(this, media.original)}>\n              <Icon name=\"play\" type=\"font-awesome\" iconStyle={styles.videoPlayIcon} />\n            </TouchableOpacity>\n          </View>\n        )}\n        {this.renderImageFooter(media)}\n      </View>\n    );\n  };\n\n  renderVideoPlayerPopup() {\n    const { showFullscreenVideo, currentVideoUrl } = this.state;\n    if (!currentVideoUrl) return;\n\n    return <VideoPopup uri={currentVideoUrl} visible={showFullscreenVideo} onClose={this.toggleFullscreenVideo} />;\n  }\n\n  render() {\n    const { visible, onClose } = this.props;\n    const { index, images } = this.state;\n\n    if (_.isEmpty(images)) {\n      return null;\n    }\n\n    // This is required for the ImageViewer to render the image info section properly\n    const imagesWithSizes = images.map(image => {\n      return {\n        ...image,\n        width: SCREEN_WIDTH,\n        height: SCREEN_HEIGHT,\n      };\n    });\n    return (\n      <Modal visible={visible} animationType=\"slide\" onRequestClose={onClose} style={styles.modal}>\n        <ImageViewer\n          style={styles.scrollable}\n          index={index}\n          onChange={this.onChange}\n          onSwipeDown={onClose}\n          enableSwipeDown\n          imageUrls={imagesWithSizes}\n          saveToLocalByLongPress={false}\n          renderImage={this.renderImage}\n        />\n        {this.renderClose()}\n        <SharingTools uri={images[index].original} />\n        {this.renderVideoPlayerPopup()}\n      </Modal>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  modal: {\n    backgroundColor: '#000',\n  },\n  scrollable: {\n    width: SCREEN_WIDTH,\n    height: SCREEN_HEIGHT,\n    backgroundColor: '#000',\n  },\n  imageContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n  menuIconContainer: {\n    position: 'absolute',\n    top: StatusBarHeight(0),\n    right: 0,\n    width: 55,\n    height: 55,\n    zIndex: 3,\n  },\n  menuIcon: {\n    fontSize: 25,\n    padding: 15,\n    width: 55,\n    textAlign: 'center',\n    color: '#fff',\n    zIndex: 3,\n  },\n  videoOverlay: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  videoPlayIcon: {\n    color: '#fff',\n    fontSize: 30,\n    textShadowColor: 'rgba(0,0,0,0.3)',\n    textShadowOffset: { width: 2, height: 2 },\n  },\n  imageInfoContainer: {\n    flexDirection: 'row',\n    paddingHorizontal: 12,\n    height: 70,\n    backgroundColor: '#fff',\n    alignItems: 'center',\n  },\n  imageTextContainer: {\n    marginLeft: 12,\n    flexDirection: 'column',\n    flex: 1,\n    height: 42,\n    justifyContent: 'space-around',\n  },\n  imageTextName: {\n    fontFamily: 'sf-semibold',\n    fontSize: 14,\n    color: TEXT_DARK,\n  },\n  iamgeTextDate: {\n    fontFamily: 'sf-regular',\n    fontSize: 12,\n    color: TEXT_DARK,\n  },\n});\n\nexport { ImagePopup };\n"],"mappings":"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","ignoreList":[]}

package/dist/module/components/ImageUploader.js

@@ -275,9 +275,15 @@ class ImageUploader extends Component {
       });
     });
     _defineProperty(this, "openCropper", () => {
+      // Switching modals - requires a timeout to ensure the modal is closed before opening the next one
       this.setState({
-        showPhotos: false,
-        showCropper: true
+        showPhotos: false
+      }, () => {
+        setTimeout(() => {
+          this.setState({
+            showCropper: true
+          });
+        }, 1000);
       });
     });
     _defineProperty(this, "toggleCropper", () => {