From 1bc7877a8b4360010aed75834b09d553a2f0ed51 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:53:11 +0200
Subject: [PATCH 01/14] feat: add util to create context menu items for when
 right-clicking members in chat or in sidebar

---
 utils/createMemberContextMenuItems.ts | 33 +++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 utils/createMemberContextMenuItems.ts

diff --git a/utils/createMemberContextMenuItems.ts b/utils/createMemberContextMenuItems.ts
new file mode 100644
index 0000000..0ad5e46
--- /dev/null
+++ b/utils/createMemberContextMenuItems.ts
@@ -0,0 +1,33 @@
+import { Permission } from "~/types/enums";
+import type { ContextMenuItem, GuildMemberResponse } from "~/types/interfaces";
+
+export default async (member: GuildMemberResponse, guildId: string) => {
+	const menuItems: ContextMenuItem[] = [];
+
+	const { fetchMeMember } = useApi();
+	const me = useState<GuildMemberResponse | undefined>("me");
+	if (!me.value) {
+		const fetchedMe = await fetchMeMember(member.guild_uuid);
+		me.value = fetchedMe;
+	}
+	const { banMember, kickMember } = useApi();
+
+	console.log("[MENUITEM] hi");
+	console.log("[MENUITEM] member:", member.user.username);
+	console.log("[MENUITEM] me:", me.value?.user.username);
+	if (me.value && member.uuid != me.value.uuid) {
+		console.log("[MENUITEM] member is not me");
+		if (hasPermission(me.value, Permission.KickMember)) {
+			console.log("[MENUITEM] has kick member permission");
+			menuItems.splice(Math.min(3, menuItems.length), 0, { name: "Kick", icon: "lucide:user-x", type: "danger", callback: async () => await kickMember(member.uuid) });
+		}
+
+		if (hasPermission(me.value, Permission.BanMember)) {
+			console.log("[MENUITEM] has ban permission");
+			menuItems.splice(Math.min(4, menuItems.length), 0, { name: "Ban (WIP)", icon: "lucide:ban", type: "danger", callback: async () => await banMember(guildId, member.uuid) });
+		}
+	}
+
+	console.log("[MENUITEM] returning menu items:", menuItems);
+	return menuItems;
+}
-- 
2.47.3


From dc4494a1db74da9babc1c92d57c1eb9733453701 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:54:00 +0200
Subject: [PATCH 02/14] style(ui): set cursor for usernames in chat to pointer

---
 components/Message.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/components/Message.vue b/components/Message.vue
index c926616..dce92ae 100644
--- a/components/Message.vue
+++ b/components/Message.vue
@@ -234,6 +234,10 @@ function getDayDifference(date1: Date, date2: Date) {
 	max-width: 2em;
 }
 
+.message-author-username {
+	cursor: pointer;
+}
+
 .left-column {
 	min-width: 2rem;
 	display: flex;
-- 
2.47.3


From 0d0dccaf8481fb73ef716fd736eb7700e7675443 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:54:31 +0200
Subject: [PATCH 03/14] style(ui): set cursor for usernames in members list
 sidebar to pointer

---
 components/Guild/MemberEntry.vue | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/components/Guild/MemberEntry.vue b/components/Guild/MemberEntry.vue
index baf0e67..80272c1 100644
--- a/components/Guild/MemberEntry.vue
+++ b/components/Guild/MemberEntry.vue
@@ -31,6 +31,7 @@ function hideModalPopup() {
 </script>
 
 <style>
+
 .member-item {
     position: relative;
 }
@@ -41,4 +42,9 @@ function hideModalPopup() {
 	min-width: 2.3em;
 	max-width: 2.3em;
 }
+
+.member-display-name {
+	cursor: pointer;
+}
+
 </style>
-- 
2.47.3


From 25c5a0e4a8ce6fd0c9606e0aa4ee9fc3fc2f445d Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:55:33 +0200
Subject: [PATCH 04/14] feat: add context menu for usernames in chat

---
 components/Message.vue | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/components/Message.vue b/components/Message.vue
index dce92ae..bfb6af6 100644
--- a/components/Message.vue
+++ b/components/Message.vue
@@ -1,5 +1,5 @@
 <template>
-	<div v-if="props.type == 'normal' || props.replyMessage" ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, menuItems)" :id="props.last ? 'last-message' : undefined"
+	<div v-if="props.type == 'normal' || props.replyMessage" ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, messageMenuItems)" :id="props.last ? 'last-message' : undefined"
 			class="message normal-message" :class="{ 'mentioned': (props.replyMessage || props.isMentioned) && props.message.member.user.uuid != props.me.uuid && props.replyMessage?.member.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">
@@ -33,7 +33,7 @@
 		</div>
 		<div class="message-data">
 			<div class="message-metadata">
-				<span class="message-author-username" tabindex="0" :style="`color: ${props.authorColor}`">
+				<span class="message-author-username" tabindex="0" :style="`color: ${props.authorColor}`" @contextmenu="showContextMenu($event, contextMenu, memberMenuItems)">
 					{{ getDisplayName(props.author) }}
 				</span>
 				<span class="message-date" :title="date.toString()">
@@ -47,7 +47,7 @@
 		</div>
 		<MessageMedia v-if="mediaLinks.length" :links="mediaLinks" />
 	</div>
-	<div v-else ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, menuItems)" :id="props.last ? 'last-message' : undefined"
+	<div v-else ref="messageElement" @contextmenu="showContextMenu($event, contextMenu, messageMenuItems)" :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">
@@ -72,6 +72,8 @@ import type { ContextMenuInterface, ContextMenuItem } from '~/types/interfaces';
 
 const { getDisplayName } = useProfile()
 
+const route = useRoute();
+
 const props = defineProps<MessageProps>();
 
 const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, pointerX: 0, pointerY: 0, items: [] }));
@@ -144,21 +146,23 @@ console.log("media links:", mediaLinks);
 //	showHover.value = !showHover.value;
 //}
 
-const menuItems: ContextMenuItem[] = [
+const messageMenuItems: ContextMenuItem[] = [
 	{ name: "Reply", icon: "lucide:reply", type: "normal", callback: () => { if (messageElement.value) replyToMessage(messageElement.value, props) } }
 ]
 
 console.log("me:", props.me);
-if (props.author?.user.uuid == props.me.uuid) {
+if (props.author.user.uuid == props.me.uuid) {
 	// Inserts "edit" option at index 1 (below the "reply" option)
-	menuItems.splice(1, 0, { name: "Edit (WIP)", icon: "lucide:square-pen", type: "normal", callback: () => { /* if (messageElement.value) editMessage(messageElement.value, props) */ } });
+	messageMenuItems.splice(Math.min(1, messageMenuItems.length), 0, { name: "Edit (WIP)", icon: "lucide:square-pen", type: "normal", callback: () => { /* if (messageElement.value) editMessage(messageElement.value, props) */ } });
 }
 
-if (props.author?.user.uuid == props.me.uuid /* || check message delete permission*/) {
+if (props.author.user.uuid == props.me.uuid /* || check message delete permission*/) {
 	// Inserts "edit" option at index 2 (below the "edit" option)
-	menuItems.splice(2, 0, { name: "Delete (WIP)", icon: "lucide:trash", type: "danger", callback: () => {} });
+	messageMenuItems.splice(Math.min(2, messageMenuItems.length), 0, { name: "Delete (WIP)", icon: "lucide:trash", type: "danger", callback: () => {} });
 }
 
+const memberMenuItems = await createMemberContextMenuItems(props.author, route.params.serverId as string);
+
 function getDayDifference(date1: Date, date2: Date) {
     const midnight1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate());
     const midnight2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate());
-- 
2.47.3


From 46a135de22c93f786cab91d3faeff6f3d6a67275 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:56:07 +0200
Subject: [PATCH 05/14] feat: add context menu for usernames in members list
 sidebar

---
 components/Guild/MemberEntry.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/components/Guild/MemberEntry.vue b/components/Guild/MemberEntry.vue
index 80272c1..a5f66fb 100644
--- a/components/Guild/MemberEntry.vue
+++ b/components/Guild/MemberEntry.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="member-item" @click.prevent="showModalPopup" tabindex="0">
+    <div class="member-item" @click.prevent="showModalPopup" tabindex="0" @contextmenu="showContextMenu($event, contextMenu, menuItems)">
         <Avatar :profile="props.member" class="member-avatar"/>
         <span class="member-display-name" :style="`color: ${generateIrcColor(props.member.user.uuid)}`">
             {{ getDisplayName(props.member) }}
@@ -11,14 +11,18 @@
 
 <script lang="ts" setup>
 import { ModalProfilePopup } from '#components';
-import type { GuildMemberResponse } from '~/types/interfaces';
+import type { ContextMenuInterface, GuildMemberResponse } from '~/types/interfaces';
 
 const { getDisplayName } = useProfile()
 
+const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, pointerX: 0, pointerY: 0, items: [] }));
+
 const props = defineProps<{
     member: GuildMemberResponse
 }>();
 
+const menuItems = await createMemberContextMenuItems(props.member, props.member.guild_uuid);
+
 const modalPopupVisible = ref<boolean>(false);
 
 function showModalPopup() {
-- 
2.47.3


From e5bdf63f2ab8bbe34eb743c350ecfd6b9daccd7a Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:57:02 +0200
Subject: [PATCH 06/14] feat: remove context menu on global mousedown only if
 the context menu useState variable's show value is set to true

---
 app.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/app.vue b/app.vue
index 8f0571f..c105499 100644
--- a/app.vue
+++ b/app.vue
@@ -23,11 +23,14 @@ onMounted(() => {
 		contextMenuHandler(e);
 	});
 	document.addEventListener("mousedown", (e) => {
-		if (e.target instanceof HTMLElement && e.target.closest("#context-menu")) return;
+		if (e.target instanceof HTMLElement && e.target.classList.contains("context-menu-item")) return;
 		console.log("click");
 		console.log("target:", e.target);
 		console.log(e.target instanceof HTMLDivElement);
-		removeContextMenu(contextMenu);
+		if (contextMenu.value.show) {
+			console.log("context menu is shown, hiding");
+			removeContextMenu(contextMenu);
+		}
 		if (e.target instanceof HTMLElement && e.target.classList.contains("message-text") && e.target.contentEditable) {
 			e.target.contentEditable = "false";
 		}
-- 
2.47.3


From 0dc485ca776ad05b3335991a96f1ac47f4b77453 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:57:54 +0200
Subject: [PATCH 07/14] feat: add functions to kick and ban a member in API
 composable

---
 composables/api.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/composables/api.ts b/composables/api.ts
index c949bc0..2e66371 100644
--- a/composables/api.ts
+++ b/composables/api.ts
@@ -47,6 +47,14 @@ export const useApi = () => {
 	async function fetchMember(guildId: string, memberId: string): Promise<GuildMemberResponse | undefined> {
 		return await fetchWithApi(`/guilds/${guildId}/members/${memberId}`);
 	}
+
+	async function kickMember(memberId: string) {
+		return await fetchWithApi(`/members/${memberId}`, { method: "DELETE" });
+	}
+
+	async function banMember(guildId: string, memberId: string) {
+		//
+	}
 	
 	async function fetchUsers() {
 		return await fetchWithApi(`/users`);
@@ -118,6 +126,8 @@ export const useApi = () => {
 		fetchChannel,
 		fetchMembers,
 		fetchMember,
+		kickMember,
+		banMember,
 		fetchUsers,
 		fetchUser,
 		fetchFriends,
-- 
2.47.3


From fdfffd78e76f50fd2f9bb2f401ced997f1b5a7ea Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:58:17 +0200
Subject: [PATCH 08/14] feat: add function to fetch logged-in user's member
 object for a guild in API composable

---
 composables/api.ts | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/composables/api.ts b/composables/api.ts
index 2e66371..f4004f5 100644
--- a/composables/api.ts
+++ b/composables/api.ts
@@ -25,6 +25,17 @@ export const useApi = () => {
 		return await fetchWithApi("/me")
 	}
 
+	async function fetchMeMember(guildId: string): Promise<GuildMemberResponse | undefined> {
+		const { getUser } = useAuth();
+
+		const me = await getUser();
+		if (me) {
+			const members = await fetchMembers(guildId);
+			const meMember = members.objects.find(member => member.user.uuid == me.uuid);
+			return meMember;
+		}
+	}
+
 	async function fetchChannels(guildId: string): Promise<ChannelResponse[]> {
 		return ensureIsArray(await fetchWithApi(`/guilds/${guildId}/channels`));
 	}
@@ -122,6 +133,7 @@ export const useApi = () => {
 		fetchGuild,
 		fetchMyGuilds,
 		fetchMe,
+		fetchMeMember,
 		fetchChannels,
 		fetchChannel,
 		fetchMembers,
-- 
2.47.3


From 86af8145b4e0f72def3e22adb70d4dee9df1f15a Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 08:59:20 +0200
Subject: [PATCH 09/14] feat: make it so opening context menu on an element
 isn't overridden by another context menu listener on an ancestor of that
 element

---
 utils/showContextMenu.ts | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/utils/showContextMenu.ts b/utils/showContextMenu.ts
index fdf5243..92a8b82 100644
--- a/utils/showContextMenu.ts
+++ b/utils/showContextMenu.ts
@@ -3,10 +3,15 @@ import ContextMenu from "~/components/UserInterface/ContextMenu.vue";
 import type { ContextMenuInterface, ContextMenuItem } from "~/types/interfaces";
 
 export default (e: MouseEvent | PointerEvent, contextMenu: ContextMenuInterface, menuItems: ContextMenuItem[]) => {
-  console.log("Showing context menu");
-  contextMenu.show = true;
-  contextMenu.pointerX = e.clientX;
-  contextMenu.pointerY = e.clientY;
-  contextMenu.items = menuItems;
-  console.log("Showed");
+  e.preventDefault();
+  e.stopPropagation();
+  console.log("Menu items:", menuItems);
+  if (menuItems.length) {
+    console.log("Showing context menu");
+    contextMenu.show = true;
+    contextMenu.pointerX = e.clientX;
+	contextMenu.pointerY = e.clientY;
+    contextMenu.items = menuItems;
+    console.log("Showed");
+  }
 }
-- 
2.47.3


From 51f8c28c54f4879cbf5e7020a517ed73534efa77 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 09:00:02 +0200
Subject: [PATCH 10/14] feat: initialize meMember useState variable on channel
 load

---
 pages/servers/[serverId]/channels/[channelId].vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue
index f07dabd..54f5a2c 100644
--- a/pages/servers/[serverId]/channels/[channelId].vue
+++ b/pages/servers/[serverId]/channels/[channelId].vue
@@ -56,7 +56,7 @@ const showGuildSettings = ref(false);
 //const servers = await fetchWithApi("/servers") as { uuid: string, name: string, description: string }[];
 //console.log("channelid: servers:", servers);
 
-const { fetchMembers } = useApi();
+const { fetchMembers, fetchMeMember } = useApi();
 
 onMounted(async () => {
 	console.log("mounting");
@@ -84,6 +84,14 @@ async function setArrayVariables() {
 	console.log("channels:", channels.value);
 	channel.value = await fetchWithApi(`/channels/${route.params.channelId}`);
 	console.log("channel:", channel.value);
+	const meMember = useState<GuildMemberResponse | undefined>("meMember");
+	console.log("[CHANNEL] meMember:", meMember.value);
+	if (!meMember.value) {
+		console.log("[CHANNEL] meMember is uninitialized, initializing");
+		const fetchedMeMember = await fetchMeMember(route.params.serverId as string);
+		meMember.value = fetchedMeMember;
+		console.log("[CHANNEL] meMember set to:", fetchedMeMember);
+	}
 }
 
 function toggleGuildSettings(e: Event) {
-- 
2.47.3


From 0540f22f5db260fdac72e816f99527329e2fb34d Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Thu, 7 Aug 2025 09:01:18 +0200
Subject: [PATCH 11/14] feat: move context menu to the left of the cursor if
 any part of it is beyond the right side of the viewport

---
 components/UserInterface/ContextMenu.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/components/UserInterface/ContextMenu.vue b/components/UserInterface/ContextMenu.vue
index 1767657..5d3a4be 100644
--- a/components/UserInterface/ContextMenu.vue
+++ b/components/UserInterface/ContextMenu.vue
@@ -18,6 +18,10 @@ onMounted(() => {
 	if (contextMenu) {
 		contextMenu.style.left = props.pointerX.toString() + "px";
 		contextMenu.style.top = props.pointerY.toString() + "px";
+		const rect = contextMenu.getBoundingClientRect();
+		if (rect.right > (window.innerWidth || document.documentElement.clientWidth)) {
+			contextMenu.style.left = (props.pointerX - contextMenu.clientWidth).toString() + "px";
+		}
 	}
 });
 
-- 
2.47.3


From ce57b8e7db8905637ec8d19f15bb5ff00386402e Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Mon, 11 Aug 2025 00:03:47 +0200
Subject: [PATCH 12/14] feat: remove global context menu event listener and
 handler to allow regular context menu where a custom one isn't needed

---
 app.vue | 15 +--------------
 1 file changed, 1 insertion(+), 14 deletions(-)

diff --git a/app.vue b/app.vue
index c105499..72bffa2 100644
--- a/app.vue
+++ b/app.vue
@@ -12,16 +12,11 @@ import type { ContextMenuInterface } from './types/interfaces';
 
 const banner = useState("banner", () => false);
 
-const contextMenu = useState<ContextMenuInterface>("contextMenu");
+const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, pointerX: 0, pointerY: 0, items: [] }));
 
 onMounted(() => {
 	loadPreferredThemes()
 
-	document.removeEventListener("contextmenu", contextMenuHandler);
-	document.addEventListener("contextmenu", (e) => {
-		if (e.target instanceof Element && e.target.classList.contains("default-contextmenu")) return;
-		contextMenuHandler(e);
-	});
 	document.addEventListener("mousedown", (e) => {
 		if (e.target instanceof HTMLElement && e.target.classList.contains("context-menu-item")) return;
 		console.log("click");
@@ -55,14 +50,6 @@ onMounted(() => {
 	});
 });
 
-function contextMenuHandler(e: MouseEvent) {
-	e.preventDefault();
-	//console.log("Opened context menu");
-	//createContextMenu(e, [
-	//	{ name: "Wah", callback: () => { return } }
-	//]);
-}
-
 </script>
 
 <style>
-- 
2.47.3


From f1eda2da7571c6dbf966533ed6934fa17f6ef591 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Mon, 11 Aug 2025 00:04:18 +0200
Subject: [PATCH 13/14] feat: handle setting of default context menu state
 variable only in app.vue

---
 components/Guild/MemberEntry.vue              | 2 +-
 components/Message.vue                        | 2 +-
 components/UserInterface/ResizableSidebar.vue | 6 +-----
 3 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/components/Guild/MemberEntry.vue b/components/Guild/MemberEntry.vue
index a5f66fb..0c7afa0 100644
--- a/components/Guild/MemberEntry.vue
+++ b/components/Guild/MemberEntry.vue
@@ -15,7 +15,7 @@ import type { ContextMenuInterface, GuildMemberResponse } from '~/types/interfac
 
 const { getDisplayName } = useProfile()
 
-const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, pointerX: 0, pointerY: 0, items: [] }));
+const contextMenu = useState<ContextMenuInterface>("contextMenu");
 
 const props = defineProps<{
     member: GuildMemberResponse
diff --git a/components/Message.vue b/components/Message.vue
index bfb6af6..9d33ac0 100644
--- a/components/Message.vue
+++ b/components/Message.vue
@@ -76,7 +76,7 @@ const route = useRoute();
 
 const props = defineProps<MessageProps>();
 
-const contextMenu = useState<ContextMenuInterface>("contextMenu", () => ({ show: false, pointerX: 0, pointerY: 0, items: [] }));
+const contextMenu = useState<ContextMenuInterface>("contextMenu");
 
 const messageElement = ref<HTMLDivElement>();
 
diff --git a/components/UserInterface/ResizableSidebar.vue b/components/UserInterface/ResizableSidebar.vue
index 79e95bd..e36c8a6 100644
--- a/components/UserInterface/ResizableSidebar.vue
+++ b/components/UserInterface/ResizableSidebar.vue
@@ -1,5 +1,5 @@
 <template>
-	<div ref="resizableSidebar" class="resizable-sidebar"
+	<div ref="resizableSidebar" class="resizable-sidebar" @contextmenu="showContextMenu($event, contextMenu, menuItems)"
 			:style="{
 				'width': storedWidth ? storedWidth : props.width,
 				'min-width': props.minWidth,
@@ -49,10 +49,6 @@ onMounted(() => {
 	if (resizableSidebar.value && widthResizer.value) {
 		widthResizer.value.addEventListener("pointerdown", (e) => {
 			e.preventDefault();
-			if (e.button == 2) {
-				showContextMenu(e, contextMenu.value, menuItems);
-				return
-			};
 			document.body.style.cursor = "ew-resize";
 			function handleMove(pointer: PointerEvent) {
 				if (resizableSidebar.value) {
-- 
2.47.3


From b0d96faa6f445c04b2cba4c3da3a4a882f7d36f6 Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Mon, 11 Aug 2025 00:10:26 +0200
Subject: [PATCH 14/14] feat: add ability to open member context menu by
 right-clicking on avatar

---
 components/Message.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/components/Message.vue b/components/Message.vue
index 9d33ac0..74b0bca 100644
--- a/components/Message.vue
+++ b/components/Message.vue
@@ -29,7 +29,7 @@
 			:text="props.replyMessage?.message"
 			:reply-id="props.replyMessage.uuid" max-width="reply" />
 		<div class="left-column">
-			<Avatar :profile="props.author" class="message-author-avatar"/>
+			<Avatar :profile="props.author" class="message-author-avatar" @contextmenu="showContextMenu($event, contextMenu, memberMenuItems)" />
 		</div>
 		<div class="message-data">
 			<div class="message-metadata">
@@ -236,6 +236,7 @@ function getDayDifference(date1: Date, date2: Date) {
 	max-height: 2em;
 	min-width: 2em;
 	max-width: 2em;
+	cursor: pointer;
 }
 
 .message-author-username {
-- 
2.47.3