added pgup/pgdown support and fuzzy search to the profile selector - fixes #6872

This commit is contained in:
Eugene Pankov 2022-09-04 23:33:07 +02:00
parent 30906866b4
commit 27e023a9ee
No known key found for this signature in database
GPG Key ID: 5896FCBBDD1CF4F4
3 changed files with 27 additions and 9 deletions

View File

@ -20,6 +20,7 @@
"@ngx-translate/core": "^14.0.0", "@ngx-translate/core": "^14.0.0",
"bootstrap": "^4.1.3", "bootstrap": "^4.1.3",
"deepmerge": "^4.1.1", "deepmerge": "^4.1.1",
"fuzzy-search": "^3.2.1",
"js-yaml": "^4.0.0", "js-yaml": "^4.0.0",
"messageformat": "^2.3.0", "messageformat": "^2.3.0",
"mixpanel": "^0.13.0", "mixpanel": "^0.13.0",

View File

@ -1,6 +1,7 @@
import { firstBy } from 'thenby' import { firstBy } from 'thenby'
import { Component, Input, HostListener, ViewChildren, QueryList, ElementRef } from '@angular/core' // eslint-disable-line @typescript-eslint/no-unused-vars import { Component, Input, HostListener, ViewChildren, QueryList, ElementRef } from '@angular/core' // eslint-disable-line @typescript-eslint/no-unused-vars
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap' import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import FuzzySearch from 'fuzzy-search'
import { SelectorOption } from '../api/selector' import { SelectorOption } from '../api/selector'
/** @hidden */ /** @hidden */
@ -28,18 +29,21 @@ export class SelectorModalComponent<T> {
} }
@HostListener('keydown', ['$event']) onKeyUp (event: KeyboardEvent): void { @HostListener('keydown', ['$event']) onKeyUp (event: KeyboardEvent): void {
if (event.key === 'ArrowUp') { if (event.key === 'PageUp' || event.key === 'ArrowUp' && event.metaKey) {
this.selectedIndex -= 10
event.preventDefault()
} else if (event.key === 'PageDown' || event.key === 'ArrowDown' && event.metaKey) {
this.selectedIndex += 10
event.preventDefault()
} else if (event.key === 'ArrowUp') {
this.selectedIndex-- this.selectedIndex--
event.preventDefault() event.preventDefault()
} } else if (event.key === 'ArrowDown') {
if (event.key === 'ArrowDown') {
this.selectedIndex++ this.selectedIndex++
event.preventDefault() event.preventDefault()
} } else if (event.key === 'Enter') {
if (event.key === 'Enter') {
this.selectOption(this.filteredOptions[this.selectedIndex]) this.selectOption(this.filteredOptions[this.selectedIndex])
} } else if (event.key === 'Escape') {
if (event.key === 'Escape') {
this.close() this.close()
} }
if (event.key === 'Backspace' && this.canEditSelected()) { if (event.key === 'Backspace' && this.canEditSelected()) {
@ -64,9 +68,17 @@ export class SelectorModalComponent<T> {
) )
.filter(x => !x.freeInputPattern) .filter(x => !x.freeInputPattern)
} else { } else {
const terms = f.split(' ')
// eslint-disable-next-line @typescript-eslint/restrict-plus-operands // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
this.filteredOptions = this.options.filter(x => x.freeInputPattern ?? this.filterMatches(x, terms)) this.filteredOptions = new FuzzySearch(
this.options,
['name', 'group', 'description'],
{ sort: true },
).search(f)
const freeOption = this.options.find(x => x.freeInputPattern)
if (freeOption && !this.filteredOptions.includes(freeOption)) {
this.filteredOptions.push(freeOption)
}
} }
this.selectedIndex = Math.max(0, this.selectedIndex) this.selectedIndex = Math.max(0, this.selectedIndex)
this.selectedIndex = Math.min(this.filteredOptions.length - 1, this.selectedIndex) this.selectedIndex = Math.min(this.filteredOptions.length - 1, this.selectedIndex)

View File

@ -43,6 +43,11 @@ deepmerge@^4.1.1:
resolved "https://registry.yarnpkg.com/filesize/-/filesize-6.3.0.tgz#dff53cfb3f104c9e422f346d53be8dbcc971bf11" resolved "https://registry.yarnpkg.com/filesize/-/filesize-6.3.0.tgz#dff53cfb3f104c9e422f346d53be8dbcc971bf11"
integrity sha512-ytx0ruGpDHKWVoiui6+BY/QMNngtDQ/pJaFwfBpQif0J63+E8DLdFyqS3NkKQn7vIruUEpoGD9JUJSg7Kp+I0g== integrity sha512-ytx0ruGpDHKWVoiui6+BY/QMNngtDQ/pJaFwfBpQif0J63+E8DLdFyqS3NkKQn7vIruUEpoGD9JUJSg7Kp+I0g==
fuzzy-search@^3.2.1:
version "3.2.1"
resolved "https://registry.yarnpkg.com/fuzzy-search/-/fuzzy-search-3.2.1.tgz#65d5faad6bc633aee86f1898b7788dfe312ac6c9"
integrity sha512-vAcPiyomt1ioKAsAL2uxSABHJ4Ju/e4UeDM+g1OlR0vV4YhLGMNsdLNvZTpEDY4JCSt0E4hASCNM5t2ETtsbyg==
https-proxy-agent@5.0.0: https-proxy-agent@5.0.0:
version "5.0.0" version "5.0.0"
resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz#e2a90542abb68a762e0a0850f6c9edadfd8506b2" resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz#e2a90542abb68a762e0a0850f6c9edadfd8506b2"