[IMPROVE] Place time after username on message (#4177)

app/containers/message/Reply.tsx

@@ -11,12 +11,12 @@ import sharedStyles from '../../views/Styles';
 import { themes } from '../../lib/constants';
 import MessageContext from './Context';
 import { fileDownloadAndPreview } from '../../utils/fileDownload';
-import { IAttachment } from '../../definitions/IAttachment';
-import { TGetCustomEmoji } from '../../definitions/IEmoji';
+import { IAttachment, TGetCustomEmoji } from '../../definitions';
 import RCActivityIndicator from '../ActivityIndicator';
 import Attachments from './Attachments';
 import { TSupportedThemes, useTheme } from '../../theme';
 import { formatAttachmentUrl } from '../../lib/methods/helpers/formatAttachmentUrl';
+import messageStyles from './styles';
 
 const styles = StyleSheet.create({
 	button: {
@@ -44,15 +44,9 @@ const styles = StyleSheet.create({
 		marginBottom: 8
 	},
 	author: {
-		flex: 1,
 		fontSize: 16,
 		...sharedStyles.textMedium
 	},
-	time: {
-		fontSize: 12,
-		marginLeft: 8,
-		...sharedStyles.textRegular
-	},
 	fieldsContainer: {
 		flex: 1,
 		flexWrap: 'wrap',
@@ -106,8 +100,8 @@ const Title = React.memo(
 				{attachment.author_name ? (
 					<Text style={[styles.author, { color: themes[theme].auxiliaryTintColor }]}>{attachment.author_name}</Text>
 				) : null}
+				{time ? <Text style={[messageStyles.time, { color: themes[theme].auxiliaryTintColor }]}>{time}</Text> : null}
 				{attachment.title ? <Text style={[styles.title, { color: themes[theme].bodyText }]}>{attachment.title}</Text> : null}
-				{time ? <Text style={[styles.time, { color: themes[theme].auxiliaryTintColor }]}>{time}</Text> : null}
 			</View>
 		);
 	}

app/containers/message/User.tsx

@@ -106,9 +106,9 @@ const User = React.memo(
 						<Text style={[styles.username, { color: themes[theme].titleText }]} numberOfLines={1}>
 							{textContent}
 						</Text>
+						<Text style={[messageStyles.time, { color: themes[theme].auxiliaryTintColor, lineHeight: 22 }]}>{time}</Text>
 					</TouchableOpacity>
 					<View style={styles.actionIcons}>
-						<Text style={[messageStyles.time, { color: themes[theme].auxiliaryTintColor }]}>{time}</Text>
 						<Encrypted type={type} />
 						<Edited isEdited={isEdited} />
 						<MessageError hasError={hasError} {...props} />

app/views/RoomView/Separator.tsx

@@ -23,9 +23,6 @@ const styles = StyleSheet.create({
 		fontSize: 14,
 		...sharedStyles.textMedium
 	},
-	marginLeft: {
-		marginLeft: 14
-	},
 	marginRight: {
 		marginRight: 14
 	},
@@ -52,7 +49,8 @@ const DateSeparator = ({ ts, unread }: { ts: Date | string | null; unread: boole
 		return (
 			<View style={styles.container}>
 				<View style={[styles.line, { backgroundColor: themes[theme].borderColor }]} />
-				<Text style={[styles.text, { color: themes[theme].auxiliaryText }, styles.marginLeft]}>{date}</Text>
+				<Text style={[styles.text, { color: themes[theme].auxiliaryText }, styles.marginHorizontal]}>{date}</Text>
+				<View style={[styles.line, { backgroundColor: themes[theme].borderColor }]} />
 			</View>
 		);
 	}

ios/Podfile.lock

@@ -960,7 +960,7 @@ SPEC CHECKSUMS:
   EXVideoThumbnails: 442c3abadb51a81551a3b53705b7560de390e6f7
   EXWebBrowser: 76783ba5dcb8699237746ecf41a9643d428a4cc5
   FBLazyVector: c9b6dfcde9b3d497793c40d4ccbfbfb05092e0df
-  FBReactNativeSpec: c39f7fc0cd6cc64f0a2a5beffc64b1aa5d42740e
+  FBReactNativeSpec: addc4f0e6ab00dc628fe91de8bfca4601762673a
   Firebase: 919186c8e119dd9372a45fd1dd17a8a942bc1892
   FirebaseAnalytics: 5fa308e1b13f838d0f6dc74719ac2a72e8c5afc4
   FirebaseCore: 8cd4f8ea22075e0ee582849b1cf79d8816506085