From 29e929584ac73124dcfaf097803143df38bebf57 Mon Sep 17 00:00:00 2001
From: digital-garbage <133010426+digital-garbage@users.noreply.github.com>
Date: Sun, 7 Jun 2026 13:09:12 +0300
Subject: [PATCH] Movie Editor: null-safe modal close; prevent double-open
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes 'TypeError: overlay is null' at models.js close handler — opening Models
twice orphaned the first overlay's handlers (they reference the module overlay,
now pointing at the second), so closing then closing again hit a null overlay.
Guard close/backdrop handlers and bail early from open() if a modal is already up.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 movie_editor/frontend/models.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/movie_editor/frontend/models.js b/movie_editor/frontend/models.js
index 95082092..baa2339d 100644
--- a/movie_editor/frontend/models.js
+++ b/movie_editor/frontend/models.js
@@ -769,6 +769,7 @@
   }
 
   async function open() {
+    if (overlay) return;  // already open — don't stack a second modal (orphans handlers)
     await ensureRoles();
     try { const pp = await API.pipelinePorts(); ports = pp.ports || []; coreProducers = pp.core_producers || []; requirements = pp.requirements || []; } catch (_) { ports = []; coreProducers = []; requirements = []; }
     try { config = await API.getModels(window.Store?.get().project?.id); } catch (_) { config = { slots: [] }; }
@@ -780,13 +781,14 @@
     const head = el("div", "modal-head");
     head.append(el("div", "modal-title", "Models & Pipeline Nodes"));
     const refresh = el("button", "btn ghost", "↻ Refresh model list"); refresh.onclick = refreshList;
-    const close = el("button", "btn ghost", "✕"); close.onclick = () => { overlay.remove(); overlay = null; };
+    const closeModal = () => { if (overlay) overlay.remove(); overlay = null; };
+    const close = el("button", "btn ghost", "✕"); close.onclick = closeModal;
     const heRight = el("div", "modal-head-right"); heRight.append(refresh); heRight.append(close);
     head.append(heRight);
     modal.append(head);
     modal.append(el("div", "modal-content"));
     overlay.append(modal);
-    overlay.addEventListener("click", (e) => { if (e.target === overlay) { overlay.remove(); overlay = null; } });
+    overlay.addEventListener("click", (e) => { if (overlay && e.target === overlay) closeModal(); });
     document.body.append(overlay);
     render();
   }