Beta

__mocks__/@rocket.chat/sdk.js

@@ -0,0 +1,2 @@
+export class Rocketchat {}
+export const settings = {};

app/constants/settings.js

@@ -14,6 +14,9 @@ export default {
 	Accounts_AllowUserProfileChange: {
 		type: 'valueAsBoolean'
 	},
+	Accounts_AllowUserStatusMessageChange: {
+		type: 'valueAsBoolean'
+	},
 	Accounts_AllowUsernameChange: {
 		type: 'valueAsBoolean'
 	},

app/constants/tablet.js

@@ -1,4 +1,4 @@
 export const MAX_SIDEBAR_WIDTH = 321;
 export const MAX_CONTENT_WIDTH = '90%';
-export const MAX_SCREEN_CONTENT_WIDTH = '45%';
+export const MAX_SCREEN_CONTENT_WIDTH = '50%';
 export const MIN_WIDTH_SPLIT_LAYOUT = 700;

app/containers/AppVersion.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { StyleSheet, View, Text } from 'react-native';
+import PropTypes from 'prop-types';
+
+import { themes } from '../constants/colors';
+import sharedStyles from '../views/Styles';
+import { getReadableVersion } from '../utils/deviceInfo';
+
+const styles = StyleSheet.create({
+	container: {
+		alignItems: 'center',
+		justifyContent: 'flex-end'
+	},
+	text: {
+		...sharedStyles.textRegular,
+		fontSize: 13
+	},
+	bold: {
+		...sharedStyles.textSemibold
+	}
+});
+
+const Check = React.memo(({ theme }) => (
+	<View style={styles.container}>
+		<Text style={[styles.text, { color: themes[theme].auxiliaryText }]}>App Version: <Text style={styles.bold}>{getReadableVersion}</Text></Text>
+	</View>
+));
+
+Check.propTypes = {
+	theme: PropTypes.string
+};
+
+export default Check;

app/containers/Button/index.js

@@ -9,15 +9,16 @@ import ActivityIndicator from '../ActivityIndicator';
 
 const styles = StyleSheet.create({
 	container: {
-		paddingHorizontal: 15,
+		paddingHorizontal: 14,
 		justifyContent: 'center',
 		height: 48,
 		borderRadius: 2,
-		marginBottom: 10
+		marginBottom: 12
 	},
 	text: {
-		fontSize: 18,
-		textAlign: 'center'
+		fontSize: 16,
+		textAlign: 'center',
+		...sharedStyles.textMedium
 	}
 });
 
@@ -30,6 +31,8 @@ export default class Button extends React.PureComponent {
 		backgroundColor: PropTypes.string,
 		loading: PropTypes.bool,
 		theme: PropTypes.string,
+		color: PropTypes.string,
+		fontSize: PropTypes.string,
 		style: PropTypes.any
 	}
 
@@ -43,9 +46,15 @@ export default class Button extends React.PureComponent {
 
 	render() {
 		const {
-			title, type, onPress, disabled, backgroundColor, loading, style, theme, ...otherProps
+			title, type, onPress, disabled, backgroundColor, color, loading, style, theme, fontSize, ...otherProps
 		} = this.props;
 		const isPrimary = type === 'primary';
+
+		let textColor = isPrimary ? themes[theme].buttonText : themes[theme].bodyText;
+		if (color) {
+			textColor = color;
+		}
+
 		return (
 			<Touchable
 				onPress={onPress}
@@ -55,20 +64,20 @@ export default class Button extends React.PureComponent {
 					backgroundColor
 						? { backgroundColor }
 						: { backgroundColor: isPrimary ? themes[theme].actionTintColor : themes[theme].backgroundColor },
-					disabled && { backgroundColor: themes[theme].borderColor },
+					disabled && { opacity: 0.3 },
 					style
 				]}
 				{...otherProps}
 			>
 				{
 					loading
-						? <ActivityIndicator color={isPrimary ? themes[theme].buttonText : themes[theme].actionTintColor} />
+						? <ActivityIndicator color={textColor} />
 						: (
 							<Text
 								style={[
 									styles.text,
-									isPrimary ? sharedStyles.textMedium : sharedStyles.textBold,
-									{ color: isPrimary ? themes[theme].buttonText : themes[theme].actionTintColor }
+									{ color: textColor },
+									fontSize && { fontSize }
 								]}
 							>
 								{title}

app/containers/FormContainer.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import { ScrollView, StyleSheet, View } from 'react-native';
+import PropTypes from 'prop-types';
+import { SafeAreaView } from 'react-navigation';
+
+import { themes } from '../constants/colors';
+import sharedStyles from '../views/Styles';
+import scrollPersistTaps from '../utils/scrollPersistTaps';
+import KeyboardView from '../presentation/KeyboardView';
+import StatusBar from './StatusBar';
+import AppVersion from './AppVersion';
+import { isTablet } from '../utils/deviceInfo';
+
+const styles = StyleSheet.create({
+	scrollView: {
+		minHeight: '100%'
+	}
+});
+
+export const FormContainerInner = ({ children }) => (
+	<View style={[sharedStyles.container, isTablet && sharedStyles.tabletScreenContent]}>
+		{children}
+	</View>
+);
+
+const FormContainer = ({ children, theme }) => (
+	<KeyboardView
+		style={{ backgroundColor: themes[theme].backgroundColor }}
+		contentContainerStyle={sharedStyles.container}
+		keyboardVerticalOffset={128}
+	>
+		<StatusBar theme={theme} />
+		<ScrollView {...scrollPersistTaps} style={sharedStyles.container} contentContainerStyle={[sharedStyles.containerScrollView, styles.scrollView]}>
+			<SafeAreaView style={sharedStyles.container} forceInset={{ top: 'never' }}>
+				{children}
+				<AppVersion theme={theme} />
+			</SafeAreaView>
+		</ScrollView>
+	</KeyboardView>
+);
+
+FormContainer.propTypes = {
+	theme: PropTypes.string,
+	children: PropTypes.element
+};
+
+FormContainerInner.propTypes = {
+	children: PropTypes.element
+};
+
+export default FormContainer;

app/containers/HeaderButton.js

@@ -36,13 +36,16 @@ export const DrawerButton = React.memo(({ navigation, testID, ...otherProps }) =
 	</CustomHeaderButtons>
 ));
 
-export const CloseModalButton = React.memo(({ navigation, testID }) => (
-	<CustomHeaderButtons left>
-		<Item title='close' iconName='cross' onPress={() => navigation.pop()} testID={testID} />
-	</CustomHeaderButtons>
-));
+export const CloseModalButton = React.memo(({ navigation, testID, onPress }) => {
+	onPress = onPress || navigation.pop;
+	return (
+		<CustomHeaderButtons left>
+			<Item title='close' iconName='cross' onPress={onPress} testID={testID} />
+		</CustomHeaderButtons>
+	);
+});
 
-export const CloseShareExtensionButton = React.memo(({ onPress, testID }) => (
+export const CancelModalButton = React.memo(({ onPress, testID }) => (
 	<CustomHeaderButtons left>
 		{isIOS
 			? <Item title={I18n.t('Cancel')} onPress={onPress} testID={testID} />
@@ -76,9 +79,10 @@ DrawerButton.propTypes = {
 };
 CloseModalButton.propTypes = {
 	navigation: PropTypes.object.isRequired,
-	testID: PropTypes.string.isRequired
+	testID: PropTypes.string.isRequired,
+	onPress: PropTypes.func
 };
-CloseShareExtensionButton.propTypes = {
+CancelModalButton.propTypes = {
 	onPress: PropTypes.func.isRequired,
 	testID: PropTypes.string.isRequired
 };

app/containers/ListItem.js

@@ -33,9 +33,10 @@ const styles = StyleSheet.create({
 });
 
 const Content = React.memo(({
-	title, subtitle, disabled, testID, right, color, theme
+	title, subtitle, disabled, testID, left, right, color, theme
 }) => (
 	<View style={[styles.container, disabled && styles.disabled]} testID={testID}>
+		{left ? left() : null}
 		<View style={styles.textContainer}>
 			<Text style={[styles.title, { color: color || themes[theme].titleText }]}>{title}</Text>
 			{subtitle
@@ -79,6 +80,7 @@ Item.propTypes = {
 Content.propTypes = {
 	title: PropTypes.string.isRequired,
 	subtitle: PropTypes.string,
+	left: PropTypes.func,
 	right: PropTypes.func,
 	disabled: PropTypes.bool,
 	testID: PropTypes.string,