diff --git a/app/containers/FormContainer.tsx b/app/containers/FormContainer.tsx
index ff233952a..8c862b54d 100644
--- a/app/containers/FormContainer.tsx
+++ b/app/containers/FormContainer.tsx
@@ -5,15 +5,15 @@ import { themes } from '../constants/colors';
 import sharedStyles from '../views/Styles';
 import scrollPersistTaps from '../utils/scrollPersistTaps';
 import KeyboardView from '../presentation/KeyboardView';
+import { useTheme } from '../theme';
 import StatusBar from './StatusBar';
 import AppVersion from './AppVersion';
 import { isTablet } from '../utils/deviceInfo';
 import SafeAreaView from './SafeAreaView';
 
 interface IFormContainer extends ScrollViewProps {
-	theme: string;
 	testID: string;
-	children: React.ReactNode;
+	children: React.ReactElement | React.ReactElement[] | null;
 }
 
 const styles = StyleSheet.create({
@@ -22,27 +22,31 @@ const styles = StyleSheet.create({
 	}
 });
 
-export const FormContainerInner = ({ children }: { children: React.ReactNode }): JSX.Element => (
+export const FormContainerInner = ({ children }: { children: (React.ReactElement | null)[] }) => (
 	<View style={[sharedStyles.container, isTablet && sharedStyles.tabletScreenContent]}>{children}</View>
 );
 
-const FormContainer = ({ children, theme, testID, ...props }: IFormContainer): JSX.Element => (
-	<KeyboardView
-		style={{ backgroundColor: themes[theme].backgroundColor }}
-		contentContainerStyle={sharedStyles.container}
-		keyboardVerticalOffset={128}>
-		<StatusBar />
-		<ScrollView
-			style={sharedStyles.container}
-			contentContainerStyle={[sharedStyles.containerScrollView, styles.scrollView]}
-			{...scrollPersistTaps}
-			{...props}>
-			<SafeAreaView testID={testID} style={{ backgroundColor: themes[theme].backgroundColor }}>
-				{children}
-				<AppVersion theme={theme} />
-			</SafeAreaView>
-		</ScrollView>
-	</KeyboardView>
-);
+const FormContainer = ({ children, testID, ...props }: IFormContainer) => {
+	const { theme } = useTheme();
+
+	return (
+		<KeyboardView
+			style={{ backgroundColor: themes[theme].backgroundColor }}
+			contentContainerStyle={sharedStyles.container}
+			keyboardVerticalOffset={128}>
+			<StatusBar />
+			<ScrollView
+				style={sharedStyles.container}
+				contentContainerStyle={[sharedStyles.containerScrollView, styles.scrollView]}
+				{...scrollPersistTaps}
+				{...props}>
+				<SafeAreaView testID={testID} style={{ backgroundColor: themes[theme].backgroundColor }}>
+					{children}
+					<AppVersion theme={theme} />
+				</SafeAreaView>
+			</ScrollView>
+		</KeyboardView>
+	);
+};
 
 export default FormContainer;
diff --git a/app/containers/List/ListContainer.tsx b/app/containers/List/ListContainer.tsx
index deb9c8a71..349c71bee 100644
--- a/app/containers/List/ListContainer.tsx
+++ b/app/containers/List/ListContainer.tsx
@@ -11,7 +11,7 @@ const styles = StyleSheet.create({
 });
 
 interface IListContainer {
-	children: React.ReactNode;
+	children: (React.ReactElement | null)[] | React.ReactElement | null;
 	testID?: string;
 }
 const ListContainer = React.memo(({ children, ...props }: IListContainer) => (
diff --git a/app/containers/List/ListHeader.tsx b/app/containers/List/ListHeader.tsx
index d9cb58eb9..469d4cec6 100644
--- a/app/containers/List/ListHeader.tsx
+++ b/app/containers/List/ListHeader.tsx
@@ -25,6 +25,7 @@ interface IListHeader {
 
 const ListHeader = React.memo(({ title, translateTitle = true }: IListHeader) => {
 	const { theme } = useTheme();
+
 	return (
 		<View style={styles.container}>
 			<Text style={[styles.title, { color: themes[theme].infoText }]} numberOfLines={1}>
diff --git a/app/containers/List/ListIcon.tsx b/app/containers/List/ListIcon.tsx
index 71e4fbdf2..c134b1690 100644
--- a/app/containers/List/ListIcon.tsx
+++ b/app/containers/List/ListIcon.tsx
@@ -3,11 +3,10 @@ import { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
 
 import { themes } from '../../constants/colors';
 import { CustomIcon } from '../../lib/Icons';
-import { withTheme } from '../../theme';
+import { useTheme } from '../../theme';
 import { ICON_SIZE } from './constants';
 
 interface IListIcon {
-	theme?: string;
 	name: string;
 	color?: string;
 	style?: StyleProp<ViewStyle>;
@@ -21,12 +20,16 @@ const styles = StyleSheet.create({
 	}
 });
 
-const ListIcon = React.memo(({ theme, name, color, style, testID }: IListIcon) => (
-	<View style={[styles.icon, style]}>
-		<CustomIcon name={name} color={color ?? themes[theme!].auxiliaryText} size={ICON_SIZE} testID={testID} />
-	</View>
-));
+const ListIcon = React.memo(({ name, color, style, testID }: IListIcon) => {
+	const { theme } = useTheme();
+
+	return (
+		<View style={[styles.icon, style]}>
+			<CustomIcon name={name} color={color ?? themes[theme].auxiliaryText} size={ICON_SIZE} testID={testID} />
+		</View>
+	);
+});
 
 ListIcon.displayName = 'List.Icon';
 
-export default withTheme(ListIcon);
+export default ListIcon;
diff --git a/app/containers/List/ListItem.tsx b/app/containers/List/ListItem.tsx
index 79b3dcbf7..c09266a41 100644
--- a/app/containers/List/ListItem.tsx
+++ b/app/containers/List/ListItem.tsx
@@ -4,11 +4,11 @@ import { I18nManager, StyleSheet, Text, View } from 'react-native';
 import Touch from '../../utils/touch';
 import { themes } from '../../constants/colors';
 import sharedStyles from '../../views/Styles';
-import { withTheme } from '../../theme';
+import { useTheme } from '../../theme';
 import I18n from '../../i18n';
 import { Icon } from '.';
 import { BASE_HEIGHT, ICON_SIZE, PADDING_HORIZONTAL } from './constants';
-import { withDimensions } from '../../dimensions';
+import { useDimensions } from '../../dimensions';
 import { CustomIcon } from '../../lib/Icons';
 
 const styles = StyleSheet.create({
@@ -59,13 +59,12 @@ interface IListItemContent {
 	left?: () => JSX.Element | null;
 	right?: () => JSX.Element | null;
 	disabled?: boolean;
+	theme: string;
 	testID?: string;
-	theme?: string;
 	color?: string;
 	translateTitle?: boolean;
 	translateSubtitle?: boolean;
 	showActionIndicator?: boolean;
-	fontScale?: number;
 	alert?: boolean;
 }
 
@@ -78,78 +77,85 @@ const Content = React.memo(
 		left,
 		right,
 		color,
-		theme,
-		fontScale,
 		alert,
 		translateTitle = true,
 		translateSubtitle = true,
-		showActionIndicator = false
-	}: IListItemContent) => (
-		<View style={[styles.container, disabled && styles.disabled, { height: BASE_HEIGHT * fontScale! }]} testID={testID}>
-			{left ? <View style={styles.leftContainer}>{left()}</View> : null}
-			<View style={styles.textContainer}>
-				<View style={styles.textAlertContainer}>
-					<Text style={[styles.title, { color: color || themes[theme!].titleText }]} numberOfLines={1}>
-						{translateTitle ? I18n.t(title) : title}
-					</Text>
-					{alert ? (
-						<CustomIcon style={[styles.alertIcon, { color: themes[theme!].dangerColor }]} size={ICON_SIZE} name='info' />
+		showActionIndicator = false,
+		theme
+	}: IListItemContent) => {
+		const { fontScale } = useDimensions();
+
+		return (
+			<View style={[styles.container, disabled && styles.disabled, { height: BASE_HEIGHT * fontScale }]} testID={testID}>
+				{left ? <View style={styles.leftContainer}>{left()}</View> : null}
+				<View style={styles.textContainer}>
+					<View style={styles.textAlertContainer}>
+						<Text style={[styles.title, { color: color || themes[theme].titleText }]} numberOfLines={1}>
+							{translateTitle ? I18n.t(title) : title}
+						</Text>
+						{alert ? (
+							<CustomIcon style={[styles.alertIcon, { color: themes[theme].dangerColor }]} size={ICON_SIZE} name='info' />
+						) : null}
+					</View>
+					{subtitle ? (
+						<Text style={[styles.subtitle, { color: themes[theme].auxiliaryText }]} numberOfLines={1}>
+							{translateSubtitle ? I18n.t(subtitle) : subtitle}
+						</Text>
 					) : null}
 				</View>
-				{subtitle ? (
-					<Text style={[styles.subtitle, { color: themes[theme!].auxiliaryText }]} numberOfLines={1}>
-						{translateSubtitle ? I18n.t(subtitle) : subtitle}
-					</Text>
+				{right || showActionIndicator ? (
+					<View style={styles.rightContainer}>
+						{right ? right() : null}
+						{showActionIndicator ? <Icon name='chevron-right' style={styles.actionIndicator} /> : null}
+					</View>
 				) : null}
 			</View>
-			{right || showActionIndicator ? (
-				<View style={styles.rightContainer}>
-					{right ? right() : null}
-					{showActionIndicator ? <Icon name='chevron-right' style={styles.actionIndicator} /> : null}
-				</View>
-			) : null}
-		</View>
-	)
+		);
+	}
 );
 
-interface IListButtonPress {
-	onPress?: Function;
+interface IListButtonPress extends IListItemButton {
+	onPress: Function;
 }
 
-interface IListItemButton extends IListButtonPress {
+interface IListItemButton {
 	title?: string;
 	disabled?: boolean;
-	theme?: string;
+	theme: string;
 	backgroundColor?: string;
 	underlayColor?: string;
 }
 
-const Button = React.memo<IListItemButton>(({ onPress, backgroundColor, underlayColor, ...props }: IListItemButton) => (
+const Button = React.memo(({ onPress, backgroundColor, underlayColor, ...props }: IListButtonPress) => (
 	<Touch
-		onPress={() => onPress!(props.title)}
-		style={{ backgroundColor: backgroundColor || themes[props.theme!].backgroundColor }}
+		onPress={() => onPress(props.title)}
+		style={{ backgroundColor: backgroundColor || themes[props.theme].backgroundColor }}
 		underlayColor={underlayColor}
 		enabled={!props.disabled}
-		theme={props.theme!}>
+		theme={props.theme}>
 		<Content {...props} />
 	</Touch>
 ));
 
-interface IListItem extends IListItemContent, IListItemButton {
+interface IListItem extends Omit<IListItemContent, 'theme'>, Omit<IListItemButton, 'theme'> {
 	backgroundColor?: string;
+	onPress?: Function;
 }
 
-const ListItem = React.memo<IListItem>(({ ...props }: IListItem) => {
+const ListItem = React.memo(({ ...props }: IListItem) => {
+	const { theme } = useTheme();
+
 	if (props.onPress) {
-		return <Button {...props} />;
+		const { onPress } = props;
+		return <Button {...props} theme={theme} onPress={onPress} />;
 	}
 	return (
-		<View style={{ backgroundColor: props.backgroundColor || themes[props.theme!].backgroundColor }}>
-			<Content {...props} />
+		<View style={{ backgroundColor: props.backgroundColor || themes[theme].backgroundColor }}>
+			<Content {...props} theme={theme} />
 		</View>
 	);
 });
 
 ListItem.displayName = 'List.Item';
 
-export default withTheme(withDimensions(ListItem));
+export default ListItem;
diff --git a/app/containers/List/ListSection.tsx b/app/containers/List/ListSection.tsx
index e334f5f3f..860f4252c 100644
--- a/app/containers/List/ListSection.tsx
+++ b/app/containers/List/ListSection.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { withTheme } from '../../theme';
 import { Header } from '.';
 
 const styles = StyleSheet.create({
@@ -11,7 +10,7 @@ const styles = StyleSheet.create({
 });
 
 interface IListSection {
-	children: React.ReactNode;
+	children: (React.ReactElement | null)[] | React.ReactElement | null;
 	title?: string;
 	translateTitle?: boolean;
 }
@@ -25,4 +24,4 @@ const ListSection = React.memo(({ children, title, translateTitle }: IListSectio
 
 ListSection.displayName = 'List.Section';
 
-export default withTheme(ListSection);
+export default ListSection;
diff --git a/app/containers/List/ListSeparator.tsx b/app/containers/List/ListSeparator.tsx
index db34b05ba..f86dee196 100644
--- a/app/containers/List/ListSeparator.tsx
+++ b/app/containers/List/ListSeparator.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { StyleSheet, View, ViewStyle } from 'react-native';
 
 import { themes } from '../../constants/colors';
-import { withTheme } from '../../theme';
+import { useTheme } from '../../theme';
 
 const styles = StyleSheet.create({
 	separator: {
@@ -12,13 +12,14 @@ const styles = StyleSheet.create({
 
 interface IListSeparator {
 	style?: ViewStyle;
-	theme?: string;
 }
 
-const ListSeparator = React.memo(({ style, theme }: IListSeparator) => (
-	<View style={[styles.separator, style, { backgroundColor: themes[theme!].separatorColor }]} />
-));
+const ListSeparator = React.memo(({ style }: IListSeparator) => {
+	const { theme } = useTheme();
+
+	return <View style={[styles.separator, style, { backgroundColor: themes[theme].separatorColor }]} />;
+});
 
 ListSeparator.displayName = 'List.Separator';
 
-export default withTheme(ListSeparator);
+export default ListSeparator;
diff --git a/app/containers/RoomHeader/RoomHeader.tsx b/app/containers/RoomHeader/RoomHeader.tsx
index bb0952b38..c0627d2d8 100644
--- a/app/containers/RoomHeader/RoomHeader.tsx
+++ b/app/containers/RoomHeader/RoomHeader.tsx
@@ -7,6 +7,7 @@ import { themes } from '../../constants/colors';
 import { MarkdownPreview } from '../markdown';
 import RoomTypeIcon from '../RoomTypeIcon';
 import { withTheme } from '../../theme';
+import { TUserStatus } from '../../definitions';
 
 const HIT_SLOP = {
 	top: 5,
@@ -67,7 +68,7 @@ interface IRoomHeader {
 	prid: string;
 	tmid: string;
 	teamMain: boolean;
-	status: string;
+	status: TUserStatus;
 	theme?: string;
 	usersTyping: [];
 	isGroupChat: boolean;
diff --git a/app/containers/RoomHeader/index.tsx b/app/containers/RoomHeader/index.tsx
index 4c21ecba2..788a70cf2 100644
--- a/app/containers/RoomHeader/index.tsx
+++ b/app/containers/RoomHeader/index.tsx
@@ -2,7 +2,7 @@ import { dequal } from 'dequal';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 
-import { IApplicationState } from '../../definitions';
+import { IApplicationState, TUserStatus } from '../../definitions';
 import { withDimensions } from '../../dimensions';
 import I18n from '../../i18n';
 import RoomHeader from './RoomHeader';
@@ -15,7 +15,7 @@ interface IRoomHeaderContainerProps {
 	tmid: string;
 	teamMain: boolean;
 	usersTyping: [];
-	status: string;
+	status: TUserStatus;
 	statusText: string;
 	connecting: boolean;
 	connected: boolean;
@@ -140,7 +140,7 @@ const mapStateToProps = (state: IApplicationState, ownProps: any) => {
 		connecting: state.meteor.connecting || state.server.loading,
 		connected: state.meteor.connected,
 		usersTyping: state.usersTyping,
-		status,
+		status: status as TUserStatus,
 		statusText
 	};
 };
diff --git a/app/containers/RoomTypeIcon.tsx b/app/containers/RoomTypeIcon.tsx
index a157f53b4..ad9b63e1f 100644
--- a/app/containers/RoomTypeIcon.tsx
+++ b/app/containers/RoomTypeIcon.tsx
@@ -5,6 +5,7 @@ import { CustomIcon } from '../lib/Icons';
 import { STATUS_COLORS, themes } from '../constants/colors';
 import Status from './Status/Status';
 import { withTheme } from '../theme';
+import { TUserStatus } from '../definitions';
 
 const styles = StyleSheet.create({
 	icon: {
@@ -17,7 +18,7 @@ interface IRoomTypeIcon {
 	type: string;
 	isGroupChat?: boolean;
 	teamMain?: boolean;
-	status?: string;
+	status?: TUserStatus;
 	size?: number;
 	style?: ViewStyle;
 }
@@ -31,9 +32,10 @@ const RoomTypeIcon = React.memo(({ type, isGroupChat, status, style, theme, team
 	const iconStyle = [styles.icon, { color }, style];
 
 	if (type === 'd' && !isGroupChat) {
-		return (
-			<Status style={[iconStyle, { color: STATUS_COLORS[status!] ?? STATUS_COLORS.offline }]} size={size} status={status!} />
-		);
+		if (!status) {
+			status = 'offline';
+		}
+		return <Status style={[iconStyle, { color: STATUS_COLORS[status] }]} size={size} status={status} />;
 	}
 
 	// TODO: move this to a separate function
diff --git a/app/containers/Status/Status.tsx b/app/containers/Status/Status.tsx
index dd780bbdd..860f79601 100644
--- a/app/containers/Status/Status.tsx
+++ b/app/containers/Status/Status.tsx
@@ -3,15 +3,9 @@ import { StyleProp, TextStyle } from 'react-native';
 
 import { CustomIcon } from '../../lib/Icons';
 import { STATUS_COLORS } from '../../constants/colors';
+import { IStatus } from './definition';
 
-interface IStatus {
-	status: string;
-	size: number;
-	style?: StyleProp<TextStyle>;
-	testID?: string;
-}
-
-const Status = React.memo(({ style, status = 'offline', size = 32, ...props }: IStatus) => {
+const Status = React.memo(({ style, status = 'offline', size = 32, ...props }: Omit<IStatus, 'id'>) => {
 	const name = `status-${status}`;
 	const isNameValid = CustomIcon.hasIcon(name);
 	const iconName = isNameValid ? name : 'status-offline';
diff --git a/app/containers/Status/definition.ts b/app/containers/Status/definition.ts
new file mode 100644
index 000000000..32443f416
--- /dev/null
+++ b/app/containers/Status/definition.ts
@@ -0,0 +1,9 @@
+import { TextProps } from 'react-native';
+
+import { TUserStatus } from '../../definitions';
+
+export interface IStatus extends TextProps {
+	id: string;
+	size: number;
+	status: TUserStatus;
+}
diff --git a/app/containers/Status/index.tsx b/app/containers/Status/index.tsx
index f47ca31c1..0e5d55497 100644
--- a/app/containers/Status/index.tsx
+++ b/app/containers/Status/index.tsx
@@ -1,20 +1,15 @@
-import React, { memo } from 'react';
-import { connect } from 'react-redux';
+import React from 'react';
+import { useSelector } from 'react-redux';
 
+import { IApplicationState, TUserStatus } from '../../definitions';
 import Status from './Status';
+import { IStatus } from './definition';
 
-interface IStatusContainer {
-	style: any;
-	size: number;
-	status: string;
-}
+const StatusContainer = ({ id, style, size = 32, ...props }: Omit<IStatus, 'status'>): React.ReactElement => {
+	const status = useSelector((state: IApplicationState) =>
+		state.meteor.connected ? state.activeUsers[id] && state.activeUsers[id].status : 'loading'
+	) as TUserStatus;
+	return <Status size={size} style={style} status={status} {...props} />;
+};
 
-const StatusContainer = memo(({ style, size = 32, status }: IStatusContainer) => (
-	<Status size={size} style={style} status={status} />
-));
-
-const mapStateToProps = (state: any, ownProps: any) => ({
-	status: state.meteor.connected ? state.activeUsers[ownProps.id] && state.activeUsers[ownProps.id].status : 'loading'
-});
-
-export default connect(mapStateToProps)(StatusContainer);
+export default StatusContainer;
diff --git a/app/containers/markdown/AtMention.tsx b/app/containers/markdown/AtMention.tsx
index 7c0f258a0..707b7994d 100644
--- a/app/containers/markdown/AtMention.tsx
+++ b/app/containers/markdown/AtMention.tsx
@@ -1,18 +1,19 @@
 import React from 'react';
-import { Text } from 'react-native';
+import { StyleProp, Text, TextStyle } from 'react-native';
 
 import { useTheme } from '../../theme';
 import { themes } from '../../constants/colors';
 import styles from './styles';
 import { events, logEvent } from '../../utils/log';
+import { IUserMention } from './interfaces';
 
 interface IAtMention {
 	mention: string;
 	username?: string;
 	navToRoomInfo?: Function;
-	style?: any;
+	style?: StyleProp<TextStyle>[];
 	useRealName?: boolean;
-	mentions: any;
+	mentions?: IUserMention[];
 }
 
 const AtMention = React.memo(({ mention, mentions, username, navToRoomInfo, style = [], useRealName }: IAtMention) => {
@@ -23,7 +24,7 @@ const AtMention = React.memo(({ mention, mentions, username, navToRoomInfo, styl
 				style={[
 					styles.mention,
 					{
-						color: themes[theme!].mentionGroupColor
+						color: themes[theme].mentionGroupColor
 					},
 					...style
 				]}>
@@ -35,11 +36,11 @@ const AtMention = React.memo(({ mention, mentions, username, navToRoomInfo, styl
 	let mentionStyle = {};
 	if (mention === username) {
 		mentionStyle = {
-			color: themes[theme!].mentionMeColor
+			color: themes[theme].mentionMeColor
 		};
 	} else {
 		mentionStyle = {
-			color: themes[theme!].mentionOtherColor
+			color: themes[theme].mentionOtherColor
 		};
 	}
 
@@ -64,7 +65,7 @@ const AtMention = React.memo(({ mention, mentions, username, navToRoomInfo, styl
 		);
 	}
 
-	return <Text style={[styles.text, { color: themes[theme!].bodyText }, ...style]}>{`@${mention}`}</Text>;
+	return <Text style={[styles.text, { color: themes[theme].bodyText }, ...style]}>{`@${mention}`}</Text>;
 });
 
 export default AtMention;
diff --git a/app/containers/markdown/BlockQuote.tsx b/app/containers/markdown/BlockQuote.tsx
index e2da2c1fa..aa67c0e3d 100644
--- a/app/containers/markdown/BlockQuote.tsx
+++ b/app/containers/markdown/BlockQuote.tsx
@@ -5,7 +5,7 @@ import { themes } from '../../constants/colors';
 import styles from './styles';
 
 interface IBlockQuote {
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	theme: string;
 }
 
diff --git a/app/containers/markdown/Hashtag.tsx b/app/containers/markdown/Hashtag.tsx
index 29ba8ddcc..bdfd10319 100644
--- a/app/containers/markdown/Hashtag.tsx
+++ b/app/containers/markdown/Hashtag.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Text, TextStyle, StyleProp } from 'react-native';
+import { StyleProp, Text, TextStyle } from 'react-native';
 
 import { themes } from '../../constants/colors';
 import { useTheme } from '../../theme';
@@ -33,7 +33,7 @@ const Hashtag = React.memo(({ hashtag, channels, navToRoomInfo, style = [] }: IH
 				style={[
 					styles.mention,
 					{
-						color: themes[theme!].mentionOtherColor
+						color: themes[theme].mentionOtherColor
 					},
 					...style
 				]}
@@ -42,7 +42,7 @@ const Hashtag = React.memo(({ hashtag, channels, navToRoomInfo, style = [] }: IH
 			</Text>
 		);
 	}
-	return <Text style={[styles.text, { color: themes[theme!].bodyText }, ...style]}>{`#${hashtag}`}</Text>;
+	return <Text style={[styles.text, { color: themes[theme].bodyText }, ...style]}>{`#${hashtag}`}</Text>;
 });
 
 export default Hashtag;
diff --git a/app/containers/markdown/Link.tsx b/app/containers/markdown/Link.tsx
index 414b73a52..7703a6be3 100644
--- a/app/containers/markdown/Link.tsx
+++ b/app/containers/markdown/Link.tsx
@@ -10,7 +10,7 @@ import openLink from '../../utils/openLink';
 import { TOnLinkPress } from './interfaces';
 
 interface ILink {
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	link: string;
 	theme: string;
 	onLinkPress?: TOnLinkPress;
diff --git a/app/containers/markdown/List.tsx b/app/containers/markdown/List.tsx
index b032a6a0f..b67eb155b 100644
--- a/app/containers/markdown/List.tsx
+++ b/app/containers/markdown/List.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
 interface IList {
-	children: JSX.Element;
+	children: React.ReactElement[] | null;
 	ordered: boolean;
 	start: number;
 	tight: boolean;
@@ -11,9 +11,8 @@ interface IList {
 const List = React.memo(({ children, ordered, tight, start = 1, numberOfLines = 0 }: IList) => {
 	let bulletWidth = 15;
 
-	if (ordered) {
-		// @ts-ignore
-		const lastNumber = start + children.length - 1;
+	if (ordered && children) {
+		const lastNumber = start + children?.length - 1;
 		bulletWidth = 9 * lastNumber.toString().length + 7;
 	}
 
diff --git a/app/containers/markdown/ListItem.tsx b/app/containers/markdown/ListItem.tsx
index 0e323df77..f822bd87a 100644
--- a/app/containers/markdown/ListItem.tsx
+++ b/app/containers/markdown/ListItem.tsx
@@ -18,7 +18,7 @@ const style = StyleSheet.create({
 });
 
 interface IListItem {
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	bulletWidth: number;
 	level: number;
 	ordered: boolean;
diff --git a/app/containers/markdown/Preview.tsx b/app/containers/markdown/Preview.tsx
index d75eb3df8..fd7519643 100644
--- a/app/containers/markdown/Preview.tsx
+++ b/app/containers/markdown/Preview.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { StyleProp, Text, TextStyle } from 'react-native';
+import { Text, TextStyle } from 'react-native';
 import removeMarkdown from 'remove-markdown';
 
 import shortnameToUnicode from '../../utils/shortnameToUnicode';
@@ -13,10 +13,10 @@ interface IMarkdownPreview {
 	msg?: string;
 	numberOfLines?: number;
 	testID?: string;
-	style?: StyleProp<TextStyle>[];
+	style?: TextStyle[];
 }
 
-const MarkdownPreview = ({ msg, numberOfLines = 1, testID, style = [] }: IMarkdownPreview): React.ReactElement | null => {
+const MarkdownPreview = ({ msg, numberOfLines = 1, testID, style = [] }: IMarkdownPreview) => {
 	if (!msg) {
 		return null;
 	}
diff --git a/app/containers/markdown/Table.tsx b/app/containers/markdown/Table.tsx
index 4a0a972bf..5f38aa017 100644
--- a/app/containers/markdown/Table.tsx
+++ b/app/containers/markdown/Table.tsx
@@ -8,7 +8,7 @@ import I18n from '../../i18n';
 import { themes } from '../../constants/colors';
 
 interface ITable {
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	numColumns: number;
 	theme: string;
 }
diff --git a/app/containers/markdown/TableCell.tsx b/app/containers/markdown/TableCell.tsx
index a00b0e092..bc8c89b84 100644
--- a/app/containers/markdown/TableCell.tsx
+++ b/app/containers/markdown/TableCell.tsx
@@ -6,7 +6,7 @@ import styles from './styles';
 
 interface ITableCell {
 	align: '' | 'left' | 'center' | 'right';
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	isLastCell: boolean;
 	theme: string;
 }
diff --git a/app/containers/markdown/TableRow.tsx b/app/containers/markdown/TableRow.tsx
index c1fc9e906..7874c48d7 100644
--- a/app/containers/markdown/TableRow.tsx
+++ b/app/containers/markdown/TableRow.tsx
@@ -5,7 +5,7 @@ import { themes } from '../../constants/colors';
 import styles from './styles';
 
 interface ITableRow {
-	children: JSX.Element;
+	children: React.ReactElement | null;
 	isLastRow: boolean;
 	theme: string;
 }
@@ -16,7 +16,7 @@ const TableRow = React.memo(({ isLastRow, children: _children, theme }: ITableRo
 		rowStyle.push(styles.rowBottomBorder);
 	}
 
-	const children: any = React.Children.toArray(_children);
+	const children = React.Children.toArray(_children) as React.ReactElement[];
 	children[children.length - 1] = React.cloneElement(children[children.length - 1], {
 		isLastCell: true
 	});
diff --git a/app/containers/markdown/interfaces.ts b/app/containers/markdown/interfaces.ts
index 8764b84fa..ed4984f48 100644
--- a/app/containers/markdown/interfaces.ts
+++ b/app/containers/markdown/interfaces.ts
@@ -2,6 +2,7 @@ export interface IUserMention {
 	_id: string;
 	username: string;
 	name?: string;
+	type?: string;
 }
 
 export interface IUserChannel {
diff --git a/app/containers/markdown/new/BigEmoji.tsx b/app/containers/markdown/new/BigEmoji.tsx
index c8f6a3beb..f8032ff8f 100644
--- a/app/containers/markdown/new/BigEmoji.tsx
+++ b/app/containers/markdown/new/BigEmoji.tsx
@@ -14,7 +14,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-const BigEmoji = ({ value }: IBigEmojiProps): JSX.Element => (
+const BigEmoji = ({ value }: IBigEmojiProps) => (
 	<View style={styles.container}>
 		{value.map(block => (
 			<Emoji value={block.value} isBigEmoji />
diff --git a/app/containers/markdown/new/Bold.tsx b/app/containers/markdown/new/Bold.tsx
index 9cb1f4fdb..f1982aacf 100644
--- a/app/containers/markdown/new/Bold.tsx
+++ b/app/containers/markdown/new/Bold.tsx
@@ -18,7 +18,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Bold = ({ value }: IBoldProps): JSX.Element => (
+const Bold = ({ value }: IBoldProps) => (
 	<Text style={styles.text}>
 		{value.map(block => {
 			switch (block.type) {
diff --git a/app/containers/markdown/new/Code.tsx b/app/containers/markdown/new/Code.tsx
index d2a164367..f3e060125 100644
--- a/app/containers/markdown/new/Code.tsx
+++ b/app/containers/markdown/new/Code.tsx
@@ -11,7 +11,7 @@ interface ICodeProps {
 	value: CodeProps['value'];
 }
 
-const Code = ({ value }: ICodeProps): JSX.Element => {
+const Code = ({ value }: ICodeProps) => {
 	const { theme } = useTheme();
 
 	return (
@@ -19,9 +19,9 @@ const Code = ({ value }: ICodeProps): JSX.Element => {
 			style={[
 				styles.codeBlock,
 				{
-					color: themes[theme!].bodyText,
-					backgroundColor: themes[theme!].bannerBackground,
-					borderColor: themes[theme!].borderColor
+					color: themes[theme].bodyText,
+					backgroundColor: themes[theme].bannerBackground,
+					borderColor: themes[theme].borderColor
 				}
 			]}>
 			{value.map(block => {
diff --git a/app/containers/markdown/new/CodeLine.tsx b/app/containers/markdown/new/CodeLine.tsx
index c05066f9c..77641447d 100644
--- a/app/containers/markdown/new/CodeLine.tsx
+++ b/app/containers/markdown/new/CodeLine.tsx
@@ -6,7 +6,7 @@ interface ICodeLineProps {
 	value: CodeLineProps['value'];
 }
 
-const CodeLine = ({ value }: ICodeLineProps): JSX.Element | null => {
+const CodeLine = ({ value }: ICodeLineProps) => {
 	if (value.type !== 'PLAIN_TEXT') {
 		return null;
 	}
diff --git a/app/containers/markdown/new/Emoji.tsx b/app/containers/markdown/new/Emoji.tsx
index 0800b8874..2d03ab08a 100644
--- a/app/containers/markdown/new/Emoji.tsx
+++ b/app/containers/markdown/new/Emoji.tsx
@@ -14,7 +14,7 @@ interface IEmojiProps {
 	isBigEmoji?: boolean;
 }
 
-const Emoji = ({ value, isBigEmoji }: IEmojiProps): JSX.Element => {
+const Emoji = ({ value, isBigEmoji }: IEmojiProps) => {
 	const { theme } = useTheme();
 	const { baseUrl, getCustomEmoji } = useContext(MarkdownContext);
 	const emojiUnicode = shortnameToUnicode(`:${value.value}:`);
@@ -23,7 +23,7 @@ const Emoji = ({ value, isBigEmoji }: IEmojiProps): JSX.Element => {
 	if (emoji) {
 		return <CustomEmoji baseUrl={baseUrl} style={[isBigEmoji ? styles.customEmojiBig : styles.customEmoji]} emoji={emoji} />;
 	}
-	return <Text style={[{ color: themes[theme!].bodyText }, isBigEmoji ? styles.textBig : styles.text]}>{emojiUnicode}</Text>;
+	return <Text style={[{ color: themes[theme].bodyText }, isBigEmoji ? styles.textBig : styles.text]}>{emojiUnicode}</Text>;
 };
 
 export default Emoji;
diff --git a/app/containers/markdown/new/Heading.tsx b/app/containers/markdown/new/Heading.tsx
index 2e810d376..a949f52c8 100644
--- a/app/containers/markdown/new/Heading.tsx
+++ b/app/containers/markdown/new/Heading.tsx
@@ -11,12 +11,12 @@ interface IHeadingProps {
 	level: HeadingProps['level'];
 }
 
-const Heading = ({ value, level }: IHeadingProps): JSX.Element => {
+const Heading = ({ value, level }: IHeadingProps) => {
 	const { theme } = useTheme();
 	const textStyle = styles[`heading${level}`];
 
 	return (
-		<Text style={[textStyle, { color: themes[theme!].bodyText }]}>
+		<Text style={[textStyle, { color: themes[theme].bodyText }]}>
 			{value.map(block => {
 				switch (block.type) {
 					case 'PLAIN_TEXT':
diff --git a/app/containers/markdown/new/Image.tsx b/app/containers/markdown/new/Image.tsx
index fb9f95d28..94bcfac91 100644
--- a/app/containers/markdown/new/Image.tsx
+++ b/app/containers/markdown/new/Image.tsx
@@ -31,11 +31,11 @@ const MessageImage = ({ img, theme }: TMessageImage) => (
 	/>
 );
 
-const Image = ({ value }: IImageProps): JSX.Element => {
+const Image = ({ value }: IImageProps) => {
 	const { theme } = useTheme();
 	const { src } = value;
 
-	return <MessageImage img={src.value} theme={theme!} />;
+	return <MessageImage img={src.value} theme={theme} />;
 };
 
 export default Image;
diff --git a/app/containers/markdown/new/Inline.tsx b/app/containers/markdown/new/Inline.tsx
index 364e380d7..70dca0846 100644
--- a/app/containers/markdown/new/Inline.tsx
+++ b/app/containers/markdown/new/Inline.tsx
@@ -19,7 +19,7 @@ interface IParagraphProps {
 	value: ParagraphProps['value'];
 }
 
-const Inline = ({ value }: IParagraphProps): JSX.Element => {
+const Inline = ({ value }: IParagraphProps) => {
 	const { useRealName, username, navToRoomInfo, mentions, channels } = useContext(MarkdownContext);
 	return (
 		<Text style={styles.inline}>
diff --git a/app/containers/markdown/new/InlineCode.tsx b/app/containers/markdown/new/InlineCode.tsx
index cf90f2cb3..123eca379 100644
--- a/app/containers/markdown/new/InlineCode.tsx
+++ b/app/containers/markdown/new/InlineCode.tsx
@@ -10,7 +10,7 @@ interface IInlineCodeProps {
 	value: InlineCodeProps['value'];
 }
 
-const InlineCode = ({ value }: IInlineCodeProps): JSX.Element => {
+const InlineCode = ({ value }: IInlineCodeProps) => {
 	const { theme } = useTheme();
 
 	return (
@@ -18,9 +18,9 @@ const InlineCode = ({ value }: IInlineCodeProps): JSX.Element => {
 			style={[
 				styles.codeInline,
 				{
-					color: themes[theme!].bodyText,
-					backgroundColor: themes[theme!].bannerBackground,
-					borderColor: themes[theme!].borderColor
+					color: themes[theme].bodyText,
+					backgroundColor: themes[theme].bannerBackground,
+					borderColor: themes[theme].borderColor
 				}
 			]}>
 			{(block => {
diff --git a/app/containers/markdown/new/Italic.tsx b/app/containers/markdown/new/Italic.tsx
index fc1432e5a..ee805c217 100644
--- a/app/containers/markdown/new/Italic.tsx
+++ b/app/containers/markdown/new/Italic.tsx
@@ -17,7 +17,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Italic = ({ value }: IItalicProps): JSX.Element => (
+const Italic = ({ value }: IItalicProps) => (
 	<Text style={styles.text}>
 		{value.map(block => {
 			switch (block.type) {
diff --git a/app/containers/markdown/new/Link.tsx b/app/containers/markdown/new/Link.tsx
index e29c4f2c0..3f926abd9 100644
--- a/app/containers/markdown/new/Link.tsx
+++ b/app/containers/markdown/new/Link.tsx
@@ -18,7 +18,7 @@ interface ILinkProps {
 	value: LinkProps['value'];
 }
 
-const Link = ({ value }: ILinkProps): JSX.Element => {
+const Link = ({ value }: ILinkProps) => {
 	const { theme } = useTheme();
 	const { onLinkPress } = useContext(MarkdownContext);
 	const { src, label } = value;
@@ -38,7 +38,7 @@ const Link = ({ value }: ILinkProps): JSX.Element => {
 	};
 
 	return (
-		<Text onPress={handlePress} onLongPress={onLongPress} style={[styles.link, { color: themes[theme!].actionTintColor }]}>
+		<Text onPress={handlePress} onLongPress={onLongPress} style={[styles.link, { color: themes[theme].actionTintColor }]}>
 			{(block => {
 				switch (block.type) {
 					case 'PLAIN_TEXT':
diff --git a/app/containers/markdown/new/OrderedList.tsx b/app/containers/markdown/new/OrderedList.tsx
index c5ae25125..d4226c54e 100644
--- a/app/containers/markdown/new/OrderedList.tsx
+++ b/app/containers/markdown/new/OrderedList.tsx
@@ -11,13 +11,13 @@ interface IOrderedListProps {
 	value: OrderedListProps['value'];
 }
 
-const OrderedList = ({ value }: IOrderedListProps): JSX.Element => {
+const OrderedList = ({ value }: IOrderedListProps) => {
 	const { theme } = useTheme();
 	return (
 		<View>
 			{value.map((item, index) => (
 				<View style={styles.row}>
-					<Text style={[styles.text, { color: themes[theme!].bodyText }]}>{index + 1}. </Text>
+					<Text style={[styles.text, { color: themes[theme].bodyText }]}>{index + 1}. </Text>
 					<Inline value={item.value} />
 				</View>
 			))}
diff --git a/app/containers/markdown/new/Paragraph.tsx b/app/containers/markdown/new/Paragraph.tsx
index 2f7649bb9..93cb81e44 100644
--- a/app/containers/markdown/new/Paragraph.tsx
+++ b/app/containers/markdown/new/Paragraph.tsx
@@ -11,10 +11,10 @@ interface IParagraphProps {
 	value: ParagraphProps['value'];
 }
 
-const Paragraph = ({ value }: IParagraphProps): JSX.Element => {
+const Paragraph = ({ value }: IParagraphProps) => {
 	const { theme } = useTheme();
 	return (
-		<Text style={[styles.text, { color: themes[theme!].bodyText }]}>
+		<Text style={[styles.text, { color: themes[theme].bodyText }]}>
 			<Inline value={value} />
 		</Text>
 	);
diff --git a/app/containers/markdown/new/Plain.tsx b/app/containers/markdown/new/Plain.tsx
index 9eca2e0c7..784bef63a 100644
--- a/app/containers/markdown/new/Plain.tsx
+++ b/app/containers/markdown/new/Plain.tsx
@@ -10,10 +10,10 @@ interface IPlainProps {
 	value: PlainProps['value'];
 }
 
-const Plain = ({ value }: IPlainProps): JSX.Element => {
+const Plain = ({ value }: IPlainProps) => {
 	const { theme } = useTheme();
 	return (
-		<Text accessibilityLabel={value} style={[styles.plainText, { color: themes[theme!].bodyText }]}>
+		<Text accessibilityLabel={value} style={[styles.plainText, { color: themes[theme].bodyText }]}>
 			{value}
 		</Text>
 	);
diff --git a/app/containers/markdown/new/Quote.tsx b/app/containers/markdown/new/Quote.tsx
index 27d6a01d1..d3005845a 100644
--- a/app/containers/markdown/new/Quote.tsx
+++ b/app/containers/markdown/new/Quote.tsx
@@ -11,11 +11,11 @@ interface IQuoteProps {
 	value: QuoteProps['value'];
 }
 
-const Quote = ({ value }: IQuoteProps): JSX.Element => {
+const Quote = ({ value }: IQuoteProps) => {
 	const { theme } = useTheme();
 	return (
 		<View style={styles.container}>
-			<View style={[styles.quote, { backgroundColor: themes[theme!].borderColor }]} />
+			<View style={[styles.quote, { backgroundColor: themes[theme].borderColor }]} />
 			<View style={styles.childContainer}>
 				{value.map(item => (
 					<Paragraph value={item.value} />
diff --git a/app/containers/markdown/new/Strike.tsx b/app/containers/markdown/new/Strike.tsx
index 4d1cf5ea8..dedea1241 100644
--- a/app/containers/markdown/new/Strike.tsx
+++ b/app/containers/markdown/new/Strike.tsx
@@ -17,7 +17,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Strike = ({ value }: IStrikeProps): JSX.Element => (
+const Strike = ({ value }: IStrikeProps) => (
 	<Text style={styles.text}>
 		{value.map(block => {
 			switch (block.type) {
diff --git a/app/containers/markdown/new/TaskList.tsx b/app/containers/markdown/new/TaskList.tsx
index 8f46af965..4359ba42c 100644
--- a/app/containers/markdown/new/TaskList.tsx
+++ b/app/containers/markdown/new/TaskList.tsx
@@ -11,13 +11,13 @@ interface ITasksProps {
 	value: TasksProps['value'];
 }
 
-const TaskList = ({ value = [] }: ITasksProps): JSX.Element => {
+const TaskList = ({ value = [] }: ITasksProps) => {
 	const { theme } = useTheme();
 	return (
 		<View>
 			{value.map(item => (
 				<View style={styles.row}>
-					<Text style={[styles.text, { color: themes[theme!].bodyText }]}>{item.status ? '- [x] ' : '- [ ] '}</Text>
+					<Text style={[styles.text, { color: themes[theme].bodyText }]}>{item.status ? '- [x] ' : '- [ ] '}</Text>
 					<Inline value={item.value} />
 				</View>
 			))}
diff --git a/app/containers/markdown/new/UnorderedList.tsx b/app/containers/markdown/new/UnorderedList.tsx
index 51c9b2188..09e16cdc7 100644
--- a/app/containers/markdown/new/UnorderedList.tsx
+++ b/app/containers/markdown/new/UnorderedList.tsx
@@ -11,13 +11,13 @@ interface IUnorderedListProps {
 	value: UnorderedListProps['value'];
 }
 
-const UnorderedList = ({ value }: IUnorderedListProps): JSX.Element => {
+const UnorderedList = ({ value }: IUnorderedListProps) => {
 	const { theme } = useTheme();
 	return (
 		<View>
 			{value.map(item => (
 				<View style={styles.row}>
-					<Text style={[styles.text, { color: themes[theme!].bodyText }]}>- </Text>
+					<Text style={[styles.text, { color: themes[theme].bodyText }]}>- </Text>
 					<Inline value={item.value} />
 				</View>
 			))}
diff --git a/app/containers/markdown/new/index.tsx b/app/containers/markdown/new/index.tsx
index a02faffca..f5e7e587c 100644
--- a/app/containers/markdown/new/index.tsx
+++ b/app/containers/markdown/new/index.tsx
@@ -35,7 +35,7 @@ const Body = ({
 	getCustomEmoji,
 	baseUrl,
 	onLinkPress
-}: IBodyProps): React.ReactElement | null => {
+}: IBodyProps) => {
 	if (isEmpty(tokens)) {
 		return null;
 	}
diff --git a/app/containers/message/Attachments.tsx b/app/containers/message/Attachments.tsx
index 673f91ae1..3c0aeb2e3 100644
--- a/app/containers/message/Attachments.tsx
+++ b/app/containers/message/Attachments.tsx
@@ -82,7 +82,7 @@ const Attachments = React.memo(
 			if (file && file.actions && file.actions.length > 0) {
 				return <AttachedActions attachment={file} />;
 			}
-			if (file.title) {
+			if (typeof file.collapsed === 'boolean') {
 				return (
 					<CollapsibleQuote key={index} index={index} attachment={file} timeFormat={timeFormat} getCustomEmoji={getCustomEmoji} />
 				);
diff --git a/app/definitions/ILoggedUser.ts b/app/definitions/ILoggedUser.ts
index c13d420fb..7aa159403 100644
--- a/app/definitions/ILoggedUser.ts
+++ b/app/definitions/ILoggedUser.ts
@@ -1,7 +1,7 @@
 import Model from '@nozbe/watermelondb/Model';
 
 import { IUserEmail, IUserSettings } from './IUser';
-import { UserStatus } from './UserStatus';
+import { TUserStatus } from './TUserStatus';
 
 export interface ILoggedUser {
 	id: string;
@@ -9,7 +9,7 @@ export interface ILoggedUser {
 	username: string;
 	name: string;
 	language?: string;
-	status: UserStatus;
+	status: TUserStatus;
 	statusText?: string;
 	customFields?: {
 		[key: string]: any;
diff --git a/app/definitions/IUser.ts b/app/definitions/IUser.ts
index 93bce8805..a9a803bd1 100644
--- a/app/definitions/IUser.ts
+++ b/app/definitions/IUser.ts
@@ -1,6 +1,6 @@
 import Model from '@nozbe/watermelondb/Model';
 
-import { UserStatus } from './UserStatus';
+import { TUserStatus } from './TUserStatus';
 import { IRocketChatRecord } from './IRocketChatRecord';
 import { ILoggedUser } from './ILoggedUser';
 
@@ -25,7 +25,7 @@ export interface IPersonalAccessToken extends ILoginToken {
 export interface IUserRegistered {
 	_id: string;
 	type: string;
-	status: UserStatus;
+	status: TUserStatus;
 	active: boolean;
 	name: string;
 	username: string;
@@ -133,14 +133,14 @@ export interface IUser extends IRocketChatRecord, Omit<ILoggedUser, 'username' |
 	name?: string;
 	services?: IUserServices;
 	emails?: IUserEmail[];
-	status: UserStatus;
+	status: TUserStatus;
 	statusConnection?: string;
 	lastLogin?: Date;
 	avatarOrigin?: string;
 	avatarETag?: string;
 	utcOffset?: number;
 	language?: string;
-	statusDefault?: UserStatus;
+	statusDefault?: TUserStatus;
 	statusText?: string;
 	oauth?: {
 		authorizedClients: string[];
diff --git a/app/definitions/TUserStatus.ts b/app/definitions/TUserStatus.ts
new file mode 100644
index 000000000..ce6286db5
--- /dev/null
+++ b/app/definitions/TUserStatus.ts
@@ -0,0 +1,3 @@
+export const STATUSES = ['offline', 'online', 'away', 'busy'] as const;
+
+export type TUserStatus = typeof STATUSES[number];
diff --git a/app/definitions/UserStatus.ts b/app/definitions/UserStatus.ts
deleted file mode 100644
index fafb9ccaa..000000000
--- a/app/definitions/UserStatus.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export enum UserStatus {
-	ONLINE = 'online',
-	AWAY = 'away',
-	OFFLINE = 'offline',
-	BUSY = 'busy'
-}
diff --git a/app/definitions/index.ts b/app/definitions/index.ts
index 19d8caec5..9a72e1b7a 100644
--- a/app/definitions/index.ts
+++ b/app/definitions/index.ts
@@ -26,6 +26,7 @@ export * from './ICertificate';
 export * from './IUrl';
 export * from './ICredentials';
 export * from './ISearch';
+export * from './TUserStatus';
 
 export interface IBaseScreen<T extends Record<string, object | undefined>, S extends string> {
 	navigation: StackNavigationProp<T, S>;
diff --git a/app/dimensions.tsx b/app/dimensions.tsx
index 1c2ce6282..92b4ee9b3 100644
--- a/app/dimensions.tsx
+++ b/app/dimensions.tsx
@@ -8,7 +8,7 @@ export interface IDimensionsContextProps {
 	width: number;
 	height: number;
 	scale?: number;
-	fontScale?: number;
+	fontScale: number;
 	setDimensions?: ({
 		width,
 		height,
@@ -22,7 +22,9 @@ export interface IDimensionsContextProps {
 	}) => void;
 }
 
-export const DimensionsContext = React.createContext<IDimensionsContextProps>(Dimensions.get('window'));
+export const DimensionsContext = React.createContext<IDimensionsContextProps>(
+	Dimensions.get('window') as IDimensionsContextProps
+);
 
 export function withDimensions<T extends object>(Component: React.ComponentType<T> & TNavigationOptions): typeof Component {
 	const DimensionsComponent = (props: T) => (
diff --git a/app/lib/rocketchat/rocketchat.js b/app/lib/rocketchat/rocketchat.js
index 155b5a545..cae66d8cf 100644
--- a/app/lib/rocketchat/rocketchat.js
+++ b/app/lib/rocketchat/rocketchat.js
@@ -73,7 +73,6 @@ export const THEME_PREFERENCES_KEY = 'RC_THEME_PREFERENCES_KEY';
 export const CRASH_REPORT_KEY = 'RC_CRASH_REPORT_KEY';
 export const ANALYTICS_EVENTS_KEY = 'RC_ANALYTICS_EVENTS_KEY';
 export const MIN_ROCKETCHAT_VERSION = '0.70.0';
-export const STATUSES = ['offline', 'online', 'away', 'busy'];
 
 const RocketChat = {
 	TOKEN_KEY,
diff --git a/app/lib/rocketchat/services/connect.ts b/app/lib/rocketchat/services/connect.ts
index 07df5c3ed..acc10eb49 100644
--- a/app/lib/rocketchat/services/connect.ts
+++ b/app/lib/rocketchat/services/connect.ts
@@ -6,7 +6,6 @@ import { Q } from '@nozbe/watermelondb';
 
 import log from '../../../utils/log';
 import { onRolesChanged } from '../../methods/getRoles';
-import { UserStatus } from '../../../definitions/UserStatus';
 import { setActiveUsers } from '../../../actions/activeUsers';
 import protectedFunction from '../../methods/helpers/protectedFunction';
 import database from '../../database';
@@ -17,8 +16,8 @@ import { store } from '../../auxStore';
 import { loginRequest, setLoginServices, setUser } from '../../../actions/login';
 import sdk from './sdk';
 import I18n from '../../../i18n';
-import RocketChat, { MIN_ROCKETCHAT_VERSION, STATUSES } from '../rocketchat';
-import { ICredentials, ILoggedUser, IRocketChat } from '../../../definitions';
+import RocketChat, { MIN_ROCKETCHAT_VERSION } from '../rocketchat';
+import { ICredentials, ILoggedUser, IRocketChat, STATUSES } from '../../../definitions';
 import { isIOS } from '../../../utils/deviceInfo';
 import { connectRequest, connectSuccess, disconnect as disconnectAction } from '../../../actions/connect';
 import { updatePermission } from '../../../actions/permissions';
@@ -195,7 +194,7 @@ function connect(
 
 					const { user: loggedUser } = store.getState().login;
 					if (loggedUser && loggedUser.id === id) {
-						store.dispatch(setUser({ status: STATUSES[status] as UserStatus, statusText }));
+						store.dispatch(setUser({ status: STATUSES[status], statusText }));
 					}
 				} else if (/updateAvatar/.test(eventName)) {
 					const { username, etag } = ddpMessage.fields.args[0];
diff --git a/app/lib/rocketchat/services/restApi.ts b/app/lib/rocketchat/services/restApi.ts
index db6124351..0d7f766bc 100644
--- a/app/lib/rocketchat/services/restApi.ts
+++ b/app/lib/rocketchat/services/restApi.ts
@@ -900,4 +900,4 @@ export const e2eFetchMyKeys = async () => {
 		};
 	}
 	return result;
-};
\ No newline at end of file
+};
diff --git a/app/presentation/RoomItem/RoomItem.tsx b/app/presentation/RoomItem/RoomItem.tsx
index e823d94e9..497cf91a2 100644
--- a/app/presentation/RoomItem/RoomItem.tsx
+++ b/app/presentation/RoomItem/RoomItem.tsx
@@ -12,6 +12,7 @@ import Touchable from './Touchable';
 import Tag from './Tag';
 import I18n from '../../i18n';
 import { DisplayMode } from '../../constants/constantDisplayMode';
+import { TUserStatus } from '../../definitions';
 
 interface IRoomItem {
 	rid: string;
@@ -24,7 +25,7 @@ interface IRoomItem {
 	avatarSize: number;
 	testID: string;
 	width: number;
-	status: string;
+	status: TUserStatus;
 	useRealName: boolean;
 	theme: string;
 	isFocused: boolean;
diff --git a/app/presentation/RoomItem/TypeIcon.tsx b/app/presentation/RoomItem/TypeIcon.tsx
index 53659fbde..c3c6926e9 100644
--- a/app/presentation/RoomItem/TypeIcon.tsx
+++ b/app/presentation/RoomItem/TypeIcon.tsx
@@ -1,10 +1,11 @@
 import React from 'react';
 
+import { TUserStatus } from '../../definitions';
 import RoomTypeIcon from '../../containers/RoomTypeIcon';
 
 interface ITypeIcon {
 	type: string;
-	status: string;
+	status: TUserStatus;
 	prid: string;
 	isGroupChat: boolean;
 	teamMain: boolean;
diff --git a/app/presentation/RoomItem/index.tsx b/app/presentation/RoomItem/index.tsx
index 7e88fe6c1..ebd1a57b5 100644
--- a/app/presentation/RoomItem/index.tsx
+++ b/app/presentation/RoomItem/index.tsx
@@ -5,6 +5,7 @@ import I18n from '../../i18n';
 import { ROW_HEIGHT, ROW_HEIGHT_CONDENSED } from './styles';
 import { formatDate } from '../../utils/room';
 import RoomItem from './RoomItem';
+import { TUserStatus } from '../../definitions';
 
 export { ROW_HEIGHT, ROW_HEIGHT_CONDENSED };
 interface IRoomItemContainerProps {
@@ -16,7 +17,7 @@ interface IRoomItemContainerProps {
 	username: string;
 	avatarSize: number;
 	width: number;
-	status: string;
+	status: TUserStatus;
 	toggleFav(): void;
 	toggleRead(): void;
 	hideChannel(): void;
@@ -53,7 +54,7 @@ class RoomItemContainer extends React.Component<IRoomItemContainerProps, any> {
 
 	private roomSubscription: any;
 
-	static defaultProps = {
+	static defaultProps: Partial<IRoomItemContainerProps> = {
 		avatarSize: 48,
 		status: 'offline',
 		getUserPresence: () => {},
@@ -233,7 +234,7 @@ const mapStateToProps = (state: any, ownProps: any) => {
 	}
 	return {
 		connected: state.meteor.connected,
-		status
+		status: status as TUserStatus
 	};
 };
 
diff --git a/app/reducers/activeUsers.test.ts b/app/reducers/activeUsers.test.ts
index 42a10d402..b78db6db4 100644
--- a/app/reducers/activeUsers.test.ts
+++ b/app/reducers/activeUsers.test.ts
@@ -1,5 +1,4 @@
 import { clearActiveUsers, setActiveUsers } from '../actions/activeUsers';
-import { UserStatus } from '../definitions/UserStatus';
 import { IActiveUsers, initialState } from './activeUsers';
 import { mockedStore } from './mockedStore';
 
@@ -9,7 +8,7 @@ describe('test reducer', () => {
 		expect(state).toEqual(initialState);
 	});
 	it('should return modified store after action', () => {
-		const activeUsers: IActiveUsers = { any: { status: UserStatus.ONLINE, statusText: 'any' } };
+		const activeUsers: IActiveUsers = { any: { status: 'online', statusText: 'any' } };
 		mockedStore.dispatch(setActiveUsers(activeUsers));
 		const state = mockedStore.getState().activeUsers;
 		expect(state).toEqual({ ...activeUsers });
diff --git a/app/reducers/activeUsers.ts b/app/reducers/activeUsers.ts
index 34a55ce6d..d399584d3 100644
--- a/app/reducers/activeUsers.ts
+++ b/app/reducers/activeUsers.ts
@@ -1,9 +1,8 @@
 import { ACTIVE_USERS } from '../actions/actionsTypes';
-import { TApplicationActions } from '../definitions';
-import { UserStatus } from '../definitions/UserStatus';
+import { TApplicationActions, TUserStatus } from '../definitions';
 
 export interface IActiveUser {
-	status: UserStatus;
+	status: TUserStatus;
 	statusText: string;
 }
 
diff --git a/app/reducers/login.test.ts b/app/reducers/login.test.ts
index 2c92b8879..709441261 100644
--- a/app/reducers/login.test.ts
+++ b/app/reducers/login.test.ts
@@ -1,3 +1,4 @@
+import { TUserStatus } from '../definitions';
 import {
 	clearUser,
 	loginFailure,
@@ -8,7 +9,6 @@ import {
 	setLoginServices,
 	setUser
 } from '../actions/login';
-import { UserStatus } from '../definitions/UserStatus';
 import { initialState } from './login';
 import { mockedStore } from './mockedStore';
 
@@ -49,7 +49,7 @@ describe('test selectedUsers reducer', () => {
 			isFromWebView: false,
 			showMessageInMainThread: false,
 			enableMessageParserEarlyAdoption: false,
-			status: UserStatus.ONLINE,
+			status: 'online' as TUserStatus,
 			statusText: 'online'
 		};
 		mockedStore.dispatch(loginSuccess(user));
diff --git a/app/reducers/login.ts b/app/reducers/login.ts
index 8d4026112..d4e60b935 100644
--- a/app/reducers/login.ts
+++ b/app/reducers/login.ts
@@ -1,7 +1,6 @@
-import { UserStatus } from '../definitions/UserStatus';
 import * as types from '../actions/actionsTypes';
 import { TActionsLogin } from '../actions/login';
-import { IUser } from '../definitions';
+import { IUser, TUserStatus } from '../definitions';
 
 export interface IUserLogin {
 	id: string;
@@ -9,7 +8,7 @@ export interface IUserLogin {
 	username: string;
 	name: string;
 	language?: string;
-	status: UserStatus;
+	status: TUserStatus;
 	statusText: string;
 	roles: string[];
 	avatarETag?: string;
diff --git a/app/views/AddChannelTeamView.tsx b/app/views/AddChannelTeamView.tsx
index 8a72d3c96..2675feb1d 100644
--- a/app/views/AddChannelTeamView.tsx
+++ b/app/views/AddChannelTeamView.tsx
@@ -6,7 +6,6 @@ import { CompositeNavigationProp } from '@react-navigation/core';
 
 import * as List from '../containers/List';
 import StatusBar from '../containers/StatusBar';
-import { useTheme } from '../theme';
 import * as HeaderButton from '../containers/HeaderButton';
 import SafeAreaView from '../containers/SafeAreaView';
 import I18n from '../i18n';
@@ -41,7 +40,6 @@ const setHeader = ({
 
 const AddChannelTeamView = ({ navigation, route, isMasterDetail }: IAddChannelTeamView) => {
 	const { teamId, teamChannels } = route.params;
-	const { theme } = useTheme();
 
 	useEffect(() => {
 		setHeader({ navigation, isMasterDetail });
@@ -67,7 +65,6 @@ const AddChannelTeamView = ({ navigation, route, isMasterDetail }: IAddChannelTe
 					testID='add-channel-team-view-create-channel'
 					left={() => <List.Icon name='team' />}
 					right={() => <List.Icon name='chevron-right' />}
-					theme={theme}
 				/>
 				<List.Separator />
 				<List.Item
@@ -76,7 +73,6 @@ const AddChannelTeamView = ({ navigation, route, isMasterDetail }: IAddChannelTe
 					testID='add-channel-team-view-add-existing'
 					left={() => <List.Icon name='channel-public' />}
 					right={() => <List.Icon name='chevron-right' />}
-					theme={theme}
 				/>
 				<List.Separator />
 			</List.Container>
diff --git a/app/views/ForgotPasswordView.tsx b/app/views/ForgotPasswordView.tsx
index 375d089d4..0153f81fd 100644
--- a/app/views/ForgotPasswordView.tsx
+++ b/app/views/ForgotPasswordView.tsx
@@ -92,7 +92,7 @@ class ForgotPasswordView extends React.Component<IForgotPasswordViewProps, IForg
 		const { theme } = this.props;
 
 		return (
-			<FormContainer theme={theme} testID='forgot-password-view'>
+			<FormContainer testID='forgot-password-view'>
 				<FormContainerInner>
 					<Text style={[sharedStyles.loginTitle, sharedStyles.textBold, { color: themes[theme].titleText }]}>
 						{I18n.t('Forgot_password')}
diff --git a/app/views/LoginView.tsx b/app/views/LoginView.tsx
index d5b136dd5..0f66cba65 100644
--- a/app/views/LoginView.tsx
+++ b/app/views/LoginView.tsx
@@ -229,7 +229,7 @@ class LoginView extends React.Component<ILoginViewProps, any> {
 	render() {
 		const { Accounts_ShowFormLogin, theme, navigation } = this.props;
 		return (
-			<FormContainer theme={theme} testID='login-view'>
+			<FormContainer testID='login-view'>
 				<FormContainerInner>
 					<LoginServices separator={Accounts_ShowFormLogin} navigation={navigation} theme={theme} />
 					{this.renderUserForm()}
diff --git a/app/views/NewServerView/index.tsx b/app/views/NewServerView/index.tsx
index 51f20a980..50917ceb5 100644
--- a/app/views/NewServerView/index.tsx
+++ b/app/views/NewServerView/index.tsx
@@ -321,7 +321,7 @@ class NewServerView extends React.Component<INewServerViewProps, INewServerViewS
 		const marginTop = previousServer ? 0 : 35;
 
 		return (
-			<FormContainer theme={theme} testID='new-server-view' keyboardShouldPersistTaps='never'>
+			<FormContainer testID='new-server-view' keyboardShouldPersistTaps='never'>
 				<FormContainerInner>
 					<Image
 						style={[
diff --git a/app/views/RegisterView.tsx b/app/views/RegisterView.tsx
index 478198a1b..b9e43bec3 100644
--- a/app/views/RegisterView.tsx
+++ b/app/views/RegisterView.tsx
@@ -172,60 +172,64 @@ class RegisterView extends React.Component<IProps, any> {
 			return null;
 		}
 		try {
-			return Object.keys(this.parsedCustomFields).map((key, index, array) => {
-				if (this.parsedCustomFields[key].type === 'select') {
-					const options = this.parsedCustomFields[key].options.map((option: string) => ({ label: option, value: option }));
-					return (
-						<RNPickerSelect
-							key={key}
-							items={options}
-							onValueChange={value => {
-								const newValue: { [key: string]: string | number } = {};
-								newValue[key] = value;
-								this.setState({ customFields: { ...customFields, ...newValue } });
-							}}
-							value={customFields[key]}>
+			return (
+				<>
+					{Object.keys(this.parsedCustomFields).map((key, index, array) => {
+						if (this.parsedCustomFields[key].type === 'select') {
+							const options = this.parsedCustomFields[key].options.map((option: string) => ({ label: option, value: option }));
+							return (
+								<RNPickerSelect
+									key={key}
+									items={options}
+									onValueChange={value => {
+										const newValue: { [key: string]: string | number } = {};
+										newValue[key] = value;
+										this.setState({ customFields: { ...customFields, ...newValue } });
+									}}
+									value={customFields[key]}>
+									<TextInput
+										inputRef={(e: any) => {
+											// @ts-ignore
+											this[key] = e;
+										}}
+										placeholder={key}
+										value={customFields[key]}
+										testID='register-view-custom-picker'
+										theme={theme}
+									/>
+								</RNPickerSelect>
+							);
+						}
+
+						return (
 							<TextInput
 								inputRef={e => {
 									// @ts-ignore
 									this[key] = e;
 								}}
+								key={key}
+								label={key}
 								placeholder={key}
 								value={customFields[key]}
-								testID='register-view-custom-picker'
+								onChangeText={(value: string) => {
+									const newValue: { [key: string]: string | number } = {};
+									newValue[key] = value;
+									this.setState({ customFields: { ...customFields, ...newValue } });
+								}}
+								onSubmitEditing={() => {
+									if (array.length - 1 > index) {
+										// @ts-ignore
+										return this[array[index + 1]].focus();
+									}
+									this.avatarUrl.focus();
+								}}
+								containerStyle={styles.inputContainer}
 								theme={theme}
 							/>
-						</RNPickerSelect>
-					);
-				}
-
-				return (
-					<TextInput
-						inputRef={(e: any) => {
-							// @ts-ignore
-							this[key] = e;
-						}}
-						key={key}
-						label={key}
-						placeholder={key}
-						value={customFields[key]}
-						onChangeText={(value: string) => {
-							const newValue: { [key: string]: string | number } = {};
-							newValue[key] = value;
-							this.setState({ customFields: { ...customFields, ...newValue } });
-						}}
-						onSubmitEditing={() => {
-							if (array.length - 1 > index) {
-								// @ts-ignore
-								return this[array[index + 1]].focus();
-							}
-							this.avatarUrl.focus();
-						}}
-						containerStyle={styles.inputContainer}
-						theme={theme}
-					/>
-				);
-			});
+						);
+					})}
+				</>
+			);
 		} catch (error) {
 			return null;
 		}
@@ -235,7 +239,7 @@ class RegisterView extends React.Component<IProps, any> {
 		const { saving } = this.state;
 		const { theme, showLoginButton, navigation } = this.props;
 		return (
-			<FormContainer theme={theme} testID='register-view'>
+			<FormContainer testID='register-view'>
 				<FormContainerInner>
 					<LoginServices navigation={navigation} theme={theme} separator />
 					<Text style={[styles.title, sharedStyles.textBold, { color: themes[theme].titleText }]}>{I18n.t('Sign_Up')}</Text>
diff --git a/app/views/ScreenLockConfigView.tsx b/app/views/ScreenLockConfigView.tsx
index e7ae0cf45..50f2cde84 100644
--- a/app/views/ScreenLockConfigView.tsx
+++ b/app/views/ScreenLockConfigView.tsx
@@ -223,7 +223,7 @@ class ScreenLockConfigView extends React.Component<IScreenLockConfigViewProps, I
 		return (
 			<List.Section>
 				<List.Separator />
-				{items.map(item => this.renderItem({ item }))}
+				<>{items.map(item => this.renderItem({ item }))}</>
 			</List.Section>
 		);
 	};
diff --git a/app/views/SendEmailConfirmationView.tsx b/app/views/SendEmailConfirmationView.tsx
index a3aad4979..6fb1f008c 100644
--- a/app/views/SendEmailConfirmationView.tsx
+++ b/app/views/SendEmailConfirmationView.tsx
@@ -62,7 +62,7 @@ const SendEmailConfirmationView = ({ navigation, route }: ISendEmailConfirmation
 	}, []);
 
 	return (
-		<FormContainer theme={theme} testID='send-email-confirmation-view'>
+		<FormContainer testID='send-email-confirmation-view'>
 			<FormContainerInner>
 				<TextInput
 					autoFocus
diff --git a/app/views/SidebarView/index.tsx b/app/views/SidebarView/index.tsx
index f406e3261..d240e6cb3 100644
--- a/app/views/SidebarView/index.tsx
+++ b/app/views/SidebarView/index.tsx
@@ -19,6 +19,7 @@ import Navigation from '../../lib/Navigation';
 import SidebarItem from './SidebarItem';
 import styles from './styles';
 import { DrawerParamList } from '../../stacks/types';
+import { TUserStatus } from '../../definitions';
 
 interface ISeparatorProps {
 	theme: string;
@@ -40,7 +41,7 @@ interface ISidebarProps {
 	Site_Name: string;
 	user: {
 		statusText: string;
-		status: string;
+		status: TUserStatus;
 		username: string;
 		name: string;
 		roles: string[];
diff --git a/app/views/StatusView.tsx b/app/views/StatusView.tsx
index 2f89660be..3aa232089 100644
--- a/app/views/StatusView.tsx
+++ b/app/views/StatusView.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import { FlatList, StyleSheet } from 'react-native';
 import { connect } from 'react-redux';
 
-import { UserStatus } from '../definitions/UserStatus';
 import { setUser } from '../actions/login';
 import * as HeaderButton from '../containers/HeaderButton';
 import * as List from '../containers/List';
@@ -11,7 +10,7 @@ import SafeAreaView from '../containers/SafeAreaView';
 import Status from '../containers/Status/Status';
 import TextInput from '../containers/TextInput';
 import { LISTENER } from '../containers/Toast';
-import { IApplicationState, IBaseScreen, IUser } from '../definitions';
+import { IApplicationState, IBaseScreen, IUser, TUserStatus } from '../definitions';
 import I18n from '../i18n';
 import RocketChat from '../lib/rocketchat';
 import { getUserSelector } from '../selectors/login';
@@ -20,7 +19,12 @@ import EventEmitter from '../utils/events';
 import { showErrorAlert } from '../utils/info';
 import log, { events, logEvent } from '../utils/log';
 
-const STATUS = [
+interface IStatus {
+	id: TUserStatus;
+	name: string;
+}
+
+const STATUS: IStatus[] = [
 	{
 		id: 'online',
 		name: 'Online'
@@ -135,7 +139,7 @@ class StatusView extends React.Component<IStatusViewProps, IStatusViewState> {
 					value={statusText}
 					containerStyle={styles.inputContainer}
 					onChangeText={text => this.setState({ statusText: text })}
-					left={<Status testID={`status-view-current-${user.status}`} style={styles.inputLeft} status={user.status!} size={24} />}
+					left={<Status testID={`status-view-current-${user.status}`} style={styles.inputLeft} status={user.status} size={24} />}
 					inputStyle={styles.inputStyle}
 					placeholder={I18n.t('What_are_you_doing_right_now')}
 					testID='status-view-input'
@@ -145,7 +149,7 @@ class StatusView extends React.Component<IStatusViewProps, IStatusViewState> {
 		);
 	};
 
-	renderItem = ({ item }: { item: { id: string; name: string } }) => {
+	renderItem = ({ item }: { item: IStatus }) => {
 		const { statusText } = this.state;
 		const { user, dispatch } = this.props;
 		const { id, name } = item;
@@ -159,7 +163,7 @@ class StatusView extends React.Component<IStatusViewProps, IStatusViewState> {
 						try {
 							const result = await RocketChat.setUserStatus(item.id, statusText);
 							if (result.success) {
-								dispatch(setUser({ status: item.id as UserStatus }));
+								dispatch(setUser({ status: item.id }));
 							}
 						} catch (e: any) {
 							showErrorAlert(I18n.t(e.data.errorType));
diff --git a/app/views/ThemeView.tsx b/app/views/ThemeView.tsx
index b3862bed2..5bc365d35 100644
--- a/app/views/ThemeView.tsx
+++ b/app/views/ThemeView.tsx
@@ -131,11 +131,11 @@ class ThemeView extends React.Component<IThemeViewProps> {
 				<List.Container>
 					<List.Section title='Theme'>
 						<List.Separator />
-						{themeGroup.map(item => this.renderItem({ item }))}
+						<>{themeGroup.map(item => this.renderItem({ item }))}</>
 					</List.Section>
 					<List.Section title='Dark_level'>
 						<List.Separator />
-						{darkGroup.map(item => this.renderItem({ item }))}
+						<>{darkGroup.map(item => this.renderItem({ item }))}</>
 					</List.Section>
 				</List.Container>
 			</SafeAreaView>
diff --git a/app/views/WorkspaceView/index.tsx b/app/views/WorkspaceView/index.tsx
index 5eb6e34dd..ed7155a02 100644
--- a/app/views/WorkspaceView/index.tsx
+++ b/app/views/WorkspaceView/index.tsx
@@ -74,7 +74,7 @@ class WorkspaceView extends React.Component<IWorkSpaceProp, any> {
 		const { theme, Site_Name, Site_Url, Assets_favicon_512, server, showLoginButton } = this.props;
 
 		return (
-			<FormContainer theme={theme} testID='workspace-view'>
+			<FormContainer testID='workspace-view'>
 				<FormContainerInner>
 					<View style={styles.alignItemsCenter}>
 						<ServerAvatar theme={theme} url={server} image={Assets_favicon_512?.url ?? Assets_favicon_512?.defaultUrl} />
diff --git a/storybook/stories/__snapshots__/List.storyshot b/storybook/stories/__snapshots__/List.storyshot
index b87a645df..0744a75ac 100644
--- a/storybook/stories/__snapshots__/List.storyshot
+++ b/storybook/stories/__snapshots__/List.storyshot
@@ -12,7 +12,7 @@ exports[`Storyshots List separator 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"pr
 
 exports[`Storyshots List title and subtitle 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"light\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}],\\"testID\\":\\"test-id\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]}]}"`;
 
-exports[`Storyshots List with FlatList 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"data\\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29],\\"contentContainerStyle\\":{\\"paddingVertical\\":32},\\"disableVirtualization\\":false,\\"horizontal\\":false,\\"initialNumToRender\\":10,\\"maxToRenderPerBatch\\":10,\\"onEndReachedThreshold\\":2,\\"scrollEventThrottle\\":50,\\"updateCellsBatchingPeriod\\":50,\\"windowSize\\":21,\\"removeClippedSubviews\\":false,\\"viewabilityConfigCallbackPairs\\":[],\\"stickyHeaderIndices\\":[]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"0\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"1\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"2\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"3\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"4\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"5\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"6\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"7\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"8\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"9\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"height\\":0}},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]}]}]}]}"`;
+exports[`Storyshots List with FlatList 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"data\\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29],\\"contentContainerStyle\\":{\\"paddingVertical\\":32},\\"ListHeaderComponent\\":{\\"compare\\":null},\\"ListFooterComponent\\":{\\"compare\\":null},\\"ItemSeparatorComponent\\":{\\"compare\\":null},\\"disableVirtualization\\":false,\\"horizontal\\":false,\\"initialNumToRender\\":10,\\"maxToRenderPerBatch\\":10,\\"onEndReachedThreshold\\":2,\\"scrollEventThrottle\\":50,\\"updateCellsBatchingPeriod\\":50,\\"windowSize\\":21,\\"removeClippedSubviews\\":false,\\"viewabilityConfigCallbackPairs\\":[],\\"stickyHeaderIndices\\":[]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"0\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"1\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"2\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"3\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"4\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"5\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"6\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"7\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"8\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":null},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"9\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"height\\":0}},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]}]}]}]}"`;
 
 exports[`Storyshots List with bigger font 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"light\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
 
diff --git a/storybook/stories/__snapshots__/Message.storyshot b/storybook/stories/__snapshots__/Message.storyshot
index 934c0f0f3..4f227eb5d 100644
--- a/storybook/stories/__snapshots__/Message.storyshot
+++ b/storybook/stories/__snapshots__/Message.storyshot
@@ -58,7 +58,7 @@ exports[`Storyshots Message System messages 1`] = `"{\\"type\\":\\"RCTScrollView
 
 exports[`Storyshots Message Temp 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"backgroundColor\\":null,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"paddingVertical\\":4,\\"width\\":\\"100%\\",\\"paddingHorizontal\\":14,\\"flexDirection\\":\\"column\\"},null]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4},{\\"marginTop\\":4}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/diego.mello?format=png&size=36\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"marginLeft\\":46},{\\"marginLeft\\":10}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"justifyContent\\":\\"space-between\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"flexShrink\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"lineHeight\\":22,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"diego.mello\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":12,\\"marginLeft\\":8,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"10:00 AM\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"opacity\\":0.3}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"Temp message\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{},{\\"marginTop\\":0,\\"marginBottom\\":0,\\"flexWrap\\":\\"wrap\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"flex-start\\",\\"justifyContent\\":\\"flex-start\\"}]]},\\"children\\":[\\"Temp message\\"]}]}]}]}]}]}]}]}]}]}"`;
 
-exports[`Storyshots Message Thumbnail from server 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"backgroundColor\\":null,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"paddingVertical\\":4,\\"width\\":\\"100%\\",\\"paddingHorizontal\\":14,\\"flexDirection\\":\\"column\\"},null]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4},{\\"marginTop\\":4}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/diego.mello?format=png&size=36\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"marginLeft\\":46},{\\"marginLeft\\":10}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"justifyContent\\":\\"space-between\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"flexShrink\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"lineHeight\\":22,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"diego.mello\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":12,\\"marginLeft\\":8,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"10:00 AM\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"testID\\":\\"collapsibleQuoteTouchable-Title\\",\\"hitSlop\\":{\\"top\\":4,\\"right\\":4,\\"bottom\\":4,\\"left\\":4},\\"focusable\\":true,\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"marginTop\\":6,\\"borderWidth\\":1,\\"borderRadius\\":4,\\"minHeight\\":40,\\"backgroundColor\\":\\"#f3f4f5\\",\\"borderLeftColor\\":\\"#CBCED1\\",\\"borderTopColor\\":\\"#e1e5e8\\",\\"borderRightColor\\":\\"#e1e5e8\\",\\"borderBottomColor\\":\\"#e1e5e8\\",\\"borderLeftWidth\\":2,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"borderRadius\\":4,\\"padding\\":8}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"Title\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"width\\":20,\\"height\\":20,\\"right\\":8,\\"top\\":8,\\"justifyContent\\":\\"center\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#6C727A\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"this is a thumbnail\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{},{\\"marginTop\\":0,\\"marginBottom\\":0,\\"flexWrap\\":\\"wrap\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"flex-start\\",\\"justifyContent\\":\\"flex-start\\"}]]},\\"children\\":[\\"this is a thumbnail\\"]}]}]}]}]}]}]}]}]}]}"`;
+exports[`Storyshots Message Thumbnail from server 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"backgroundColor\\":null,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"paddingVertical\\":4,\\"width\\":\\"100%\\",\\"paddingHorizontal\\":14,\\"flexDirection\\":\\"column\\"},null]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4},{\\"marginTop\\":4}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/diego.mello?format=png&size=36\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"marginLeft\\":46},{\\"marginLeft\\":10}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"justifyContent\\":\\"space-between\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"flexShrink\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"lineHeight\\":22,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"diego.mello\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":12,\\"marginLeft\\":8,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"10:00 AM\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"marginVertical\\":4,\\"alignSelf\\":\\"flex-start\\",\\"borderLeftWidth\\":2,\\"borderColor\\":\\"#e1e5e8\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"borderRadius\\":4,\\"flexDirection\\":\\"column\\",\\"paddingVertical\\":4,\\"paddingLeft\\":8}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"marginBottom\\":8}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":16,\\"marginBottom\\":3,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[\\"Title\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":null,\\"height\\":200,\\"flex\\":1,\\"borderTopLeftRadius\\":4,\\"borderTopRightRadius\\":4,\\"marginBottom\\":1}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://images-na.ssl-images-amazon.com/images/I/71jKxPAMFbL._AC_SL1500_.jpg\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{\\"color\\":\\"#6C727A\\",\\"fontSize\\":14}],{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"Image text\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{},{\\"marginTop\\":0,\\"marginBottom\\":0,\\"flexWrap\\":\\"wrap\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"flex-start\\",\\"justifyContent\\":\\"flex-start\\"}],{\\"color\\":\\"#6C727A\\",\\"fontSize\\":14}]},\\"children\\":[\\"Image text\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"this is a thumbnail\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{},{\\"marginTop\\":0,\\"marginBottom\\":0,\\"flexWrap\\":\\"wrap\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"flex-start\\",\\"justifyContent\\":\\"flex-start\\"}]]},\\"children\\":[\\"this is a thumbnail\\"]}]}]}]}]}]}]}]}]}]}"`;
 
 exports[`Storyshots Message Time format 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"backgroundColor\\":null,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"paddingVertical\\":4,\\"width\\":\\"100%\\",\\"paddingHorizontal\\":14,\\"flexDirection\\":\\"column\\"},null]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4},{\\"marginTop\\":4}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":36,\\"height\\":36,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/diego.mello?format=png&size=36\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"marginLeft\\":46},{\\"marginLeft\\":10}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"justifyContent\\":\\"space-between\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"focusable\\":true,\\"style\\":{\\"flexShrink\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"lineHeight\\":22,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"diego.mello\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":12,\\"marginLeft\\":8,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"10 November 2017\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#2f343d\\"}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"Testing\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},[{},{\\"marginTop\\":0,\\"marginBottom\\":0,\\"flexWrap\\":\\"wrap\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"flex-start\\",\\"justifyContent\\":\\"flex-start\\"}]]},\\"children\\":[\\"Testing\\"]}]}]}]}]}]}]}]}]}]}"`;
 
diff --git a/storybook/stories/__snapshots__/RoomItem.storyshot b/storybook/stories/__snapshots__/RoomItem.storyshot
index 655f2427a..60a5d1c66 100644
--- a/storybook/stories/__snapshots__/RoomItem.storyshot
+++ b/storybook/stories/__snapshots__/RoomItem.storyshot
@@ -20,4 +20,4 @@ exports[`Storyshots Room Item Type 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"pr
 
 exports[`Storyshots Room Item User 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/diego.mello?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#cbced1\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"diego.mello\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#cbced1\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]}]}]}"`;
 
-exports[`Storyshots Room Item User status 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#2de0a5\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#2de0a5\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#ffd21f\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#ffd21f\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#f5455c\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#f5455c\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#cbced1\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#9ea2a8\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#9ea2a8\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#cbced1\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]}]}]}"`;
+exports[`Storyshots Room Item User status 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#2de0a5\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#2de0a5\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#ffd21f\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#ffd21f\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#f5455c\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#f5455c\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#cbced1\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#9ea2a8\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{\\"color\\":\\"#9ea2a8\\"}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":670,\\"width\\":750,\\"transform\\":[{\\"translateX\\":-80}],\\"backgroundColor\\":\\"#1d74f5\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"right\\":0},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"height\\":150},null],\\"pointerEvents\\":\\"box-none\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}],\\"backgroundColor\\":\\"#54585e\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"height\\":150,\\"justifyContent\\":\\"center\\",\\"top\\":0,\\"width\\":750,\\"transform\\":[{\\"translateX\\":750}]}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":28,\\"color\\":\\"#ffffff\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"transform\\":[{\\"translateX\\":0}]}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"paddingLeft\\":14,\\"height\\":150},false]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4},{\\"marginRight\\":10}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":48,\\"height\\":48,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=48\\",\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"paddingVertical\\":10,\\"paddingRight\\":14,\\"borderBottomWidth\\":0.5},{\\"borderColor\\":\\"#cbcbcc\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":\\"100%\\",\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{\\"flex\\":1}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#cbced1\\"},[{\\"width\\":22,\\"height\\":22,\\"textAlignVertical\\":\\"center\\"},[[{\\"marginRight\\":4},{\\"color\\":\\"#0d0e12\\"},{\\"marginRight\\":8}],{}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"fontSize\\":17,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"500\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"rocket.cat\\"]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"alignItems\\":\\"flex-end\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":13,\\"marginLeft\\":4,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"},null],\\"ellipsizeMode\\":\\"tail\\",\\"numberOfLines\\":1},\\"children\\":[\\"10:00\\"]}]}]}]}]}]}]}]}]}]}"`;