From d3b16ad1a504b03460245607f5e0e751945e2169 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 12 Sep 2023 15:54:53 +0200
Subject: [PATCH 1/2] add the icons back

---
 src/components/BrowserSelector.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/BrowserSelector.tsx b/src/components/BrowserSelector.tsx
index d425a5cb..a259b58d 100644
--- a/src/components/BrowserSelector.tsx
+++ b/src/components/BrowserSelector.tsx
@@ -57,6 +57,7 @@ export const BrowserSelector = ({
       id: browser.id,
       onClick: () => onSelectBrowser(browser),
       right: !isAccepted && result !== ComparisonResult.Equal && <StatusDot status={result} />,
+      left: browserIcons[browser.key],
       title: browser.name,
     }));
 

From 715b834a6a627efdeabec309a53d83cc912fdc59 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 14 Sep 2023 13:57:15 +0200
Subject: [PATCH 2/2] use icon prop, improve type-safety

---
 src/components/BrowserSelector.tsx | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/components/BrowserSelector.tsx b/src/components/BrowserSelector.tsx
index a259b58d..9a0aebd3 100644
--- a/src/components/BrowserSelector.tsx
+++ b/src/components/BrowserSelector.tsx
@@ -1,6 +1,6 @@
 import { TooltipNote, WithTooltip } from "@storybook/components";
 import { styled } from "@storybook/theming";
-import React from "react";
+import React, { ComponentProps } from "react";
 
 import { Browser, BrowserInfo, ComparisonResult } from "../gql/graphql";
 import { aggregateResult } from "../utils/aggregateResult";
@@ -50,16 +50,20 @@ export const BrowserSelector = ({
     icon = <StatusDotWrapper status={aggregate}>{icon}</StatusDotWrapper>;
   }
 
-  const links =
+  type Link = ComponentProps<typeof TooltipMenu>["links"][0];
+
+  const links: Link[] =
     browserResults.length > 1 &&
-    browserResults.map(({ browser, result }) => ({
-      active: selectedBrowser === browser,
-      id: browser.id,
-      onClick: () => onSelectBrowser(browser),
-      right: !isAccepted && result !== ComparisonResult.Equal && <StatusDot status={result} />,
-      left: browserIcons[browser.key],
-      title: browser.name,
-    }));
+    browserResults.map(
+      ({ browser, result }): Link => ({
+        active: selectedBrowser === browser,
+        id: browser.id,
+        onClick: () => onSelectBrowser(browser),
+        right: !isAccepted && result !== ComparisonResult.Equal && <StatusDot status={result} />,
+        icon: browserIcons[browser.key],
+        title: browser.name,
+      })
+    );
 
   return (
     <WithTooltip