2024-04-19 13:37:34 +04:00

59 lines
1.3 KiB
TypeScript

import React, { memo } from '../../../lib/teact/teact';
import type { ApiUser } from '../../../api/types';
import buildClassName from '../../../util/buildClassName';
import renderText from '../../common/helpers/renderText';
import useLastCallback from '../../../hooks/useLastCallback';
import Avatar from '../../common/Avatar';
import ListItem from '../../ui/ListItem';
import './ChatCommand.scss';
type OwnProps<T = undefined> = {
command: string;
description: string;
peer?: ApiUser;
withAvatar?: boolean;
focus?: boolean;
clickArg: T;
onClick: (arg: T) => void;
};
// eslint-disable-next-line @typescript-eslint/comma-dangle
const ChatCommand = <T,>({
withAvatar,
focus,
command,
description,
peer,
clickArg,
onClick,
}: OwnProps<T>) => {
const handleClick = useLastCallback(() => {
onClick(clickArg);
});
return (
<ListItem
key={command}
className={buildClassName('BotCommand chat-item-clickable scroll-item', withAvatar && 'with-avatar')}
multiline
onClick={handleClick}
focus={focus}
>
{withAvatar && (
<Avatar size="small" peer={peer} />
)}
<div className="content-inner">
<span className="title">/{command}</span>
<span className="subtitle">{renderText(description)}</span>
</div>
</ListItem>
);
};
export default memo(ChatCommand);