From 48326a38ade9eb98c0ca88c80ccd7f93750ddcbd Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 6 Feb 2025 08:10:03 -0500
Subject: [PATCH] refactor: use primer components for notification metric
 tooltip

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 .../settings/NotificationSettings.tsx         | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/renderer/components/settings/NotificationSettings.tsx b/src/renderer/components/settings/NotificationSettings.tsx
index d7c5f26c4..78aaae595 100644
--- a/src/renderer/components/settings/NotificationSettings.tsx
+++ b/src/renderer/components/settings/NotificationSettings.tsx
@@ -102,28 +102,28 @@ export const NotificationSettings: FC = () => {
                 <Stack direction="vertical" gap="condensed">
                   <Text>Show notification metric pills for:</Text>
                   <Box className="pl-4">
-                    <ul>
-                      <li className="flex items-center gap-1">
+                    <Stack direction="vertical" gap="none">
+                      <Stack direction="horizontal" gap="condensed">
                         <IssueClosedIcon size={Size.SMALL} />
                         linked issues
-                      </li>
-                      <li className="flex items-center gap-1">
+                      </Stack>
+                      <Stack direction="horizontal" gap="condensed">
                         <CheckIcon size={Size.SMALL} />
                         pr reviews
-                      </li>
-                      <li className="flex items-center gap-1">
+                      </Stack>
+                      <Stack direction="horizontal" gap="condensed">
                         <CommentIcon size={Size.SMALL} />
                         comments
-                      </li>
-                      <li className="flex items-center gap-1">
+                      </Stack>
+                      <Stack direction="horizontal" gap="condensed">
                         <TagIcon size={Size.SMALL} />
                         labels
-                      </li>
-                      <li className="flex items-center gap-1">
+                      </Stack>
+                      <Stack direction="horizontal" gap="condensed">
                         <MilestoneIcon size={Size.SMALL} />
                         milestones
-                      </li>
-                    </ul>
+                      </Stack>
+                    </Stack>
                   </Box>
                 </Stack>
               }