enhance: チャットのリアクションを削除できるように

This commit is contained in:
syuilo 2025-03-25 16:09:19 +09:00
parent 8e72c68205
commit 98554579ea
11 changed files with 226 additions and 16 deletions

View file

@ -32,7 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:moveClass="prefer.s.animation ? $style.transition_reaction_move : ''"
tag="div" :class="$style.reactions"
>
<div v-for="record in message.reactions" :key="record.reaction + record.user.id" :class="$style.reaction">
<div v-for="record in message.reactions" :key="record.reaction + record.user.id" :class="$style.reaction" @click="onReactionClick(record)">
<MkAvatar :user="record.user" :link="false" :class="$style.reactionAvatar"/>
<MkReactionIcon
:withTooltip="true"
@ -87,6 +87,15 @@ function react(ev: MouseEvent) {
});
}
function onReactionClick(record: Misskey.entities.ChatMessage['reactions'][0]) {
if (record.user.id === $i.id) {
misskeyApi('chat/messages/unreact', {
messageId: props.message.id,
reaction: record.reaction,
});
}
}
function showMenu(ev: MouseEvent) {
const menu: MenuItem[] = [];

View file

@ -170,6 +170,7 @@ async function initialize() {
connection.value.on('message', onMessage);
connection.value.on('deleted', onDeleted);
connection.value.on('react', onReact);
connection.value.on('unreact', onUnreact);
} else {
const [r, m] = await Promise.all([
misskeyApi('chat/rooms/show', { roomId: props.roomId }),
@ -189,6 +190,7 @@ async function initialize() {
connection.value.on('message', onMessage);
connection.value.on('deleted', onDeleted);
connection.value.on('react', onReact);
connection.value.on('unreact', onUnreact);
}
window.document.addEventListener('visibilitychange', onVisibilitychange);
@ -268,6 +270,16 @@ function onReact(ctx) {
}
}
function onUnreact(ctx) {
const message = messages.value.find(m => m.id === ctx.messageId);
if (message) {
const index = message.reactions.findIndex(r => r.reaction === ctx.reaction && r.user.id === ctx.user.id);
if (index !== -1) {
message.reactions.splice(index, 1);
}
}
}
function onIndicatorClick() {
showIndicator.value = false;
}