From 3943034a18e3338d2a81ed26f6e2697ed3a052f3 Mon Sep 17 00:00:00 2001
From: korutech-ai <davo@korutech.com>
Date: Wed, 28 Aug 2024 11:18:53 +1200
Subject: [PATCH] UPDATE: Added a notes editing toggle button to improve notes
 tab layout.

---
 web/model-manager.js | 46 +++++++++++++++++++++++++++++++++++++-------
 1 file changed, 39 insertions(+), 7 deletions(-)

diff --git a/web/model-manager.js b/web/model-manager.js
index 469c14a..bc7b4dd 100644
--- a/web/model-manager.js
+++ b/web/model-manager.js
@@ -2716,7 +2716,7 @@ class ModelInfo {
             (() => {
                 const notes = $el("textarea.comfy-multiline-input", {
                     name: "model notes",
-                    value: noteText, 
+                    value: noteText,
                     oninput: (e) => {
                         if (this.#settingsElements["model-info-autosave-notes"].checked) {
                             saveDebounce();
@@ -2752,19 +2752,51 @@ class ModelInfo {
                 this.elements.notes = notes;
                 this.elements.markdown = markdown;
                 this.#savedNotesValue = noteText;
+
+                const notes_editor = $el(
+                    "div",
+                    {
+                        style: {
+                            "display": noteText == "" ? "flex" : "none",
+                            "height": "100%",
+                            "min-height": "60px"
+                        },
+                    },
+                    notes
+                );
+                const notes_viewer = $el(
+                    "div",
+                    {
+                        style: {
+                            "display": noteText == "" ? "none" : "flex",
+                            "height": "100%",
+                            "min-height": "60px",
+                            "overflow": "scroll"
+                        },
+                    },
+                    markdown
+                );
+
+                const editNotesButton = new ComfyButton({
+                    icon: "pencil",
+                    tooltip: "Change file name",
+                    classList: "comfyui-button icon-button",
+                    action: async () => {
+                        notes_editor.style.display = notes_editor.style.display == "flex" ? "none" : "flex";
+                        notes_viewer.style.display = notes_viewer.style.display == "none" ? "flex" : "none";
+                    },
+                }).element;
+
                 return [
                     $el("div.row", {
                         style: { "align-items": "center" },
                     }, [
                         $el("h1", ["Notes"]),
                         saveNotesButton,
+                        editNotesButton,
                     ]),
-                    $el("div", {
-                        style: { "display": "block", "height": "20%", "min-height": "120px", "z-index": "1" },
-                    }, notes),
-                    $el("div", {
-                        style: { "display": "block", "height": "70%", "min-height": "60px", "overflow": "scroll" },
-                    }, markdown),
+                    notes_editor,
+                    notes_viewer,
                 ];
             })()
         );