From 3f97bcecc0e193e0fc0cd4955026132edd60450c Mon Sep 17 00:00:00 2001
From: samunohito <46447427+samunohito@users.noreply.github.com>
Date: Sun, 10 Dec 2023 20:42:30 +0900
Subject: [PATCH] fix

---
 packages/frontend/src/pages/settings/reaction.vue |  2 +-
 packages/frontend/src/scripts/emoji-picker.ts     | 11 +++++++----
 packages/frontend/src/scripts/reaction-picker.ts  |  4 ++--
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/src/pages/settings/reaction.vue b/packages/frontend/src/pages/settings/reaction.vue
index 4af96f9f10..3d89b0bd4e 100644
--- a/packages/frontend/src/pages/settings/reaction.vue
+++ b/packages/frontend/src/pages/settings/reaction.vue
@@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <template>
 <div class="_gaps_m">
-	<FormSection first="true">
+	<FormSection :first="true">
 		<template #label>{{ i18n.ts.reactionDeckSettingTitle }}</template>
 		<template #description>{{ i18n.ts.reactionDeckSettingDescription }}</template>
 
diff --git a/packages/frontend/src/scripts/emoji-picker.ts b/packages/frontend/src/scripts/emoji-picker.ts
index 1397eb810a..3f3703fe29 100644
--- a/packages/frontend/src/scripts/emoji-picker.ts
+++ b/packages/frontend/src/scripts/emoji-picker.ts
@@ -24,20 +24,23 @@ class EmojiPicker {
 		// nop
 	}
 
+	/**
+	 * リアクションデッキ・絵文字デッキを動的に切り替えるための{@link ComputedRef}を作成する。
+	 */
 	private createDeckItemCompute(): ComputedRef<string[]> {
-		const itemPresetType = this.itemPresetType;
-		const useReactionDeckItems = defaultStore.reactiveState.useReactionDeckItems;
+		const itemPresetTypeRef = this.itemPresetType;
+		const useReactionDeckItemsRef = defaultStore.reactiveState.useReactionDeckItems;
 		const reactionsRef = defaultStore.reactiveState.reactions;
 		const emojisRef = defaultStore.reactiveState.emojiDeckItems;
 
 		return computed(() => {
-			switch (itemPresetType.value) {
+			switch (itemPresetTypeRef.value) {
 				case 'reactions':
 					return reactionsRef.value;
 				case 'emojis':
 					return emojisRef.value;
 				default:
-					return useReactionDeckItems.value ? reactionsRef.value : emojisRef.value;
+					return useReactionDeckItemsRef.value ? reactionsRef.value : emojisRef.value;
 			}
 		});
 	}
diff --git a/packages/frontend/src/scripts/reaction-picker.ts b/packages/frontend/src/scripts/reaction-picker.ts
index 3799544cd6..9b13e794f5 100644
--- a/packages/frontend/src/scripts/reaction-picker.ts
+++ b/packages/frontend/src/scripts/reaction-picker.ts
@@ -26,14 +26,14 @@ class ReactionPicker {
 			manualShowing: this.manualShowing,
 		}, {
 			done: reaction => {
-				this.onChosen!(reaction);
+				if (this.onChosen) this.onChosen(reaction);
 			},
 			close: () => {
 				this.manualShowing.value = false;
 			},
 			closed: () => {
 				this.src.value = null;
-				this.onClosed!();
+				if (this.onClosed) this.onClosed();
 			},
 		});
 	}