diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 51a82a32b..a927d108b 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -705,6 +705,7 @@ apply: "適用" receiveAnnouncementFromInstance: "インスタンスからのお知らせを受け取る" emailNotification: "メール通知" inChannelSearch: "チャンネル内検索" +useReactionPickerForContextMenu: "右クリックでリアクションピッカーを開く" _email: _follow: diff --git a/src/client/components/note-detailed.vue b/src/client/components/note-detailed.vue index 1108bd2c2..434dd56ba 100644 --- a/src/client/components/note-detailed.vue +++ b/src/client/components/note-detailed.vue @@ -756,7 +756,13 @@ export default defineComponent({ }; if (isLink(e.target)) return; if (window.getSelection().toString() !== '') return; - os.contextMenu(this.getMenu(), e).then(this.focus); + + if (this.$store.state.useReactionPickerForContextMenu) { + e.preventDefault(); + this.react(); + } else { + os.contextMenu(this.getMenu(), e).then(this.focus); + } }, menu(viaKeyboard = false) { diff --git a/src/client/components/note.vue b/src/client/components/note.vue index d53228985..24c374869 100644 --- a/src/client/components/note.vue +++ b/src/client/components/note.vue @@ -731,7 +731,13 @@ export default defineComponent({ }; if (isLink(e.target)) return; if (window.getSelection().toString() !== '') return; - os.contextMenu(this.getMenu(), e).then(this.focus); + + if (this.$store.state.useReactionPickerForContextMenu) { + e.preventDefault(); + this.react(); + } else { + os.contextMenu(this.getMenu(), e).then(this.focus); + } }, menu(viaKeyboard = false) { diff --git a/src/client/components/ui/modal.vue b/src/client/components/ui/modal.vue index 69a83e002..405fa4aaa 100644 --- a/src/client/components/ui/modal.vue +++ b/src/client/components/ui/modal.vue @@ -70,6 +70,7 @@ export default defineComponent({ // TODO: ResizeObserver無くしたい new ResizeObserver((entries, observer) => { const rect = this.src.getBoundingClientRect(); + const width = popover.offsetWidth; const height = popover.offsetHeight; diff --git a/src/client/pages/settings/general.vue b/src/client/pages/settings/general.vue index 0e741d474..90ff3e2c2 100644 --- a/src/client/pages/settings/general.vue +++ b/src/client/pages/settings/general.vue @@ -19,6 +19,7 @@ {{ $ts.openImageInNewTab }} {{ $ts.enableInfiniteScroll }} + {{ $ts.useReactionPickerForContextMenu }} {{ $ts.disablePagesScript }} @@ -144,6 +145,7 @@ export default defineComponent({ chatOpenBehavior: ColdDeviceStorage.makeGetterSetter('chatOpenBehavior'), instanceTicker: defaultStore.makeGetterSetter('instanceTicker'), enableInfiniteScroll: defaultStore.makeGetterSetter('enableInfiniteScroll'), + useReactionPickerForContextMenu: defaultStore.makeGetterSetter('useReactionPickerForContextMenu'), }, watch: { diff --git a/src/client/store.ts b/src/client/store.ts index bf042d8ab..528e563fd 100644 --- a/src/client/store.ts +++ b/src/client/store.ts @@ -144,6 +144,10 @@ export const defaultStore = markRaw(new Storage('base', { where: 'device', default: true }, + useReactionPickerForContextMenu: { + where: 'device', + default: true + }, showGapBetweenNotesInTimeline: { where: 'device', default: true diff --git a/src/client/ui/chat/note.vue b/src/client/ui/chat/note.vue index f4c9f063d..4e4a303c3 100644 --- a/src/client/ui/chat/note.vue +++ b/src/client/ui/chat/note.vue @@ -741,7 +741,13 @@ export default defineComponent({ }; if (isLink(e.target)) return; if (window.getSelection().toString() !== '') return; - os.contextMenu(this.getMenu(), e).then(this.focus); + + if (this.$store.state.useReactionPickerForContextMenu) { + e.preventDefault(); + this.react(); + } else { + os.contextMenu(this.getMenu(), e).then(this.focus); + } }, menu(viaKeyboard = false) {