diff --git a/src/components/Tasks/TaskList.tsx b/src/components/Tasks/TaskList.tsx index 5c29a41..1b3e065 100644 --- a/src/components/Tasks/TaskList.tsx +++ b/src/components/Tasks/TaskList.tsx @@ -42,6 +42,7 @@ export default React.memo(function TaskList(props: PropsType) { key={uid} entry={entry} onClick={props.onItemClick} + onSave={props.onItemSave} /> ); }); diff --git a/src/components/Tasks/TaskListItem.tsx b/src/components/Tasks/TaskListItem.tsx index 6655929..4a17a2e 100644 --- a/src/components/Tasks/TaskListItem.tsx +++ b/src/components/Tasks/TaskListItem.tsx @@ -3,20 +3,42 @@ import * as React from 'react'; -import { TaskType } from '../../pim-types'; +import { TaskType, TaskStatusType, PimType } from '../../pim-types'; import { ListItem } from '../../widgets/List'; -const TaskListItem = React.memo((props: { entry: TaskType, onClick: (entry: TaskType) => void }) => { +import Checkbox from '@material-ui/core/Checkbox'; + +interface PropsType { + entry: TaskType; + onClick: (task: TaskType) => void; + onSave: (item: PimType, journalUid: string, originalItem?: PimType) => Promise; +} + +const TaskListItem = React.memo((props: PropsType) => { const { - entry, + entry: task, onClick, + onSave: save, } = props; - const title = entry.title; + const title = task.title; + + function toggleComplete(_e: React.ChangeEvent, checked: boolean) { + const clonedTask = task.clone(); + clonedTask.status = checked ? TaskStatusType.Completed : TaskStatusType.NeedsAction; + save(clonedTask, (task as any).journalUid, task); + } return ( onClick(entry)} + onClick={() => onClick(task)} + leftIcon={ + e.stopPropagation()} + onChange={toggleComplete} + checked={task.finished} + /> + } /> ); });