72 lines
2.6 KiB
TypeScript
72 lines
2.6 KiB
TypeScript
"use client";
|
|
import type { MailEnvelope } from "@/app/[lang]/dashboard/mail/page";
|
|
import { useDictionary } from "@/components/DictionaryContext";
|
|
import { useParams } from "next/navigation";
|
|
|
|
function timeAgo(dateStr: string, lang: string): string {
|
|
const now = new Date();
|
|
const d = new Date(dateStr);
|
|
const diff = now.getTime() - d.getTime();
|
|
const mins = Math.floor(diff / 60000);
|
|
if (mins < 1) return lang === "tr" ? "şimdi" : "now";
|
|
if (mins < 60) return `${mins}${lang === "tr" ? "dk" : "m"}`;
|
|
const hrs = Math.floor(mins / 60);
|
|
if (hrs < 24) return `${hrs}${lang === "tr" ? "sa" : "h"}`;
|
|
const days = Math.floor(hrs / 24);
|
|
if (days < 7) return `${days}${lang === "tr" ? "g" : "d"}`;
|
|
return d.toLocaleDateString(lang === "tr" ? "tr-TR" : "en-US", { day: "numeric", month: "short" });
|
|
}
|
|
|
|
function senderName(msg: MailEnvelope): string {
|
|
const f = msg.from[0];
|
|
return f?.name || f?.address || "Unknown";
|
|
}
|
|
|
|
export default function MessageList({ messages, loading, selectedUid, onSelect, onDelete }: {
|
|
messages: MailEnvelope[];
|
|
loading: boolean;
|
|
selectedUid: number | null;
|
|
onSelect: (uid: number) => void;
|
|
onDelete: (uid: number) => void;
|
|
}) {
|
|
const dict = useDictionary();
|
|
const params = useParams();
|
|
const lang = (params.lang as string) || "en";
|
|
|
|
if (loading) {
|
|
return <div className="empty-state" style={{ padding: 40 }}><span className="spinner" style={{ width: 20, height: 20 }} /></div>;
|
|
}
|
|
|
|
if (messages.length === 0) {
|
|
return (
|
|
<div className="empty-state" style={{ padding: 40 }}>
|
|
<div style={{ fontSize: 13, color: "var(--text-muted)" }}>{dict.mailClient.emptyFolder || "Bu klasör boş"}</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="message-list-inner">
|
|
{messages.map((m) => (
|
|
<div
|
|
key={m.uid}
|
|
className={`message-row ${selectedUid === m.uid ? "selected" : ""} ${!m.seen ? "unread" : ""}`}
|
|
onClick={() => onSelect(m.uid)}
|
|
>
|
|
<div className="message-avatar">
|
|
{senderName(m)[0]?.toUpperCase() ?? "?"}
|
|
</div>
|
|
<div className="message-content">
|
|
<div className="message-top">
|
|
<span className="message-sender">{senderName(m)}</span>
|
|
<span className="message-time">{timeAgo(m.date, lang)}</span>
|
|
</div>
|
|
<div className="message-subject">{m.subject || dict.mailClient.noSubject || "(Konu Yok)"}</div>
|
|
</div>
|
|
{m.hasAttachments && <span className="message-attach" title={dict.mailClient.attachments || "Ekler"}>📎</span>}
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|