stack those menus!

src/webpage/contextmenu.ts

@@ -159,7 +159,10 @@ class Seperator<x, y> implements menuPart<x, y> {
 	}
 	makeContextHTML(obj1: x, obj2: y, menu: HTMLDivElement): void {
 		if (!this.visible || this.visible(obj1, obj2)) {
-			if (menu.children[menu.children.length - 1].tagName === "HR") {
+			if (
+				!menu.children[menu.children.length - 1] ||
+				menu.children[menu.children.length - 1].tagName === "HR"
+			) {
 				return;
 			}
 			menu.append(document.createElement("hr"));
@@ -303,6 +306,10 @@ class Contextmenu<x, y> {
 		this.buttons.push(button);
 		return button;
 	}
+	excluded = [] as string[];
+	excludeGroup(group: string) {
+		this.excluded.push(group);
+	}
 	addSeperator(visible?: (obj1: x, obj2: y) => boolean, group?: string) {
 		this.buttons.push(new Seperator(visible, group));
 	}
@@ -338,7 +345,10 @@ class Contextmenu<x, y> {
 		div.classList.add("contextmenu", "flexttb");
 		const processed = new WeakSet<menuPart<unknown, unknown>>();
 
+		const excluded = new Set(layered.flatMap((_) => _[0].excluded));
+
 		for (const button of this.buttons) {
+			if (excluded.has(button.group || "")) continue;
 			button.makeContextHTML(addinfo, other, div, layered, processed);
 		}
 		if (div.children[div.children.length - 1]?.tagName !== "HR") {

src/webpage/direct.ts

@@ -396,7 +396,7 @@ dmPermissions.setPermission("USE_VAD", 1);
 class Group extends Channel {
 	users: User[];
 	owner_id?: string;
-	static groupcontextmenu = new Contextmenu<Group, undefined>("channel menu");
+	static groupcontextmenu = new Contextmenu<Group, undefined>("channel menu", true);
 	static groupMenu = this.makeGroupMenu();
 	static makeGroupMenu() {
 		const menu = new Contextmenu<Group, User>("group menu", true);
@@ -427,9 +427,13 @@ class Group extends Channel {
 			function (this: Group) {
 				this.readbottom();
 			},
+			{
+				group: "dm",
+			},
 		);
+		this.groupcontextmenu.excludeGroup("dmPerson");
 
-		this.groupcontextmenu.addSeperator();
+		this.groupcontextmenu.addSeperator(undefined, "dm");
 
 		this.groupcontextmenu.addButton(
 			() => I18n.group.edit(),
@@ -450,6 +454,7 @@ class Group extends Channel {
 			},
 			{
 				color: "red",
+				group: "dm",
 			},
 		);
 
@@ -458,27 +463,21 @@ class Group extends Channel {
 			function (this: Group) {
 				this.addPerson();
 			},
-		);
-
-		this.groupcontextmenu.addSeperator();
-
-		this.groupcontextmenu.addButton(
-			() => I18n.user.copyId(),
-			function () {
-				navigator.clipboard.writeText(this.users[0].id);
-			},
 			{
-				visible: function () {
-					return this.type === 1;
-				},
+				group: "dm",
 			},
 		);
 
+		this.groupcontextmenu.addSeperator(undefined, "dm");
+
 		this.groupcontextmenu.addButton(
 			() => I18n.DMs.copyId(),
 			function (this: Group) {
 				navigator.clipboard.writeText(this.id);
 			},
+			{
+				group: "id",
+			},
 		);
 	}
 
@@ -593,6 +592,9 @@ class Group extends Channel {
 	createguildHTML() {
 		const div = document.createElement("div");
 		Group.groupcontextmenu.bindContextmenu(div, this, undefined);
+		if (this.type === 1 && this.users[0]) {
+			User.contextmenu.bindContextmenu(div, this.users[0], undefined);
+		}
 		this.html = new WeakRef(div);
 		div.classList.add("flexltr", "liststyle");
 		const myhtml = document.createElement("span");

src/webpage/user.ts

@@ -308,6 +308,9 @@ class User extends SnowFlake {
 		await relChange;
 	}
 	static setUpContextMenu(): void {
+		this.contextmenu.addGroup("dm");
+		this.contextmenu.addSeperator();
+
 		this.contextmenu.addButton(
 			() => I18n.user.message(),
 			function (this: User) {
@@ -317,6 +320,7 @@ class User extends SnowFlake {
 				icon: {
 					css: "svg-frmessage",
 				},
+				group: "dmPerson",
 			},
 		);
 
@@ -578,6 +582,7 @@ class User extends SnowFlake {
 				navigator.clipboard.writeText(this.id);
 			},
 		);
+		this.contextmenu.addGroup("id");
 
 		this.contextmenu.addSeperator();