[NEW] Send multiple attachments

android/app/src/main/AndroidManifest.xml

@@ -3,13 +3,8 @@
 	package="chat.rocket.reactnative">
 
 	<uses-permission android:name="android.permission.INTERNET" />
-	<!-- <uses-permission android:name="android.permission.CAMERA" />
 	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
 	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
-	<uses-permission android:name="android.permission.RECORD_AUDIO" />
-	<uses-permission android:name="android.permission.WAKE_LOCK" />
-	<uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION" /> -->
-	<!-- <uses-permission-sdk-23 android:name="android.permission.VIBRATE"/> -->
 
 	<application
 		android:name=".MainApplication"
@@ -65,6 +60,7 @@
 				android:theme="@style/AppTheme" >
 				<intent-filter>
 					<action android:name="android.intent.action.SEND" />
+					<action android:name="android.intent.action.SEND_MULTIPLE" />
 					<category android:name="android.intent.category.DEFAULT" />
 					<data android:mimeType="*/*" />
 				</intent-filter>

android/app/src/main/java/chat/rocket/reactnative/generated/BasePackageList.java

@@ -15,6 +15,7 @@ public List<Package> getPackageList() {
         new expo.modules.keepawake.KeepAwakePackage(),
         new expo.modules.localauthentication.LocalAuthenticationPackage(),
         new expo.modules.permissions.PermissionsPackage(),
+        new expo.modules.videothumbnails.VideoThumbnailsPackage(),
         new expo.modules.webbrowser.WebBrowserPackage()
     );
   }

app/constants/colors.js

@@ -53,7 +53,9 @@ export const themes = {
 		passcodePrimary: '#2F343D',
 		passcodeSecondary: '#6C727A',
 		passcodeDotEmpty: '#CBCED1',
-		passcodeDotFull: '#6C727A'
+		passcodeDotFull: '#6C727A',
+		previewBackground: '#1F2329',
+		previewTintColor: '#ffffff'
 	},
 	dark: {
 		backgroundColor: '#030b1b',
@@ -95,7 +97,9 @@ export const themes = {
 		passcodePrimary: '#FFFFFF',
 		passcodeSecondary: '#CBCED1',
 		passcodeDotEmpty: '#CBCED1',
-		passcodeDotFull: '#6C727A'
+		passcodeDotFull: '#6C727A',
+		previewBackground: '#030b1b',
+		previewTintColor: '#ffffff'
 	},
 	black: {
 		backgroundColor: '#000000',
@@ -137,6 +141,8 @@ export const themes = {
 		passcodePrimary: '#FFFFFF',
 		passcodeSecondary: '#CBCED1',
 		passcodeDotEmpty: '#CBCED1',
-		passcodeDotFull: '#6C727A'
+		passcodeDotFull: '#6C727A',
+		previewBackground: '#000000',
+		previewTintColor: '#ffffff'
 	}
 };

app/containers/ActionSheet/Provider.js

@@ -1,5 +1,4 @@
-import React, { useRef, useContext } from 'react';
-import hoistNonReactStatics from 'hoist-non-react-statics';
+import React, { useRef, useContext, forwardRef } from 'react';
 import PropTypes from 'prop-types';
 
 import ActionSheet from './ActionSheet';
@@ -14,15 +13,11 @@ export const useActionSheet = () => useContext(context);
 
 const { Provider, Consumer } = context;
 
-export const withActionSheet = (Component) => {
-	const ConnectedActionSheet = props => (
-		<Consumer>
-			{contexts => <Component {...props} {...contexts} />}
-		</Consumer>
-	);
-	hoistNonReactStatics(ConnectedActionSheet, Component);
-	return ConnectedActionSheet;
-};
+export const withActionSheet = Component => forwardRef((props, ref) => (
+	<Consumer>
+		{contexts => <Component {...props} {...contexts} ref={ref} />}
+	</Consumer>
+));
 
 export const ActionSheetProvider = React.memo(({ children }) => {
 	const ref = useRef();

app/containers/Header/index.js

@@ -4,11 +4,22 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 import { View, StyleSheet } from 'react-native';
 import { themes } from '../../constants/colors';
 import { themedHeader } from '../../utils/navigation';
-import { isIOS } from '../../utils/deviceInfo';
+import { isIOS, isTablet } from '../../utils/deviceInfo';
 
 // Get from https://github.com/react-navigation/react-navigation/blob/master/packages/stack/src/views/Header/HeaderSegment.tsx#L69
 export const headerHeight = isIOS ? 44 : 56;
 
+export const getHeaderHeight = (isLandscape) => {
+	if (isIOS) {
+		if (isLandscape && !isTablet) {
+			return 32;
+		} else {
+			return 44;
+		}
+	}
+	return 56;
+};
+
 const styles = StyleSheet.create({
 	container: {
 		height: headerHeight,

app/containers/HeaderButton.js

@@ -36,9 +36,11 @@ export const DrawerButton = React.memo(({ navigation, testID, ...otherProps }) =
 	</CustomHeaderButtons>
 ));
 
-export const CloseModalButton = React.memo(({ navigation, testID, onPress = () => navigation.pop() }) => (
+export const CloseModalButton = React.memo(({
+	navigation, testID, onPress = () => navigation.pop(), ...props
+}) => (
 	<CustomHeaderButtons left>
-		<Item title='close' iconName='Cross' onPress={onPress} testID={testID} />
+		<Item title='close' iconName='Cross' onPress={onPress} testID={testID} {...props} />
 	</CustomHeaderButtons>
 ));
 
@@ -57,9 +59,9 @@ export const MoreButton = React.memo(({ onPress, testID }) => (
 	</CustomHeaderButtons>
 ));
 
-export const SaveButton = React.memo(({ onPress, testID }) => (
+export const SaveButton = React.memo(({ onPress, testID, ...props }) => (
 	<CustomHeaderButtons>
-		<Item title='save' iconName='download' onPress={onPress} testID={testID} />
+		<Item title='save' iconName='download' onPress={onPress} testID={testID} {...props} />
 	</CustomHeaderButtons>
 ));
 

app/containers/MessageBox/LeftButtons.ios.js

@@ -1,22 +1,28 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import { View } from 'react-native';
 
 import { CancelEditingButton, ActionsButton } from './buttons';
+import styles from './styles';
 
 const LeftButtons = React.memo(({
-	theme, showMessageBoxActions, editing, editCancel
+	theme, showMessageBoxActions, editing, editCancel, isActionsEnabled
 }) => {
 	if (editing) {
 		return <CancelEditingButton onPress={editCancel} theme={theme} />;
 	}
-	return <ActionsButton onPress={showMessageBoxActions} theme={theme} />;
+	if (isActionsEnabled) {
+		return <ActionsButton onPress={showMessageBoxActions} theme={theme} />;
+	}
+	return <View style={styles.buttonsWhitespace} />;
 });
 
 LeftButtons.propTypes = {
 	theme: PropTypes.string,
 	showMessageBoxActions: PropTypes.func.isRequired,
 	editing: PropTypes.bool,
-	editCancel: PropTypes.func.isRequired
+	editCancel: PropTypes.func.isRequired,
+	isActionsEnabled: PropTypes.bool
 };
 
 export default LeftButtons;

app/containers/MessageBox/Recording.js

@@ -6,7 +6,7 @@ import {
 import { AudioRecorder, AudioUtils } from 'react-native-audio';
 import { BorderlessButton } from 'react-native-gesture-handler';
 import { activateKeepAwake, deactivateKeepAwake } from 'expo-keep-awake';
-import RNFetchBlob from 'rn-fetch-blob';
+import * as FileSystem from 'expo-file-system';
 
 import styles from './styles';
 import I18n from '../../i18n';
@@ -113,7 +113,7 @@ export default class extends React.PureComponent {
 			this.recording = false;
 			const filePath = await AudioRecorder.stopRecording();
 			if (isAndroid) {
-				const data = await RNFetchBlob.fs.stat(decodeURIComponent(filePath));
+				const data = await FileSystem.getInfoAsync(decodeURIComponent(filePath), { size: true });
 				this.finishRecording(true, filePath, data.size);
 			}
 		} catch (err) {

app/containers/MessageBox/RightButtons.android.js

@@ -1,23 +1,25 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import { View } from 'react-native';
 
 import { SendButton, AudioButton, ActionsButton } from './buttons';
+import styles from './styles';
 
 const RightButtons = React.memo(({
-	theme, showSend, submit, recordAudioMessage, recordAudioMessageEnabled, showMessageBoxActions
+	theme, showSend, submit, recordAudioMessage, recordAudioMessageEnabled, showMessageBoxActions, isActionsEnabled
 }) => {
 	if (showSend) {
 		return <SendButton onPress={submit} theme={theme} />;
 	}
-	if (recordAudioMessageEnabled) {
+	if (recordAudioMessageEnabled || isActionsEnabled) {
 		return (
 			<>
-				<AudioButton onPress={recordAudioMessage} theme={theme} />
-				<ActionsButton onPress={showMessageBoxActions} theme={theme} />
+				{recordAudioMessageEnabled ? <AudioButton onPress={recordAudioMessage} theme={theme} /> : null}
+				{isActionsEnabled ? <ActionsButton onPress={showMessageBoxActions} theme={theme} /> : null}
 			</>
 		);
 	}
-	return <ActionsButton onPress={showMessageBoxActions} theme={theme} />;
+	return <View style={styles.buttonsWhitespace} />;
 });
 
 RightButtons.propTypes = {
@@ -26,7 +28,8 @@ RightButtons.propTypes = {
 	submit: PropTypes.func.isRequired,
 	recordAudioMessage: PropTypes.func.isRequired,
 	recordAudioMessageEnabled: PropTypes.bool,
-	showMessageBoxActions: PropTypes.func.isRequired
+	showMessageBoxActions: PropTypes.func.isRequired,
+	isActionsEnabled: PropTypes.bool
 };
 
 export default RightButtons;