Merge branch 'main' into highlight-reply

utils/createContextMenu.ts

@@ -1,21 +0,0 @@
-import { render } from "vue";
-import ContextMenu from "~/components/UserInterface/ContextMenu.vue";
-import type { ContextMenuItem } from "~/types/interfaces";
-
-export default (e: PointerEvent | MouseEvent, menuItems: ContextMenuItem[]) => {
-  console.log("Rendering new context menu");
-  const menuContainer = document.createElement("div");
-  console.log("hello");
-  menuContainer.id = "context-menu";
-  document.body.appendChild(menuContainer);
-  console.log("pointer x:", e.clientX);
-  console.log("pointer y:", e.clientY);
-  console.log("menu items:", menuItems);
-  const contextMenu = h(ContextMenu, {
-  	menuItems,
-  	pointerX: e.clientX,
-  	pointerY: e.clientY 
-  });
-  render(contextMenu, menuContainer);
-  console.log("Rendered");
-}

utils/removeContextMenu.ts

@@ -1,6 +1,12 @@
-export default () => {
-	const contextMenu = document.getElementById("context-menu");
-	if (contextMenu) {
-		contextMenu.remove();
+import type { ContextMenuInterface } from "~/types/interfaces";
+
+export default (contextMenu: Ref<ContextMenuInterface>) => {
+	console.log("resetting and hiding context menu");
+	contextMenu.value = {
+		show: false,
+		pointerX: 0,
+		pointerY: 0,
+		items: []
 	}
+	console.log("hidden context menu");
 }

utils/showContextMenu.ts

@@ -0,0 +1,12 @@
+import { render } from "vue";
+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");
+}