gorb/frontend
4
0
Fork 0
Code Issues 15 Pull requests 7 Projects Releases Packages 1 Wiki Activity Actions

feat: make use of useState to show and hide context menu rather than manually rendering and unrendering

Browse source
This commit is contained in:
SauceyRed 2025-07-30 16:26:06 +02:00
parent a146eb001a
commit 78d43ca0c8
Signed by: sauceyred
GPG key ID: 2BF92EB6D8A5CCA7
7 changed files with 47 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

7
components/Message.vue
View file

@ -1,5 +1,5 @@
<template>
<div v-if="props.type == 'normal' || props.replyMessage" ref="messageElement" @contextmenu="createContextMenu($event, menuItems)" :id="props.last ? 'last-message' : undefined"
<div v-if="props.type == 'normal' || props.replyMessage" ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, menuItems)" :id="props.last ? 'last-message' : undefined"
class="message normal-message" :class="{ 'mentioned': (props.replyMessage || props.isMentioned) && props.message.user.uuid != props.me.uuid && props.replyMessage?.user.uuid == props.me.uuid }" :data-message-id="props.messageId"
:editing.sync="props.editing" :replying-to.sync="props.replyingTo">
<div v-if="props.replyMessage" class="message-reply-svg">
@ -50,7 +50,7 @@
</div>
<MessageMedia v-if="mediaLinks.length" :links="mediaLinks" />
</div>
<div v-else ref="messageElement" @contextmenu="createContextMenu($event, menuItems)" :id="props.last ? 'last-message' : undefined"
<div v-else ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, menuItems)" :id="props.last ? 'last-message' : undefined"
class="message grouped-message" :class="{ 'message-margin-bottom': props.marginBottom, 'mentioned': props.replyMessage || props.isMentioned }"
:data-message-id="props.messageId" :editing.sync="props.editing" :replying-to.sync="props.replyingTo">
<div class="left-column">
@ -71,9 +71,12 @@ import { parse } from 'marked';
import type { MessageProps } from '~/types/props';
import MessageMedia from './MessageMedia.vue';
import MessageReply from './UserInterface/MessageReply.vue';
import type { ContextMenuInterface, ContextMenuItem } from '~/types/interfaces';
const props = defineProps<MessageProps>();
const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, cursorX: 0, cursorY: 0, items: [] }));
const messageElement = ref<HTMLDivElement>();
const dateHidden = ref<boolean>(true);