RocketChat · Prateek93a · Sep 23, 2019 · Sep 24, 2019
diff --git a/app/index.js b/app/index.js
@@ -238,11 +238,11 @@ class CustomInsideStack extends React.Component {
 	render() {
 		const { navigation } = this.props;
 		return (
-			<React.Fragment>
+			<>
 				<InsideStackModal navigation={navigation} />
 				<NotificationBadge navigation={navigation} />
 				<Toast />
-			</React.Fragment>
+			</>
 		);
 	}
 }

diff --git a/app/views/AuthLoadingView.js b/app/views/AuthLoadingView.js
@@ -12,8 +12,8 @@ const styles = StyleSheet.create({
 });
 
 export default React.memo(() => (
-	<React.Fragment>
+	<>
 		<StatusBar />
 		{isAndroid ? <Image source={{ uri: 'launch_screen' }} style={styles.image} /> : null}
-	</React.Fragment>
+	</>
 ));
diff --git a/app/views/AuthenticationWebView.js b/app/views/AuthenticationWebView.js
@@ -105,7 +105,7 @@ class AuthenticationWebView extends React.PureComponent {
 		const { loading } = this.state;
 		const uri = navigation.getParam('url');
 		return (
-			<React.Fragment>
+			<>
 				<StatusBar />
 				<WebView
 					useWebKit
@@ -120,7 +120,7 @@ class AuthenticationWebView extends React.PureComponent {
 					}}
 				/>
 				{ loading ? <ActivityIndicator size='large' style={styles.loading} /> : null }
-			</React.Fragment>
+			</>
 		);
 	}
 }

diff --git a/app/views/DirectoryView/Options.js b/app/views/DirectoryView/Options.js
@@ -85,7 +85,7 @@ export default class DirectoryOptions extends PureComponent {
 		});
 		const { globalUsers, toggleWorkspace, isFederationEnabled } = this.props;
 		return (
-			<React.Fragment>
+			<>
 				<TouchableWithoutFeedback onPress={this.close}>
 					<Animated.View style={[styles.backdrop, { opacity: backdropOpacity }]} />
 				</TouchableWithoutFeedback>
@@ -103,7 +103,7 @@ export default class DirectoryOptions extends PureComponent {
 					{this.renderItem('users')}
 					{isFederationEnabled
 						? (
-							<React.Fragment>
+							<>
 								<View style={styles.dropdownSeparator} />
 								<View style={[styles.dropdownItemContainer, styles.globalUsersContainer]}>
 									<View style={styles.globalUsersTextContainer}>
@@ -112,11 +112,11 @@ export default class DirectoryOptions extends PureComponent {
 									</View>
 									<Switch value={globalUsers} onValueChange={toggleWorkspace} trackColor={SWITCH_TRACK_COLOR} />
 								</View>
-							</React.Fragment>
+							</>
 						)
 						: null}
 				</Animated.View>
-			</React.Fragment>
+			</>
 		);
 	}
 }
diff --git a/app/views/DirectoryView/index.js b/app/views/DirectoryView/index.js
@@ -142,7 +142,7 @@ class DirectoryView extends React.Component {
 	renderHeader = () => {
 		const { type } = this.state;
 		return (
-			<React.Fragment>
+			<>
 				<SearchBox
 					onChangeText={this.onSearchChangeText}
 					onSubmitEditing={this.search}
@@ -155,7 +155,7 @@ class DirectoryView extends React.Component {
 						<CustomIcon name='arrow-down' size={20} style={styles.toggleDropdownArrow} />
 					</View>
 				</Touch>
-			</React.Fragment>
+			</>
 		);
 	}
 

diff --git a/app/views/RoomInfoView/index.js b/app/views/RoomInfoView/index.js
@@ -253,23 +253,23 @@ class RoomInfoView extends React.Component {
 	renderChannel = () => {
 		const { room } = this.state;
 		return (
-			<React.Fragment>
+			<>
 				{this.renderItem('description', room)}
 				{this.renderItem('topic', room)}
 				{this.renderItem('announcement', room)}
 				{room.broadcast ? this.renderBroadcast() : null}
-			</React.Fragment>
+			</>
 		);
 	}
 
 	renderDirect = () => {
 		const { roomUser } = this.state;
 		return (
-			<React.Fragment>
+			<>
 				{this.renderRoles()}
 				{this.renderTimezone()}
 				{this.renderCustomFields(roomUser._id)}
-			</React.Fragment>
+			</>
 		);
 	}
 

diff --git a/app/views/RoomView/index.js b/app/views/RoomView/index.js
@@ -669,13 +669,13 @@ class RoomView extends React.Component {
 
 		if (showUnreadSeparator || dateSeparator) {
 			return (
-				<React.Fragment>
+				<>
 					{message}
 					<Separator
 						ts={dateSeparator}
 						unread={showUnreadSeparator}
 					/>
-				</React.Fragment>
+				</>
 			);
 		}
 

diff --git a/app/views/RoomsListView/ListHeader/index.js b/app/views/RoomsListView/ListHeader/index.js
@@ -8,11 +8,11 @@ import Sort from './Sort';
 const ListHeader = React.memo(({
 	searchLength, sortBy, onChangeSearchText, toggleSort, goDirectory
 }) => (
-	<React.Fragment>
+	<>
 		<SearchBar onChangeSearchText={onChangeSearchText} />
 		<Directory goDirectory={goDirectory} />
 		<Sort searchLength={searchLength} sortBy={sortBy} toggleSort={toggleSort} />
-	</React.Fragment>
+	</>
 ));
 
 ListHeader.propTypes = {

diff --git a/app/views/RoomsListView/SortDropdown.js b/app/views/RoomsListView/SortDropdown.js
@@ -64,10 +64,12 @@ class Sort extends PureComponent {
 
 	sortByName = () => {
 		this.setSortPreference({ sortBy: 'alphabetical' });
+		this.close();
 	}
 
 	sortByActivity = () => {
 		this.setSortPreference({ sortBy: 'activity' });
+		this.close();
 	}
 
 	toggleGroupByType = () => {
@@ -112,7 +114,7 @@ class Sort extends PureComponent {
 		} = this.props;
 
 		return (
-			<React.Fragment>
+			<>
 				<TouchableWithoutFeedback key='sort-backdrop' onPress={this.close}>
 					<Animated.View style={[styles.backdrop, { opacity: backdropOpacity }]} />
 				</TouchableWithoutFeedback>
@@ -167,7 +169,7 @@ class Sort extends PureComponent {
 						</View>
 					</Touch>
 				</Animated.View>
-			</React.Fragment>
+			</>
 		);
 	}
 }

diff --git a/app/views/ShareListView/index.js b/app/views/ShareListView/index.js
@@ -310,7 +310,7 @@ class ShareListView extends React.Component {
 		const { server } = this.props;
 		const currentServer = servers.find(serverFiltered => serverFiltered.id === server);
 		return currentServer ? (
-			<React.Fragment>
+			<>
 				{this.renderSectionHeader('Select_Server')}
 				<View style={styles.bordered}>
 					<ServerItem
@@ -319,7 +319,7 @@ class ShareListView extends React.Component {
 						item={currentServer}
 					/>
 				</View>
-			</React.Fragment>
+			</>
 		) : null;
 	}
 
@@ -332,17 +332,17 @@ class ShareListView extends React.Component {
 	renderHeader = () => {
 		const { searching } = this.state;
 		return (
-			<React.Fragment>
+			<>
 				{ !searching
 					? (
-						<React.Fragment>
+						<>
 							{this.renderSelectServer()}
 							{this.renderSectionHeader('Chats')}
-						</React.Fragment>
+						</>
 					)
 					: null
 				}
-			</React.Fragment>
+			</>
 		);
 	}
 
@@ -393,9 +393,9 @@ class ShareListView extends React.Component {
 			<View style={styles.container}>
 				{ !searching
 					? (
-						<React.Fragment>
+						<>
 							{this.renderSelectServer()}
-						</React.Fragment>
+						</>
 					)
 					: null
 				}

diff --git a/app/views/SidebarView/index.js b/app/views/SidebarView/index.js
@@ -177,7 +177,7 @@ class Sidebar extends Component {
 		const { isAdmin } = this.state;
 		const { activeItemKey } = this.props;
 		return (
-			<React.Fragment>
+			<>
 				<SidebarItem
 					text={I18n.t('Chats')}
 					left={<CustomIcon name='message' size={20} color={COLOR_TEXT} />}
@@ -215,7 +215,7 @@ class Sidebar extends Component {
 					onPress={this.logout}
 					testID='sidebar-logout'
 				/>
-			</React.Fragment>
+			</>
 		);
 	}