fix: Update collection label retrieval to support titles and improve SVG error handling

This commit is contained in:
sHa
2025-06-18 16:49:05 +03:00
parent 5baa4bfab4
commit 83dd8245a8
2 changed files with 106 additions and 93 deletions

View File

@@ -45,7 +45,8 @@
dropdownOpen = false; dropdownOpen = false;
} }
$: currentLabel = (collections.find(c => c.name === collection)?.label || "Logo Gallery").replace(/s$/, ""); $: currentCollectionObj = collections.find(c => c.name === collection);
$: currentLabel = (currentCollectionObj?.title || currentCollectionObj?.label || "Logo Gallery").replace(/s$/, "");
</script> </script>
<header class="main-header"> <header class="main-header">
@@ -55,7 +56,7 @@
<img src="favicon.svg" alt="Logo Gallery icon" /> <img src="favicon.svg" alt="Logo Gallery icon" />
</div> </div>
<button class="collection-title-btn" on:click={handleTitleClick} aria-haspopup="listbox" aria-expanded={dropdownOpen}> <button class="collection-title-btn" on:click={handleTitleClick} aria-haspopup="listbox" aria-expanded={dropdownOpen}>
{currentLabel} Gallery <span class="triangle"></span> {currentLabel} <span class="triangle"></span>
</button> </button>
{#if dropdownOpen} {#if dropdownOpen}
<ul class="collection-dropdown" role="listbox"> <ul class="collection-dropdown" role="listbox">
@@ -72,7 +73,7 @@
handleCollectionSelect(c.name); handleCollectionSelect(c.name);
} }
}} }}
>{c.label} Gallery</li> >{c.title} Gallery</li>
{/each} {/each}
</ul> </ul>
{/if} {/if}
@@ -107,6 +108,7 @@
{getTagObj} {getTagObj}
{compactMode} {compactMode}
{setCompactMode} {setCompactMode}
collection={currentCollectionObj}
/> />
<ListViewSwitcher <ListViewSwitcher
{viewMode} {viewMode}

View File

@@ -12,7 +12,13 @@
let svgSource = ""; // Store the updated SVG source code let svgSource = ""; // Store the updated SVG source code
async function fetchAndColorSvg() { async function fetchAndColorSvg() {
try {
const res = await fetch(path); const res = await fetch(path);
if (!res.ok) {
svgHtml = `<svg width='100%' height='100%' viewBox='0 0 64 64' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='64' height='64' fill='#eee'/><line x1='16' y1='16' x2='48' y2='48' stroke='#888' stroke-width='4'/><line x1='48' y1='16' x2='16' y2='48' stroke='#888' stroke-width='4'/></svg>`;
svgSource = svgHtml;
return;
}
let text = await res.text(); let text = await res.text();
if (!color) { if (!color) {
// No user-selected color, add currentColor to ensure theme colors are applied // No user-selected color, add currentColor to ensure theme colors are applied
@@ -117,6 +123,11 @@
svgHtml = doc.documentElement.outerHTML; svgHtml = doc.documentElement.outerHTML;
// Update the svgSource property to store the modified SVG code // Update the svgSource property to store the modified SVG code
svgSource = doc.documentElement.outerHTML; svgSource = doc.documentElement.outerHTML;
} catch (error) {
console.error("Error fetching or processing SVG:", error);
svgHtml = `<svg width='100%' height='100%' viewBox='0 0 64 64' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='64' height='64' fill='#eee'/><line x1='16' y1='16' x2='48' y2='48' stroke='#888' stroke-width='4'/><line x1='48' y1='16' x2='16' y2='48' stroke='#888' stroke-width='4'/></svg>`;
svgSource = svgHtml;
}
} }
// Export the svgSource so it can be accessed from outside // Export the svgSource so it can be accessed from outside