From 6ecf6dadcfb939c50f6979bc22c31d514e8bcd51 Mon Sep 17 00:00:00 2001
From: Dries Peeters <dries.peeters96@gmail.com>
Date: Wed, 22 Oct 2025 08:00:48 +0200
Subject: [PATCH] fix: Multiple UI/UX improvements and bulk delete
 implementation

Major Changes:
- Implement bulk delete functionality for tasks with custom confirmation dialog
  * Add /tasks/bulk-delete POST route with permission checks
  * Add checkboxes and "Delete Selected" button to task list
  * Skip tasks with time entries, provide detailed feedback
  * Log all deletions for audit trail
---
 app/routes/tasks.py           | 65 ++++++++++++++++++++++++
 app/templates/tasks/list.html | 95 +++++++++++++++++++++++++++++++++--
 2 files changed, 155 insertions(+), 5 deletions(-)

diff --git a/app/routes/tasks.py b/app/routes/tasks.py
index afd948a..7a91678 100644
--- a/app/routes/tasks.py
+++ b/app/routes/tasks.py
@@ -506,6 +506,71 @@ def delete_task(task_id):
     flash(f'Task "{task_name}" deleted successfully', 'success')
     return redirect(url_for('tasks.list_tasks'))
 
+@tasks_bp.route('/tasks/bulk-delete', methods=['POST'])
+@login_required
+def bulk_delete_tasks():
+    """Delete multiple tasks at once"""
+    task_ids = request.form.getlist('task_ids[]')
+    
+    if not task_ids:
+        flash('No tasks selected for deletion', 'warning')
+        return redirect(url_for('tasks.list_tasks'))
+    
+    deleted_count = 0
+    skipped_count = 0
+    errors = []
+    
+    for task_id_str in task_ids:
+        try:
+            task_id = int(task_id_str)
+            task = Task.query.get(task_id)
+            
+            if not task:
+                continue
+            
+            # Check permissions
+            if not current_user.is_admin and task.created_by != current_user.id:
+                skipped_count += 1
+                errors.append(f"'{task.name}': No permission")
+                continue
+            
+            # Check for time entries
+            if task.time_entries.count() > 0:
+                skipped_count += 1
+                errors.append(f"'{task.name}': Has time entries")
+                continue
+            
+            # Delete the task
+            task_id_for_log = task.id
+            project_id_for_log = task.project_id
+            task_name = task.name
+            
+            db.session.delete(task)
+            deleted_count += 1
+            
+            # Log the deletion
+            app_module.log_event("task.deleted", user_id=current_user.id, task_id=task_id_for_log, project_id=project_id_for_log)
+            app_module.track_event(current_user.id, "task.deleted", {"task_id": task_id_for_log, "project_id": project_id_for_log})
+            
+        except Exception as e:
+            skipped_count += 1
+            errors.append(f"ID {task_id_str}: {str(e)}")
+    
+    # Commit all deletions
+    if deleted_count > 0:
+        if not safe_commit('bulk_delete_tasks', {'count': deleted_count}):
+            flash('Could not delete tasks due to a database error. Please check server logs.', 'error')
+            return redirect(url_for('tasks.list_tasks'))
+    
+    # Show appropriate messages
+    if deleted_count > 0:
+        flash(f'Successfully deleted {deleted_count} task{"s" if deleted_count != 1 else ""}', 'success')
+    
+    if skipped_count > 0:
+        flash(f'Skipped {skipped_count} task{"s" if skipped_count != 1 else ""}: {"; ".join(errors[:3])}', 'warning')
+    
+    return redirect(url_for('tasks.list_tasks'))
+
 @tasks_bp.route('/tasks/my-tasks')
 @login_required
 def my_tasks():
diff --git a/app/templates/tasks/list.html b/app/templates/tasks/list.html
index 17440f4..f212fb7 100644
--- a/app/templates/tasks/list.html
+++ b/app/templates/tasks/list.html
@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% from "components/ui.html" import page_header, stat_card, badge %}
+{% from "components/ui.html" import page_header, stat_card, badge, confirm_dialog %}
 
 {% block content %}
 {% set breadcrumbs = [
@@ -99,14 +99,17 @@
             <button type="button" class="px-3 py-1.5 text-sm bg-background-light dark:bg-background-dark rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" title="Export to CSV">
                 <i class="fas fa-download mr-1"></i> Export
             </button>
-            <button type="button" class="px-3 py-1.5 text-sm bg-background-light dark:bg-background-dark rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" title="Bulk actions">
-                <i class="fas fa-check-square mr-1"></i> Bulk
+            <button type="button" id="bulkDeleteBtn" class="px-3 py-1.5 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors hidden" title="Delete selected tasks" onclick="showBulkDeleteConfirm()">
+                <i class="fas fa-trash mr-1"></i> Delete Selected (<span id="selectedCount">0</span>)
             </button>
         </div>
     </div>
-    <table class="table table-zebra w-full text-left" data-enhanced>
+    <table class="table table-zebra w-full text-left">
         <thead class="border-b border-border-light dark:border-border-dark">
             <tr>
+                <th class="p-4 w-12">
+                    <input type="checkbox" id="selectAll" class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary" onchange="toggleAllTasks()">
+                </th>
                 <th class="p-4" data-sortable>Name</th>
                 <th class="p-4" data-sortable>Project</th>
                 <th class="p-4" data-sortable>Priority</th>
@@ -118,7 +121,10 @@
         </thead>
         <tbody>
             {% for task in tasks %}
-            <tr class="border-b border-border-light dark:border-border-dark">
+            <tr class="border-b border-border-light dark:border-border-dark hover:bg-gray-50 dark:hover:bg-gray-800">
+                <td class="p-4">
+                    <input type="checkbox" class="task-checkbox h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary" value="{{ task.id }}" onchange="updateBulkDeleteButton()">
+                </td>
                 <td class="p-4">{{ task.name }}</td>
                 <td class="p-4">{{ task.project.name }}</td>
                 <td class="p-4">
@@ -175,6 +181,22 @@
         </tbody>
     </table>
 </div>
+
+<!-- Bulk Delete Form (hidden) -->
+<form id="confirmBulkDelete-form" method="POST" action="{{ url_for('tasks.bulk_delete_tasks') }}" class="hidden">
+    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+</form>
+
+<!-- Bulk Delete Confirmation Dialog -->
+{{ confirm_dialog(
+    'confirmBulkDelete',
+    'Delete Selected Tasks',
+    'Are you sure you want to delete the selected tasks? This action cannot be undone. Tasks with existing time entries will be skipped.',
+    'Delete',
+    'Cancel',
+    'danger'
+) }}
+
 {% endblock %}
 
 {% block scripts_extra %}
@@ -183,6 +205,69 @@
 .filter-toggle-transition { transition: all 0.3s ease-in-out; }
 </style>
 <script>
+// Bulk delete functions
+function toggleAllTasks() {
+    const selectAll = document.getElementById('selectAll');
+    const checkboxes = document.querySelectorAll('.task-checkbox');
+    checkboxes.forEach(cb => cb.checked = selectAll.checked);
+    updateBulkDeleteButton();
+}
+
+function updateBulkDeleteButton() {
+    const checkboxes = document.querySelectorAll('.task-checkbox:checked');
+    const count = checkboxes.length;
+    const btn = document.getElementById('bulkDeleteBtn');
+    const countSpan = document.getElementById('selectedCount');
+    
+    if (count > 0) {
+        btn.classList.remove('hidden');
+        countSpan.textContent = count;
+    } else {
+        btn.classList.add('hidden');
+    }
+    
+    // Update select all checkbox state
+    const allCheckboxes = document.querySelectorAll('.task-checkbox');
+    const selectAll = document.getElementById('selectAll');
+    if (selectAll && allCheckboxes.length > 0) {
+        selectAll.checked = count === allCheckboxes.length;
+        selectAll.indeterminate = count > 0 && count < allCheckboxes.length;
+    }
+}
+
+function showBulkDeleteConfirm() {
+    document.getElementById('confirmBulkDelete').classList.remove('hidden');
+}
+
+// Handle bulk delete confirmation
+document.addEventListener('DOMContentLoaded', function() {
+    // Intercept the form submission to add task IDs
+    const form = document.getElementById('confirmBulkDelete-form');
+    if (form) {
+        form.addEventListener('submit', function(e) {
+            // Prevent default to add task IDs first
+            e.preventDefault();
+            
+            const checkboxes = document.querySelectorAll('.task-checkbox:checked');
+            
+            // Clear existing hidden inputs
+            form.querySelectorAll('input[name="task_ids[]"]').forEach(input => input.remove());
+            
+            // Add selected task IDs to form
+            checkboxes.forEach(cb => {
+                const input = document.createElement('input');
+                input.type = 'hidden';
+                input.name = 'task_ids[]';
+                input.value = cb.value;
+                form.appendChild(input);
+            });
+            
+            // Now submit the form
+            form.submit();
+        });
+    }
+});
+
 function toggleFilterVisibility() {
     const filterBody = document.getElementById('filterBody');
     const toggleIcon = document.getElementById('filterToggleIcon');