feat(media-manager): link media filenames to preview pages in match wizard

- Updates the 'Link Media' wizard and confirmation modal to make filenames clickable.
- Links Drive files to their view page.
- Links Shopify files to the Admin Content > Files page, derived from the product admin URL.
- Applies primary theme color to links for better visibility.
This commit is contained in:
Ben Miller
2026-01-01 05:37:53 -07:00
parent 09995d0d05
commit 8d780d2fcb

View File

@ -527,27 +527,34 @@
.combined-item {
display: flex;
flex-direction: column;
background: #f0f9ff; /* Light blue tint */
background: #f0f9ff;
/* Light blue tint */
border: 2px solid var(--primary);
}
.combined-images {
display: flex;
flex: 1;
overflow: hidden;
border-bottom: 1px solid var(--border);
}
.combined-part {
flex: 1;
position: relative;
border-right: 1px solid var(--border);
}
.combined-part:last-child {
border-right: none;
}
.combined-part .media-content {
aspect-ratio: auto; /* Allow filling height */
aspect-ratio: auto;
/* Allow filling height */
height: 100px;
}
.unlink-btn {
width: 100%;
background: white;
@ -563,6 +570,7 @@
font-weight: 500;
transition: background 0.1s;
}
.unlink-btn:hover {
background: #fee2e2;
}
@ -2199,8 +2207,20 @@
dImg.src = blank;
sImg.src = blank;
document.getElementById('match-drive-name').innerText = match.drive.filename;
document.getElementById('match-shopify-name').innerText = match.shopify.filename;
// Link to Drive Preview
var driveLink = "https://drive.google.com/file/d/" + match.drive.id + "/view";
document.getElementById('match-drive-name').innerHTML = '<a href="' + driveLink + '" target="_blank" style="color:var(--primary); text-decoration:underline;">' + match.drive.filename + '</a>';
// Link to Shopify Admin Media
var shopifyLink = match.shopify.contentUrl || "#";
if (ui.shopifyUrl) {
// Pattern: .../admin/content/files/{id}?selectedView=all
// We derive the base admin URL from the product URL
var adminBase = ui.shopifyUrl.split('/products/')[0];
var mediaId = match.shopify.id.split('/').pop();
shopifyLink = adminBase + "/content/files/" + mediaId + "?selectedView=all";
}
document.getElementById('match-shopify-name').innerHTML = '<a href="' + shopifyLink + '" target="_blank" style="color:var(--primary); text-decoration:underline;">' + match.shopify.filename + '</a>';
document.getElementById('match-index').innerText = this.currentMatchIndex + 1;
document.getElementById('match-total').innerText = this.matches.length;