Fix regression in emoji picker order mangling after clearing filter (#10854)

* Add regression test for emoji picker order mangling after clearing filter

* Fix regression in emoji picker order mangling after clearing filter

* Iterate

* Update src/components/views/emojipicker/EmojiPicker.tsx
This commit is contained in:
Michael Telatynski 2023-05-11 14:24:39 +01:00 committed by GitHub
parent d944422417
commit 68ff19fb4b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 42 additions and 17 deletions

View file

@ -268,25 +268,30 @@ class EmojiPicker extends React.Component<IProps, IState> {
} else {
emojis = cat.id === "recent" ? this.recentlyUsed : DATA_BY_CATEGORY[cat.id];
}
emojis = emojis.filter((emoji) => this.emojiMatchesFilter(emoji, lcFilter));
emojis = emojis.sort((a, b) => {
const indexA = a.shortcodes[0].indexOf(lcFilter);
const indexB = b.shortcodes[0].indexOf(lcFilter);
// Prioritize emojis containing the filter in its shortcode
if (indexA == -1 || indexB == -1) {
return indexB - indexA;
}
if (lcFilter !== "") {
emojis = emojis.filter((emoji) => this.emojiMatchesFilter(emoji, lcFilter));
// Copy the array to not clobber the original unfiltered sorting
emojis = [...emojis].sort((a, b) => {
const indexA = a.shortcodes[0].indexOf(lcFilter);
const indexB = b.shortcodes[0].indexOf(lcFilter);
// If both emojis start with the filter
// put the shorter emoji first
if (indexA == 0 && indexB == 0) {
return a.shortcodes[0].length - b.shortcodes[0].length;
}
// Prioritize emojis containing the filter in its shortcode
if (indexA == -1 || indexB == -1) {
return indexB - indexA;
}
// If both emojis start with the filter
// put the shorter emoji first
if (indexA == 0 && indexB == 0) {
return a.shortcodes[0].length - b.shortcodes[0].length;
}
// Prioritize emojis starting with the filter
return indexA - indexB;
});
}
// Prioritize emojis starting with the filter
return indexA - indexB;
});
this.memoizedDataByCategory[cat.id] = emojis;
cat.enabled = emojis.length > 0;
// The setState below doesn't re-render the header and we already have the refs for updateVisibility, so...