Files
webmailserver/components/mail/FolderList.tsx

67 lines
2.0 KiB
TypeScript

"use client";
import type { MailFolder } from "@/app/[lang]/dashboard/mail/page";
const FOLDER_ICONS: Record<string, string> = {
"\\Inbox": "📥",
"\\Sent": "📤",
"\\Drafts": "📝",
"\\Trash": "🗑️",
"\\Junk": "⚠️",
"\\Archive": "📦",
};
const FOLDER_LABELS: Record<string, string> = {
INBOX: "Gelen Kutusu",
Sent: "Gönderilenler",
Drafts: "Taslaklar",
Trash: "Çöp Kutusu",
Junk: "Spam",
Archive: "Arşiv",
};
function getFolderIcon(folder: MailFolder): string {
if (folder.specialUse && FOLDER_ICONS[folder.specialUse]) return FOLDER_ICONS[folder.specialUse];
const lower = folder.path.toLowerCase();
if (lower === "inbox") return "📥";
if (lower.includes("sent")) return "📤";
if (lower.includes("draft")) return "📝";
if (lower.includes("trash")) return "🗑️";
if (lower.includes("junk") || lower.includes("spam")) return "⚠️";
if (lower.includes("archive")) return "📦";
return "📁";
}
function getFolderLabel(folder: MailFolder): string {
return FOLDER_LABELS[folder.name] ?? FOLDER_LABELS[folder.path] ?? folder.name;
}
export default function FolderList({ folders, active, onSelect }: {
folders: MailFolder[];
active: string;
onSelect: (path: string) => void;
}) {
const sorted = [...folders].sort((a, b) => {
if (a.path === "INBOX") return -1;
if (b.path === "INBOX") return 1;
if (a.specialUse && !b.specialUse) return -1;
if (!a.specialUse && b.specialUse) return 1;
return a.name.localeCompare(b.name);
});
return (
<div className="folder-list">
{sorted.map((f) => (
<button
key={f.path}
className={`folder-item ${active === f.path ? "active" : ""}`}
onClick={() => onSelect(f.path)}
>
<span className="folder-icon">{getFolderIcon(f)}</span>
<span className="folder-name">{getFolderLabel(f)}</span>
{f.unseen > 0 && <span className="folder-badge">{f.unseen}</span>}
</button>
))}
</div>
);
}