Use "frequently used emojis" for autocompletion in composer (#8998)

Co-authored-by: grimhilt <grimhilt@users.noreply.github.com>
This commit is contained in:
grimhilt 2022-07-21 13:27:11 +00:00 committed by GitHub
parent 9edd49818c
commit 35ba389d61
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 38 additions and 3 deletions

View file

@ -29,8 +29,9 @@ import QueryMatcher from './QueryMatcher';
import { PillCompletion } from './Components';
import { ICompletion, ISelectionRange } from './Autocompleter';
import SettingsStore from "../settings/SettingsStore";
import { EMOJI, IEmoji } from '../emoji';
import { EMOJI, IEmoji, getEmojiFromUnicode } from '../emoji';
import { TimelineRenderingType } from '../contexts/RoomContext';
import * as recent from '../emojipicker/recent';
const LIMIT = 20;
@ -73,6 +74,7 @@ function colonsTrimmed(str: string): string {
export default class EmojiProvider extends AutocompleteProvider {
matcher: QueryMatcher<ISortedEmoji>;
nameMatcher: QueryMatcher<ISortedEmoji>;
private readonly recentlyUsed: IEmoji[];
constructor(room: Room, renderingType?: TimelineRenderingType) {
super({ commandRegex: EMOJI_REGEX, renderingType });
@ -87,6 +89,8 @@ export default class EmojiProvider extends AutocompleteProvider {
// For removing punctuation
shouldMatchWordsOnly: true,
});
this.recentlyUsed = Array.from(new Set(recent.get().map(getEmojiFromUnicode).filter(Boolean)));
}
async getCompletions(
@ -109,7 +113,7 @@ export default class EmojiProvider extends AutocompleteProvider {
// Do second match with shouldMatchWordsOnly in order to match against 'name'
completions = completions.concat(this.nameMatcher.match(matchedString));
const sorters = [];
let sorters = [];
// make sure that emoticons come first
sorters.push(c => score(matchedString, c.emoji.emoticon || ""));
@ -130,6 +134,15 @@ export default class EmojiProvider extends AutocompleteProvider {
sorters.push(c => c._orderBy);
completions = sortBy(uniq(completions), sorters);
completions = completions.slice(0, LIMIT);
// Do a second sort to place emoji matching with frequently used one on top
sorters = [];
this.recentlyUsed.forEach(emoji => {
sorters.push(c => score(emoji.shortcodes[0], c.emoji.shortcodes[0]));
});
completions = sortBy(uniq(completions), sorters);
completions = completions.map(c => ({
completion: c.emoji.unicode,
component: (
@ -138,7 +151,7 @@ export default class EmojiProvider extends AutocompleteProvider {
</PillCompletion>
),
range,
})).slice(0, LIMIT);
}));
}
return completions;
}