66 lines
2.0 KiB
TypeScript
66 lines
2.0 KiB
TypeScript
import { Badge } from "@/components/ui/badge";
|
|
import { SheetTrigger } from "@/components/ui/sheet";
|
|
import { TableCell, TableRow } from "@/components/ui/table";
|
|
import { Task, Tag, TagId } from "@/lib/types";
|
|
import { Color, getColor } from "@/lib/ui/color";
|
|
import TaskEdit from "../edit/TaskEdit";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Trash2 } from "lucide-react";
|
|
|
|
export default function TableTask({
|
|
task,
|
|
setTask,
|
|
tags,
|
|
onDelete,
|
|
}: {
|
|
task: Task;
|
|
setTask: (t: Task) => void;
|
|
tags: Record<TagId, Tag>;
|
|
onDelete?: (taskId: string) => void;
|
|
}) {
|
|
return (
|
|
<TaskEdit task={task} tags={tags} setTask={setTask}>
|
|
<SheetTrigger asChild>
|
|
<TableRow className="cursor-pointer hover:bg-accent">
|
|
<TableCell className="font-medium">{task.title}</TableCell>
|
|
<TableCell className="max-w-[250px] truncate">
|
|
{task.description || "-"}
|
|
</TableCell>
|
|
<TableCell>
|
|
<Badge variant="outline">{task.statusId}</Badge>
|
|
</TableCell>
|
|
<TableCell className="flex gap-1 items-center justify-between">
|
|
<div className="flex gap-1">
|
|
{task.tagIds?.map((tagId) => (
|
|
<Badge
|
|
key={tagId}
|
|
variant="outline"
|
|
style={
|
|
tags[tagId]
|
|
? getColor(tags[tagId].color || "#808080")
|
|
: undefined
|
|
}
|
|
>
|
|
{tags[tagId]?.name || tagId}
|
|
</Badge>
|
|
))}
|
|
</div>
|
|
{onDelete && (
|
|
<Button
|
|
size="sm"
|
|
variant="ghost"
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
onDelete(task.id);
|
|
}}
|
|
>
|
|
<Trash2 className="h-4 w-4 text-red-500" />
|
|
</Button>
|
|
)}
|
|
</TableCell>
|
|
</TableRow>
|
|
</SheetTrigger>
|
|
</TaskEdit>
|
|
);
|
|
}
|