Merge pull request #2646 from aferd/RHCLOUD-28582

RHCLOUD-28582 add tooltip for notifications badge
RedHatInsights · Oct 5, 2023 · 8405014 · 8405014
2 parents 383387c + 75d40e0
commit 8405014
Showing 1 changed file with 11 additions and 9 deletions.
diff --git a/src/components/Header/Tools.tsx b/src/components/Header/Tools.tsx
@@ -241,15 +241,17 @@ const Tools = () => {
       </ToolbarItem>
       {isNotificationsEnabled && (
         <ToolbarItem className="pf-v5-u-mr-0 pf-v5-u-ml-sm">
-          <NotificationBadge
-            className="chr-c-notification-badge"
-            variant={unreadNotifications ? 'unread' : 'read'}
-            onClick={() => dispatch(toggleNotificationsDrawer())}
-            aria-label="Notifications"
-            isExpanded={isDrawerExpanded}
-          >
-            <BellIcon />
-          </NotificationBadge>
+          <Tooltip aria="none" aria-live="polite" content={'Notifications'} flipBehavior={['bottom']} className="tooltip-inner-settings-cy">
+            <NotificationBadge
+              className="chr-c-notification-badge"
+              variant={unreadNotifications ? 'unread' : 'read'}
+              onClick={() => dispatch(toggleNotificationsDrawer())}
+              aria-label="Notifications"
+              isExpanded={isDrawerExpanded}
+            >
+              <BellIcon />
+            </NotificationBadge>
+          </Tooltip>
         </ToolbarItem>
       )}
       {localStorage.getItem('chrome:darkmode') === 'true' && (