snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/views/teams/contextualBar/TeamAutocomplete/TeamAutocomplete.tsx

@@ -0,0 +1,50 @@
+import { AutoComplete, Option, Box } from '@rocket.chat/fuselage';
+import { RoomAvatar } from '@rocket.chat/ui-avatar';
+import { useEndpoint } from '@rocket.chat/ui-contexts';
+import { useQuery } from '@tanstack/react-query';
+import type { ComponentProps } from 'react';
+import { memo, useMemo, useState } from 'react';
+
+export type TeamAutocompleteProps = Omit<ComponentProps<typeof AutoComplete>, 'filter'>;
+
+const TeamAutocomplete = ({ value, onChange, ...props }: TeamAutocompleteProps) => {
+	const [filter, setFilter] = useState('');
+
+	const teamsAutoCompleteEndpoint = useEndpoint('GET', '/v1/teams.autocomplete');
+	const { data, isSuccess } = useQuery({
+		queryKey: ['teamsAutoComplete', filter],
+		queryFn: async () => teamsAutoCompleteEndpoint({ name: filter }),
+	});
+
+	const options = useMemo(
+		() =>
+			isSuccess
+				? data?.teams.map(({ name, teamId, _id, avatarETag, t }) => ({
+						value: teamId as string,
+						label: { name, avatarETag, type: t, _id },
+					}))
+				: [],
+		[data, isSuccess],
+	);
+
+	return (
+		<AutoComplete
+			{...props}
+			value={value}
+			onChange={onChange}
+			filter={filter}
+			setFilter={setFilter}
+			renderSelected={({ selected: { value, label: room } }) => (
+				<Box value={value}>
+					<RoomAvatar size='x20' room={room} /> {room.name}
+				</Box>
+			)}
+			renderItem={({ value, label: room, ...props }) => (
+				<Option key={value} {...props} label={room.name} avatar={<RoomAvatar size='x20' room={room} />} />
+			)}
+			options={options}
+		/>
+	);
+};
+
+export default memo(TeamAutocomplete);

apps/meteor/client/views/teams/contextualBar/TeamAutocomplete/index.ts

@@ -0,0 +1 @@
+export { default } from './TeamAutocomplete';