tasks-mockup/src/components/task-row.js

42 lines
1.0 KiB
JavaScript

import React from 'react'
const TaskRow = props => {
const { task } = props
const project = props.projects.find(p => p.id === task.projectId)
return (
<li className="list-group-item" key={task.id} onClick={props.editTask}>
<button
className="btn btn-outline-danger mr-1"
onClick={() => props.deleteTask(task.id)}
>
X
</button>
<button className="btn ml-1" onClick={() => props.selectTask(task.id)}>
{task.desc}
</button>
<button
className={`btn btn-${
task.completed ? 'secondary' : 'outline-success'
} float-right`}
onClick={() => props.completeTask(task.id)}
>
&#10004;
</button>
{props.component === 'project' ? (
''
) : task.projectId ? (
<button
className="btn ml-3 mr-2 float-right"
onClick={() => props.selectProject(task.projectId)}
>
{project.name}
</button>
) : (
''
)}
</li>
)
}
export default TaskRow