Skip to content
Snippets Groups Projects
Commit 745c3600 authored by OUKASSOU Anas's avatar OUKASSOU Anas
Browse files

Merge branch 'feature/manage-tasks' into 'main'

Feature/manage tasks

See merge request !14
parents d0d10a67 0794d219
No related branches found
No related tags found
1 merge request!14Feature/manage tasks
...@@ -18,26 +18,38 @@ export default function TaskItem({ task }) { ...@@ -18,26 +18,38 @@ export default function TaskItem({ task }) {
setTasks(tasks.filter(task => task.id !== id)); setTasks(tasks.filter(task => task.id !== id));
}; };
const formattedDate = task.dueDate
? new Date(task.dueDate).toLocaleDateString()
: "No due date";
return ( return (
<li className="flex items-center space-x-4"> <li>
<div className="flex items-start p-4 border rounded-lg shadow-sm bg-white my-2 hover:shadow-md transition-shadow">
<div className="flex-shrink-0 pt-1">
<input <input
type="checkbox"
id={task.id} id={task.id}
type="checkbox"
className="h-5 w-5 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
checked={task.isCompleted} checked={task.isCompleted}
onChange={onChange} onChange={onChange}
className="w-5 h-5 text-blue-500 border-gray-300 rounded focus:ring-blue-500"
/> />
<label </div>
htmlFor={task.id}
className={`text-lg ${task.isCompleted ? 'line-through text-gray-400' : ''}`}> <div className="ml-3 flex-1">
<h3 className={`text-base font-medium ${task.isCompleted ? 'text-gray-400 line-through' : 'text-gray-900'}`}>
{task.name} {task.name}
</label> </h3>
<p className={`text-sm mt-1 ${task.isCompleted ? 'text-gray-400' : 'text-gray-500'}`}>
Due: {formattedDate}
</p>
</div>
<button <button
onClick={() => onDelete(task.id)} onClick={() => onDelete(task.id)}
className="ml-auto p-1 rounded-full hover:bg-gray-200 focus:outline-none" className="ml-auto p-1 rounded-full hover:bg-gray-200 focus:outline-none"
> >
<TrashIcon className="w-5 h-5 text-red-500 hover:text-red-700" /> <TrashIcon className="w-5 h-5 text-red-500 hover:text-red-700" />
</button> </button>
</div>
</li> </li>
) )
} }
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment