From 838afd8ae4993b7f6b005fe6b44aa562c89ca150 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 13 Nov 2025 16:57:43 -0500
Subject: [PATCH] refactor: tooltips

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/components/Sidebar.tsx                    |  8 --------
 src/renderer/components/fields/Tooltip.tsx             | 10 +++++++---
 src/renderer/components/settings/SettingsFooter.tsx    |  2 +-
 .../routes/__snapshots__/Settings.test.tsx.snap        |  2 +-
 4 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/renderer/components/Sidebar.tsx b/src/renderer/components/Sidebar.tsx
index 22e75a5d4..fd5a4c817 100644
--- a/src/renderer/components/Sidebar.tsx
+++ b/src/renderer/components/Sidebar.tsx
@@ -85,7 +85,6 @@ export const Sidebar: FC = () => {
           onClick={() => navigate('/', { replace: true })}
           size="small"
           tooltipDirection="e"
-          unsafeDisableTooltip={false}
           variant="invisible"
         />
 
@@ -97,7 +96,6 @@ export const Sidebar: FC = () => {
           onClick={() => openGitHubNotifications(primaryAccountHostname)}
           size="small"
           tooltipDirection="e"
-          unsafeDisableTooltip={false}
           variant={hasUnreadNotifications ? 'primary' : 'invisible'}
         />
 
@@ -110,7 +108,6 @@ export const Sidebar: FC = () => {
             onClick={() => toggleFilters()}
             size="small"
             tooltipDirection="e"
-            unsafeDisableTooltip={false}
             variant={hasActiveFilters(settings) ? 'primary' : 'invisible'}
           />
         )}
@@ -122,7 +119,6 @@ export const Sidebar: FC = () => {
           onClick={() => openGitHubIssues(primaryAccountHostname)}
           size="small"
           tooltipDirection="e"
-          unsafeDisableTooltip={false}
           variant="invisible"
         />
 
@@ -133,7 +129,6 @@ export const Sidebar: FC = () => {
           onClick={() => openGitHubPulls(primaryAccountHostname)}
           size="small"
           tooltipDirection="e"
-          unsafeDisableTooltip={false}
           variant="invisible"
         />
       </Stack>
@@ -156,7 +151,6 @@ export const Sidebar: FC = () => {
               onClick={() => refreshNotifications()}
               size="small"
               tooltipDirection="e"
-              unsafeDisableTooltip={false}
               variant="invisible"
             />
 
@@ -167,7 +161,6 @@ export const Sidebar: FC = () => {
               onClick={() => toggleSettings()}
               size="small"
               tooltipDirection="e"
-              unsafeDisableTooltip={false}
               variant="invisible"
             />
           </>
@@ -181,7 +174,6 @@ export const Sidebar: FC = () => {
             onClick={() => quitApp()}
             size="small"
             tooltipDirection="e"
-            unsafeDisableTooltip={false}
             variant="invisible"
           />
         )}
diff --git a/src/renderer/components/fields/Tooltip.tsx b/src/renderer/components/fields/Tooltip.tsx
index 34a89d004..84e0ca42a 100644
--- a/src/renderer/components/fields/Tooltip.tsx
+++ b/src/renderer/components/fields/Tooltip.tsx
@@ -3,6 +3,8 @@ import { type FC, type ReactNode, useState } from 'react';
 import { QuestionIcon } from '@primer/octicons-react';
 import { AnchoredOverlay } from '@primer/react';
 
+import { cn } from '../../utils/cn';
+
 export interface ITooltip {
   name: string;
   tooltip: ReactNode | string;
@@ -31,9 +33,11 @@ export const Tooltip: FC<ITooltip> = (props: ITooltip) => {
       side="outside-bottom"
     >
       <div
-        className={
-          'z-10 w-60 rounded-sm border border-gray-300 p-2 shadow-sm bg-gitify-tooltip-popout text-left text-xs text-gitify-font'
-        }
+        className={cn(
+          'z-10 w-60 p-2',
+          'text-left text-xs text-gitify-font',
+          'rounded-sm border border-gray-300 shadow-sm bg-gitify-tooltip-popout',
+        )}
       >
         {props.tooltip}
       </div>
diff --git a/src/renderer/components/settings/SettingsFooter.tsx b/src/renderer/components/settings/SettingsFooter.tsx
index 4bb13978d..d7b58eff0 100644
--- a/src/renderer/components/settings/SettingsFooter.tsx
+++ b/src/renderer/components/settings/SettingsFooter.tsx
@@ -24,7 +24,7 @@ export const SettingsFooter: FC = () => {
   return (
     <Footer justify="space-between">
       <Stack direction="horizontal">
-        <Tooltip direction="n" text="View release notes">
+        <Tooltip direction="ne" text="View release notes">
           <Button
             data-testid="settings-release-notes"
             onClick={() => openGitifyReleaseNotes(appVersion)}
diff --git a/src/renderer/routes/__snapshots__/Settings.test.tsx.snap b/src/renderer/routes/__snapshots__/Settings.test.tsx.snap
index 4448c7961..fc1029368 100644
--- a/src/renderer/routes/__snapshots__/Settings.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Settings.test.tsx.snap
@@ -1984,7 +1984,7 @@ exports[`renderer/routes/Settings.tsx should render itself & its children 1`] =
         <span
           aria-hidden="true"
           class="prc-TooltipV2-Tooltip-cYMVY"
-          data-direction="n"
+          data-direction="ne"
           id="_r_11_"
           popover="auto"
           role="tooltip"