Enhance(frontend): 絵文字ピッカー/オートコンプリートで完全一致の絵文字を優先するように (#12928)

* 絵文字ピッカー/オートコンプリートで完全一致の絵文字を優先するように

* update CHANGELOG.md

* improve performance

CHANGELOG.md

@@ -25,6 +25,7 @@
 - Enhance: 管理者の場合はAPI tokenの発行画面で管理機能に関する権限を付与できるように
 - Enhance: AiScriptを0.17.0に更新　[CHANGELOG](https://github.com/aiscript-dev/aiscript/blob/bb89d132b633a622d3cb0eff0d0cc7e476c0cfdd/CHANGELOG.md)
   - 配列の範囲外・非整数のインデックスへの代入が完全禁止になるので注意
+- Enhance: 絵文字ピッカー・オートコンプリートで、完全一致した絵文字を優先的に表示するように
 - Fix: ネイティブモードの絵文字がモノクロにならないように
 - Fix: v2023.12.0で追加された「モデレーターがユーザーのアイコンもしくはバナー画像を未設定状態にできる機能」が管理画面上で正しく表示されていない問題を修正
 - Fix: AiScriptの`readline`関数が不正な値を返すことがある問題のv2023.12.0時点での修正がPlay以外に適用されていないのを修正

packages/frontend/src/components/MkAutocomplete.vue

@@ -262,14 +262,23 @@ function emojiAutoComplete(query: string | null, emojiDb: EmojiDef[], max = 30):
 	}
 
 	const matched = new Map<string, EmojiScore>();
+	// 完全一致（エイリアス込み）
+	emojiDb.some(x => {
+		if (x.name === query && !matched.has(x.aliasOf ?? x.name)) {
+			matched.set(x.aliasOf ?? x.name, { emoji: x, score: query.length + 2 });
+		}
+		return matched.size === max;
+	});
 
 	// 前方一致（エイリアスなし）
+	if (matched.size < max) {
 		emojiDb.some(x => {
 			if (x.name.startsWith(query) && !x.aliasOf) {
 				matched.set(x.name, { emoji: x, score: query.length + 1 });
 			}
 			return matched.size === max;
 		});
+	}
 
 	// 前方一致（エイリアス込み）
 	if (matched.size < max) {

packages/frontend/src/components/MkEmojiPicker.vue

@@ -221,6 +221,19 @@ watch(q, () => {
 				}
 			}
 		} else {
+			if (customEmojisMap.has(newQ)) {
+				matches.add(customEmojisMap.get(newQ)!);
+			}
+			if (matches.size >= max) return matches;
+
+			for (const emoji of emojis) {
+				if (emoji.aliases.some(alias => alias === newQ)) {
+					matches.add(emoji);
+					if (matches.size >= max) break;
+				}
+			}
+			if (matches.size >= max) return matches;
+
 			for (const emoji of emojis) {
 				if (emoji.name.startsWith(newQ)) {
 					matches.add(emoji);