e9e52e0dfe
This doesn’t include Ember Data, as we are still back on 3.12. Most changes are deprecation updates, linting fixes, and dependencies. It can be read commit-by-commit, though many of them are mechanical and skimmable. For the new linting exclusions, I’ve added them to the Tech Debt list. The decrease in test count is because linting is no longer included in ember test. There’s a new deprecation warning in the logs that can be fixed by updating Ember Power Select but when I tried that it caused it to render incorrectly, so I decided to ignore it for now and address it separately.
139 lines
4 KiB
JavaScript
139 lines
4 KiB
JavaScript
import Mixin from '@ember/object/mixin';
|
|
import { get, computed } from '@ember/object';
|
|
import { reads } from '@ember/object/computed';
|
|
import Fuse from 'fuse.js';
|
|
|
|
/**
|
|
Searchable mixin
|
|
|
|
Simple search filtering behavior for a list of objects.
|
|
|
|
Properties to override:
|
|
- searchTerm: the string to use as a query
|
|
- searchProps: the props on each object to search
|
|
-- exactMatchSearchProps: the props for exact search when props are different per search type
|
|
-- regexSearchProps: the props for regex search when props are different per search type
|
|
-- fuzzySearchProps: the props for fuzzy search when props are different per search type
|
|
- exactMatchEnabled: (true) disable to not use the exact match search type
|
|
- fuzzySearchEnabled: (false) enable to use the fuzzy search type
|
|
- regexEnabled: (true) disable to disable the regex search type
|
|
- listToSearch: the list of objects to search
|
|
|
|
Properties provided:
|
|
- listSearched: a subset of listToSearch of items that meet the search criteria
|
|
*/
|
|
// eslint-disable-next-line ember/no-new-mixins
|
|
export default Mixin.create({
|
|
searchTerm: '',
|
|
listToSearch: computed(function() {
|
|
return [];
|
|
}),
|
|
|
|
searchProps: null,
|
|
exactMatchSearchProps: reads('searchProps'),
|
|
regexSearchProps: reads('searchProps'),
|
|
fuzzySearchProps: reads('searchProps'),
|
|
|
|
// Three search modes
|
|
exactMatchEnabled: true,
|
|
fuzzySearchEnabled: false,
|
|
includeFuzzySearchMatches: false,
|
|
regexEnabled: true,
|
|
|
|
// Search should reset pagination. Not every instance of
|
|
// search will be paired with pagination, but it's still
|
|
// preferable to generalize this rather than risking it being
|
|
// forgotten on a single page.
|
|
resetPagination() {
|
|
if (this.currentPage != null) {
|
|
this.set('currentPage', 1);
|
|
}
|
|
},
|
|
|
|
fuse: computed('fuzzySearchProps.[]', 'includeFuzzySearchMatches', 'listToSearch.[]', function() {
|
|
return new Fuse(this.listToSearch, {
|
|
shouldSort: true,
|
|
threshold: 0.4,
|
|
location: 0,
|
|
distance: 100,
|
|
tokenize: true,
|
|
matchAllTokens: true,
|
|
maxPatternLength: 32,
|
|
minMatchCharLength: 1,
|
|
includeMatches: this.includeFuzzySearchMatches,
|
|
keys: this.fuzzySearchProps || [],
|
|
getFn(item, key) {
|
|
return get(item, key);
|
|
},
|
|
});
|
|
}),
|
|
|
|
listSearched: computed(
|
|
'exactMatchEnabled',
|
|
'exactMatchSearchProps.[]',
|
|
'fuse',
|
|
'fuzzySearchEnabled',
|
|
'fuzzySearchProps.[]',
|
|
'includeFuzzySearchMatches',
|
|
'listToSearch.[]',
|
|
'regexEnabled',
|
|
'regexSearchProps.[]',
|
|
'searchTerm',
|
|
function() {
|
|
const searchTerm = this.searchTerm.trim();
|
|
|
|
if (!searchTerm || !searchTerm.length) {
|
|
return this.listToSearch;
|
|
}
|
|
|
|
const results = [];
|
|
|
|
if (this.exactMatchEnabled) {
|
|
results.push(
|
|
...exactMatchSearch(searchTerm, this.listToSearch, this.exactMatchSearchProps)
|
|
);
|
|
}
|
|
|
|
if (this.fuzzySearchEnabled) {
|
|
let fuseSearchResults = this.fuse.search(searchTerm);
|
|
|
|
if (this.includeFuzzySearchMatches) {
|
|
fuseSearchResults = fuseSearchResults.map(result => {
|
|
const item = result.item;
|
|
item.set('fuzzySearchMatches', result.matches);
|
|
return item;
|
|
});
|
|
}
|
|
|
|
results.push(...fuseSearchResults);
|
|
}
|
|
|
|
if (this.regexEnabled) {
|
|
results.push(...regexSearch(searchTerm, this.listToSearch, this.regexSearchProps));
|
|
}
|
|
|
|
return results.uniq();
|
|
}
|
|
),
|
|
});
|
|
|
|
function exactMatchSearch(term, list, keys) {
|
|
if (term.length) {
|
|
return list.filter(item => keys.some(key => get(item, key) === term));
|
|
}
|
|
}
|
|
|
|
function regexSearch(term, list, keys) {
|
|
if (term.length) {
|
|
try {
|
|
const regex = new RegExp(term, 'i');
|
|
// Test the value of each key for each object against the regex
|
|
// All that match are returned.
|
|
return list.filter(item => keys.some(key => regex.test(get(item, key))));
|
|
} catch (e) {
|
|
// Swallow the error; most likely due to an eager search of an incomplete regex
|
|
}
|
|
return [];
|
|
}
|
|
}
|