Minor tweaks
This commit is contained in:
parent
88dbf345ea
commit
9473bf4024
|
@ -53,11 +53,12 @@ interface IThreadDetails {
|
||||||
badgeColor: string;
|
badgeColor: string;
|
||||||
toggleFollowThread: Function;
|
toggleFollowThread: Function;
|
||||||
thread: boolean;
|
thread: boolean;
|
||||||
|
time: string;
|
||||||
style: object;
|
style: object;
|
||||||
theme: string;
|
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;
|
let { tcount, dcount } = item;
|
||||||
if (thread) {
|
if (thread) {
|
||||||
if (tcount! >= 1000) {
|
if (tcount! >= 1000) {
|
||||||
|
@ -99,7 +100,14 @@ const ThreadDetails = ({ item, user, badgeColor, toggleFollowThread, thread, sty
|
||||||
{replies}
|
{replies}
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</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>
|
</View>
|
||||||
|
|
||||||
{thread ? (
|
{thread ? (
|
||||||
|
|
|
@ -28,20 +28,20 @@ interface IMarkdownProps {
|
||||||
username: string;
|
username: string;
|
||||||
tmid?: string;
|
tmid?: string;
|
||||||
isEdited?: boolean;
|
isEdited?: boolean;
|
||||||
numberOfLines?: number;
|
numberOfLines: number;
|
||||||
customEmojis?: boolean;
|
customEmojis?: boolean;
|
||||||
useRealName?: boolean;
|
useRealName: boolean;
|
||||||
channels?: {
|
channels: {
|
||||||
name: string;
|
name: string;
|
||||||
_id: number;
|
_id: number;
|
||||||
}[];
|
}[];
|
||||||
mentions?: object[];
|
mentions?: object[];
|
||||||
navToRoomInfo?: Function;
|
navToRoomInfo: Function;
|
||||||
preview?: boolean;
|
preview?: boolean;
|
||||||
theme?: string;
|
theme: string;
|
||||||
testID?: string;
|
testID?: string;
|
||||||
style?: any;
|
style?: any;
|
||||||
onLinkPress?: Function;
|
onLinkPress: Function;
|
||||||
}
|
}
|
||||||
|
|
||||||
type TLiteral = {
|
type TLiteral = {
|
||||||
|
|
|
@ -63,6 +63,7 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): JSX.Elem
|
||||||
const user = useSelector((state: IState) => state.login?.user);
|
const user = useSelector((state: IState) => state.login?.user);
|
||||||
const baseUrl = useSelector((state: IState) => state.server?.server);
|
const baseUrl = useSelector((state: IState) => state.server?.server);
|
||||||
const useRealName = useSelector((state: IState) => state.settings?.UI_Use_Real_Name);
|
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 isMasterDetail = useSelector((state: IState) => state.app?.isMasterDetail);
|
||||||
|
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
|
@ -199,6 +200,7 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): JSX.Elem
|
||||||
baseUrl,
|
baseUrl,
|
||||||
useRealName
|
useRealName
|
||||||
}}
|
}}
|
||||||
|
timeFormat={timeFormat}
|
||||||
onPress={onDiscussionPress}
|
onPress={onDiscussionPress}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|
|
@ -2,6 +2,7 @@ import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { StyleSheet, Text, View } from 'react-native';
|
import { StyleSheet, Text, View } from 'react-native';
|
||||||
import Touchable from 'react-native-platform-touchable';
|
import Touchable from 'react-native-platform-touchable';
|
||||||
|
import moment from 'moment';
|
||||||
|
|
||||||
import { withTheme } from '../../theme';
|
import { withTheme } from '../../theme';
|
||||||
import Avatar from '../../containers/Avatar';
|
import Avatar from '../../containers/Avatar';
|
||||||
|
@ -25,6 +26,11 @@ const styles = StyleSheet.create({
|
||||||
marginBottom: 2,
|
marginBottom: 2,
|
||||||
alignItems: 'center'
|
alignItems: 'center'
|
||||||
},
|
},
|
||||||
|
discussionTitleContainer: {
|
||||||
|
flexDirection: 'row',
|
||||||
|
marginBottom: 2,
|
||||||
|
justifyContent: 'space-between'
|
||||||
|
},
|
||||||
title: {
|
title: {
|
||||||
flexShrink: 1,
|
flexShrink: 1,
|
||||||
fontSize: 18,
|
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;
|
const username = (useRealName && item?.u?.name) || item?.u?.username;
|
||||||
let time;
|
let date;
|
||||||
|
let hour;
|
||||||
if (item?.ts) {
|
if (item?.ts) {
|
||||||
time = formatDateThreads(item.ts);
|
date = formatDateThreads(item.ts);
|
||||||
|
hour = moment(item.ts).format(timeFormat);
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -71,11 +79,11 @@ const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, to
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
<Avatar style={styles.avatar} text={item?.u?.username} size={36} borderRadius={4} user={user} theme={theme} />
|
<Avatar style={styles.avatar} text={item?.u?.username} size={36} borderRadius={4} user={user} theme={theme} />
|
||||||
<View style={styles.contentContainer}>
|
<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}>
|
<Text style={[styles.title, { color: themes[theme].titleText }]} numberOfLines={1}>
|
||||||
{username}
|
{username}
|
||||||
</Text>
|
</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>
|
||||||
<View style={styles.messageContainer}>
|
<View style={styles.messageContainer}>
|
||||||
<Markdown
|
<Markdown
|
||||||
|
@ -92,6 +100,7 @@ const Item = ({ item, baseUrl, theme, useRealName, user, badgeColor, onPress, to
|
||||||
<ThreadDetails
|
<ThreadDetails
|
||||||
item={item}
|
item={item}
|
||||||
user={user}
|
user={user}
|
||||||
|
time={date}
|
||||||
toggleFollowThread={toggleFollowThread}
|
toggleFollowThread={toggleFollowThread}
|
||||||
thread={thread}
|
thread={thread}
|
||||||
style={styles.threadDetails}
|
style={styles.threadDetails}
|
||||||
|
@ -111,7 +120,8 @@ Item.propTypes = {
|
||||||
badgeColor: PropTypes.string,
|
badgeColor: PropTypes.string,
|
||||||
onPress: PropTypes.func,
|
onPress: PropTypes.func,
|
||||||
toggleFollowThread: PropTypes.func,
|
toggleFollowThread: PropTypes.func,
|
||||||
thread: PropTypes.bool
|
thread: PropTypes.bool,
|
||||||
|
timeFormat: PropTypes.string
|
||||||
};
|
};
|
||||||
|
|
||||||
export default withTheme(Item);
|
export default withTheme(Item);
|
||||||
|
|
Loading…
Reference in New Issue