Simplify sidebar tabs, improve saved search display, and refactor

suggestions
This commit is contained in:
2026-05-27 09:27:26 -04:00
parent 1c59300f11
commit 0d3de28967
3 changed files with 91 additions and 75 deletions
+32 -27
View File
@@ -453,52 +453,48 @@
const historyItems = SearchHistory.filter(inputValue);
this._renderHistory(historyItems, inputValue);
// Title and tag suggestions from API (debounced)
// Title and tag suggestions from API (debounced) — always fetch both
clearTimeout(this._suggestTimer);
if (ctx.prefix && ctx.prefix.length >= 2) {
this._suggestTimer = setTimeout(() => this._fetchSuggestions(ctx, vault, inputValue), SUGGEST_DEBOUNCE_MS);
const prefix = ctx.prefix;
if (prefix && prefix.length >= 2) {
this._suggestTimer = setTimeout(() => this._fetchSuggestions(prefix, vault), 150);
} else {
this._renderTitles([], "");
this._renderTags([], "");
this._titlesSection.hidden = true;
this._tagsSection.hidden = true;
}
// Show/hide sections
this._titlesSection.hidden = true;
this._tagsSection.hidden = true;
const hasContent = historyItems.length > 0;
this._historySection.hidden = historyItems.length === 0;
this._emptyEl.hidden = hasContent;
if (hasContent || (ctx.prefix && ctx.prefix.length >= 2)) {
if (hasContent || (prefix && prefix.length >= 2)) {
this.show();
} else if (!hasContent) {
} else {
this.hide();
}
this._collectItems();
},
async _fetchSuggestions(ctx, vault, inputValue) {
async _fetchSuggestions(prefix, vault) {
suggestAbortController = new AbortController();
try {
const [titlesRes, tagsRes] = await Promise.all([
ctx.type !== "tag" ? api(`/api/suggest?q=${encodeURIComponent(ctx.prefix)}&vault=${encodeURIComponent(vault)}&limit=8`, { signal: suggestAbortController.signal }) : Promise.resolve({ suggestions: [] }),
ctx.type === "tag" || ctx.type === "text" ? api(`/api/tags/suggest?q=${encodeURIComponent(ctx.prefix)}&vault=${encodeURIComponent(vault)}&limit=6`, { signal: suggestAbortController.signal }) : Promise.resolve({ suggestions: [] }),
api(`/api/suggest?q=${encodeURIComponent(prefix)}&vault=${encodeURIComponent(vault)}&limit=8`, { signal: suggestAbortController.signal }),
api(`/api/tags/suggest?q=${encodeURIComponent(prefix)}&vault=${encodeURIComponent(vault)}&limit=8`, { signal: suggestAbortController.signal }),
]);
this._renderTitles(titlesRes.suggestions || [], ctx.prefix);
this._renderTags(tagsRes.suggestions || [], ctx.prefix);
this._renderTitles(titlesRes.suggestions || [], prefix);
this._renderTags(tagsRes.suggestions || [], prefix);
// Update visibility
const hasTitles = (titlesRes.suggestions || []).length > 0;
const hasTags = (tagsRes.suggestions || []).length > 0;
this._titlesSection.hidden = !hasTitles;
this._tagsSection.hidden = !hasTags;
const historyVisible = !this._historySection.hidden;
const hasAny = historyVisible || hasTitles || hasTags;
this._emptyEl.hidden = hasAny;
if (hasAny) this.show();
else if (!historyVisible) this.hide();
if (hasTitles || hasTags) this.show();
this._collectItems();
} catch (err) {
if (err.name !== "AbortError") console.error("Suggestion fetch error:", err);
@@ -6056,18 +6052,26 @@
return;
}
if (empty) empty.style.display = "none";
list.innerHTML = searches.map(s => `
list.innerHTML = searches.map(s => {
const badges = [];
if (s.case_sensitive) badges.push('<span class="search-filter-badge">Aa</span>');
if (s.whole_word) badges.push('<span class="search-filter-badge">wd</span>');
if (s.regex) badges.push('<span class="search-filter-badge">.*</span>');
const pathFilters = [];
if (s.include_paths) pathFilters.push(`<span class="saved-search-path" title="Inclure: ${escapeHtml(s.include_paths)}">📥 ${escapeHtml(s.include_paths)}</span>`);
if (s.exclude_paths) pathFilters.push(`<span class="saved-search-path" title="Exclure: ${escapeHtml(s.exclude_paths)}">📤 ${escapeHtml(s.exclude_paths)}</span>`);
const vaultStr = s.vault && s.vault !== "all" ? `<span class="saved-search-vault">📁 ${escapeHtml(s.vault)}</span>` : "";
return `
<div class="saved-search-item">
<div class="saved-search-query" title="${escapeHtml(s.query)}">${escapeHtml(s.query.length > 50 ? s.query.slice(0, 50) + "..." : s.query)}</div>
<div class="saved-search-query">${escapeHtml(s.query)}</div>
<div class="saved-search-meta">
${s.case_sensitive ? '<span class="search-filter-badge">Aa</span>' : ""}
${s.whole_word ? '<span class="search-filter-badge">wd</span>' : ""}
${s.regex ? '<span class="search-filter-badge">.*</span>' : ""}
<span class="saved-search-vault">${escapeHtml(s.vault)}</span>
${badges.join("")}
${vaultStr}
</div>
${pathFilters.length ? '<div class="saved-search-filters">' + pathFilters.join(" ") + '</div>' : ""}
<button class="saved-search-delete" data-id="${s.id}" title="Supprimer">✕</button>
</div>
`).join("");
`}).join("");
list.querySelectorAll(".saved-search-item").forEach(item => {
item.addEventListener("click", (e) => {
if (e.target.classList.contains("saved-search-delete")) return;
@@ -6090,6 +6094,7 @@
if (excl) excl.value = s.exclude_paths;
}
// Execute the search
AutocompleteDropdown.hide();
const vault = s.vault || "all";
if (input) { input.dispatchEvent(new Event("input")); }
clearTimeout(searchTimeout);