4a6b5e5498
- Fixed group emoji icons in DB (💼🛒📚🗺️🏃✨🏠🌿) - Added TaskModal component for + button - Czech status labels (Čeká, Probíhá, Hotovo, Zrušeno) - Improved TaskCard, GroupSelector, Header, StatusBadge - Better dark/light mode transitions Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
interface StatusBadgeProps {
|
|
status: string;
|
|
size?: "sm" | "md";
|
|
}
|
|
|
|
const STATUS_MAP: Record<string, { label: string; bg: string; text: string; dot: string }> = {
|
|
pending: {
|
|
label: "\u010Cek\u00e1",
|
|
bg: "bg-yellow-100 dark:bg-yellow-900/30",
|
|
text: "text-yellow-800 dark:text-yellow-300",
|
|
dot: "bg-yellow-500",
|
|
},
|
|
in_progress: {
|
|
label: "Prob\u00edh\u00e1",
|
|
bg: "bg-blue-100 dark:bg-blue-900/30",
|
|
text: "text-blue-800 dark:text-blue-300",
|
|
dot: "bg-blue-500",
|
|
},
|
|
done: {
|
|
label: "Hotovo",
|
|
bg: "bg-green-100 dark:bg-green-900/30",
|
|
text: "text-green-800 dark:text-green-300",
|
|
dot: "bg-green-500",
|
|
},
|
|
completed: {
|
|
label: "Hotovo",
|
|
bg: "bg-green-100 dark:bg-green-900/30",
|
|
text: "text-green-800 dark:text-green-300",
|
|
dot: "bg-green-500",
|
|
},
|
|
cancelled: {
|
|
label: "Zru\u0161eno",
|
|
bg: "bg-gray-100 dark:bg-gray-800/30",
|
|
text: "text-gray-600 dark:text-gray-400",
|
|
dot: "bg-gray-400",
|
|
},
|
|
};
|
|
|
|
export default function StatusBadge({ status, size = "sm" }: StatusBadgeProps) {
|
|
const s = STATUS_MAP[status] || STATUS_MAP.pending;
|
|
const sizeClass = size === "sm" ? "px-2 py-0.5 text-xs" : "px-3 py-1 text-sm";
|
|
|
|
return (
|
|
<span
|
|
className={`inline-flex items-center gap-1.5 rounded-full font-medium ${s.bg} ${s.text} ${sizeClass}`}
|
|
>
|
|
<span className={`w-1.5 h-1.5 rounded-full ${s.dot}`} />
|
|
{s.label}
|
|
</span>
|
|
);
|
|
}
|