enhance(frontend): improve emoji picker settings

This commit is contained in:
syuilo 2025-03-13 16:56:47 +09:00
parent 3ced310f77
commit 10b67e1b3a
16 changed files with 601 additions and 324 deletions

View file

@ -536,6 +536,57 @@ export const searchIndexes: SearchIndexItem[] = [
path: '/settings/mute-block',
icon: 'ti ti-ban',
},
{
id: 'yR1OSyLiT',
children: [
{
id: 'yMJzyzOUk',
label: i18n.ts._emojiPalette.enableSyncBetweenDevicesForPalettes,
keywords: ['sync', 'palettes', 'devices'],
},
{
id: 'wCE09vgZr',
label: i18n.ts._emojiPalette.paletteForMain,
keywords: ['main', 'palette'],
},
{
id: 'uCzRPrSNx',
label: i18n.ts._emojiPalette.paletteForReaction,
keywords: ['reaction', 'palette'],
},
{
id: 'hgQr28WUk',
children: [
{
id: 'fY04NIHSQ',
label: i18n.ts.size,
keywords: ['emoji', 'picker', 'scale', 'size'],
},
{
id: '3j7vlaL7t',
label: i18n.ts.numberOfColumn,
keywords: ['emoji', 'picker', 'width', 'column', 'size'],
},
{
id: 'zPX8z1Bcy',
label: i18n.ts.height,
keywords: ['emoji', 'picker', 'height', 'size'],
},
{
id: '2CSkZa4tl',
label: i18n.ts.style,
keywords: ['emoji', 'picker', 'style'],
},
],
label: i18n.ts.emojiPickerDisplay,
keywords: ['emoji', 'picker', 'display'],
},
],
label: i18n.ts.emojiPalette,
keywords: ['emoji', 'palette'],
path: '/settings/emoji-palette',
icon: 'ti ti-mood-happy',
},
{
id: '3Tcxw4Fwl',
children: [
@ -608,23 +659,28 @@ export const searchIndexes: SearchIndexItem[] = [
id: 'FfZdOs8y',
children: [
{
id: 'lVlkdP4zN',
id: 'B1ZU6Ur54',
label: i18n.ts._deck.enableSyncBetweenDevicesForProfiles,
keywords: ['sync', 'profiles', 'devices'],
},
{
id: 'iEF0gqNAo',
label: i18n.ts._deck.useSimpleUiForNonRootPages,
keywords: ['ui', 'root', 'page'],
},
{
id: 'avgxEYgsi',
id: 'BNdSeWxZn',
label: i18n.ts.defaultNavigationBehaviour,
keywords: ['default', 'navigation', 'behaviour', 'window'],
},
{
id: 'ma7OSw5JK',
id: 'zT9pGm8DF',
label: i18n.ts._deck.alwaysShowMainColumn,
keywords: ['always', 'show', 'main', 'column'],
},
{
id: 'jjTlUDhJH',
label: 'Unnamed marker',
id: '5dk2xv1vc',
label: i18n.ts._deck.columnAlign,
keywords: ['column', 'align'],
},
],

View file

@ -3,10 +3,10 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { defineAsyncComponent, ref } from 'vue';
import { defineAsyncComponent, ref, watch } from 'vue';
import type { Ref } from 'vue';
import { popup } from '@/os.js';
import { store } from '@/store.js';
import { prefer } from '@/preferences.js';
/**
*
@ -25,7 +25,14 @@ class EmojiPicker {
}
public async init() {
const emojisRef = store.r.pinnedEmojis;
const emojisRef = ref<string[]>([]);
watch([prefer.r.emojiPaletteForMain, prefer.r.emojiPalettes], () => {
emojisRef.value = prefer.s.emojiPaletteForMain == null ? prefer.s.emojiPalettes[0].emojis : prefer.s.emojiPalettes.find(palette => palette.id === prefer.s.emojiPaletteForMain)?.emojis ?? [];
}, {
immediate: true,
});
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
src: this.src,
pinnedEmojis: emojisRef,

View file

@ -4,10 +4,10 @@
*/
import * as Misskey from 'misskey-js';
import { defineAsyncComponent, ref } from 'vue';
import { defineAsyncComponent, ref, watch } from 'vue';
import type { Ref } from 'vue';
import { popup } from '@/os.js';
import { store } from '@/store.js';
import { prefer } from '@/preferences.js';
class ReactionPicker {
private src: Ref<HTMLElement | null> = ref(null);
@ -21,7 +21,14 @@ class ReactionPicker {
}
public async init() {
const reactionsRef = store.r.reactions;
const reactionsRef = ref<string[]>([]);
watch([prefer.r.emojiPaletteForReaction, prefer.r.emojiPalettes], () => {
reactionsRef.value = prefer.s.emojiPaletteForReaction == null ? prefer.s.emojiPalettes[0].emojis : prefer.s.emojiPalettes.find(palette => palette.id === prefer.s.emojiPaletteForReaction)?.emojis ?? [];
}, {
immediate: true,
});
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
src: this.src,
pinnedEmojis: reactionsRef,