continue breadcrumb update

public/js/folderManager.js

@@ -334,6 +334,10 @@ function folderDropHandler(event) {
     });
 }
 
+/* ----------------------
+   Main Folder Tree Rendering and Event Binding
+----------------------*/
+// --- Helpers for safe breadcrumb rendering ---
 function renderBreadcrumbFragment(folderPath) {
   const frag = document.createDocumentFragment();
   const parts = folderPath.split("/");
@@ -357,28 +361,14 @@ function renderBreadcrumbFragment(folderPath) {
 }
 
 function updateBreadcrumbTitle(folder) {
-  const container = document.getElementById("fileListTitle");
+  const titleEl = document.getElementById("fileListTitle");
-  container.textContent = "";  // clear old
+  titleEl.textContent = "";
-
+  titleEl.appendChild(document.createTextNode(t("files_in") + " ("));
-  // prefix
+  titleEl.appendChild(renderBreadcrumbFragment(folder));
-  container.appendChild(
+  titleEl.appendChild(document.createTextNode(")"));
-    document.createTextNode(`${t("files_in")} (`)
+  setupBreadcrumbDelegation();
-  );
-
-  // the actual crumbs
-  container.appendChild(
-    renderBreadcrumbFragment(folder)
-  );
-
-  // closing paren
-  container.appendChild(
-    document.createTextNode(")")
-  );
 }
 
-/* ----------------------
-   Main Folder Tree Rendering and Event Binding
-----------------------*/
 export async function loadFolderTree(selectedFolder) {
   try {
     // Check if the user has folder-only permission.
@@ -464,18 +454,8 @@ export async function loadFolderTree(selectedFolder) {
     }
     localStorage.setItem("lastOpenedFolder", window.currentFolder);
 
-    const titleEl = document.getElementById("fileListTitle");
+    // Initial breadcrumb update
-    titleEl.textContent = "";
+    updateBreadcrumbTitle(window.currentFolder);
-
-    titleEl.appendChild(
-      document.createTextNode(t("files_in") + " (")
-    );
-
-    const breadcrumbFragment = renderBreadcrumbFragment(window.currentFolder);
-    titleEl.appendChild(breadcrumbFragment);
-
-    titleEl.appendChild(document.createTextNode(")"));
-    setupBreadcrumbDelegation();
     loadFileList(window.currentFolder);
 
     const folderState = loadFolderTreeState();
@@ -489,6 +469,7 @@ export async function loadFolderTree(selectedFolder) {
       selectedEl.classList.add("selected");
     }
 
+    // Folder-option click: update selection, breadcrumbs, and file list
     container.querySelectorAll(".folder-option").forEach(el => {
       el.addEventListener("click", function (e) {
         e.stopPropagation();
@@ -497,13 +478,14 @@ export async function loadFolderTree(selectedFolder) {
         const selected = this.getAttribute("data-folder");
         window.currentFolder = selected;
         localStorage.setItem("lastOpenedFolder", selected);
-        const titleEl = document.getElementById("fileListTitle");
+
-        titleEl.innerHTML = t("files_in") + " (" + renderBreadcrumb(selected) + ")";
+        // Safe breadcrumb update
-        setupBreadcrumbDelegation();
+        updateBreadcrumbTitle(selected);
         loadFileList(selected);
       });
     });
 
+    // Root toggle handler
     const rootToggle = container.querySelector("#rootRow .folder-toggle");
     if (rootToggle) {
       rootToggle.addEventListener("click", function (e) {
@@ -527,6 +509,7 @@ export async function loadFolderTree(selectedFolder) {
       });
     }
 
+    // Other folder-toggle handlers
     container.querySelectorAll(".folder-toggle").forEach(toggle => {
       toggle.addEventListener("click", function (e) {
         e.stopPropagation();
@@ -555,6 +538,7 @@ export async function loadFolderTree(selectedFolder) {
   }
 }
 
+
 // For backward compatibility.
 export function loadFolderList(selectedFolder) {
   loadFolderTree(selectedFolder);