Fixed audio recording issues (#310)

app/containers/MessageBox/Recording.js

@@ -36,6 +36,7 @@ export default class extends React.PureComponent {
 		super();
 
 		this.recordingCanceled = false;
+		this.recording = true;
 		this.state = {
 			currentTime: '00:00'
 		};
@@ -65,6 +66,12 @@ export default class extends React.PureComponent {
 		AudioRecorder.startRecording();
 	}
 
+	componentWillUnmount() {
+		if (this.recording) {
+			this.cancelAudioMessage();
+		}
+	}
+
 	_finishRecording(didSucceed, filePath) {
 		if (!didSucceed) {
 			return this.props.onFinish && this.props.onFinish(didSucceed);
@@ -81,6 +88,7 @@ export default class extends React.PureComponent {
 
 	finishAudioMessage = async() => {
 		try {
+			this.recording = false;
 			const filePath = await AudioRecorder.stopRecording();
 			if (Platform.OS === 'android') {
 				this._finishRecording(true, filePath);
@@ -92,6 +100,7 @@ export default class extends React.PureComponent {
 	}
 
 	cancelAudioMessage = async() => {
+		this.recording = false;
 		this.recordingCanceled = true;
 		await AudioRecorder.stopRecording();
 		return this._finishRecording(false);
@@ -113,7 +122,7 @@ export default class extends React.PureComponent {
 						accessibilityTraits='button'
 						onPress={this.cancelAudioMessage}
 					/>
-					<Text key='currentTime' style={[styles.textBoxInput, { width: 50, height: 60 }]}>{this.state.currentTime}</Text>
+					<Text key='currentTime' style={styles.textBoxInput}>{this.state.currentTime}</Text>
 					<Icon
 						style={[styles.actionButtons, { color: 'green' }]}
 						name='check'

app/containers/MessageBox/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { View, TextInput, FlatList, Text, TouchableOpacity } from 'react-native';
+import { View, TextInput, FlatList, Text, TouchableOpacity, Alert } from 'react-native';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import ImagePicker from 'react-native-image-picker';
 import { connect } from 'react-redux';
@@ -209,12 +209,19 @@ export default class MessageBox extends React.PureComponent {
 	}
 
 	finishAudioMessage = async(fileInfo) => {
-		if (fileInfo) {
-			RocketChat.sendFileMessage(this.props.rid, fileInfo);
-		}
 		this.setState({
 			recording: false
 		});
+		if (fileInfo) {
+			try {
+				await RocketChat.sendFileMessage(this.props.rid, fileInfo);
+			} catch (e) {
+				if (e && e.error === 'error-file-too-large') {
+					return Alert.alert('File is too large!');
+				}
+				log('finishAudioMessage', e);
+			}
+		}
 	}
 
 	closeEmoji() {

app/lib/rocketchat.js

@@ -615,7 +615,7 @@ const RocketChat = {
 		return call('sendFileMessage', rid, null, data, msg);
 	},
 	async sendFileMessage(rid, fileInfo, data) {
-		const placeholder = RocketChat.getMessage(rid, 'Sending a file');
+		let placeholder;
 		try {
 			if (!data) {
 				data = await RNFetchBlob.wrap(fileInfo.path);
@@ -624,6 +624,15 @@ const RocketChat = {
 				fileInfo.name = fileStat.filename;
 			}
 
+			const { FileUpload_MaxFileSize } = reduxStore.getState().settings;
+
+			// -1 maxFileSize means there is no limit
+			if (FileUpload_MaxFileSize > -1 && fileInfo.size > FileUpload_MaxFileSize) {
+				return Promise.reject({ error: 'error-file-too-large' }); // eslint-disable-line
+			}
+
+			placeholder = RocketChat.getMessage(rid, 'Sending a file');
+
 			const result = await RocketChat._ufsCreate({ ...fileInfo, rid });
 			await RNFetchBlob.fetch('POST', result.url, {
 				'Content-Type': 'application/octet-stream'
@@ -643,10 +652,12 @@ const RocketChat = {
 		} finally {
 			// TODO: fix that
 			try {
-				database.write(() => {
+				if (placeholder) {
-					const msg = database.objects('messages').filtered('_id = $0', placeholder._id);
+					database.write(() => {
-					database.delete(msg);
+						const msg = database.objects('messages').filtered('_id = $0', placeholder._id);
-				});
+						database.delete(msg);
+					});
+				}
 			} catch (e) {
 				console.error(e);
 			}