49 lines
1.1 KiB
TypeScript
49 lines
1.1 KiB
TypeScript
import { List, ListSubheader } from "@mui/material";
|
|
import { useAuth } from "../../../../hooks/useAuth";
|
|
import { useProject } from "../../../../hooks/useProject";
|
|
import { Task, TasksListItem } from "./TasksListItem";
|
|
|
|
export type TaskListProps = {
|
|
title: string;
|
|
tasks: Task[];
|
|
};
|
|
|
|
export const TasksList = ({ title, tasks }: TaskListProps) => {
|
|
const { apiClient } = useAuth();
|
|
const { tasksMutate, project } = useProject();
|
|
|
|
const handleCheck = (taskId: number) => {
|
|
apiClient(`projects/${project.id}/tasks/${taskId}/finish`).then((res) => {
|
|
tasksMutate();
|
|
});
|
|
};
|
|
|
|
const handleDelete = (taskId: number) => {
|
|
apiClient(`projects/${project.id}/tasks/${taskId}`, {
|
|
method: "DELETE",
|
|
}).then((res) => {
|
|
tasksMutate();
|
|
});
|
|
};
|
|
|
|
return (
|
|
<List
|
|
dense
|
|
subheader={
|
|
<ListSubheader component="div" id="nested-list-subheader">
|
|
{title}
|
|
</ListSubheader>
|
|
}
|
|
>
|
|
{tasks.map((task) => (
|
|
<TasksListItem
|
|
key={task.id}
|
|
task={task}
|
|
onCheck={handleCheck}
|
|
onDelete={handleDelete}
|
|
/>
|
|
))}
|
|
</List>
|
|
);
|
|
};
|