diff --git a/src/js/techreport/combobox.js b/src/js/techreport/combobox.js index 6fa0ad95..27aafdbf 100644 --- a/src/js/techreport/combobox.js +++ b/src/js/techreport/combobox.js @@ -29,11 +29,13 @@ class ComboBox { option.dataset.key = index; option.textContent = row.technology; option.id = `${this.element.dataset.id}-${row.technology.replaceAll(' ','-')}`; - const logo = document.createElement('img'); - logo.setAttribute('alt', ''); - logo.setAttribute('src', `https://cdn.httparchive.org/v1/static/icons/${icon}`); - logo.setAttribute('loading', 'lazy'); - option.append(logo); + if(icon) { + const logo = document.createElement('img'); + logo.setAttribute('alt', ''); + logo.setAttribute('src', `https://cdn.httparchive.org/v1/static/icons/${icon}`); + logo.setAttribute('loading', 'lazy'); + option.append(logo); + } if(this.selected.includes(row.technology)) { option.setAttribute('aria-selected', true); } @@ -198,12 +200,14 @@ class ComboBox { deleteSelection.dataset.name = name; deleteSelection.addEventListener('click', () => this.unselectElement(name)); - /* Add the app logo */ - const appIcon = document.createElement('img'); - appIcon.setAttribute('src', `https://cdn.httparchive.org/v1/static/icons/${encodeURI(icon)}`); - appIcon.setAttribute('alt', ''); - appIcon.classList.add('logo'); - deleteSelection.append(appIcon); + if (icon) { + /* Add the app logo */ + const appIcon = document.createElement('img'); + appIcon.setAttribute('src', `https://cdn.httparchive.org/v1/static/icons/${encodeURI(icon)}`); + appIcon.setAttribute('alt', ''); + appIcon.classList.add('logo'); + deleteSelection.append(appIcon); + } /* Add the delete icon */ const deleteIcon = document.createElement('img'); diff --git a/src/js/techreport/index.js b/src/js/techreport/index.js index 1a18ebf4..2b139148 100644 --- a/src/js/techreport/index.js +++ b/src/js/techreport/index.js @@ -299,9 +299,7 @@ class TechReport { // Get the information about the selected technology getTechInfo() { const technologies = this.filters.app; - const technology = technologies.join('%2C') - .replaceAll(" ", "%20"); - + const technology = technologies.map(encodeURIComponent).join(','); const url = `${Constants.apiBase}/technologies?technology=${technology}`; fetch(url) @@ -315,7 +313,9 @@ class TechReport { const categories = techInfo && techInfo.category ? techInfo.category.split(', ') : []; DrilldownHeader.setCategories(categories); DrilldownHeader.setDescription(techInfo.description); - DrilldownHeader.setIcon(techInfo.icon); + if (techInfo.icon) { + DrilldownHeader.setIcon(techInfo.icon); + } }); } @@ -408,7 +408,9 @@ class TechReport { const app = this.filters.app[0]; const icon = data[app]?.at(-1)?.icon; DrilldownHeader.update(this.filters); - DrilldownHeader.setIcon(`${encodeURI(icon)}`); + if (icon) { + DrilldownHeader.setIcon(`${encodeURI(icon)}`); + } if(data && data[app]) { UIUtils.updateReportComponents(this.sections, data, data[app], this.page, this.labels); diff --git a/src/js/techreport/tableLinked.js b/src/js/techreport/tableLinked.js index 09d8c3d1..5be37525 100644 --- a/src/js/techreport/tableLinked.js +++ b/src/js/techreport/tableLinked.js @@ -106,12 +106,14 @@ class TableLinked { const wrapper = document.createElement('span'); wrapper.classList.add('app-wrapper'); - const img = document.createElement('span'); - const imgUrl = `https://cdn.httparchive.org/v1/static/icons/${encodeURI(technology[0]?.icon)}`; - img.setAttribute('aria-hidden', 'true'); - img.setAttribute('style', `background-image: url(${imgUrl})`); - img.classList.add('app-img'); - wrapper.append(img); + if(technology[0]?.icon) { + const img = document.createElement('span'); + const imgUrl = `https://cdn.httparchive.org/v1/static/icons/${encodeURI(technology[0]?.icon)}`; + img.setAttribute('aria-hidden', 'true'); + img.setAttribute('style', `background-image: url(${imgUrl})`); + img.classList.add('app-img'); + wrapper.append(img); + } const formattedApp = DataUtils.formatAppName(app); const link = document.createElement('a');