From 164765cd271cfc883ad63943a714b694b00988e7 Mon Sep 17 00:00:00 2001
From: Robin <robin@robin.town>
Date: Tue, 2 Jun 2026 10:15:40 +0200
Subject: [PATCH] Show the right fallback labels in device switcher menus

---
 .../MediaMuteAndSwitchButton.test.tsx         | 36 +++++++++++++++++++
 src/components/MediaMuteAndSwitchButton.tsx   |  4 +--
 2 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/src/components/MediaMuteAndSwitchButton.test.tsx b/src/components/MediaMuteAndSwitchButton.test.tsx
index 80ee0254..60be336a 100644
--- a/src/components/MediaMuteAndSwitchButton.test.tsx
+++ b/src/components/MediaMuteAndSwitchButton.test.tsx
@@ -76,6 +76,42 @@ describe("MediaMuteAndSwitchButton", () => {
     expect(onMute).toHaveBeenCalled();
   });
 
+  test("shows numbered devices correctly", async () => {
+    const user = userEvent.setup();
+    render(
+      <TooltipProvider>
+        <MediaMuteAndSwitchButton
+          title="Switcher"
+          iconsAndLabels="audio"
+          enabled
+          options={[
+            { label: { type: "number", number: 1 }, id: "mic1" },
+            { label: { type: "number", number: 2 }, id: "mic2" },
+          ]}
+          selectedOption="mic1"
+        />
+        <MediaMuteAndSwitchButton
+          title="Switcher"
+          iconsAndLabels="video"
+          enabled
+          options={[
+            { label: { type: "number", number: 1 }, id: "cam1" },
+            { label: { type: "number", number: 2 }, id: "cam2" },
+          ]}
+          selectedOption="cam1"
+        />
+      </TooltipProvider>,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Microphone" }));
+    screen.getByRole("menuitem", { name: "Microphone 1" });
+    screen.getByRole("menuitem", { name: "Microphone 2" });
+    await user.keyboard("[Escape]");
+    await user.click(screen.getByRole("button", { name: "Camera" }));
+    screen.getByRole("menuitem", { name: "Camera 1" });
+    screen.getByRole("menuitem", { name: "Camera 2" });
+  });
+
   test("calls select callback on menu click", async () => {
     const user = userEvent.setup();
     const onSelect = vi.fn();
diff --git a/src/components/MediaMuteAndSwitchButton.tsx b/src/components/MediaMuteAndSwitchButton.tsx
index 44bdf5e6..80cb02a3 100644
--- a/src/components/MediaMuteAndSwitchButton.tsx
+++ b/src/components/MediaMuteAndSwitchButton.tsx
@@ -119,13 +119,13 @@ export const MediaMuteAndSwitchButton: FC<MediaMuteAndSwitchButtonProps> = ({
       IconOptions = VideoCallIcon;
       optionsButtonLabel = t("settings.devices.camera");
       numberedLabel = (n): string =>
-        t("settings.devices.microphone_numbered", { n });
+        t("settings.devices.camera_numbered", { n });
       break;
     case "audio":
       IconOptions = MicOnIcon;
       optionsButtonLabel = t("settings.devices.microphone");
       numberedLabel = (n): string =>
-        t("settings.devices.camera_numbered", { n });
+        t("settings.devices.microphone_numbered", { n });
       break;
   }
   return (