46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
import { DeleteOutlined } from "@ant-design/icons";
|
|
import { Button, Flex, Popconfirm, Typography } from "antd";
|
|
|
|
import type { Conversation } from "../../../../shared/api";
|
|
|
|
interface ConversationCardProps {
|
|
conversation: Conversation;
|
|
onDelete: () => void;
|
|
onSelect: () => void;
|
|
selected: boolean;
|
|
}
|
|
|
|
export function ConversationCard({ conversation, onDelete, onSelect, selected }: ConversationCardProps) {
|
|
const className = selected ? "app-sidebar-list-item app-sidebar-list-item--selected" : "app-sidebar-list-item";
|
|
|
|
return (
|
|
<Flex align="center" className={className} gap="small" justify="space-between" onClick={onSelect}>
|
|
<Typography.Text ellipsis style={{ flex: 1, minWidth: 0 }}>
|
|
{conversation.title}
|
|
</Typography.Text>
|
|
<span className="app-sidebar-item-actions">
|
|
<Popconfirm
|
|
description="删除后不可恢复"
|
|
okButtonProps={{ danger: true }}
|
|
okText="删除"
|
|
onCancel={(e) => e?.stopPropagation()}
|
|
onConfirm={(e) => {
|
|
e?.stopPropagation();
|
|
onDelete();
|
|
}}
|
|
title="确认删除该对话?"
|
|
>
|
|
<Button
|
|
aria-label="删除"
|
|
danger
|
|
icon={<DeleteOutlined />}
|
|
onClick={(e) => e.stopPropagation()}
|
|
size="small"
|
|
type="text"
|
|
/>
|
|
</Popconfirm>
|
|
</span>
|
|
</Flex>
|
|
);
|
|
}
|