94 lines
2.5 KiB
TypeScript
94 lines
2.5 KiB
TypeScript
import React, {
|
|
FC, useMemo, useState, memo, useRef, useCallback,
|
|
} from '../../../lib/teact/teact';
|
|
import { withGlobal } from '../../../lib/teact/teactn';
|
|
|
|
import { GlobalActions } from '../../../global/types';
|
|
import { ApiChat, ApiUser } from '../../../api/types';
|
|
|
|
import { getUserFullName } from '../../../modules/helpers';
|
|
import searchWords from '../../../util/searchWords';
|
|
import { pick } from '../../../util/iteratees';
|
|
import useLang from '../../../hooks/useLang';
|
|
|
|
import ChatOrUserPicker from '../../common/ChatOrUserPicker';
|
|
|
|
export type OwnProps = {
|
|
chat: ApiChat;
|
|
isOpen: boolean;
|
|
onClose: NoneToVoidFunction;
|
|
};
|
|
|
|
type StateProps = {
|
|
usersById: Record<number, ApiUser>;
|
|
currentUserId?: number;
|
|
};
|
|
|
|
type DispatchProps = Pick<GlobalActions, 'loadMoreMembers' | 'deleteChatMember'>;
|
|
|
|
const RemoveGroupUserModal: FC<OwnProps & StateProps & DispatchProps> = ({
|
|
chat,
|
|
usersById,
|
|
currentUserId,
|
|
isOpen,
|
|
onClose,
|
|
loadMoreMembers,
|
|
deleteChatMember,
|
|
}) => {
|
|
const lang = useLang();
|
|
const [filter, setFilter] = useState('');
|
|
// eslint-disable-next-line no-null/no-null
|
|
const filterRef = useRef<HTMLInputElement>(null);
|
|
|
|
const usersId = useMemo(() => {
|
|
const availableMembers = (chat.fullInfo?.members || []).filter((member) => {
|
|
return !member.isAdmin && !member.isOwner && member.userId !== currentUserId;
|
|
});
|
|
|
|
return availableMembers.reduce((acc, member) => {
|
|
if (
|
|
!filter
|
|
|| !usersById[member.userId]
|
|
|| searchWords(getUserFullName(usersById[member.userId]) || '', filter)
|
|
) {
|
|
acc.push(member.userId);
|
|
}
|
|
|
|
return acc;
|
|
}, [] as number[]);
|
|
}, [chat.fullInfo?.members, currentUserId, filter, usersById]);
|
|
|
|
const handleRemoveUser = useCallback((userId: number) => {
|
|
deleteChatMember({ chatId: chat.id, userId });
|
|
onClose();
|
|
}, [chat.id, deleteChatMember, onClose]);
|
|
|
|
return (
|
|
<ChatOrUserPicker
|
|
isOpen={isOpen}
|
|
chatOrUserIds={usersId}
|
|
filterRef={filterRef}
|
|
filterPlaceholder={lang('ChannelBlockUser')}
|
|
filter={filter}
|
|
onFilterChange={setFilter}
|
|
loadMore={loadMoreMembers}
|
|
onSelectChatOrUser={handleRemoveUser}
|
|
onClose={onClose}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default memo(withGlobal<OwnProps>(
|
|
(global): StateProps => {
|
|
const {
|
|
users: {
|
|
byId: usersById,
|
|
},
|
|
currentUserId,
|
|
} = global;
|
|
|
|
return { usersById, currentUserId };
|
|
},
|
|
(setGlobal, actions): DispatchProps => pick(actions, ['loadMoreMembers', 'deleteChatMember']),
|
|
)(RemoveGroupUserModal));
|