From ba30d1e7cea593a88399b7eb8694179ee0680097 Mon Sep 17 00:00:00 2001
From: Bruno Charest <bruno.charest@gmail.com>
Date: Sat, 6 Jun 2026 00:11:21 -0400
Subject: [PATCH] feat: Forge opens in editor modal instead of new tab

Forge button now reuses the existing editor-modal with an iframe. Same position as the Edit/CodeMirror modal. On close, the forge iframe is removed and the current file is refreshed (picks up changes saved by the POC's auto-save). Updated both frontend/js/viewer.js and frontend/app.js.
---
 frontend/app.js       | 20 ++++++++++++++++++--
 frontend/js/utils.js  |  6 ++++++
 frontend/js/viewer.js | 14 ++++++++++++--
 3 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/frontend/app.js b/frontend/app.js
index 9822dfb..5b7bf30 100644
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -3294,8 +3294,18 @@
 
     const forgeBtn = el("button", { class: "btn-action btn-forge", title: "Forge (nouvel editeur)" }, [icon("hammer", 14), document.createTextNode("Forge")]);
     forgeBtn.addEventListener("click", () => {
-      var forgeUrl = "/editor-poc?vault=" + encodeURIComponent(data.vault) + "&path=" + encodeURIComponent(data.path);
-      window.open(forgeUrl, "_blank");
+      var modal = document.getElementById("editor-modal");
+      var titleEl = document.getElementById("editor-title");
+      var bodyEl = document.getElementById("editor-body");
+      titleEl.textContent = "Forge: " + data.path.split("/").pop();
+      bodyEl.innerHTML = "";
+      var iframe = document.createElement("iframe");
+      iframe.id = "forge-iframe";
+      iframe.src = "/editor-poc?vault=" + encodeURIComponent(data.vault) + "&path=" + encodeURIComponent(data.path);
+      iframe.style.cssText = "width:100%;height:100%;border:none;";
+      bodyEl.appendChild(iframe);
+      modal.classList.add("active");
+      safeCreateIcons();
     });
 
     const openNewWindowBtn = el("button", { class: "btn-action", title: "Ouvrir dans une nouvelle fenetre" }, [icon("external-link", 14), document.createTextNode("pop-out")]);
@@ -6312,6 +6322,12 @@
       editorView = null;
     }
     fallbackEditorEl = null;
+    // Remove forge iframe if present + refresh current file
+    var forgeFrame = document.getElementById("forge-iframe");
+    if (forgeFrame) {
+      forgeFrame.remove();
+      if (currentVault && currentPath) openFile(currentVault, currentPath);
+    }
     editorVault = null;
     editorPath = null;
   }
diff --git a/frontend/js/utils.js b/frontend/js/utils.js
index b2c944b..3f1bc78 100644
--- a/frontend/js/utils.js
+++ b/frontend/js/utils.js
@@ -459,6 +459,12 @@ function closeEditor() {
     state.editorView = null;
   }
   state.fallbackEditorEl = null;
+  // Remove forge iframe if present + refresh current file
+  var forgeFrame = document.getElementById("forge-iframe");
+  if (forgeFrame) {
+    forgeFrame.remove();
+    if (state.currentVault && state.currentPath) openFile(state.currentVault, state.currentPath);
+  }
   state.editorVault = null;
   state.editorPath = null;
   // Refresh file content if we're viewing the edited file
diff --git a/frontend/js/viewer.js b/frontend/js/viewer.js
index 6d229b1..dbbc30f 100644
--- a/frontend/js/viewer.js
+++ b/frontend/js/viewer.js
@@ -499,8 +499,18 @@ export function renderFile(data) {
 
   const forgeBtn = el("button", { class: "btn-action btn-forge", title: "Forge (nouvel editeur)" }, [icon("hammer", 14), document.createTextNode("Forge")]);
   forgeBtn.addEventListener("click", () => {
-    var forgeUrl = "/editor-poc?vault=" + encodeURIComponent(data.vault) + "&path=" + encodeURIComponent(data.path);
-    window.open(forgeUrl, "_blank");
+    var modal = document.getElementById("editor-modal");
+    var titleEl = document.getElementById("editor-title");
+    var bodyEl = document.getElementById("editor-body");
+    titleEl.textContent = "Forge: " + data.path.split("/").pop();
+    bodyEl.innerHTML = "";
+    var iframe = document.createElement("iframe");
+    iframe.id = "forge-iframe";
+    iframe.src = "/editor-poc?vault=" + encodeURIComponent(data.vault) + "&path=" + encodeURIComponent(data.path);
+    iframe.style.cssText = "width:100%;height:100%;border:none;";
+    bodyEl.appendChild(iframe);
+    modal.classList.add("active");
+    safeCreateIcons();
   });
 
   const openNewWindowBtn = el("button", { class: "btn-action", title: "Ouvrir dans une nouvelle fenetre" }, [icon("external-link", 14), document.createTextNode("pop-out")]);