From 09428da3d97a462b67db40b8505146eabc762cc3 Mon Sep 17 00:00:00 2001 From: Oonishi <275808243+ponkcore@users.noreply.github.com> Date: Sun, 30 Aug 2026 17:10:02 +0300 Subject: [PATCH] fix(dashboard): prevent provider icons collapsing to zero size (#12054) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Corrige ícones de provider colapsando para tamanho zero, com teste próprio. Validado no worktree combinado. Obrigado! --- .../fixes/0000-provider-icon-zero-size.md | 1 + src/shared/components/ProviderIcon.tsx | 18 ++++++------------ tests/unit/ui/ProviderIcon-icon-url.test.tsx | 17 +++++++++++++++++ 3 files changed, 24 insertions(+), 12 deletions(-) create mode 100644 changelog.d/fixes/0000-provider-icon-zero-size.md diff --git a/changelog.d/fixes/0000-provider-icon-zero-size.md b/changelog.d/fixes/0000-provider-icon-zero-size.md new file mode 100644 index 0000000000..3d18f0289c --- /dev/null +++ b/changelog.d/fixes/0000-provider-icon-zero-size.md @@ -0,0 +1 @@ +- **fix(dashboard):** Keep local and theme-aware provider SVG icons at a definite layout size so Chromium does not collapse them to 0×0 after the v3.8.50 image-rendering change ([#12054](https://github.com/diegosouzapw/OmniRoute/pull/12054)) — thanks @ponkcore diff --git a/src/shared/components/ProviderIcon.tsx b/src/shared/components/ProviderIcon.tsx index fb91f2e530..b0cc297030 100644 --- a/src/shared/components/ProviderIcon.tsx +++ b/src/shared/components/ProviderIcon.tsx @@ -438,10 +438,8 @@ const ProviderIcon = memo(function ProviderIcon({ style={{ objectFit: "contain", flex: "none", - width: "auto", - height: "auto", - maxWidth: size, - maxHeight: size, + width: size, + height: size, }} onError={() => setFailedAssets((current) => ({ ...current, [themedKey]: true }))} /> @@ -454,10 +452,8 @@ const ProviderIcon = memo(function ProviderIcon({ // intrinsic aspect ratio (some wordmarks are much wider than tall), and next/image's // dev-mode check warns whenever the layout size differs from the square // width/height attributes — a false positive for non-square logos rendered - // at fixed icon sizes. We keep `width/height` attributes for layout reserve - // but let the intrinsic ratio win on both axes (`width/height: "auto"`) so - // wide logos render at their true aspect ratio instead of - // being letterboxed into a 1:1 box. + // at fixed icon sizes. Explicit CSS dimensions keep the flex item from + // collapsing to 0×0; object-fit preserves each logo's intrinsic ratio. if (hasSvg && !svgFailed) { return ( setFailedAssets((current) => ({ ...current, [svgKey]: true }))} /> diff --git a/tests/unit/ui/ProviderIcon-icon-url.test.tsx b/tests/unit/ui/ProviderIcon-icon-url.test.tsx index 10a49b874d..7ce75d2db7 100644 --- a/tests/unit/ui/ProviderIcon-icon-url.test.tsx +++ b/tests/unit/ui/ProviderIcon-icon-url.test.tsx @@ -226,6 +226,23 @@ describe("ProviderIcon — custom remote icon URL (#2166)", () => { }); }); +describe("ProviderIcon — local SVG dimensions", () => { + it.each([ + ["cline", "/providers/cline.svg"], + ["kimi-coding", "/providers/kimi-logomark-light.svg"], + ])("gives %s a definite square layout size", (providerId, expectedSrc) => { + const container = renderIcon({ providerId, size: 24 }); + const img = container.querySelector(`img[src="${expectedSrc}"]`); + + expect(img).not.toBeNull(); + expect(img?.style.width).toBe("24px"); + expect(img?.style.height).toBe("24px"); + expect(img?.style.objectFit).toBe("contain"); + expect(img?.style.maxWidth).toBe(""); + expect(img?.style.maxHeight).toBe(""); + }); +}); + describe("ProviderIcon — unresolved local asset provenance", () => { it("covers the complete provider and alias inventory", () => { expect(PROVIDER_IDS_WITHOUT_LOCAL_ASSET_PROVENANCE).toHaveLength(79);