feat: make it toggleable whether to disable emojis in notifications (#9880)

I talked about feature #9865 on my fedi account and received a comment like, "I don't care about emoji reactions in my timelines, but I do care what reactions I get!"

Adding too many options is bad, but I agreed that making it toggleable whether to disable emojis in notifications is helpful, so I added this feature. This allows you to check emoji reactions to your posts in notifications while using the simple UI. I'd say this provides an experience that neither Mastodon nor Misskey has.

The new setting item shows up only when you disable emoji reactions.

Co-authored-by: naskya <m@naskya.net>
Reviewed-on: https://codeberg.org/calckey/calckey/pulls/9880
Co-authored-by: naskya <naskya@noreply.codeberg.org>
Co-committed-by: naskya <naskya@noreply.codeberg.org>
This commit is contained in:
naskya 2023-04-20 07:57:36 +00:00 committed by Kainoa Kanter
parent b60a3b509e
commit e0d76ef8ef
8 changed files with 25 additions and 4 deletions

View File

@ -115,6 +115,7 @@ sensitive: "NSFW"
add: "Add" add: "Add"
reaction: "Reactions" reaction: "Reactions"
enableEmojiReactions: "Enable emoji reactions" enableEmojiReactions: "Enable emoji reactions"
showEmojisInReactionNotifications: "Show emojis in reaction notifications"
reactionSetting: "Reactions to show in the reaction picker" reactionSetting: "Reactions to show in the reaction picker"
reactionSettingDescription2: "Drag to reorder, click to delete, press \"+\" to add." reactionSettingDescription2: "Drag to reorder, click to delete, press \"+\" to add."
rememberNoteVisibility: "Remember post visibility settings" rememberNoteVisibility: "Remember post visibility settings"

View File

@ -110,6 +110,7 @@ sensitive: "閲覧注意"
add: "追加" add: "追加"
reaction: "リアクション" reaction: "リアクション"
enableEmojiReactions: "絵文字リアクションを有効にする" enableEmojiReactions: "絵文字リアクションを有効にする"
showEmojisInReactionNotifications: "自分の投稿に対するリアクションの通知で絵文字を表示する"
reactionSetting: "ピッカーに表示するリアクション" reactionSetting: "ピッカーに表示するリアクション"
reactionSettingDescription2: "ドラッグして並び替え、クリックして削除、+を押して追加します。" reactionSettingDescription2: "ドラッグして並び替え、クリックして削除、+を押して追加します。"
rememberNoteVisibility: "公開範囲を記憶する" rememberNoteVisibility: "公開範囲を記憶する"

View File

@ -108,6 +108,7 @@ sensitive: "敏感内容"
add: "添加" add: "添加"
reaction: "回应" reaction: "回应"
enableEmojiReaction: "启用表情符号回应" enableEmojiReaction: "启用表情符号回应"
showEmojisInReactionNotifications: "在回应通知中显示表情符号"
reactionSetting: "在选择器中显示的回应" reactionSetting: "在选择器中显示的回应"
reactionSettingDescription2: "拖动重新排序,单击删除,点击 + 添加。" reactionSettingDescription2: "拖动重新排序,单击删除,点击 + 添加。"
rememberNoteVisibility: "保存上次设置的可见性" rememberNoteVisibility: "保存上次设置的可见性"

View File

@ -108,6 +108,7 @@ sensitive: "敏感內容"
add: "新增" add: "新增"
reaction: "情感" reaction: "情感"
enableEmojiReaction: "啟用表情符號反應" enableEmojiReaction: "啟用表情符號反應"
showEmojisInReactionNotifications: "在反應通知中顯示表情符號"
reactionSetting: "在選擇器中顯示反應" reactionSetting: "在選擇器中顯示反應"
reactionSettingDescription2: "拖動以重新列序,點擊以刪除,按下 + 添加。" reactionSettingDescription2: "拖動以重新列序,點擊以刪除,按下 + 添加。"
rememberNoteVisibility: "記住貼文可見性" rememberNoteVisibility: "記住貼文可見性"

View File

@ -66,8 +66,7 @@
<!-- notification.reaction null になることはまずないがここでoptional chaining使うと一部ブラウザで刺さるので念の為 --> <!-- notification.reaction null になることはまずないがここでoptional chaining使うと一部ブラウザで刺さるので念の為 -->
<XReactionIcon <XReactionIcon
v-else-if=" v-else-if="
notification.type === 'reaction' && showEmojiReactions && notification.type === 'reaction'
defaultStore.state.enableEmojiReactions
" "
ref="reactionRef" ref="reactionRef"
:reaction=" :reaction="
@ -83,8 +82,7 @@
/> />
<XReactionIcon <XReactionIcon
v-else-if=" v-else-if="
notification.type === 'reaction' && !showEmojiReactions && notification.type === 'reaction'
!defaultStore.state.enableEmojiReactions
" "
:reaction="defaultReaction" :reaction="defaultReaction"
:no-style="true" :no-style="true"
@ -301,6 +299,9 @@ const props = withDefaults(
const elRef = ref<HTMLElement>(null); const elRef = ref<HTMLElement>(null);
const reactionRef = ref(null); const reactionRef = ref(null);
const showEmojiReactions =
defaultStore.state.enableEmojiReactions ||
defaultStore.state.showEmojisInReactionNotifications;
const defaultReaction = ["⭐", "👍", "❤️"].includes(instance.defaultReaction) const defaultReaction = ["⭐", "👍", "❤️"].includes(instance.defaultReaction)
? instance.defaultReaction ? instance.defaultReaction
: "⭐"; : "⭐";

View File

@ -115,6 +115,7 @@ const defaultStoreSaveKeys: (keyof (typeof defaultStore)["state"])[] = [
"showAdminUpdates", "showAdminUpdates",
"enableCustomKaTeXMacro", "enableCustomKaTeXMacro",
"enableEmojiReactions", "enableEmojiReactions",
"showEmojisInReactionNotifications",
]; ];
const coldDeviceStorageSaveKeys: (keyof typeof ColdDeviceStorage.default)[] = [ const coldDeviceStorageSaveKeys: (keyof typeof ColdDeviceStorage.default)[] = [
"lightTheme", "lightTheme",

View File

@ -86,6 +86,14 @@
</div> </div>
</FormSection> </FormSection>
</div> </div>
<div v-else>
<FormSwitch
v-model="showEmojisInReactionNotifications"
class="_formBlock"
>
{{ i18n.ts.showEmojisInReactionNotifications }}
</FormSwitch>
</div>
</div> </div>
</template> </template>
@ -132,6 +140,9 @@ const reactionPickerUseDrawerForMobile = $computed(
const enableEmojiReactions = $computed( const enableEmojiReactions = $computed(
defaultStore.makeGetterSetter("enableEmojiReactions") defaultStore.makeGetterSetter("enableEmojiReactions")
); );
const showEmojisInReactionNotifications = $computed(
defaultStore.makeGetterSetter("showEmojisInReactionNotifications")
);
function save() { function save() {
defaultStore.set("reactions", reactions); defaultStore.set("reactions", reactions);

View File

@ -298,6 +298,10 @@ export const defaultStore = markRaw(
where: "account", where: "account",
default: true, default: true,
}, },
showEmojisInReactionNotifications: {
where: "account",
default: true,
},
}), }),
); );