feat: improve TaskCard and TagList components, enhance task loading logic
- Updated TaskCard to conditionally render footer elements based on available data (due date, source, completion status). - Enhanced TagList to visually indicate deleting tags and improved button styles for better UX. - Modified useTasks hook to refresh tasks only if no initial data is present, optimizing loading behavior. - Updated TagsPageClient to manage local tags and handle optimistic UI updates during tag deletion.
This commit is contained in:
@@ -186,32 +186,36 @@ export function TaskCard({ task, onDelete, onEdit, onUpdateTitle }: TaskCardProp
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Footer tech avec séparateur néon */}
|
||||
<div className="pt-2 border-t border-slate-700/50">
|
||||
<div className="flex items-center justify-between text-xs">
|
||||
{task.dueDate ? (
|
||||
<span className="flex items-center gap-1 text-slate-400 font-mono">
|
||||
<span className="text-cyan-400">⏰</span>
|
||||
{formatDistanceToNow(new Date(task.dueDate), {
|
||||
addSuffix: true,
|
||||
locale: fr
|
||||
})}
|
||||
</span>
|
||||
) : (
|
||||
<span className="text-slate-600 font-mono">--:--</span>
|
||||
)}
|
||||
|
||||
{task.source !== 'manual' && task.source && (
|
||||
<Badge variant="outline" size="sm">
|
||||
{task.source}
|
||||
</Badge>
|
||||
)}
|
||||
|
||||
{task.completedAt && (
|
||||
<span className="text-emerald-400 font-mono font-bold">✓ DONE</span>
|
||||
)}
|
||||
{/* Footer tech avec séparateur néon - seulement si des données à afficher */}
|
||||
{(task.dueDate || (task.source && task.source !== 'manual') || task.completedAt) && (
|
||||
<div className="pt-2 border-t border-slate-700/50">
|
||||
<div className="flex items-center justify-between text-xs">
|
||||
{task.dueDate ? (
|
||||
<span className="flex items-center gap-1 text-slate-400 font-mono">
|
||||
<span className="text-cyan-400">⏰</span>
|
||||
{formatDistanceToNow(new Date(task.dueDate), {
|
||||
addSuffix: true,
|
||||
locale: fr
|
||||
})}
|
||||
</span>
|
||||
) : (
|
||||
<div></div>
|
||||
)}
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
{task.source !== 'manual' && task.source && (
|
||||
<Badge variant="outline" size="sm">
|
||||
{task.source}
|
||||
</Badge>
|
||||
)}
|
||||
|
||||
{task.completedAt && (
|
||||
<span className="text-emerald-400 font-mono font-bold">✓ DONE</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user