laoxong/misskey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

customEmojiCategories as computed

Browse Source
This commit is contained in:
tamaina 2023-01-16 10:36:29 +00:00
parent f2a9194c79
commit 43956f3ffb
4 changed files with 12 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/frontend/src/components/MkEmojiPicker.vue
View File

@ -88,7 +88,7 @@ import { deviceKind } from '@/scripts/device-kind';
import { instance } from '@/instance'; import { instance } from '@/instance';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { getCustomEmojiCategories, customEmojis } from '@/custom-emojis'; import { customEmojiCategories, customEmojis } from '@/custom-emojis';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
showPinned?: boolean; showPinned?: boolean;
@ -104,7 +104,6 @@ const emit = defineEmits<{
(ev: 'chosen', v: string): void; (ev: 'chosen', v: string): void;
}>(); }>();
const customEmojiCategories = getCustomEmojiCategories();
const searchEl = shallowRef<HTMLInputElement>(); const searchEl = shallowRef<HTMLInputElement>();
const emojisEl = shallowRef<HTMLDivElement>(); const emojisEl = shallowRef<HTMLDivElement>();

22
packages/frontend/src/custom-emojis.ts
View File

@ -1,10 +1,17 @@
import { apiGet } from './os'; import { apiGet } from './os';
import { miLocalStorage } from './local-storage'; import { miLocalStorage } from './local-storage';
import { shallowRef } from 'vue'; import { shallowRef, computed, markRaw } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
const storageCache = miLocalStorage.getItem('emojis'); const storageCache = miLocalStorage.getItem('emojis');
export const customEmojis = shallowRef<Misskey.entities.CustomEmoji[]>(storageCache ? JSON.parse(storageCache) : []); export const customEmojis = shallowRef<Misskey.entities.CustomEmoji[]>(storageCache ? JSON.parse(storageCache) : []);
export const customEmojiCategories = computed<string[]>(() => {
const categories = new Set<string>();
for (const emoji of customEmojis.value) {
categories.add(emoji.category);
}
return markRaw(Array.from(categories));
});
fetchCustomEmojis(); fetchCustomEmojis();
window.setInterval(fetchCustomEmojis, 1000 * 60 * 10); window.setInterval(fetchCustomEmojis, 1000 * 60 * 10);
@ -21,19 +28,6 @@ export async function fetchCustomEmojis() {
miLocalStorage.setItem('lastEmojisFetchedAt', now.toString()); miLocalStorage.setItem('lastEmojisFetchedAt', now.toString());
} }
let cachedCategories;
export function getCustomEmojiCategories() {
if (cachedCategories) return cachedCategories;
const categories = new Set();
for (const emoji of customEmojis.value) {
categories.add(emoji.category);
}
const res = Array.from(categories);
cachedCategories = res;
return res;
}
let cachedTags; let cachedTags;
export function getCustomEmojiTags() { export function getCustomEmojiTags() {
if (cachedTags) return cachedTags; if (cachedTags) return cachedTags;

3
packages/frontend/src/pages/about.emojis.vue
View File

@ -39,11 +39,10 @@ import MkSelect from '@/components/MkSelect.vue';
import MkFoldableSection from '@/components/MkFoldableSection.vue'; import MkFoldableSection from '@/components/MkFoldableSection.vue';
import MkTab from '@/components/MkTab.vue'; import MkTab from '@/components/MkTab.vue';
import * as os from '@/os'; import * as os from '@/os';
import { customEmojis, getCustomEmojiCategories, getCustomEmojiTags } from '@/custom-emojis'; import { customEmojis, customEmojiCategories, getCustomEmojiTags } from '@/custom-emojis';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
const customEmojiCategories = getCustomEmojiCategories();
const customEmojiTags = getCustomEmojiTags(); const customEmojiTags = getCustomEmojiTags();
let q = $ref(''); let q = $ref('');
let searchEmojis = $ref<Misskey.entities.CustomEmoji[]>(null); let searchEmojis = $ref<Misskey.entities.CustomEmoji[]>(null);

5
packages/frontend/src/pages/emoji-edit-dialog.vue
View File

@ -15,7 +15,7 @@
<MkInput v-model="name"> <MkInput v-model="name">
<template #label>{{ i18n.ts.name }}</template> <template #label>{{ i18n.ts.name }}</template>
</MkInput> </MkInput>
<MkInput v-model="category" :datalist="categories"> <MkInput v-model="category" :datalist="customEmojiCategories">
<template #label>{{ i18n.ts.category }}</template> <template #label>{{ i18n.ts.category }}</template>
</MkInput> </MkInput>
<MkInput v-model="aliases"> <MkInput v-model="aliases">
@ -36,7 +36,7 @@ import MkInput from '@/components/MkInput.vue';
import * as os from '@/os'; import * as os from '@/os';
import { unique } from '@/scripts/array'; import { unique } from '@/scripts/array';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { getCustomEmojiCategories } from '@/custom-emojis'; import { customEmojiCategories } from '@/custom-emojis';
const props = defineProps<{ const props = defineProps<{
emoji: any, emoji: any,
@ -46,7 +46,6 @@ let dialog = $ref(null);
let name: string = $ref(props.emoji.name); let name: string = $ref(props.emoji.name);
let category: string = $ref(props.emoji.category); let category: string = $ref(props.emoji.category);
let aliases: string = $ref(props.emoji.aliases.join(' ')); let aliases: string = $ref(props.emoji.aliases.join(' '));
const categories = getCustomEmojiCategories();
const emit = defineEmits<{ const emit = defineEmits<{
(ev: 'done', v: { deleted?: boolean, updated?: any }): void, (ev: 'done', v: { deleted?: boolean, updated?: any }): void,