40 lines
1.3 KiB
JavaScript
40 lines
1.3 KiB
JavaScript
import { getChatDisplayInfo } from "../../utils/chatDisplay";
|
|
import TrashIcon from "../icons/TrashIcon";
|
|
|
|
export default function ChatListItem({ chat, post, unreadMap, t, onOpen, onDelete }) {
|
|
const { title, imgSrc, emoji, unreadCount, preview } = getChatDisplayInfo(chat, post, unreadMap, t);
|
|
|
|
return (
|
|
<div
|
|
className={`chat-list-item${unreadCount > 0 ? " unread" : ""}`}
|
|
onClick={() => onOpen(chat.id)}
|
|
>
|
|
<div className="chat-list-avatar">
|
|
{imgSrc ? (
|
|
<img src={imgSrc} alt="" className="chat-list-avatar-img" />
|
|
) : (
|
|
emoji || chat.otherUserName?.[0] || chat.otherUser?.name?.[0] || "?"
|
|
)}
|
|
</div>
|
|
<div className="chat-list-info">
|
|
<div className="chat-list-name">{title}</div>
|
|
<div className="chat-list-preview">
|
|
{preview}
|
|
</div>
|
|
</div>
|
|
{unreadCount > 0 && (
|
|
<div className="chat-list-unread-badge">{unreadCount > 99 ? "99+" : unreadCount}</div>
|
|
)}
|
|
<button
|
|
className="chat-list-delete-btn"
|
|
title={t('chat.deleteChat')}
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
onDelete(chat.id);
|
|
}}
|
|
>
|
|
<TrashIcon />
|
|
</button>
|
|
</div>
|
|
);
|
|
} |