From 9473bf4024d5f0f5c163dda03460f8e42dd6c91b Mon Sep 17 00:00:00 2001
From: Gerzon Z <gerzonzcanario@gmail.com>
Date: Fri, 17 Sep 2021 15:55:06 -0400
Subject: [PATCH] Minor tweaks

---
 app/containers/ThreadDetails.tsx     | 12 ++++++++++--
 app/containers/markdown/index.tsx    | 12 ++++++------
 app/views/DiscussionsView/index.tsx  |  2 ++
 app/views/ThreadMessagesView/Item.js | 22 ++++++++++++++++------
 4 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/app/containers/ThreadDetails.tsx b/app/containers/ThreadDetails.tsx
index 054d7595d..76a9f23e1 100644
--- a/app/containers/ThreadDetails.tsx
+++ b/app/containers/ThreadDetails.tsx
@@ -53,11 +53,12 @@ interface IThreadDetails {
 	badgeColor: string;
 	toggleFollowThread: Function;
 	thread: boolean;
+	time: string;
 	style: object;
 	theme: string;
 }
 
-const ThreadDetails = ({ item, user, badgeColor, toggleFollowThread, thread, style, theme }: IThreadDetails) => {
+const ThreadDetails = ({ item, user, badgeColor, toggleFollowThread, thread, time, style, theme }: IThreadDetails) => {
 	let { tcount, dcount } = item;
 	if (thread) {
 		if (tcount! >= 1000) {
@@ -99,7 +100,14 @@ const ThreadDetails = ({ item, user, badgeColor, toggleFollowThread, thread, sty
 							{replies}
 						</Text>
 					</View>
-				) : null}
+				) : (
+					<View style={styles.detailContainer}>
+						<CustomIcon name='clock' size={24} color={themes[theme].auxiliaryText} />
+						<Text style={[styles.detailText, { color: themes[theme].auxiliaryText }]} numberOfLines={1}>
+							{time}
+						</Text>
+					</View>
+				)}
 			</View>
 
 			{thread ? (
diff --git a/app/containers/markdown/index.tsx b/app/containers/markdown/index.tsx
index 0aec122ff..2055e3e12 100644
--- a/app/containers/markdown/index.tsx
+++ b/app/containers/markdown/index.tsx
@@ -28,20 +28,20 @@ interface IMarkdownProps {
 	username: string;
 	tmid?: string;
 	isEdited?: boolean;
-	numberOfLines?: number;
+	numberOfLines: number;
 	customEmojis?: boolean;
-	useRealName?: boolean;
-	channels?: {
+	useRealName: boolean;
+	channels: {
 		name: string;
 		_id: number;
 	}[];
 	mentions?: object[];
-	navToRoomInfo?: Function;
+	navToRoomInfo: Function;
 	preview?: boolean;
-	theme?: string;
+	theme: string;
 	testID?: string;
 	style?: any;
-	onLinkPress?: Function;
+	onLinkPress: Function;
 }
 
 type TLiteral = {
diff --git a/app/views/DiscussionsView/index.tsx b/app/views/DiscussionsView/index.tsx
index 96835a421..118890c07 100644
--- a/app/views/DiscussionsView/index.tsx
+++ b/app/views/DiscussionsView/index.tsx
@@ -63,6 +63,7 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): JSX.Elem
 	const user = useSelector((state: IState) => state.login?.user);
 	const baseUrl = useSelector((state: IState) => state.server?.server);
 	const useRealName = useSelector((state: IState) => state.settings?.UI_Use_Real_Name);
+	const timeFormat = useSelector((state: IState) => state.settings?.Message_TimeFormat);
 	const isMasterDetail = useSelector((state: IState) => state.app?.isMasterDetail);
 
 	const [loading, setLoading] = useState(false);
@@ -199,6 +200,7 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): JSX.Elem
 				baseUrl,
 				useRealName
 			}}
+			timeFormat={timeFormat}
 			onPress={onDiscussionPress}
 		/>
 	);
diff --git a/app/views/ThreadMessagesView/Item.js b/app/views/ThreadMessagesView/Item.js
index f10abe272..b04ec2e31 100644
--- a/app/views/ThreadMessagesView/Item.js
+++ b/app/views/ThreadMessagesView/Item.js
@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { StyleSheet, Text, View } from 'react-native';
 import Touchable from 'react-native-platform-touchable';
+import moment from 'moment';
 
 import { withTheme } from '../../theme';
 import Avatar from '../../containers/Avatar';
@@ -25,6 +26,11 @@ const styles = StyleSheet.create({
 		marginBottom: 2,
 		alignItems: 'center'
 	},
+	discussionTitleContainer: {
+		flexDirection: 'row',
+		marginBottom: 2,
+		justifyContent: 'space-between'
+	},
 	title: {
 		flexShrink: 1,
 		fontSize: 18,
@@ -56,11 +62,13 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, toggleFollowThread, thread }) => {
+const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, toggleFollowThread, timeFormat, thread }) => {
 	const username = (useRealName && item?.u?.name) || item?.u?.username;
-	let time;
+	let date;
+	let hour;
 	if (item?.ts) {
-		time = formatDateThreads(item.ts);
+		date = formatDateThreads(item.ts);
+		hour = moment(item.ts).format(timeFormat);
 	}
 
 	return (
@@ -71,11 +79,11 @@ const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, to
 			<View style={styles.container}>
 				<Avatar style={styles.avatar} text={item?.u?.username} size={36} borderRadius={4} user={user} theme={theme} />
 				<View style={styles.contentContainer}>
-					<View style={styles.titleContainer}>
+					<View style={thread ? styles.titleContainer : styles.discussionTitleContainer}>
 						<Text style={[styles.title, { color: themes[theme].titleText }]} numberOfLines={1}>
 							{username}
 						</Text>
-						<Text style={[styles.time, { color: themes[theme].auxiliaryText }]}>{time}</Text>
+						<Text style={[styles.time, { color: themes[theme].auxiliaryText }]}>{thread ? date : hour}</Text>
 					</View>
 					<View style={styles.messageContainer}>
 						<Markdown
@@ -92,6 +100,7 @@ const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, to
 					<ThreadDetails
 						item={item}
 						user={user}
+						time={date}
 						toggleFollowThread={toggleFollowThread}
 						thread={thread}
 						style={styles.threadDetails}
@@ -111,7 +120,8 @@ Item.propTypes = {
 	badgeColor: PropTypes.string,
 	onPress: PropTypes.func,
 	toggleFollowThread: PropTypes.func,
-	thread: PropTypes.bool
+	thread: PropTypes.bool,
+	timeFormat: PropTypes.string
 };
 
 export default withTheme(Item);