mirror of https://github.com/msgbyte/tailchat
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
974 B
TypeScript
38 lines
974 B
TypeScript
import { Select } from 'antd';
|
|
import React, { useCallback } from 'react';
|
|
import { t, useUserInfoList } from 'tailchat-shared';
|
|
|
|
interface UserSelectorProps {
|
|
allUserIds: string[];
|
|
userIds?: string[];
|
|
onChange?: (userIds: string[]) => void;
|
|
}
|
|
export const UserSelector: React.FC<UserSelectorProps> = React.memo((props) => {
|
|
const { allUserIds, userIds, onChange } = props;
|
|
const userInfoList = useUserInfoList(allUserIds);
|
|
|
|
const handleChange = useCallback(
|
|
(userIds: string[]) => {
|
|
typeof onChange === 'function' && onChange(userIds);
|
|
},
|
|
[onChange]
|
|
);
|
|
|
|
return (
|
|
<Select
|
|
mode="multiple"
|
|
allowClear={true}
|
|
placeholder={t('请选择用户')}
|
|
value={userIds}
|
|
onChange={handleChange}
|
|
>
|
|
{userInfoList.map((info) => (
|
|
<Select.Option key={info._id} value={info._id}>
|
|
{info.nickname}
|
|
</Select.Option>
|
|
))}
|
|
</Select>
|
|
);
|
|
});
|
|
UserSelector.displayName = 'UserSelector';
|