Make task names display noice

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

@@ -76,7 +76,16 @@
               <label class="form-check-label" for="task{{task.id}}"></label>
             </div>
           </td>
-          <td class="overflow-auto name-col">{{ task.input_data?.filename }}</td>
+          <td class="overflow-auto name-col">
+            <div>{{ taskDisplayName(task) }}</div>
+            <div class="small text-muted">
+              @if (taskShowsSeparateTypeLabel(task)) {
+                <span>{{ task.task_type_display }}</span>
+                <span class="mx-1">&bull;</span>
+              }
+              <span>{{ task.trigger_source_display }}</span>
+            </div>
+          </td>
           <td class="d-none d-lg-table-cell">{{ task.date_created | customDate:'short' }}</td>
           @if (activeTab !== 'started' && activeTab !== 'queued') {
             <td class="d-none d-lg-table-cell">

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

@@ -134,6 +134,22 @@ const tasks: PaperlessTask[] = [
     acknowledged: false,
     related_document_ids: [],
   },
+  {
+    id: 461,
+    task_id: 'bb79efb3-1e78-4f31-b4be-0966620b0ce1',
+    input_data: {},
+    date_created: new Date('2023-06-07T03:54:35.694916Z'),
+    date_done: null,
+    task_type: PaperlessTaskType.SanityCheck,
+    task_type_display: 'Sanity Check',
+    trigger_source: PaperlessTaskTriggerSource.System,
+    trigger_source_display: 'System',
+    status: PaperlessTaskStatus.Started,
+    status_display: 'Started',
+    result_message: null,
+    acknowledged: false,
+    related_document_ids: [],
+  },
 ]
 
 describe('TasksComponent', () => {
@@ -185,9 +201,7 @@ describe('TasksComponent', () => {
     jest.useFakeTimers()
     fixture.detectChanges()
     httpTestingController
-      .expectOne(
-        `${environment.apiBaseUrl}tasks/?task_type=consume_file&acknowledged=false`
-      )
+      .expectOne(`${environment.apiBaseUrl}tasks/?acknowledged=false`)
       .flush(tasks)
   })
 
@@ -368,6 +382,21 @@ describe('TasksComponent', () => {
     ).toEqual(2) // 1 task x 2 lines
   })
 
+  it('should fall back to task type when filename is unavailable', () => {
+    component.activeTab = TaskTab.Started
+    fixture.detectChanges()
+
+    const nameColumn = fixture.debugElement.queryAll(
+      By.css('tbody td.name-col')
+    )
+    const sanityTaskRow = nameColumn.find((cell) =>
+      cell.nativeElement.textContent.includes('Sanity Check')
+    )
+
+    expect(sanityTaskRow.nativeElement.textContent).toContain('Sanity Check')
+    expect(sanityTaskRow.nativeElement.textContent).toContain('System')
+  })
+
   it('should filter tasks by result', () => {
     component.activeTab = TaskTab.Failed
     fixture.detectChanges()

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

@@ -188,6 +188,14 @@ export class TasksComponent
       : this.selectedTasks.add(task.id)
   }
 
+  taskDisplayName(task: PaperlessTask): string {
+    return task.input_data?.filename?.toString() || task.task_type_display
+  }
+
+  taskShowsSeparateTypeLabel(task: PaperlessTask): boolean {
+    return this.taskDisplayName(task) !== task.task_type_display
+  }
+
   get currentTasks(): PaperlessTask[] {
     let tasks: PaperlessTask[] = []
     switch (this.activeTab) {
@@ -207,7 +215,7 @@ export class TasksComponent
     if (this._filterText.length) {
       tasks = tasks.filter((t) => {
         if (this.filterTargetID == TaskFilterTargetID.Name) {
-          return (t.input_data?.filename as string)
+          return this.taskDisplayName(t)
             ?.toLowerCase()
             .includes(this._filterText.toLowerCase())
         } else if (this.filterTargetID == TaskFilterTargetID.Result) {