fix: ドラフトの絵文字は該当するキーを入力されても表示しないように修正

(cherry picked from commit f332fbc47eabc373e292076078ad673d72e6a5c9)
This commit is contained in:
tar_bin 2023-05-21 14:25:59 +09:00 committed by mattyatea
parent b138752ccb
commit 51313e7ec2
2 changed files with 8 additions and 2 deletions

View File

@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
--> -->
<template> <template>
<span v-if="errored">:{{ customEmojiName }}:</span> <span v-if="errored || isDraft">:{{ customEmojiName }}:</span>
<img v-else :class="[$style.root, { [$style.normal]: normal, [$style.noStyle]: noStyle }]" :src="url" :alt="alt" :title="alt" decoding="async" @error="errored = true" @load="errored = false"/> <img v-else :class="[$style.root, { [$style.normal]: normal, [$style.noStyle]: noStyle }]" :src="url" :alt="alt" :title="alt" decoding="async" @error="errored = true" @load="errored = false"/>
</template> </template>
@ -25,6 +25,7 @@ const props = defineProps<{
const customEmojiName = computed(() => (props.name[0] === ':' ? props.name.substring(1, props.name.length - 1) : props.name).replace('@.', '')); const customEmojiName = computed(() => (props.name[0] === ':' ? props.name.substring(1, props.name.length - 1) : props.name).replace('@.', ''));
const isLocal = computed(() => !props.host && (customEmojiName.value.endsWith('@.') || !customEmojiName.value.includes('@'))); const isLocal = computed(() => !props.host && (customEmojiName.value.endsWith('@.') || !customEmojiName.value.includes('@')));
const isDraft = computed(() => customEmojisNameMap.value.get(customEmojiName.value)?.draft ?? false);
const rawUrl = computed(() => { const rawUrl = computed(() => {
if (props.url) { if (props.url) {

View File

@ -3,7 +3,7 @@
* SPDX-License-Identifier: AGPL-3.0-only * SPDX-License-Identifier: AGPL-3.0-only
*/ */
import { shallowRef, computed, markRaw, watch } from 'vue'; import { shallowRef, computed, markRaw, triggerRef,watch } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import { api, apiGet } from '@/os.js'; import { api, apiGet } from '@/os.js';
import { useStream } from '@/stream.js'; import { useStream } from '@/stream.js';
@ -11,6 +11,7 @@ import { get, set } from '@/scripts/idb-proxy.js';
const storageCache = await get('emojis'); const storageCache = await get('emojis');
export const customEmojis = shallowRef<Misskey.entities.CustomEmoji[]>(Array.isArray(storageCache) ? storageCache : []); export const customEmojis = shallowRef<Misskey.entities.CustomEmoji[]>(Array.isArray(storageCache) ? storageCache : []);
export const customEmojisNameMap = computed(() => new Map(customEmojis.value.map(item => [item.name, item])));
export const customEmojiCategories = computed<[ ...string[], null ]>(() => { export const customEmojiCategories = computed<[ ...string[], null ]>(() => {
const categories = new Set<string>(); const categories = new Set<string>();
for (const emoji of customEmojis.value) { for (const emoji of customEmojis.value) {
@ -34,16 +35,19 @@ const stream = useStream();
stream.on('emojiAdded', emojiData => { stream.on('emojiAdded', emojiData => {
customEmojis.value = [emojiData.emoji, ...customEmojis.value]; customEmojis.value = [emojiData.emoji, ...customEmojis.value];
triggerRef(customEmojis);
set('emojis', customEmojis.value); set('emojis', customEmojis.value);
}); });
stream.on('emojiUpdated', emojiData => { stream.on('emojiUpdated', emojiData => {
customEmojis.value = customEmojis.value.map(item => emojiData.emojis.find(search => search.name === item.name) as Misskey.entities.CustomEmoji ?? item); customEmojis.value = customEmojis.value.map(item => emojiData.emojis.find(search => search.name === item.name) as Misskey.entities.CustomEmoji ?? item);
triggerRef(customEmojis);
set('emojis', customEmojis.value); set('emojis', customEmojis.value);
}); });
stream.on('emojiDeleted', emojiData => { stream.on('emojiDeleted', emojiData => {
customEmojis.value = customEmojis.value.filter(item => !emojiData.emojis.some(search => search.name === item.name)); customEmojis.value = customEmojis.value.filter(item => !emojiData.emojis.some(search => search.name === item.name));
triggerRef(customEmojis);
set('emojis', customEmojis.value); set('emojis', customEmojis.value);
}); });
@ -60,6 +64,7 @@ export async function fetchCustomEmojis(force = false) {
} }
customEmojis.value = res.emojis; customEmojis.value = res.emojis;
triggerRef(customEmojis);
set('emojis', res.emojis); set('emojis', res.emojis);
set('lastEmojisFetchedAt', now); set('lastEmojisFetchedAt', now);
} }