feat: extract expandDirectoryInSidebar helper and add debouncing to breadcrumb navigation clicks
- Extract expandDirectoryInSidebar function to handle directory expansion logic with loading and chevron icon updates - Replace inline directory expansion code in focusPathInSidebar with calls to new helper function - Add busy state tracking to breadcrumb click handlers to prevent rapid successive clicks - Disable pointer events during breadcrumb navigation execution - Make breadcrumb onClick handlers async to support
This commit is contained in:
parent
0362d4dfeb
commit
ddb73461da
@ -2342,6 +2342,23 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function expandDirectoryInSidebar(vaultName, dirPath, dirItem) {
|
||||||
|
const subContainer = document.getElementById(`dir-${vaultName}-${dirPath}`);
|
||||||
|
if (!subContainer) return null;
|
||||||
|
|
||||||
|
if (subContainer.children.length === 0) {
|
||||||
|
await loadDirectory(vaultName, dirPath, subContainer);
|
||||||
|
}
|
||||||
|
|
||||||
|
subContainer.classList.remove("collapsed");
|
||||||
|
if (dirItem) {
|
||||||
|
const chevron = dirItem.querySelector("[data-lucide]");
|
||||||
|
if (chevron) chevron.setAttribute("data-lucide", "chevron-down");
|
||||||
|
}
|
||||||
|
safeCreateIcons();
|
||||||
|
return subContainer;
|
||||||
|
}
|
||||||
|
|
||||||
async function focusPathInSidebar(vaultName, targetPath, options) {
|
async function focusPathInSidebar(vaultName, targetPath, options) {
|
||||||
switchSidebarTab("vaults");
|
switchSidebarTab("vaults");
|
||||||
|
|
||||||
@ -2388,11 +2405,7 @@
|
|||||||
|
|
||||||
const isLastSegment = index === segments.length - 1;
|
const isLastSegment = index === segments.length - 1;
|
||||||
if (!isLastSegment) {
|
if (!isLastSegment) {
|
||||||
const nextContainer = document.getElementById(`dir-${vaultName}-${cumulativePath}`);
|
const nextContainer = await expandDirectoryInSidebar(vaultName, cumulativePath, targetItem);
|
||||||
if (nextContainer && nextContainer.classList.contains("collapsed")) {
|
|
||||||
targetItem.click();
|
|
||||||
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
||||||
}
|
|
||||||
if (nextContainer) {
|
if (nextContainer) {
|
||||||
currentContainer = nextContainer;
|
currentContainer = nextContainer;
|
||||||
}
|
}
|
||||||
@ -2400,11 +2413,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (lastTargetItem && options && options.expandTarget) {
|
if (lastTargetItem && options && options.expandTarget) {
|
||||||
const targetContainer = document.getElementById(`dir-${vaultName}-${targetPath}`);
|
await expandDirectoryInSidebar(vaultName, targetPath, lastTargetItem);
|
||||||
if (targetContainer && targetContainer.classList.contains("collapsed")) {
|
|
||||||
lastTargetItem.click();
|
|
||||||
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Clear previous path selections and highlight the final target
|
// Clear previous path selections and highlight the final target
|
||||||
@ -5060,7 +5069,20 @@
|
|||||||
function makeBreadcrumbSpan(text, onClick) {
|
function makeBreadcrumbSpan(text, onClick) {
|
||||||
const s = document.createElement("span");
|
const s = document.createElement("span");
|
||||||
s.textContent = text;
|
s.textContent = text;
|
||||||
if (onClick) s.addEventListener("click", onClick);
|
if (onClick) {
|
||||||
|
s.addEventListener("click", async (event) => {
|
||||||
|
event.preventDefault();
|
||||||
|
if (s.dataset.busy === "true") return;
|
||||||
|
s.dataset.busy = "true";
|
||||||
|
s.style.pointerEvents = "none";
|
||||||
|
try {
|
||||||
|
await onClick(event);
|
||||||
|
} finally {
|
||||||
|
s.dataset.busy = "false";
|
||||||
|
s.style.pointerEvents = "";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
return s;
|
return s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user