Differential D5722 Diff 18951 web/chat/mention-suggestion-tooltip.react.js

Changeset View

Standalone View

web/chat/mention-suggestion-tooltip.react.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';

	import SearchIndex from 'lib/shared/search-index';			import SearchIndex from 'lib/shared/search-index';
	import { threadOtherMembers } from 'lib/shared/thread-utils';			import { threadOtherMembers } from 'lib/shared/thread-utils';
	import type { RelativeMemberInfo } from 'lib/types/thread-types';			import type { RelativeMemberInfo } from 'lib/types/thread-types';

	import Button from '../components/button.react';			import Button from '../components/button.react';
	import type { InputState } from '../input/input-state';			import type { InputState } from '../input/input-state';
				import { type TypeaheadMatchedStrings } from './chat-input-bar.react';
	import css from './mention-suggestion-tooltip.css';			import css from './mention-suggestion-tooltip.css';
	import {			import {
	getTypeaheadTooltipActions,			getTypeaheadTooltipActions,
	getTypeaheadTooltipPosition,			getTypeaheadTooltipPosition,
	getTypeaheadUserSuggestions,			getTypeaheadUserSuggestions,
	} from './mention-utils';			} from './mention-utils';

	export type MentionSuggestionTooltipProps = {			export type MentionSuggestionTooltipProps = {
	+inputState: InputState,			+inputState: InputState,
	+textarea: HTMLTextAreaElement,			+textarea: HTMLTextAreaElement,
	+userSearchIndex: SearchIndex,			+userSearchIndex: SearchIndex,
	+threadMembers: $ReadOnlyArray<RelativeMemberInfo>,			+threadMembers: $ReadOnlyArray<RelativeMemberInfo>,
	+viewerID: ?string,			+viewerID: ?string,
	+matchedText: string,			+matchedStrings: TypeaheadMatchedStrings,
	+matchedTextBeforeAtSymbol: string,
	+matchedUsernamePrefix: string,
	};			};

	function MentionSuggestionTooltip(			function MentionSuggestionTooltip(
	props: MentionSuggestionTooltipProps,			props: MentionSuggestionTooltipProps,
	): React.Node {			): React.Node {
	const {			const {
	inputState,			inputState,
	textarea,			textarea,
	userSearchIndex,			userSearchIndex,
	threadMembers,			threadMembers,
	viewerID,			viewerID,
	matchedText,			matchedStrings,
	matchedTextBeforeAtSymbol,
	matchedUsernamePrefix,
	} = props;			} = props;

				const {
				entireText: matchedText,
				textBeforeAtSymbol: matchedTextBeforeAtSymbol,
				usernamePrefix: matchedUsernamePrefix,
				} = matchedStrings;

	const typedPrefix = matchedUsernamePrefix ?? '';			const typedPrefix = matchedUsernamePrefix ?? '';

	const suggestedUsers = React.useMemo(			const suggestedUsers = React.useMemo(
	() =>			() =>
	getTypeaheadUserSuggestions(			getTypeaheadUserSuggestions(
	userSearchIndex,			userSearchIndex,
	threadOtherMembers(threadMembers, viewerID),			threadOtherMembers(threadMembers, viewerID),
	typedPrefix,			typedPrefix,
	▲ Show 20 Lines • Show All 60 Lines • Show Last 20 Lines