Differential D4115 Diff 13081 native/chat/inline-engagement.react.js

Changeset View

Standalone View

native/chat/inline-engagement.react.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { Text, View } from 'react-native';			import { Text, View } from 'react-native';

	import useInlineEngagementText from 'lib/hooks/inline-engagement-text.react';			import useInlineEngagementText from 'lib/hooks/inline-engagement-text.react';
	import type { ThreadInfo } from 'lib/types/thread-types';			import type { ThreadInfo } from 'lib/types/thread-types';

	import Button from '../components/button.react';			import Button from '../components/button.react';
				import SWMansionIcon from '../components/swmansion-icon.react';
	import { useStyles } from '../themes/colors';			import { useStyles } from '../themes/colors';
	import { inlineSidebarHeight } from './chat-constants';			import { inlineSidebarHeight } from './chat-constants';
	import { useNavigateToThread } from './message-list-types';			import { useNavigateToThread } from './message-list-types';

	type Props = {			type Props = {
	+threadInfo: ThreadInfo,			+threadInfo: ThreadInfo,
	+position: 'left' \| 'right',			+position: 'left' \| 'right',
	};			};
	function InlineEngagement(props: Props): React.Node {			function InlineEngagement(props: Props): React.Node {
	const { threadInfo, position } = props;			const { threadInfo, position } = props;
	const { repliesText } = useInlineEngagementText(threadInfo);			const { repliesText } = useInlineEngagementText(threadInfo);

	const navigateToThread = useNavigateToThread();			const navigateToThread = useNavigateToThread();
	const onPress = React.useCallback(() => {			const onPress = React.useCallback(() => {
	navigateToThread({ threadInfo });			navigateToThread({ threadInfo });
	}, [navigateToThread, threadInfo]);			}, [navigateToThread, threadInfo]);

	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	const unreadStyle = threadInfo.currentUser.unread ? styles.unread : null;			const unreadStyle = threadInfo.currentUser.unread ? styles.unread : null;
	const contentStyles = [styles.content, styles[position]];			const contentStyles = [styles.content, styles[position]];

	return (			return (
	<View style={contentStyles}>			<View style={contentStyles}>
	<Button style={styles.sidebar} onPress={onPress}>			<Button style={styles.sidebar} onPress={onPress}>
				<SWMansionIcon size={14} color="white" name="sidebar-filled" />
	<Text style={[styles.name, unreadStyle]}>{repliesText}</Text>			<Text style={[styles.name, unreadStyle]}>{repliesText}</Text>
	</Button>			</Button>
	</View>			</View>
	);			);
	}			}

	const unboundStyles = {			const unboundStyles = {
	content: {			content: {
	Show All 36 Lines