Differential D8058 Diff 27408 native/community-creation/community-creation-members.react.js

Changeset View

Standalone View

native/community-creation/community-creation-members.react.js

	Show All 13 Lines
	import CommunityCreationKeyserverLabel from './community-creation-keyserver-label.react.js';			import CommunityCreationKeyserverLabel from './community-creation-keyserver-label.react.js';
	import type { CommunityCreationNavigationProp } from './community-creation-navigator.react.js';			import type { CommunityCreationNavigationProp } from './community-creation-navigator.react.js';
	import RegistrationContainer from '../account/registration/registration-container.react.js';			import RegistrationContainer from '../account/registration/registration-container.react.js';
	import { createTagInput } from '../components/tag-input.react.js';			import { createTagInput } from '../components/tag-input.react.js';
	import UserList from '../components/user-list.react.js';			import UserList from '../components/user-list.react.js';
	import type { NavigationRoute } from '../navigation/route-names.js';			import type { NavigationRoute } from '../navigation/route-names.js';
	import { useSelector } from '../redux/redux-utils.js';			import { useSelector } from '../redux/redux-utils.js';

				export type CommunityCreationMembersScreenParams = {
				+announcement: boolean,
				};

	const TagInput = createTagInput<AccountUserInfo>();			const TagInput = createTagInput<AccountUserInfo>();
	const tagInputProps = {			const tagInputProps = {
	placeholder: 'username',			placeholder: 'username',
	autoFocus: true,			autoFocus: true,
	returnKeyType: 'go',			returnKeyType: 'go',
	};			};
	const tagDataLabelExtractor = (userInfo: AccountUserInfo) => userInfo.username;			const tagDataLabelExtractor = (userInfo: AccountUserInfo) => userInfo.username;

	type Props = {			type Props = {
	+navigation: CommunityCreationNavigationProp<'CommunityCreationMembers'>,			+navigation: CommunityCreationNavigationProp<'CommunityCreationMembers'>,
	+route: NavigationRoute<'CommunityCreationMembers'>,			+route: NavigationRoute<'CommunityCreationMembers'>,
	};			};

	// eslint-disable-next-line no-unused-vars
	function CommunityCreationMembers(props: Props): React.Node {			function CommunityCreationMembers(props: Props): React.Node {
				const { announcement } = props.route.params;

	const otherUserInfos = useSelector(userInfoSelectorForPotentialMembers);			const otherUserInfos = useSelector(userInfoSelectorForPotentialMembers);
	const userSearchIndex = useSelector(userSearchIndexForPotentialMembers);			const userSearchIndex = useSelector(userSearchIndexForPotentialMembers);

	const [usernameInputText, setUsernameInputText] = React.useState<string>('');			const [usernameInputText, setUsernameInputText] = React.useState<string>('');
	const [selectedUsers, setSelectedUsers] = React.useState<			const [selectedUsers, setSelectedUsers] = React.useState<
	$ReadOnlyArray<AccountUserInfo>,			$ReadOnlyArray<AccountUserInfo>,
	>([]);			>([]);

	const selectedUserIDs = React.useMemo(			const selectedUserIDs = React.useMemo(
	() => selectedUsers.map(userInfo => userInfo.id),			() => selectedUsers.map(userInfo => userInfo.id),
	[selectedUsers],			[selectedUsers],
	);			);

	const userSearchResults = React.useMemo(			const userSearchResults = React.useMemo(
	() =>			() =>
	getPotentialMemberItems(			getPotentialMemberItems(
	usernameInputText,			usernameInputText,
	otherUserInfos,			otherUserInfos,
	userSearchIndex,			userSearchIndex,
	selectedUserIDs,			selectedUserIDs,
	null,			null,
	null,			null,
	threadTypes.COMMUNITY_ROOT,			announcement
				? threadTypes.COMMUNITY_ANNOUNCEMENT_ROOT
				: threadTypes.COMMUNITY_ROOT,
	),			),
	[otherUserInfos, selectedUserIDs, userSearchIndex, usernameInputText],			[
				announcement,
				otherUserInfos,
				selectedUserIDs,
				userSearchIndex,
				usernameInputText,
				],
	);			);

	const onSelectUser = React.useCallback(			const onSelectUser = React.useCallback(
	userID => {			userID => {
	if (selectedUserIDs.some(existingUserID => userID === existingUserID)) {			if (selectedUserIDs.some(existingUserID => userID === existingUserID)) {
	return;			return;
	}			}
	setSelectedUsers(oldUserInfoInputArray => [			setSelectedUsers(oldUserInfoInputArray => [
	Show All 30 Lines