lgcosta/paperless-ngx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove ngbdropdown keyboard events workaround

Browse Source
This commit is contained in:
shamoon 2024-05-10 12:56:03 -07:00
parent 18e78964f3
commit 654c4c867c
3 changed files with 7 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src-ui/src/app/components/app-frame/global-search/global-search.component.html
View File

@ -10,7 +10,8 @@
spellcheck="false" spellcheck="false"
[(ngModel)]="query" [(ngModel)]="query"
(ngModelChange)="this.queryDebounce.next($event)" (ngModelChange)="this.queryDebounce.next($event)"
(keydown)="searchInputKeyDown($event)"> (keydown)="searchInputKeyDown($event)"
ngbDropdownAnchor>
<div class="position-absolute top-50 end-0 translate-middle"> <div class="position-absolute top-50 end-0 translate-middle">
@if (loading) { @if (loading) {
<div class="spinner-border spinner-border-sm text-muted mt-1"></div> <div class="spinner-border spinner-border-sm text-muted mt-1"></div>

7
src-ui/src/app/components/app-frame/global-search/global-search.component.spec.ts
View File

@ -475,13 +475,6 @@ describe('GlobalSearchComponent', () => {
expect(focusSpy).toHaveBeenCalled() expect(focusSpy).toHaveBeenCalled()
}) })
it('should prevent event propagation for keyboard events on buttons that are not arrows', () => {
const event = { stopImmediatePropagation: jest.fn(), key: 'Enter' }
const stopPropagationSpy = jest.spyOn(event, 'stopImmediatePropagation')
component.onButtonKeyDown(event as any)
expect(stopPropagationSpy).toHaveBeenCalled()
})
it('should support explicit advanced search', () => { it('should support explicit advanced search', () => {
const qfSpy = jest.spyOn(documentListViewService, 'quickFilter') const qfSpy = jest.spyOn(documentListViewService, 'quickFilter')
component.query = 'test' component.query = 'test'

18
src-ui/src/app/components/app-frame/global-search/global-search.component.ts
View File

@ -88,7 +88,7 @@ export class GlobalSearchComponent implements OnInit {
}) })
} }
ngOnInit() { public ngOnInit() {
this.hotkeyService this.hotkeyService
.addShortcut({ keys: '/', description: $localize`Global search` }) .addShortcut({ keys: '/', description: $localize`Global search` })
.subscribe(() => { .subscribe(() => {
@ -241,7 +241,7 @@ export class GlobalSearchComponent implements OnInit {
item.nativeElement.focus() item.nativeElement.focus()
} }
onItemHover(event: MouseEvent) { public onItemHover(event: MouseEvent) {
const item: ElementRef = this.resultItems const item: ElementRef = this.resultItems
.toArray() .toArray()
.find((item) => item.nativeElement === event.currentTarget) .find((item) => item.nativeElement === event.currentTarget)
@ -249,7 +249,7 @@ export class GlobalSearchComponent implements OnInit {
this.setCurrentItem() this.setCurrentItem()
} }
onButtonHover(event: MouseEvent) { public onButtonHover(event: MouseEvent) {
;(event.currentTarget as HTMLElement).focus() ;(event.currentTarget as HTMLElement).focus()
} }
@ -289,7 +289,7 @@ export class GlobalSearchComponent implements OnInit {
} }
} }
dropdownKeyDown(event: KeyboardEvent) { public dropdownKeyDown(event: KeyboardEvent) {
if ( if (
this.searchResults?.total && this.searchResults?.total &&
this.resultsDropdown.isOpen() && this.resultsDropdown.isOpen() &&
@ -332,18 +332,10 @@ export class GlobalSearchComponent implements OnInit {
} }
} }
onButtonKeyDown(event: KeyboardEvent) { public onButtonKeyDown(event: KeyboardEvent) {
if (event.key === 'Enter' && (event.metaKey || event.ctrlKey)) { if (event.key === 'Enter' && (event.metaKey || event.ctrlKey)) {
event.target.dispatchEvent(new MouseEvent('click', { ctrlKey: true })) event.target.dispatchEvent(new MouseEvent('click', { ctrlKey: true }))
} }
// prevents ngBootstrap issue with keydown events
if (
!['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft', 'Escape'].includes(
event.key
)
) {
event.stopImmediatePropagation()
}
} }
public onDropdownOpenChange(open: boolean) { public onDropdownOpenChange(open: boolean) {