Feature: global search, keyboard shortcuts / hotkey support (#6449)

src-ui/src/app/components/document-list/document-list.component.ts

@@ -32,6 +32,7 @@ import { ToastService } from 'src/app/services/toast.service'
 import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
 import { FilterEditorComponent } from './filter-editor/filter-editor.component'
 import { SaveViewConfigDialogComponent } from './save-view-config-dialog/save-view-config-dialog.component'
+import { HotKeyService } from 'src/app/services/hot-key.service'
 
 @Component({
   selector: 'pngx-document-list',
@@ -55,6 +56,7 @@ export class DocumentListComponent
     private consumerStatusService: ConsumerStatusService,
     public openDocumentsService: OpenDocumentsService,
     public settingsService: SettingsService,
+    private hotKeyService: HotKeyService,
     public permissionService: PermissionsService
   ) {
     super()
@@ -215,6 +217,50 @@ export class DocumentListComponent
           this.unmodifiedFilterRules = []
         }
       })
+
+    this.hotKeyService
+      .addShortcut({
+        keys: 'escape',
+        description: $localize`Reset filters / selection`,
+      })
+      .pipe(takeUntil(this.unsubscribeNotifier))
+      .subscribe(() => {
+        if (this.list.selected.size > 0) {
+          this.list.selectNone()
+        } else if (this.isFiltered) {
+          this.filterEditor.resetSelected()
+        }
+      })
+
+    this.hotKeyService
+      .addShortcut({ keys: 'a', description: $localize`Select all` })
+      .pipe(takeUntil(this.unsubscribeNotifier))
+      .subscribe(() => {
+        this.list.selectAll()
+      })
+
+    this.hotKeyService
+      .addShortcut({ keys: 'p', description: $localize`Select page` })
+      .pipe(takeUntil(this.unsubscribeNotifier))
+      .subscribe(() => {
+        this.list.selectPage()
+      })
+
+    this.hotKeyService
+      .addShortcut({
+        keys: 'o',
+        description: $localize`Open first [selected] document`,
+      })
+      .pipe(takeUntil(this.unsubscribeNotifier))
+      .subscribe(() => {
+        if (this.list.documents.length > 0) {
+          if (this.list.selected.size > 0) {
+            this.openDocumentDetail(Array.from(this.list.selected)[0])
+          } else {
+            this.openDocumentDetail(this.list.documents[0])
+          }
+        }
+      })
   }
 
   ngOnDestroy() {
@@ -297,8 +343,11 @@ export class DocumentListComponent
     })
   }
 
-  openDocumentDetail(document: Document) {
-    this.router.navigate(['documents', document.id])
+  openDocumentDetail(document: Document | number) {
+    this.router.navigate([
+      'documents',
+      typeof document === 'number' ? document : document.id,
+    ])
   }
 
   toggleSelected(document: Document, event: MouseEvent): void {