From eade5b27d8af7ff84e110f837b7b71a46917d80c Mon Sep 17 00:00:00 2001
From: Christian Bastian <80225746+cdb-boop@users.noreply.github.com>
Date: Tue, 23 Jul 2024 16:26:28 -0400
Subject: [PATCH] Add model manager button to [Beta] menu.

---
 web/model-manager.js | 34 +++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/web/model-manager.js b/web/model-manager.js
index e116fb4..b8c4fd2 100644
--- a/web/model-manager.js
+++ b/web/model-manager.js
@@ -1,6 +1,7 @@
 import { app } from "../../scripts/app.js";
 import { api } from "../../scripts/api.js";
 import { ComfyDialog, $el } from "../../scripts/ui.js";
+import { ComfyButton } from "../../scripts/ui/components/button.js";
 
 /**
  * @param {string} url
@@ -4095,6 +4096,17 @@ function getInstance() {
     return instance;
 }
 
+const toggleModelManager = () => {
+    const modelManager = getInstance();
+    const style = modelManager.element.style;
+    if (style.display === "" || style.display === "none") {
+        modelManager.show();
+    }
+    else {
+        modelManager.close();
+    }
+};
+
 app.registerExtension({
     name: "Comfy.ModelManager",
     init() {
@@ -4106,22 +4118,22 @@ app.registerExtension({
             href: "./extensions/ComfyUI-Model-Manager/model-manager.css",
         });
         
-        app.ui.menuContainer.appendChild(
+        app.ui?.menuContainer?.appendChild(
             $el("button", {
                 id: "comfyui-model-manager-button",
                 parent: document.querySelector(".comfy-menu"),
                 textContent: "Models",
-                onclick: () => {
-                    const modelManager = getInstance();
-                    const style = modelManager.element.style;
-                    if (style.display === "" || style.display === "none") {
-                        modelManager.show();
-                    }
-                    else {
-                        modelManager.close();
-                    }
-                },
+                onclick: () => toggleModelManager(),
             })
         );
+        
+        // [Beta] mobile menu
+        app?.menu?.actionsGroup.element.appendChild(new ComfyButton({
+            icon: "folder-search-outline",
+            tooltip: "Opens model manager",
+            action: () => toggleModelManager(),
+            content: "Model Manager",
+            popup: getInstance(),
+        }).element);
     },
 });