summaryrefslogtreecommitdiff
path: root/src/client/pages/settings/reaction.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/pages/settings/reaction.vue')
-rw-r--r--src/client/pages/settings/reaction.vue25
1 files changed, 20 insertions, 5 deletions
diff --git a/src/client/pages/settings/reaction.vue b/src/client/pages/settings/reaction.vue
index 7de2f72f61..81bb024995 100644
--- a/src/client/pages/settings/reaction.vue
+++ b/src/client/pages/settings/reaction.vue
@@ -7,6 +7,7 @@
{{ $t('reaction') }}<template #desc>{{ $t('reactionSettingDescription') }} <button class="_textButton" @click="chooseEmoji">{{ $t('chooseEmoji') }}</button></template>
</MkInput>
<MkButton inline @click="setDefault"><Fa :icon="faUndo"/> {{ $t('default') }}</MkButton>
+ <MkSwitch v-model:value="useFullReactionPicker">{{ $t('useFullReactionPicker') }}</MkSwitch>
</div>
<div class="_footer">
<MkButton @click="save()" primary inline :disabled="!changed"><Fa :icon="faSave"/> {{ $t('save') }}</MkButton>
@@ -22,6 +23,7 @@ import { faLaugh, faSave, faEye } from '@fortawesome/free-regular-svg-icons';
import { faUndo } from '@fortawesome/free-solid-svg-icons';
import MkInput from '@/components/ui/input.vue';
import MkButton from '@/components/ui/button.vue';
+import MkSwitch from '@/components/ui/switch.vue';
import { emojiRegexWithCustom } from '../../../misc/emoji-regex';
import { defaultSettings } from '@/store';
import * as os from '@/os';
@@ -30,6 +32,7 @@ export default defineComponent({
components: {
MkInput,
MkButton,
+ MkSwitch,
},
emits: ['info'],
@@ -50,6 +53,11 @@ export default defineComponent({
splited(): any {
return this.reactions.match(emojiRegexWithCustom);
},
+
+ useFullReactionPicker: {
+ get() { return this.$store.state.device.useFullReactionPicker; },
+ set(value) { this.$store.commit('device/set', { key: 'useFullReactionPicker', value: value }); }
+ },
},
watch: {
@@ -72,11 +80,18 @@ export default defineComponent({
},
preview(ev) {
- os.popup(import('@/components/reaction-picker.vue'), {
- reactions: this.splited,
- showFocus: false,
- src: ev.currentTarget || ev.target,
- }, {}, 'closed');
+ if (this.$store.state.device.useFullReactionPicker) {
+ os.popup(import('@/components/emoji-picker.vue'), {
+ reactions: this.splited,
+ src: ev.currentTarget || ev.target,
+ }, {}, 'closed');
+ } else {
+ os.popup(import('@/components/reaction-picker.vue'), {
+ reactions: this.splited,
+ showFocus: false,
+ src: ev.currentTarget || ev.target,
+ }, {}, 'closed');
+ }
},
setDefault() {