Fix manual linking syntax error and improve button visibility

- Fix Uncaught SyntaxError in MediaManager.html by using attribute selector for IDs with special characters (e.g. Shopify GIDs).
- Ensure Link Selected button visibility updates correctly by refactoring updateLinkButtonState and calling it on selection changes.
This commit is contained in:
Ben Miller
2025-12-31 22:09:06 -07:00
parent 78bbf04824
commit 61db262082

View File

@ -822,12 +822,14 @@
// Targeted updates // Targeted updates
affectedIds.forEach(function (aid) { ui.updateCardState(aid); }); affectedIds.forEach(function (aid) { ui.updateCardState(aid); });
ui.updateLinkButtonState();
}; };
MediaState.prototype.clearSelection = function () { MediaState.prototype.clearSelection = function () {
var affectedIds = Array.from(this.selectedIds); var affectedIds = Array.from(this.selectedIds);
this.selectedIds.clear(); this.selectedIds.clear();
affectedIds.forEach(function (aid) { ui.updateCardState(aid); }); affectedIds.forEach(function (aid) { ui.updateCardState(aid); });
ui.updateLinkButtonState();
}; };
MediaState.prototype.addItem = function (item) { MediaState.prototype.addItem = function (item) {
@ -1047,6 +1049,22 @@
btn.disabled = false; btn.disabled = false;
}; };
UI.prototype.updateLinkButtonState = function () {
var btnLink = document.getElementById('btn-link-selected');
if (btnLink) {
var items = state.items || [];
var selectedItems = items.filter(function (i) { return state.selectedIds.has(i.id); });
var hasDrive = selectedItems.some(function (i) { return i.source === 'drive_only'; });
var hasShopify = selectedItems.some(function (i) { return i.source === 'shopify_only'; });
if (hasDrive && hasShopify) {
btnLink.style.display = 'block';
} else {
btnLink.style.display = 'none';
}
}
};
UI.prototype.render = function (items) { UI.prototype.render = function (items) {
this.grid.innerHTML = ''; this.grid.innerHTML = '';
var _this = this; // Capture 'this' for callbacks var _this = this; // Capture 'this' for callbacks
@ -1061,18 +1079,7 @@
} }
// Link Selected button logic // Link Selected button logic
var btnLink = document.getElementById('btn-link-selected'); this.updateLinkButtonState();
if (btnLink) {
var selectedItems = items.filter(function (i) { return state.selectedIds.has(i.id); });
var hasDrive = selectedItems.some(function (i) { return i.source === 'drive_only'; });
var hasShopify = selectedItems.some(function (i) { return i.source === 'shopify_only'; });
if (hasDrive && hasShopify) {
btnLink.style.display = 'block';
} else {
btnLink.style.display = 'none';
}
}
if (items.length === 0) { if (items.length === 0) {
this.grid.innerHTML = '<div class="empty-state">No media found. Upload something!</div>'; this.grid.innerHTML = '<div class="empty-state">No media found. Upload something!</div>';
@ -1333,7 +1340,7 @@
var overlay = el.querySelector('.media-overlay'); var overlay = el.querySelector('.media-overlay');
if (overlay) { if (overlay) {
// Remove existing link button if it exists // Remove existing link button if it exists
var oldLinkBtn = el.querySelector('#link-btn-' + id); var oldLinkBtn = el.querySelector('[id="link-btn-' + id + '"]');
if (oldLinkBtn) oldLinkBtn.remove(); if (oldLinkBtn) oldLinkBtn.remove();
// Add link button back if NOT deleted // Add link button back if NOT deleted