From a6e6ef7b83796ced497f1093ce010b5c5cc5526c Mon Sep 17 00:00:00 2001
From: Luca <102960244+Luca-Timo@users.noreply.github.com>
Date: Wed, 3 Jun 2026 13:38:52 +0200
Subject: [PATCH] fix(branding): SVG (and .ico) favicons now render

DynamicFavicon hardcoded link.type='image/png', so an SVG/.ico favicon
was declared as PNG and browsers ignored it. Derive the type from the
file extension instead. (Sidebar icon already uses <img> which renders
SVG fine.)
---
 .../src/components/common/DynamicFavicon.tsx  | 24 +++++++++++++++----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/common/DynamicFavicon.tsx b/frontend/src/components/common/DynamicFavicon.tsx
index d8226eab..1cade38f 100644
--- a/frontend/src/components/common/DynamicFavicon.tsx
+++ b/frontend/src/components/common/DynamicFavicon.tsx
@@ -14,13 +14,27 @@ export const DynamicFavicon: React.FC = () => {
       const existingFavicons = document.querySelectorAll("link[rel*='icon']");
       existingFavicons.forEach(favicon => favicon.remove());
 
-      // Create new favicon link
-      const link = document.createElement('link');
-      link.rel = 'icon';
-      link.type = 'image/png';
-      link.href = settings.branding_favicon_url.startsWith('http')
+      // Create new favicon link. Derive the MIME type from the file
+      // extension — hardcoding image/png made SVG (and .ico) favicons
+      // get declared as PNG, which browsers reject (favicon didn't show).
+      const href = settings.branding_favicon_url.startsWith('http')
         ? settings.branding_favicon_url
         : buildResourceUrl(settings.branding_favicon_url);
+      const ext = href.split('?')[0].split('.').pop()?.toLowerCase();
+      const typeByExt: Record<string, string> = {
+        svg: 'image/svg+xml',
+        png: 'image/png',
+        ico: 'image/x-icon',
+        gif: 'image/gif',
+        jpg: 'image/jpeg',
+        jpeg: 'image/jpeg',
+        webp: 'image/webp',
+      };
+
+      const link = document.createElement('link');
+      link.rel = 'icon';
+      if (ext && typeByExt[ext]) link.type = typeByExt[ext];
+      link.href = href;
 
       document.head.appendChild(link);
     }