Differential D7924 Diff 26810 native/navigation/community-drawer-content.react.js

Changeset View

Standalone View

native/navigation/community-drawer-content.react.js

// @flow		// @flow

import * as React from 'react';		import * as React from 'react';
import { FlatList, Platform } from 'react-native';		import { FlatList, Platform, View, Text } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';		import { SafeAreaView } from 'react-native-safe-area-context';
import { useSelector } from 'react-redux';		import { useSelector } from 'react-redux';

import {		import {
childThreadInfos,		childThreadInfos,
communityThreadSelector,		communityThreadSelector,
} from 'lib/selectors/thread-selectors.js';		} from 'lib/selectors/thread-selectors.js';
import {		import {
createRecursiveDrawerItemsData,		createRecursiveDrawerItemsData,
appendSuffix,		appendSuffix,
} from 'lib/utils/drawer-utils.react.js';		} from 'lib/utils/drawer-utils.react.js';
import { useResolvedThreadInfos } from 'lib/utils/entity-helpers.js';		import { useResolvedThreadInfos } from 'lib/utils/entity-helpers.js';

import CommunityDrawerItemCommunity from './community-drawer-item-community.react.js';		import CommunityDrawerItemCommunity from './community-drawer-item-community.react.js';
import { useNavigateToThread } from '../chat/message-list-types.js';		import { useNavigateToThread } from '../chat/message-list-types.js';
		import SWMansionIcon from '../components/swmansion-icon.react.js';
import { useStyles } from '../themes/colors.js';		import { useStyles } from '../themes/colors.js';

const maxDepth = 2;		const maxDepth = 2;
const safeAreaEdges = Platform.select({		const safeAreaEdges = Platform.select({
ios: ['top'],		ios: ['top'],
default: ['top', 'bottom'],		default: ['top', 'bottom'],
});		});

▲ Show 20 Lines • Show All 46 Lines • ▼ Show 20 Lines	() =>
childThreadInfosMap,		childThreadInfosMap,
communitiesSuffixed,		communitiesSuffixed,
labelStyles,		labelStyles,
maxDepth,		maxDepth,
),		),
[childThreadInfosMap, communitiesSuffixed, labelStyles],		[childThreadInfosMap, communitiesSuffixed, labelStyles],
);		);

		const isCommunityCreationButtonEnabled = false;
		let communityCreationButton;
		if (isCommunityCreationButtonEnabled) {
		communityCreationButton = (
		<View style={styles.communityCreationContainer}>
		<View style={styles.communityCreationIconContainer}>
		<SWMansionIcon
		name="plus"
		size={22}
		style={styles.communityCreationIcon}
		/>
		</View>
		<Text style={styles.communityCreationText}>Create community</Text>
		</View>
		);
		}

return (		return (
<SafeAreaView style={styles.drawerContent} edges={safeAreaEdges}>		<SafeAreaView style={styles.drawerContent} edges={safeAreaEdges}>
<FlatList data={drawerItemsData} renderItem={renderItem} />		<FlatList data={drawerItemsData} renderItem={renderItem} />
		{communityCreationButton}
</SafeAreaView>		</SafeAreaView>
);		);
}		}

const unboundStyles = {		const unboundStyles = {
drawerContent: {		drawerContent: {
flex: 1,		flex: 1,
paddingRight: 8,		paddingRight: 8,
paddingTop: 8,		paddingTop: 8,
backgroundColor: 'drawerBackground',		paddingBottom: 8,
		},
		communityCreationContainer: {
		flexDirection: 'row',
		padding: 24,
		alignItems: 'center',
		borderTopWidth: 1,
		borderColor: 'panelSeparator',
		},
		communityCreationText: {
		color: 'panelForegroundLabel',
		fontSize: 16,
		lineHeight: 24,
		fontWeight: '500',
		},
		communityCreationIconContainer: {
		height: 28,
		width: 28,
		justifyContent: 'center',
		alignItems: 'center',
		borderRadius: 16,
		marginRight: 12,
		backgroundColor: 'panelSecondaryForeground',
		},
		communityCreationIcon: {
		color: 'panelForegroundLabel',
},		},
};		};
const labelUnboundStyles = {		const labelUnboundStyles = {
level0Label: {		level0Label: {
color: 'drawerItemLabelLevel0',		color: 'drawerItemLabelLevel0',
fontSize: 16,		fontSize: 16,
lineHeight: 24,		lineHeight: 24,
fontWeight: '500',		fontWeight: '500',
Show All 20 Lines