From c9b119d401cd44ddbae44e633c384064572d4d5d Mon Sep 17 00:00:00 2001
From: "Qingyang(Abby) Hu" <abigailhu2000@gmail.com>
Date: Thu, 20 Apr 2023 13:35:10 -0700
Subject: [PATCH] Add tooltip to help icon (#3626) (#3872)

* Add tooltip to help icon



Add tooltip to menu icon

Signed-off-by: sabina.zaripova <sabina.zaripova@nu.edu.kz>
Co-authored-by: sayuree <52072402+sayuree@users.noreply.github.com>
---
 CHANGELOG.md                                   |  1 +
 .../header/__snapshots__/header.test.tsx.snap  | 18 ++++++++++++++++++
 src/core/public/chrome/ui/header/header.tsx    |  8 +++++++-
 .../chrome/ui/header/header_help_menu.tsx      | 10 +++++++++-
 4 files changed, 35 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b273c62bc0d7..2e4785162240 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -122,6 +122,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - Temporary workaround for task-kill exceptions on Windows when it is passed a pid for a process that is already dead ([#2842](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2842))
 - [Build] Fixed "Last Access Time" not being set by `scanCopy` on Windows ([#2964](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2964))
 - Update `leaflet-vega` and fix its usage ([#3005](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3005))
+- Add clarifying tooltips to header navigation ([#3573](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/3573))
 
 ### 🚞 Infrastructure
 
diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
index 5ad89191b0c9..2d0f7f4a579d 100644
--- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
+++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap
@@ -4695,6 +4695,11 @@ exports[`Header renders 1`] = `
                           >
                             <EuiIcon
                               size="m"
+                              type="questionInCircle"
+                            />
+                            <EuiIcon
+                              size="m"
+                              title="Help"
                               type="help"
                             />
                           </EuiHeaderSectionItemButton>
@@ -4742,11 +4747,22 @@ exports[`Header renders 1`] = `
                                 >
                                   <EuiIcon
                                     size="m"
+                                    type="questionInCircle"
+                                  >
+                                    <div
+                                      data-euiicon-type="questionInCircle"
+                                      size="m"
+                                    />
+                                  </EuiIcon>
+                                  <EuiIcon
+                                    size="m"
+                                    title="Help"
                                     type="help"
                                   >
                                     <div
                                       data-euiicon-type="help"
                                       size="m"
+                                      title="Help"
                                     />
                                   </EuiIcon>
                                 </button>
@@ -4862,11 +4878,13 @@ exports[`Header renders 1`] = `
                     >
                       <EuiIcon
                         size="m"
+                        title="Menu"
                         type="menu"
                       >
                         <div
                           data-euiicon-type="menu"
                           size="m"
+                          title="Menu"
                         />
                       </EuiIcon>
                     </button>
diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx
index 2946b4eaa130..3037f969e863 100644
--- a/src/core/public/chrome/ui/header/header.tsx
+++ b/src/core/public/chrome/ui/header/header.tsx
@@ -175,7 +175,13 @@ export function Header({
                   aria-controls={navId}
                   ref={toggleCollapsibleNavRef}
                 >
-                  <EuiIcon type="menu" size="m" />
+                  <EuiIcon
+                    type="menu"
+                    size="m"
+                    title={i18n.translate('core.ui.primaryNav.menu', {
+                      defaultMessage: 'Menu',
+                    })}
+                  />
                 </EuiHeaderSectionItemButton>
               </EuiHeaderSectionItem>
 
diff --git a/src/core/public/chrome/ui/header/header_help_menu.tsx b/src/core/public/chrome/ui/header/header_help_menu.tsx
index d292564e6f4a..d73af4acbf01 100644
--- a/src/core/public/chrome/ui/header/header_help_menu.tsx
+++ b/src/core/public/chrome/ui/header/header_help_menu.tsx
@@ -330,7 +330,15 @@ class HeaderHelpMenuUI extends Component<Props, State> {
         })}
         onClick={this.onMenuButtonClick}
       >
-        <EuiIcon type="help" size="m" />
+        <EuiIcon type="questionInCircle" size="m" />
+        <EuiIcon
+          type="help"
+          size="m"
+          title={intl.formatMessage({
+            id: 'core.ui.chrome.headerGlobalNav.helpMenuButtonTitle',
+            defaultMessage: 'Help',
+          })}
+        />
       </EuiHeaderSectionItemButton>
     );