From 90c735f234e5caeb27466d6688c83187e73be6ac Mon Sep 17 00:00:00 2001 From: samunohito <46447427+samunohito@users.noreply.github.com> Date: Sat, 9 Dec 2023 13:02:01 +0900 Subject: [PATCH] =?UTF-8?q?=E7=B5=B5=E6=96=87=E5=AD=97=E3=83=87=E3=83=83?= =?UTF-8?q?=E3=82=AD=E3=81=AE=E4=BD=9C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- locales/index.d.ts | 9 +- locales/ja-JP.yml | 9 +- .../frontend/src/components/MkEmojiPicker.vue | 29 +- .../src/components/MkEmojiPickerDialog.vue | 3 + .../frontend/src/components/form/section.vue | 9 +- .../pages/settings/preferences-backups.vue | 1 + .../frontend/src/pages/settings/reaction.vue | 254 ++++++++++++------ packages/frontend/src/scripts/emoji-picker.ts | 34 ++- .../frontend/src/scripts/reaction-picker.ts | 5 +- packages/frontend/src/store.ts | 8 + 10 files changed, 254 insertions(+), 107 deletions(-) diff --git a/locales/index.d.ts b/locales/index.d.ts index 846a6d503d..4dafde8c0b 100644 --- a/locales/index.d.ts +++ b/locales/index.d.ts @@ -124,7 +124,14 @@ export interface Locale { "add": string; "reaction": string; "reactions": string; - "reactionSetting": string; + "reactionDeckSettingTitle": string; + "reactionDeckSettingDescription": string; + "emojiDeckSettingTitle": string; + "emojiDeckSettingDescription": string; + "diversionReactionDeckEmojisTitle": string; + "diversionReactionDeckEmojisDescription": string; + "diversionReactionDeckSettingCaption": string; + "diversionReactionDeckSettingDescription": string; "reactionSettingDescription2": string; "rememberNoteVisibility": string; "attachCancel": string; diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 0d84440bc8..c934d43d5f 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -121,7 +121,14 @@ sensitive: "センシティブ" add: "追加" reaction: "リアクション" reactions: "リアクション" -reactionSetting: "ピッカーに表示するリアクション" +reactionDeckSettingTitle: "リアクションデッキ" +reactionDeckSettingDescription: "ノートの＋ボタンから使用するリアクションデッキの設定です。" +emojiDeckSettingTitle: "絵文字デッキ" +emojiDeckSettingDescription: "投稿時に使用する絵文字デッキの設定です。" +diversionReactionDeckEmojisTitle: "ピッカーの表示設定" +diversionReactionDeckEmojisDescription: "ピッカーの表示についての設定を行います。この設定はリアクションピッカーと絵文字ピッカーで共通です。" +diversionReactionDeckSettingCaption: "リアクションデッキと同じ設定を使う" +diversionReactionDeckSettingDescription: "絵文字デッキの設定をリアクションデッキと同じにします。絵文字デッキの設定内容そのものは消えません。" reactionSettingDescription2: "ドラッグして並び替え、クリックして削除、＋を押して追加します。" rememberNoteVisibility: "公開範囲を記憶する" attachCancel: "添付取り消し" diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue index b5e5a0260c..dab2b984f3 100644 --- a/packages/frontend/src/components/MkEmojiPicker.vue +++ b/packages/frontend/src/components/MkEmojiPicker.vue @@ -77,8 +77,8 @@ SPDX-License-Identifier: AGPL-3.0-only :key="`custom:${child.value}`" :initialShown="false" :emojis="computed(() => customEmojis.filter(e => child.value === '' ? (e.category === 'null' || !e.category) : e.category === child.value).filter(filterAvailable).map(e => `:${e.name}:`))" - :hasChildSection="child.children.length !== 0" - :customEmojiTree="child.children" + :hasChildSection="child.children.length !== 0" + :customEmojiTree="child.children" @chosen="chosen" > {{ child.value || i18n.ts.other }} @@ -103,12 +103,12 @@ import { ref, shallowRef, computed, watch, onMounted } from 'vue'; import * as Misskey from 'misskey-js'; import XSection from '@/components/MkEmojiPicker.section.vue'; import { - emojilist, - emojiCharByCategory, - UnicodeEmojiDef, - unicodeEmojiCategories as categories, - getEmojiName, - CustomEmojiFolderTree + emojilist, + emojiCharByCategory, + UnicodeEmojiDef, + unicodeEmojiCategories as categories, + getEmojiName, + CustomEmojiFolderTree, } from '@/scripts/emojilist.js'; import MkRippleEffect from '@/components/MkRippleEffect.vue'; import * as os from '@/os.js'; @@ -121,6 +121,7 @@ import { $i } from '@/account.js'; const props = withDefaults(defineProps<{ showPinned?: boolean; + pinnedEmojis?: string[]; asReactionPicker?: boolean; maxHeight?: number; asDrawer?: boolean; @@ -137,15 +138,13 @@ const searchEl = shallowRef(); const emojisEl = shallowRef(); const { - reactions: pinnedReactions, reactionPickerSize, reactionPickerWidth, reactionPickerHeight, - disableShowingAnimatedImages, recentlyUsedEmojis, } = defaultStore.reactiveState; -const pinned = computed(() => props.asReactionPicker ? pinnedReactions.value : []); // TODO: 非リアクションの絵文字ピッカー用のpinned絵文字を設定可能にする？ +const pinned = computed(() => props.pinnedEmojis); const size = computed(() => props.asReactionPicker ? reactionPickerSize.value : 1); const width = computed(() => props.asReactionPicker ? reactionPickerWidth.value : 3); const height = computed(() => props.asReactionPicker ? reactionPickerHeight.value : 2); @@ -154,7 +153,7 @@ const searchResultCustom = ref([]); const searchResultUnicode = ref([]); const tab = ref<'index' | 'custom' | 'unicode' | 'tags'>('index'); -const customEmojiFolderRoot: CustomEmojiFolderTree = { value: "", category: "", children: [] }; +const customEmojiFolderRoot: CustomEmojiFolderTree = { value: '', category: '', children: [] }; function parseAndMergeCategories(input: string, root: CustomEmojiFolderTree): CustomEmojiFolderTree { const parts = input.split('/').map(p => p.trim()); @@ -176,9 +175,9 @@ function parseAndMergeCategories(input: string, root: CustomEmojiFolderTree): Cu } customEmojiCategories.value.forEach(ec => { - if (ec !== null) { - parseAndMergeCategories(ec, customEmojiFolderRoot); - } + if (ec !== null) { + parseAndMergeCategories(ec, customEmojiFolderRoot); + } }); parseAndMergeCategories('', customEmojiFolderRoot); diff --git a/packages/frontend/src/components/MkEmojiPickerDialog.vue b/packages/frontend/src/components/MkEmojiPickerDialog.vue index 2cce1f5520..2ee16337ba 100644 --- a/packages/frontend/src/components/MkEmojiPickerDialog.vue +++ b/packages/frontend/src/components/MkEmojiPickerDialog.vue @@ -22,6 +22,7 @@ SPDX-License-Identifier: AGPL-3.0-only class="_popup _shadow" :class="{ [$style.drawer]: type === 'drawer' }" :showPinned="showPinned" + :pinnedEmojis="pinnedEmojis" :asReactionPicker="asReactionPicker" :asDrawer="type === 'drawer'" :max-height="maxHeight" @@ -40,11 +41,13 @@ const props = withDefaults(defineProps<{ manualShowing?: boolean | null; src?: HTMLElement; showPinned?: boolean; + pinnedEmojis?: string[], asReactionPicker?: boolean; choseAndClose?: boolean; }>(), { manualShowing: null, showPinned: true, + pinnedEmojis: undefined, asReactionPicker: false, choseAndClose: true, }); diff --git a/packages/frontend/src/components/form/section.vue b/packages/frontend/src/components/form/section.vue index 095b24604a..6af63d1ec6 100644 --- a/packages/frontend/src/components/form/section.vue +++ b/packages/frontend/src/components/form/section.vue @@ -6,6 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only