Skip to content

Commit 2ba7756

Browse files
author
catlog22
committed
fix(dashboard): replace task status emoji icons with Lucide icons in session-detail
- Replace ✓/○/⟳ with check-circle/circle/loader-2 icons - Update formatStatusLabel() to return HTML with Lucide icons - Update task stats bar and bulk action buttons - Simplify toast messages to avoid HTML in text content - Add lucide.createIcons() call in updateTaskStatsBar()
1 parent 02f77c0 commit 2ba7756

File tree

1 file changed

+18
-16
lines changed

1 file changed

+18
-16
lines changed

ccw/src/templates/dashboard-js/views/session-detail.js

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -178,21 +178,21 @@ function renderTasksTab(session, tasks, completed, inProgress, pending) {
178178
<!-- Combined Stats & Actions Bar -->
179179
<div class="task-toolbar">
180180
<div class="task-stats-bar">
181-
<span class="task-stat completed">${completed} completed</span>
182-
<span class="task-stat in-progress">${inProgress} in progress</span>
183-
<span class="task-stat pending">${pending} pending</span>
181+
<span class="task-stat completed"><i data-lucide="check-circle" class="w-4 h-4 inline mr-1"></i>${completed} completed</span>
182+
<span class="task-stat in-progress"><i data-lucide="loader-2" class="w-4 h-4 inline mr-1"></i>${inProgress} in progress</span>
183+
<span class="task-stat pending"><i data-lucide="circle" class="w-4 h-4 inline mr-1"></i>${pending} pending</span>
184184
</div>
185185
<div class="toolbar-divider"></div>
186186
<div class="task-bulk-actions">
187187
<span class="bulk-label">Quick Actions:</span>
188188
<button class="bulk-action-btn" onclick="bulkSetAllStatus('pending')" title="Set all tasks to pending">
189-
<span class="bulk-icon"></span> All Pending
189+
<span class="bulk-icon"><i data-lucide="circle" class="w-4 h-4"></i></span> All Pending
190190
</button>
191191
<button class="bulk-action-btn" onclick="bulkSetAllStatus('in_progress')" title="Set all tasks to in progress">
192-
<span class="bulk-icon"></span> All In Progress
192+
<span class="bulk-icon"><i data-lucide="loader-2" class="w-4 h-4"></i></span> All In Progress
193193
</button>
194194
<button class="bulk-action-btn completed" onclick="bulkSetAllStatus('completed')" title="Set all tasks to completed">
195-
<span class="bulk-icon"></span> All Completed
195+
<span class="bulk-icon"><i data-lucide="check-circle" class="w-4 h-4"></i></span> All Completed
196196
</button>
197197
</div>
198198
</div>
@@ -271,9 +271,9 @@ function renderDetailTaskItem(task) {
271271

272272
function formatStatusLabel(status) {
273273
const labels = {
274-
'pending': 'Pending',
275-
'in_progress': 'In Progress',
276-
'completed': 'Completed'
274+
'pending': '<i data-lucide="circle" class="w-3 h-3 inline mr-1"></i>Pending',
275+
'in_progress': '<i data-lucide="loader-2" class="w-3 h-3 inline mr-1"></i>In Progress',
276+
'completed': '<i data-lucide="check-circle" class="w-3 h-3 inline mr-1"></i>Completed'
277277
};
278278
return labels[status] || status;
279279
}
@@ -582,7 +582,7 @@ async function updateSingleTaskStatus(taskId, newStatus) {
582582
// Update UI
583583
updateTaskItemUI(taskId, newStatus);
584584
updateTaskStatsBar();
585-
showToast(`Task ${taskId} ${formatStatusLabel(newStatus)}`, 'success');
585+
showToast(`Task ${taskId} status updated`, 'success');
586586
} else {
587587
showToast(result.error || 'Failed to update status', 'error');
588588
// Revert select
@@ -624,7 +624,7 @@ async function bulkSetAllStatus(newStatus) {
624624
// Update all task UIs
625625
taskIds.forEach(id => updateTaskItemUI(id, newStatus));
626626
updateTaskStatsBar();
627-
showToast(`All ${taskIds.length} tasks ${formatStatusLabel(newStatus)}`, 'success');
627+
showToast(`All ${taskIds.length} tasks updated`, 'success');
628628
} else {
629629
showToast(result.error || 'Failed to bulk update', 'error');
630630
}
@@ -664,7 +664,7 @@ async function bulkSetPendingToInProgress() {
664664
if (result.success) {
665665
pendingTaskIds.forEach(id => updateTaskItemUI(id, 'in_progress'));
666666
updateTaskStatsBar();
667-
showToast(`${pendingTaskIds.length} tasks: Pending → In Progress`, 'success');
667+
showToast(`${pendingTaskIds.length} tasks moved to In Progress`, 'success');
668668
} else {
669669
showToast(result.error || 'Failed to update', 'error');
670670
}
@@ -704,7 +704,7 @@ async function bulkSetInProgressToCompleted() {
704704
if (result.success) {
705705
inProgressTaskIds.forEach(id => updateTaskItemUI(id, 'completed'));
706706
updateTaskStatsBar();
707-
showToast(`${inProgressTaskIds.length} tasks: In Progress → Completed`, 'success');
707+
showToast(`${inProgressTaskIds.length} tasks completed`, 'success');
708708
} else {
709709
showToast(result.error || 'Failed to update', 'error');
710710
}
@@ -743,10 +743,12 @@ function updateTaskStatsBar() {
743743
const statsBar = document.querySelector('.task-stats-bar');
744744
if (statsBar) {
745745
statsBar.innerHTML = `
746-
<span class="task-stat completed">${completed} completed</span>
747-
<span class="task-stat in-progress">${inProgress} in progress</span>
748-
<span class="task-stat pending">${pending} pending</span>
746+
<span class="task-stat completed"><i data-lucide="check-circle" class="w-4 h-4 inline mr-1"></i>${completed} completed</span>
747+
<span class="task-stat in-progress"><i data-lucide="loader-2" class="w-4 h-4 inline mr-1"></i>${inProgress} in progress</span>
748+
<span class="task-stat pending"><i data-lucide="circle" class="w-4 h-4 inline mr-1"></i>${pending} pending</span>
749749
`;
750+
// Reinitialize Lucide icons
751+
if (typeof lucide !== 'undefined') lucide.createIcons();
750752
}
751753
}
752754

0 commit comments

Comments
 (0)