Gandalf/sofarr
1
0
Fork 0
Code Issues 1 Pull Requests Actions 1 Packages Projects Releases 22 Wiki Activity

Extract createClientLogo helper to eliminate 2× client-logo duplication
Some checks failed
Build and Push Docker Image / build (push) Successful in 27s
Details
Licence Check / Licence compatibility and copyright header verification (push) Failing after 36s
Details
CI / Security audit (push) Successful in 1m1s
Details
CI / Tests & coverage (push) Successful in 1m15s
Details

Browse Source 
- Consolidated duplicate client logo creation logic into single helper function
- Removed second duplicate logo block from createDownloadCard
- Updated updateDownloadCard to use the same helper
- Client logo now appears exactly once per download card
This commit is contained in:
Gronod
2026-05-20 23:36:16 +01:00
parent 0b91152ad7
commit d03efbf25e
1 changed files with 21 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
client/src/ui/downloads.js
View File

@@ -32,6 +32,24 @@ export function renderTagBadges(tagBadges, showAll, matchedUserTag) {
return fragment; return fragment;
} }
function createClientLogo(download) {
const clientLogoWrapper = document.createElement('span');
clientLogoWrapper.className = 'download-client-logo-wrapper download-card-logo-wrapper';
const clientLogo = document.createElement('img');
clientLogo.className = 'download-client-logo';
clientLogo.src = `/images/clients/${download.client}.svg`;
clientLogo.alt = `${download.instanceName || download.client} icon`;
clientLogo.title = download.instanceName || download.client;
clientLogo.onerror = () => {
clientLogoWrapper.textContent = download.client.charAt(0).toUpperCase();
clientLogoWrapper.classList.add('fallback');
};
clientLogoWrapper.appendChild(clientLogo);
return clientLogoWrapper;
}
export function renderDownloads() { export function renderDownloads() {
const downloadsList = document.getElementById('downloads-list'); const downloadsList = document.getElementById('downloads-list');
const noDownloads = document.getElementById('no-downloads'); const noDownloads = document.getElementById('no-downloads');
@@ -133,21 +151,7 @@ export function updateDownloadCard(card, download) {
// Add client logo to card (positioned at bottom right via CSS) // Add client logo to card (positioned at bottom right via CSS)
if (download.client && !card.querySelector('.download-card-logo-wrapper')) { if (download.client && !card.querySelector('.download-card-logo-wrapper')) {
const clientLogoWrapper = document.createElement('span'); card.appendChild(createClientLogo(download));
clientLogoWrapper.className = 'download-client-logo-wrapper download-card-logo-wrapper';
const clientLogo = document.createElement('img');
clientLogo.className = 'download-client-logo';
clientLogo.src = `/images/clients/${download.client}.svg`;
clientLogo.alt = `${download.instanceName || download.client} icon`;
clientLogo.title = download.instanceName || download.client;
clientLogo.onerror = () => {
clientLogoWrapper.textContent = download.client.charAt(0).toUpperCase();
clientLogoWrapper.classList.add('fallback');
};
clientLogoWrapper.appendChild(clientLogo);
card.appendChild(clientLogoWrapper);
} }
// Update status // Update status
@@ -317,24 +321,9 @@ export function createDownloadCard(download) {
// Add client logo to card (positioned at bottom right via CSS) // Add client logo to card (positioned at bottom right via CSS)
if (download.client) { if (download.client) {
const clientLogoWrapper = document.createElement('span'); card.appendChild(createClientLogo(download));
clientLogoWrapper.className = 'download-client-logo-wrapper download-card-logo-wrapper';
const clientLogo = document.createElement('img');
clientLogo.className = 'download-client-logo';
clientLogo.src = `/images/clients/${download.client}.svg`;
clientLogo.alt = `${download.instanceName || download.client} icon`;
clientLogo.title = download.instanceName || download.client;
clientLogo.onerror = () => {
// Fallback to text if image fails to load
clientLogoWrapper.textContent = download.client.charAt(0).toUpperCase();
clientLogoWrapper.classList.add('fallback');
};
clientLogoWrapper.appendChild(clientLogo);
card.appendChild(clientLogoWrapper);
} }
const title = document.createElement('h3'); const title = document.createElement('h3');
title.className = 'download-title'; title.className = 'download-title';
title.textContent = download.title; title.textContent = download.title;
@@ -366,26 +355,6 @@ export function createDownloadCard(download) {
infoDiv.appendChild(movie); infoDiv.appendChild(movie);
} }
// Add client logo
if (download.client) {
const clientLogoWrapper = document.createElement('span');
clientLogoWrapper.className = 'download-client-logo-wrapper download-card-logo-wrapper';
const clientLogo = document.createElement('img');
clientLogo.className = 'download-client-logo';
clientLogo.src = `/images/clients/${download.client}.svg`;
clientLogo.alt = `${download.instanceName || download.client} icon`;
clientLogo.title = download.instanceName || download.client;
clientLogo.onerror = () => {
// Fallback to text if image fails to load
clientLogoWrapper.textContent = download.client.charAt(0).toUpperCase();
clientLogoWrapper.classList.add('fallback');
};
clientLogoWrapper.appendChild(clientLogo);
header.appendChild(clientLogoWrapper);
}
const details = document.createElement('div'); const details = document.createElement('div');
details.className = 'download-details'; details.className = 'download-details';