|
+
+
+
+
+ |
+ `;
+ };
+ const setMetadataBuildHistoryFilterMenuOpen = (open) => {
+ this.metadataBuildHistoryFilterMenuOpen = Boolean(open);
+ const menu = metadataBuildResults?.querySelector?.('.mr-options-history-filter-menu');
+ const toggle = metadataBuildResults?.querySelector?.('[data-metadata-history-filter-toggle]');
+ if (menu) menu.hidden = !this.metadataBuildHistoryFilterMenuOpen;
+ if (toggle) toggle.setAttribute('aria-expanded', this.metadataBuildHistoryFilterMenuOpen ? 'true' : 'false');
+ };
+ const updateMetadataBuildActionFilterControl = (filter = 'all') => {
+ if (!metadataBuildResults) return;
+ const normalizedFilter = metadataBuildHistoryFilterValues.includes(filter) ? filter : 'all';
+ const counts = this.metadataBuildHistoryFilterCounts || {};
+ const toggle = metadataBuildResults.querySelector('[data-metadata-history-filter-toggle]');
+ const chip = metadataBuildResults.querySelector('[data-metadata-history-filter-chip]');
+ if (toggle) toggle.classList.toggle('is-filtered', normalizedFilter !== 'all');
+ if (chip) {
+ chip.textContent = metadataBuildHistoryFilterLabels[normalizedFilter] || normalizedFilter;
+ chip.hidden = normalizedFilter === 'all';
}
+ metadataBuildResults.querySelectorAll('[data-metadata-history-filter-option]').forEach((option) => {
+ const value = option.dataset.metadataHistoryFilterOption || 'all';
+ const isActive = value === normalizedFilter;
+ option.classList.toggle('is-active', isActive);
+ option.setAttribute('aria-checked', isActive ? 'true' : 'false');
+ const countEl = option.querySelector('strong');
+ if (countEl) countEl.textContent = Number(counts[value] || 0).toLocaleString();
+ });
+ };
+ const applyMetadataBuildHistoryFilter = (filter = 'all') => {
+ if (!metadataBuildResults) return;
+ const normalizedFilter = metadataBuildHistoryFilterValues.includes(filter) ? filter : 'all';
+ this.metadataBuildHistoryFilter = normalizedFilter;
+ let shown = 0;
+ metadataBuildResults.querySelectorAll('[data-metadata-history-row]').forEach((row) => {
+ const action = row.dataset.historyAction || 'checked';
+ const matches = metadataBuildHistoryActionMatchesFilter(action, normalizedFilter);
+ row.hidden = !matches;
+ if (matches) shown += 1;
+ });
+ const emptyRow = metadataBuildResults.querySelector('[data-metadata-history-empty-row]');
+ if (emptyRow) emptyRow.hidden = shown > 0;
+ this.metadataBuildHistoryFilteredCount = shown;
+ updateMetadataBuildActionFilterControl(normalizedFilter);
};
const renderMetadataBuildResults = (data = undefined) => {
@@ -1654,11 +1705,11 @@ export const optionsMethods = {
const activeHistoryFilter = getMetadataBuildHistoryFilter();
this.metadataBuildHistoryFilter = activeHistoryFilter;
const filteredItems = displayItems.filter(item => metadataBuildHistoryMatchesFilter(item, activeHistoryFilter));
- updateMetadataBuildHistoryFilterUi(displayItems, filteredItems, activeHistoryFilter);
- const visibleItems = filteredItems;
+ const filterCounts = updateMetadataBuildHistoryFilterUi(displayItems, filteredItems, activeHistoryFilter);
+ const visibleItems = displayItems;
let html = '';
- if (visibleItems.length) {
+ if (displayItems.length) {
const rows = visibleItems.map((item) => {
const modelLabel = item.relative_path || item.filename || item.model_path || 'Model';
const modelPath = item.model_path || '';
@@ -1674,8 +1725,10 @@ export const optionsMethods = {
: '';
const changedFieldsTitle = changedFields ? ` title="${this.escapeHtml(changedFields)}"` : '';
const action = item.action || 'checked';
- const actionClass = String(action).toLowerCase().replace(/[^a-z0-9_-]+/g, '-');
+ const actionValue = String(action).toLowerCase();
+ const actionClass = actionValue.replace(/[^a-z0-9_-]+/g, '-');
const message = item.message || changedFieldsSummary;
+ const rowMatchesFilter = metadataBuildHistoryActionMatchesFilter(actionValue, activeHistoryFilter);
const buildContext = modelPath ? {
context_scope: 'local_model',
open_folder_label: 'Show File in Folder',
@@ -1697,7 +1750,7 @@ export const optionsMethods = {
? this.getContextMenuAttrs(buildContext, 'Right-click for model options')
: '';
return `
-
`;
}).join('');
+ const emptyRow = `
+ No history items match the ${this.escapeHtml(label)} filter.
`;
} else if (source?.cancelled) {
html += 'Metadata build was cancelled before any history item was captured.
';
} else {
@@ -2977,10 +3034,38 @@ export const optionsMethods = {
});
});
- if (metadataBuildHistoryFilterInput) {
- metadataBuildHistoryFilterInput.addEventListener('change', () => {
- this.metadataBuildHistoryFilter = getMetadataBuildHistoryFilter();
- renderMetadataBuildResults();
+ if (metadataBuildResults) {
+ metadataBuildResults.addEventListener('click', (event) => {
+ const filterToggle = event.target?.closest?.('[data-metadata-history-filter-toggle]');
+ if (filterToggle) {
+ event.preventDefault();
+ event.stopPropagation();
+ setMetadataBuildHistoryFilterMenuOpen(!this.metadataBuildHistoryFilterMenuOpen);
+ return;
+ }
+
+ const filterOption = event.target?.closest?.('[data-metadata-history-filter-option]');
+ if (filterOption) {
+ event.preventDefault();
+ event.stopPropagation();
+ const nextFilter = filterOption.dataset.metadataHistoryFilterOption || 'all';
+ applyMetadataBuildHistoryFilter(nextFilter);
+ setMetadataBuildHistoryFilterMenuOpen(false);
+ }
+ });
+ }
+
+ this.contentElement.addEventListener('click', (event) => {
+ if (!this.metadataBuildHistoryFilterMenuOpen) return;
+ if (event.target?.closest?.('.mr-options-history-action-filter-wrap')) return;
+ setMetadataBuildHistoryFilterMenuOpen(false);
+ });
+
+ if (metadataBuildResults) {
+ metadataBuildResults.addEventListener('keydown', (event) => {
+ if (event.key !== 'Escape' || !this.metadataBuildHistoryFilterMenuOpen) return;
+ event.preventDefault();
+ setMetadataBuildHistoryFilterMenuOpen(false);
});
}