89 lines
2.2 KiB
TypeScript
89 lines
2.2 KiB
TypeScript
import type { FC } from '../../../lib/teact/teact';
|
|
import {
|
|
memo, useMemo, useState,
|
|
} from '../../../lib/teact/teact';
|
|
import { getActions, withGlobal } from '../../../global';
|
|
|
|
import type { ApiChat, ApiChatMember } from '../../../api/types';
|
|
|
|
import { filterPeersByQuery } from '../../../global/helpers/peers';
|
|
import { selectChatFullInfo } from '../../../global/selectors';
|
|
|
|
import useLang from '../../../hooks/useLang';
|
|
import useLastCallback from '../../../hooks/useLastCallback';
|
|
|
|
import ChatOrUserPicker from '../../common/pickers/ChatOrUserPicker';
|
|
|
|
export type OwnProps = {
|
|
chat: ApiChat;
|
|
isOpen: boolean;
|
|
onClose: NoneToVoidFunction;
|
|
};
|
|
|
|
type StateProps = {
|
|
currentUserId?: string;
|
|
chatMembers?: ApiChatMember[];
|
|
};
|
|
|
|
const RemoveGroupUserModal: FC<OwnProps & StateProps> = ({
|
|
chat,
|
|
currentUserId,
|
|
chatMembers,
|
|
isOpen,
|
|
onClose,
|
|
}) => {
|
|
const {
|
|
loadMoreMembers,
|
|
deleteChatMember,
|
|
} = getActions();
|
|
|
|
const lang = useLang();
|
|
const [search, setSearch] = useState('');
|
|
|
|
const usersId = useMemo(() => {
|
|
const availableMemberIds = (chatMembers || [])
|
|
.reduce((acc: string[], member) => {
|
|
if (!member.isAdmin && !member.isOwner && member.userId !== currentUserId) {
|
|
acc.push(member.userId);
|
|
}
|
|
return acc;
|
|
}, []);
|
|
|
|
return filterPeersByQuery({ ids: availableMemberIds, query: search, type: 'user' });
|
|
}, [chatMembers, currentUserId, search]);
|
|
|
|
const handleLoadMore = useLastCallback(() => {
|
|
loadMoreMembers({ chatId: chat.id });
|
|
});
|
|
|
|
const handleRemoveUser = useLastCallback((userId: string) => {
|
|
deleteChatMember({ chatId: chat.id, userId });
|
|
onClose();
|
|
});
|
|
|
|
return (
|
|
<ChatOrUserPicker
|
|
isOpen={isOpen}
|
|
chatOrUserIds={usersId}
|
|
title={lang('ChannelBlockUser')}
|
|
searchPlaceholder={lang('Search')}
|
|
search={search}
|
|
onSearchChange={setSearch}
|
|
loadMore={handleLoadMore}
|
|
onSelectChatOrUser={handleRemoveUser}
|
|
onClose={onClose}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default memo(withGlobal<OwnProps>(
|
|
(global, { chat }): Complete<StateProps> => {
|
|
const { currentUserId } = global;
|
|
|
|
return {
|
|
currentUserId,
|
|
chatMembers: selectChatFullInfo(global, chat.id)?.members,
|
|
};
|
|
},
|
|
)(RemoveGroupUserModal));
|