Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

fix(frontend): MkEmojiPickerとMkReactionsViewerで一部のUnicode絵文字を正常に扱えない問題を修正 (MisskeyIO#488)

Browse source 
This reverts commit e3dd3f6b63 partially.
This commit is contained in:
まっちゃとーにゅ 2024-02-27 23:56:50 +09:00 committed by GitHub
parent 9fe29b5e8e
commit d0d94b00d9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 25 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
packages/frontend/src/components/MkEmojiPicker.vue
View file

@ -49,7 +49,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@pointerenter="computeButtonTitle"
@click="chosen(emoji, $event)"
>
<MkCustomEmoji v-if="!emoji?.hasOwnProperty('char')" class="emoji" :name="getKey(emoji)" :normal="true"/>
<MkCustomEmoji v-if="emoji[0] === ':'" class="emoji" :name="getKey(emoji)" :normal="true"/>
<MkEmoji v-else class="emoji" :emoji="getKey(emoji)" :normal="true"/>
</button>
</div>
@ -67,7 +67,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@pointerenter="computeButtonTitle"
@click="chosen(emoji, $event)"
>
<MkCustomEmoji v-if="!emoji?.hasOwnProperty('char')" class="emoji" :name="getKey(emoji)" :normal="true"/>
<MkCustomEmoji v-if="emoji[0] === ':'" class="emoji" :name="getKey(emoji)" :normal="true"/>
<MkEmoji v-else class="emoji" :emoji="getKey(emoji)" :normal="true"/>
</button>
</div>
@ -108,7 +108,6 @@ import * as Misskey from 'misskey-js';
import XSection from '@/components/MkEmojiPicker.section.vue';
import {
emojilist,
unicodeEmojisMap,
emojiCharByCategory,
UnicodeEmojiDef,
unicodeEmojiCategories as categories,
@ -357,8 +356,8 @@ watch(q, () => {
searchResultUnicode.value = Array.from(searchUnicode());
});
function canReact(emoji: Misskey.entities.EmojiSimple | UnicodeEmojiDef): boolean {
return !props.targetNote || checkReactionPermissions($i!, props.targetNote, emoji);
function canReact(emoji: string | UnicodeEmojiDef | Misskey.entities.EmojiSimple): boolean {
return !props.targetNote || typeof emoji === 'string' || Object.hasOwn(emoji, 'char') || checkReactionPermissions($i!, props.targetNote, emoji);
}
function filterCategory(emoji: Misskey.entities.EmojiSimple, category: string): boolean {
@ -378,15 +377,21 @@ function reset() {
q.value = '';
}
function getKey(emoji: string | Misskey.entities.EmojiSimple | UnicodeEmojiDef): string {
return typeof emoji === 'string' ? emoji : 'char' in emoji ? emoji.char : `:${emoji.name}:`;
function getKey(emoji: string | UnicodeEmojiDef | Misskey.entities.EmojiSimple): string {
if (typeof emoji === 'string') {
return emoji;
} else if (Object.hasOwn(emoji, 'char')) {
return (emoji as UnicodeEmojiDef).char;
} else {
return `:${emoji.name}:`;
}
}
function getDef(emoji: string) {
if (emoji.includes(':')) {
return customEmojisMap.get(emoji.replace(/:/g, '')) ?? null;
} else {
return unicodeEmojisMap.get(emoji) ?? null;
return emoji;
}
}

18
packages/frontend/src/components/MkReactionsViewer.reaction.vue
View file

@ -34,7 +34,6 @@ import { i18n } from '@/i18n.js';
import * as sound from '@/scripts/sound.js';
import { checkReactionPermissions } from '@/scripts/check-reaction-permissions.js';
import { customEmojisMap } from '@/custom-emojis.js';
import { unicodeEmojisMap } from '@/scripts/emojilist.js';
const props = defineProps<{
reaction: string;
@ -45,19 +44,24 @@ const props = defineProps<{
const mock = inject<boolean>('mock', false);
const emit = defineEmits<{
(ev: 'reactionToggled', emoji: string, newCount: number): void;
}>();
const emit = defineEmits<
(ev: 'reactionToggled', emoji: string, newCount: number) => void
>();
const buttonEl = shallowRef<HTMLElement>();
const remoteReactionRegExp = /@\w/;
const isCustomEmoji = computed(() => props.reaction.includes(':'));
const emojiName = computed(() => props.reaction.replace(/:/g, '').replace(/@\./, ''));
const emoji = computed(() => customEmojisMap.get(emojiName.value) ?? unicodeEmojisMap.get(props.reaction));
const emoji = computed(() => isCustomEmoji.value ? customEmojisMap.get(emojiName.value) : null);
const canToggle = computed(() => {
return !props.reaction.match(/@\w/) && $i && emoji.value && checkReactionPermissions($i, props.note, emoji.value);
return !RegExp(remoteReactionRegExp).exec(props.reaction) && $i && (
!isCustomEmoji.value
|| (emoji.value && checkReactionPermissions($i, props.note, emoji.value))
);
});
const canGetInfo = computed(() => !props.reaction.match(/@\w/) && props.reaction.includes(':'));
const canGetInfo = computed(() => !RegExp(remoteReactionRegExp).exec(props.reaction) && props.reaction.includes(':'));
async function toggleReaction() {
if (!canToggle.value) return;

6
packages/frontend/src/scripts/check-reaction-permissions.ts
View file

@ -1,10 +1,6 @@
import * as Misskey from 'misskey-js';
import { UnicodeEmojiDef } from './emojilist.js';
export function checkReactionPermissions(me: Misskey.entities.MeDetailed, note: Misskey.entities.Note, emoji: Misskey.entities.EmojiSimple | UnicodeEmojiDef): boolean {
if ('char' in emoji) return true; // UnicodeEmojiDefなら常にリアクション可能
emoji = emoji as Misskey.entities.EmojiSimple;
export function checkReactionPermissions(me: Misskey.entities.MeDetailed, note: Misskey.entities.Note, emoji: Misskey.entities.EmojiSimple): boolean {
const roleIdsThatCanBeUsedThisEmojiAsReaction = emoji.roleIdsThatCanBeUsedThisEmojiAsReaction ?? [];
const roleIdsThatCanNotBeUsedThisEmojiAsReaction = emoji.roleIdsThatCanNotBeUsedThisEmojiAsReaction ?? [];

4
packages/frontend/src/scripts/emojilist.ts
View file

@ -20,10 +20,6 @@ export const emojilist: UnicodeEmojiDef[] = _emojilist.map(x => ({
category: unicodeEmojiCategories[x[2]],
}));
export const unicodeEmojisMap = new Map<string, UnicodeEmojiDef>(
emojilist.map(x => [x.char, x])
);
const _indexByChar = new Map<string, number>();
const _charGroupByCategory = new Map<string, string[]>();
for (let i = 0; i < emojilist.length; i++) {