Rocket.Chat.ReactNative/app/views/ShareView/Header.tsx

98 lines
2.2 KiB
TypeScript

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import I18n from '../../i18n';
import { CustomIcon, TIconsName } from '../../containers/CustomIcon';
import { themes } from '../../lib/constants';
import { useTheme } from '../../theme';
import sharedStyles from '../Styles';
import { makeThreadName } from '../../lib/methods/helpers/room';
import { ISubscription, TThreadModel } from '../../definitions';
import { getRoomTitle, isGroupChat, isAndroid, isTablet } from '../../lib/methods/helpers';
const androidMarginLeft = isTablet ? 0 : 4;
const styles = StyleSheet.create({
container: {
flex: 1,
marginRight: isAndroid ? 15 : 5,
marginLeft: isAndroid ? androidMarginLeft : -10,
justifyContent: 'center'
},
inner: {
alignItems: 'center',
flexDirection: 'row',
flex: 1
},
text: {
fontSize: 16,
...sharedStyles.textRegular,
marginRight: 4
},
name: {
...sharedStyles.textSemibold
}
});
interface IHeader {
room: ISubscription;
thread: TThreadModel;
}
const Header = React.memo(({ room, thread }: IHeader) => {
const { theme } = useTheme();
let type;
if (thread?.id) {
type = 'thread';
} else if (room?.prid) {
type = 'discussion';
} else {
type = room?.t;
}
let icon: TIconsName;
if (type === 'discussion') {
icon = 'discussions';
} else if (type === 'thread') {
icon = 'threads';
} else if (type === 'c') {
icon = 'channel-public';
} else if (type === 'l') {
icon = 'omnichannel';
} else if (type === 'd') {
if (isGroupChat(room)) {
icon = 'team';
} else {
icon = 'mention';
}
} else {
icon = 'channel-private';
}
const textColor = themes[theme].previewTintColor;
let title;
if (thread?.id) {
title = makeThreadName(thread);
} else {
title = getRoomTitle(room);
}
return (
<View style={styles.container}>
<View style={styles.inner}>
<Text numberOfLines={1} style={styles.text}>
<Text style={[styles.text, { color: textColor }]} numberOfLines={1}>
{I18n.t('Sending_to')}{' '}
</Text>
<CustomIcon name={icon} size={16} color={textColor} />
<Text style={[styles.name, { color: textColor }]} numberOfLines={1}>
{title}
</Text>
</Text>
</View>
</View>
);
});
export default Header;