MM-13365/MM-13375 Fix edit profile image (#2433)

* MM-13365/MM-13375 Fix edit profile image

* Set Max file size to 20Mb
This commit is contained in:
Elias Nahum 2018-12-10 09:24:50 -03:00 committed by GitHub
parent aa20048b2b
commit a6eea28b5b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 69 additions and 36 deletions

View file

@ -26,6 +26,11 @@ const ShareExtension = NativeModules.MattermostShare;
export default class AttachmentButton extends PureComponent {
static propTypes = {
blurTextBox: PropTypes.func.isRequired,
browseFileTypes: PropTypes.string,
canBrowseFiles: PropTypes.bool,
canBrowseLibrary: PropTypes.bool,
canTakePhoto: PropTypes.bool,
canTakeVideo: PropTypes.bool,
children: PropTypes.node,
fileCount: PropTypes.number,
maxFileCount: PropTypes.number.isRequired,
@ -39,6 +44,11 @@ export default class AttachmentButton extends PureComponent {
};
static defaultProps = {
browseFileTypes: Platform.OS === 'ios' ? 'public.item' : '*/*',
canBrowseFiles: true,
canBrowseLibrary: true,
canTakePhoto: true,
canTakeVideo: true,
maxFileCount: 5,
};
@ -163,11 +173,12 @@ export default class AttachmentButton extends PureComponent {
};
attachFileFromFiles = async () => {
const {browseFileTypes} = this.props;
const hasPermission = await this.hasStoragePermission();
if (hasPermission) {
DocumentPicker.show({
filetype: [Platform.OS === 'ios' ? 'public.item' : '*/*'],
filetype: [browseFileTypes],
}, async (error, res) => {
if (error) {
return;
@ -329,7 +340,15 @@ export default class AttachmentButton extends PureComponent {
};
showFileAttachmentOptions = () => {
const {fileCount, maxFileCount, onShowFileMaxWarning} = this.props;
const {
canBrowseFiles,
canBrowseLibrary,
canTakePhoto,
canTakeVideo,
fileCount,
maxFileCount,
onShowFileMaxWarning,
} = this.props;
if (fileCount === maxFileCount) {
onShowFileMaxWarning();
@ -337,57 +356,69 @@ export default class AttachmentButton extends PureComponent {
}
this.props.blurTextBox();
const options = {
items: [{
const items = [];
if (canTakePhoto) {
items.push({
action: () => this.handleFileAttachmentOption(this.attachPhotoFromCamera),
text: {
id: t('mobile.file_upload.camera_photo'),
defaultMessage: 'Take Photo',
},
icon: 'camera',
}, {
});
}
if (canTakeVideo) {
items.push({
action: () => this.handleFileAttachmentOption(this.attachVideoFromCamera),
text: {
id: t('mobile.file_upload.camera_video'),
defaultMessage: 'Take Video',
},
icon: 'video-camera',
}, {
});
}
if (canBrowseLibrary) {
items.push({
action: () => this.handleFileAttachmentOption(this.attachFileFromLibrary),
text: {
id: t('mobile.file_upload.library'),
defaultMessage: 'Photo Library',
},
icon: 'photo',
}],
};
if (Platform.OS === 'android') {
options.items.push({
action: () => this.handleFileAttachmentOption(this.attachVideoFromLibraryAndroid),
text: {
id: t('mobile.file_upload.video'),
defaultMessage: 'Video Library',
},
icon: 'file-video-o',
});
if (Platform.OS === 'android') {
items.push({
action: () => this.handleFileAttachmentOption(this.attachVideoFromLibraryAndroid),
text: {
id: t('mobile.file_upload.video'),
defaultMessage: 'Video Library',
},
icon: 'file-video-o',
});
}
}
options.items.push({
action: () => this.handleFileAttachmentOption(this.attachFileFromFiles),
text: {
id: t('mobile.file_upload.browse'),
defaultMessage: 'Browse Files',
},
icon: 'file',
});
if (canBrowseFiles) {
items.push({
action: () => this.handleFileAttachmentOption(this.attachFileFromFiles),
text: {
id: t('mobile.file_upload.browse'),
defaultMessage: 'Browse Files',
},
icon: 'file',
});
}
this.props.navigator.showModal({
screen: 'OptionsModal',
title: '',
animationType: 'none',
passProps: {
items: options.items,
items,
},
navigatorStyle: {
navBarHidden: true,

View file

@ -49,8 +49,13 @@ export default class ProfilePicture extends PureComponent {
pictureUrl: null,
};
componentWillMount() {
const {edit, imageUri, profileImageUri, user} = this.props;
componentDidMount() {
const {actions, edit, imageUri, profileImageUri, user, status} = this.props;
this.mounted = true;
if (!status && user) {
actions.getStatusForId(user.id);
}
if (profileImageUri) {
this.setImageURL(profileImageUri);
@ -61,14 +66,6 @@ export default class ProfilePicture extends PureComponent {
}
}
componentDidMount() {
if (!this.props.status && this.props.user) {
this.props.actions.getStatusForId(this.props.user.id);
}
this.mounted = true;
}
componentWillReceiveProps(nextProps) {
if (this.mounted) {
if (nextProps.edit && nextProps.imageUri && nextProps.imageUri !== this.props.imageUri) {

View file

@ -7,6 +7,7 @@ import {intlShape} from 'react-intl';
import {View} from 'react-native';
import RNFetchBlob from 'rn-fetch-blob';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
import {DocumentPickerUtil} from 'react-native-document-picker';
import {Client4} from 'mattermost-redux/client';
@ -25,6 +26,7 @@ import AttachmentButton from 'app/components/attachment_button';
import mattermostBucket from 'app/mattermost_bucket';
import LocalConfig from 'assets/config';
const MAX_SIZE = 20 * 1024;
const holders = {
firstName: {
id: t('user.settings.general.firstName'),
@ -488,6 +490,9 @@ export default class EditProfile extends PureComponent {
<View style={style.top}>
<AttachmentButton
blurTextBox={emptyFunction}
browseFileTypes={DocumentPickerUtil.images()}
canTakeVideo={false}
maxFileSize={MAX_SIZE}
theme={theme}
navigator={navigator}
wrapper={true}