Rocket.Chat.ReactNative/app/views/ForwardMessageView/SelectPersonOrChannel.tsx

77 lines
2.0 KiB
TypeScript

import React, { useEffect, useState } from 'react';
import { Text, View } from 'react-native';
import { BlockContext } from '@rocket.chat/ui-kit';
import { getAvatarURL } from '../../lib/methods/helpers/getAvatarUrl';
import I18n from '../../i18n';
import { MultiSelect } from '../../containers/UIKit/MultiSelect';
import styles from './styles';
import { IForwardMessageViewSelectRoom } from './interfaces';
import { ISearchLocal } from '../../definitions';
import { localSearchSubscription } from '../../lib/methods';
import { getRoomAvatar, getRoomTitle } from '../../lib/methods/helpers';
import { useTheme } from '../../theme';
const SelectPersonOrChannel = ({
server,
token,
userId,
onRoomSelect,
blockUnauthenticatedAccess,
serverVersion
}: IForwardMessageViewSelectRoom): React.ReactElement => {
const [rooms, setRooms] = useState<ISearchLocal[]>([]);
const { colors } = useTheme();
const getRooms = async (keyword = '') => {
try {
const res = await localSearchSubscription({ text: keyword, filterMessagingAllowed: true });
setRooms(res);
return res.map(item => ({
value: item.rid,
text: { text: getRoomTitle(item) },
imageUrl: getAvatar(item)
}));
} catch {
// do nothing
}
};
useEffect(() => {
getRooms('');
}, []);
const getAvatar = (item: ISearchLocal) =>
getAvatarURL({
text: getRoomAvatar(item),
type: item.t,
userId,
token,
server,
avatarETag: item.avatarETag,
rid: item.rid,
blockUnauthenticatedAccess,
serverVersion
});
return (
<View style={styles.inputContainer}>
<Text style={[styles.label, { color: colors.bodyText }]}>{I18n.t('Person_or_channel')}</Text>
<MultiSelect
onSearch={getRooms}
onChange={onRoomSelect}
options={rooms.map(room => ({
value: room.rid,
text: { text: getRoomTitle(room) },
imageUrl: getAvatar(room)
}))}
placeholder={{ text: `${I18n.t('Select')}` }}
context={BlockContext.FORM}
multiselect
/>
</View>
);
};
export default SelectPersonOrChannel;