From b9f6ed70e95cecc2aec8ee83f58e1319952e22a8 Mon Sep 17 00:00:00 2001
From: David Hu <davidhu314@gmail.com>
Date: Sun, 23 Aug 2026 13:24:12 -0700
Subject: [PATCH] fix(web): align project menu labels

---
 apps/web/src/components/ui/menu.test.tsx | 4 +++-
 apps/web/src/components/ui/menu.tsx      | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/components/ui/menu.test.tsx b/apps/web/src/components/ui/menu.test.tsx
index 079d2a1794b8..336ba5aa38f9 100644
--- a/apps/web/src/components/ui/menu.test.tsx
+++ b/apps/web/src/components/ui/menu.test.tsx
@@ -4,13 +4,14 @@ import { describe, expect, it } from "vite-plus/test";
 import { Menu, MenuRadioGroup, MenuRadioItem } from "./menu";
 
 describe("menu radio item geometry", () => {
-  it("keeps radio-item icons on the same text grid as menu items", () => {
+  it("keeps SVG and image icons on the same text grid", () => {
     const html = renderToStaticMarkup(
       <Menu>
         <MenuRadioGroup value="merge">
           <MenuRadioItem value="merge">
             <span className="flex items-center gap-2">
               <svg aria-hidden className="size-3.5" />
+              <img alt="" className="size-3.5" src="/project-icon.png" />
               <span>Merge</span>
             </span>
           </MenuRadioItem>
@@ -19,5 +20,6 @@ describe("menu radio item geometry", () => {
     );
 
     expect(html).toContain("-mx-0.5");
+    expect(html).toContain("img]:-mx-0.5");
   });
 });
diff --git a/apps/web/src/components/ui/menu.tsx b/apps/web/src/components/ui/menu.tsx
index b66782ebe2d1..fcf3d3cb8726 100644
--- a/apps/web/src/components/ui/menu.tsx
+++ b/apps/web/src/components/ui/menu.tsx
@@ -166,7 +166,7 @@ function MenuRadioItem({
   return (
     <MenuPrimitive.RadioItem
       className={cn(
-        "[&_svg]:-mx-0.5 flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center rounded-sm px-2 py-1 text-base text-foreground outline-none data-checked:bg-foreground/[0.08] data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+        "[&_img]:-mx-0.5 [&_svg]:-mx-0.5 flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center rounded-sm px-2 py-1 text-base text-foreground outline-none data-checked:bg-foreground/[0.08] data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
         className,
       )}
       data-slot="menu-radio-item"