hammer/hammer-queue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
- 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:
Hammer
2026-01-29 08:06:37 +00:00
parent 24c9539c00
commit 0f084704ee
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/pages/DashboardPage.tsx
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> <h3 className="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2">Up Next</h3>
<div className="space-y-2"> <div className="space-y-2">
{upNext.map((task, i) => ( {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-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-xs font-mono text-gray-400">HQ-{task.taskNumber}</span>
<span className="text-gray-700 truncate">{task.title}</span> <span className="text-gray-700 truncate group-hover:text-amber-700 transition">{task.title}</span>
</div> {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>
</div> </div>
@@ -234,7 +239,7 @@ export function DashboardPage() {
<div className="p-5"> <div className="p-5">
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3"> <div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
{recentlyCompleted.map((task) => ( {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"> <div className="flex items-center gap-2 mb-1">
<span className="text-xs font-bold text-green-700 font-mono">HQ-{task.taskNumber}</span> <span className="text-xs font-bold text-green-700 font-mono">HQ-{task.taskNumber}</span>
{task.completedAt && ( {task.completedAt && (
@@ -242,7 +247,7 @@ export function DashboardPage() {
)} )}
</div> </div>
<h3 className="font-medium text-sm text-green-900">{task.title}</h3> <h3 className="font-medium text-sm text-green-900">{task.title}</h3>
</div> </Link>
))} ))}
</div> </div>
</div> </div>