From 1eecf9a5c89c2fbfe467512014b72f91d57e6e59 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sat, 28 Dec 2024 09:50:19 +0200
Subject: [PATCH] feat(mobile): context menu triggering

---
 src/public/app/menus/context_menu.ts | 21 ++++++++++++++++++++-
 src/public/stylesheets/style.css     |  2 +-
 2 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/src/public/app/menus/context_menu.ts b/src/public/app/menus/context_menu.ts
index f3bd9d01b..a2f3faa17 100644
--- a/src/public/app/menus/context_menu.ts
+++ b/src/public/app/menus/context_menu.ts
@@ -1,5 +1,6 @@
 import { CommandNames } from '../components/app_context.js';
 import keyboardActionService from '../services/keyboard_actions.js';
+import utils from '../services/utils.js';
 
 interface ContextMenuOptions<T extends CommandNames> {
     x: number;
@@ -34,13 +35,21 @@ class ContextMenu {
     private $widget!: JQuery<HTMLElement>;
     private dateContextMenuOpenedMs: number;
     private options?: ContextMenuOptions<any>;
+    private isMobile: boolean;
 
     constructor() {
         this.$widget = $("#context-menu-container");
         this.$widget.addClass("dropend");
         this.dateContextMenuOpenedMs = 0;
+        this.isMobile = utils.isMobile();
 
-        $(document).on('click', () => this.hide());
+        $(document).on('click', (e) => {
+            if (this.isMobile && $(e.target).closest("#context-menu-container").length) {
+                return;
+            }
+
+            this.hide();
+        });
     }
 
     async show<T extends CommandNames>(options: ContextMenuOptions<T>) {
@@ -158,6 +167,16 @@ class ContextMenu {
                             return false;
                         }
 
+                        if (this.isMobile && "items" in item && item.items) {
+                            const $target = $(e.target);
+                            $target
+                                .parents(".dropdown-item")
+                                .find("ul.dropdown-menu")
+                                .toggleClass("show");
+                            e.preventDefault();
+                            return false;
+                        }
+
                         this.hide();
 
                         if ("handler" in item && item.handler) {
diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css
index 50462b213..5250e8c33 100644
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -966,7 +966,7 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
     cursor: pointer;
 }
 
-li.dropdown-submenu:hover > ul.dropdown-menu {
+body.desktop li.dropdown-submenu:hover > ul.dropdown-menu {
     display: block;
 }