Yay make the task list useful

src-ui/src/app/components/admin/tasks/tasks.component.html

@@ -175,16 +175,17 @@
               </div>
             </td>
             <td class="overflow-auto name-col">
-              <div>{{ taskDisplayName(task) }}</div>
+              @let documentCount = taskDocumentCount(task);
+              <div>
+                {{ taskDisplayName(task) }}
+                @if (documentCount !== null && documentCount > 1) {
+                  <small class="text-muted ms-1" i18n>({documentCount, plural, =1 {1 document} other {{{ documentCount }} documents}})</small>
+                }
+              </div>
               <div class="small text-muted">
                 @if (taskShowsSeparateTypeLabel(task)) {
                   <span class="me-2">{{ task.task_type_display }}</span>
                 }
-                @let documentCount = taskDocumentCount(task);
-                @if (documentCount !== null) {
-                  <span class="me-2" i18n>{documentCount, plural, =1 {1 document} other {{{ documentCount }} documents}}</span>
-                  <span class="me-2" aria-hidden="true">&middot;</span>
-                }
                 <span class="text-nowrap"><pngx-bs-icon class="me-1" width="1em" height="1em" name="box-arrow-in-right"></pngx-bs-icon>{{ task.trigger_source_display }}</span>
               </div>
             </td>

src-ui/src/app/components/admin/tasks/tasks.component.spec.ts

@@ -896,9 +896,9 @@ describe('TasksComponent', () => {
   })
 
   it.each([
-    ['modify_tags', 12, 'Update tags', '12 documents'],
-    ['run_workflow', 1, 'Run workflow', '1 document'],
-    ['delete', 3, 'Move to trash', '3 documents'],
+    ['modify_tags', 12, 'Bulk operation: Update tags', '(12 documents)'],
+    ['run_workflow', 1, 'Run workflow', null],
+    ['delete', 3, 'Bulk operation: Move to trash', '(3 documents)'],
   ])(
     'shows the operation, document count and outcome for %s',
     (operation, count, label, summary) => {
@@ -921,7 +921,14 @@ describe('TasksComponent', () => {
 
       const name = fixture.nativeElement.querySelector('tbody .name-col')
       expect(name.textContent).toContain(label)
-      expect(name.textContent).toContain(summary)
+      const countLabel = name.querySelector('small.text-muted')
+      if (summary) {
+        expect(countLabel.textContent).toContain(summary)
+      } else {
+        expect(countLabel).toBeNull()
+        expect(name.textContent).not.toContain('Bulk operation:')
+      }
+      expect(name.textContent).not.toContain('·')
       expect(name.textContent).toContain('Web UI')
       expect(name.textContent).not.toContain(task.task_type_display)
       expect(
@@ -943,7 +950,8 @@ describe('TasksComponent', () => {
 
     const name = fixture.nativeElement.querySelector('tbody .name-col')
     expect(name.textContent).toContain('Document reprocessing')
-    expect(name.textContent).toContain('1 document')
+    expect(name.textContent).not.toContain('Bulk operation:')
+    expect(name.querySelector('small')).toBeNull()
     expect(component.taskResultMessage(task)).toBeNull()
   })
 

src-ui/src/app/components/admin/tasks/tasks.component.ts

@@ -435,11 +435,14 @@ export class TasksComponent
   }
 
   taskDisplayName(task: PaperlessTask): string {
-    return (
-      task.input_data?.filename?.toString() ||
-      this.taskOperationLabel(task) ||
-      task.task_type_display
-    )
+    const filename = task.input_data?.filename?.toString()
+    if (filename) return filename
+    const operation = this.taskOperationLabel(task)
+    const count = this.taskDocumentCount(task)
+    if (operation && count !== null && count > 1) {
+      return $localize`Bulk operation: ${operation}`
+    }
+    return operation || task.task_type_display
   }
 
   taskShowsSeparateTypeLabel(task: PaperlessTask): boolean {