feat: clickable links on dashboard, priority badges on up-next

- Up Next items link to task detail pages
- Recently Completed items are now clickable links
- High/critical priority badges shown on Up Next items
- Hover states on dashboard items
This commit is contained in:
2026-01-29 08:06:37 +00:00
parent 24c9539c00
commit 0f084704ee

View File

@@ -202,11 +202,16 @@ export function DashboardPage() {
<h3 className="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2">Up Next</h3>
<div className="space-y-2">
{upNext.map((task, i) => (
<div key={task.id} className="flex items-center gap-2 text-sm">
<Link to={`/task/HQ-${task.taskNumber}`} key={task.id} className="flex items-center gap-2 text-sm group hover:bg-gray-50 rounded-lg px-1 -mx-1 py-0.5 transition">
<span className="text-gray-300 text-xs w-4 text-right">{i + 1}.</span>
<span className="text-xs font-mono text-gray-400">HQ-{task.taskNumber}</span>
<span className="text-gray-700 truncate">{task.title}</span>
</div>
<span className="text-gray-700 truncate group-hover:text-amber-700 transition">{task.title}</span>
{task.priority === "high" || task.priority === "critical" ? (
<span className={`text-[10px] px-1.5 py-0.5 rounded-full font-medium shrink-0 ${task.priority === "critical" ? "bg-red-100 text-red-600" : "bg-orange-100 text-orange-600"}`}>
{task.priority}
</span>
) : null}
</Link>
))}
</div>
</div>
@@ -234,7 +239,7 @@ export function DashboardPage() {
<div className="p-5">
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
{recentlyCompleted.map((task) => (
<div key={task.id} className="rounded-lg border border-green-200 bg-green-50 p-3">
<Link to={`/task/HQ-${task.taskNumber}`} key={task.id} className="rounded-lg border border-green-200 bg-green-50 p-3 hover:bg-green-100 transition block">
<div className="flex items-center gap-2 mb-1">
<span className="text-xs font-bold text-green-700 font-mono">HQ-{task.taskNumber}</span>
{task.completedAt && (
@@ -242,7 +247,7 @@ export function DashboardPage() {
)}
</div>
<h3 className="font-medium text-sm text-green-900">{task.title}</h3>
</div>
</Link>
))}
</div>
</div>