From 749100478e87c3864af47ac4c9986fecb0a84855 Mon Sep 17 00:00:00 2001
From: olensmar <ole@lensmar.com>
Date: Sat, 12 Feb 2022 23:14:11 +0100
Subject: [PATCH] fix: added tooltips to New Resource buttons

---
 .../organisms/NavigatorPane/NavigatorPane.tsx | 26 ++++++++++---------
 .../NewResourceWizard/NewResourceWizard.tsx   |  2 +-
 src/constants/tooltips.ts                     |  1 +
 .../ResourceKindSectionNameSuffix.tsx         | 20 +++++++-------
 4 files changed, 27 insertions(+), 22 deletions(-)

diff --git a/src/components/organisms/NavigatorPane/NavigatorPane.tsx b/src/components/organisms/NavigatorPane/NavigatorPane.tsx
index c3ed0d3136..39337d53f6 100644
--- a/src/components/organisms/NavigatorPane/NavigatorPane.tsx
+++ b/src/components/organisms/NavigatorPane/NavigatorPane.tsx
@@ -10,7 +10,7 @@ import {FilterOutlined, PlusOutlined} from '@ant-design/icons';
 import styled from 'styled-components';
 
 import {NAVIGATOR_HEIGHT_OFFSET, ROOT_FILE_ENTRY} from '@constants/constants';
-import {QuickFilterTooltip} from '@constants/tooltips';
+import {NewResourceTooltip, QuickFilterTooltip} from '@constants/tooltips';
 
 import {ResourceFilterType} from '@models/appstate';
 
@@ -120,17 +120,19 @@ const NavPane: React.FC = () => {
             </div>
           </MonoPaneTitle>
           <S.TitleBarRightButtons>
-            <S.PlusButton
-              id="create-resource-button"
-              $disabled={!isFolderOpen || isInPreviewMode}
-              $highlighted={highlightedItems.createResource}
-              className={highlightedItems.createResource ? 'animated-highlight' : ''}
-              disabled={!isFolderOpen || isInPreviewMode}
-              icon={<PlusOutlined />}
-              size="small"
-              type="link"
-              onClick={onClickNewResource}
-            />
+            <Tooltip title={NewResourceTooltip}>
+              <S.PlusButton
+                id="create-resource-button"
+                $disabled={!isFolderOpen || isInPreviewMode}
+                $highlighted={highlightedItems.createResource}
+                className={highlightedItems.createResource ? 'animated-highlight' : ''}
+                disabled={!isFolderOpen || isInPreviewMode}
+                icon={<PlusOutlined />}
+                size="small"
+                type="link"
+                onClick={onClickNewResource}
+              />
+            </Tooltip>
             <Tooltip title={QuickFilterTooltip}>
               <Badge count={appliedFilters.length} size="small" offset={[-2, 2]} color={Colors.greenOkay}>
                 <Button
diff --git a/src/components/organisms/NewResourceWizard/NewResourceWizard.tsx b/src/components/organisms/NewResourceWizard/NewResourceWizard.tsx
index ecfd052e5b..b6d1d78b20 100644
--- a/src/components/organisms/NewResourceWizard/NewResourceWizard.tsx
+++ b/src/components/organisms/NewResourceWizard/NewResourceWizard.tsx
@@ -349,7 +349,7 @@ const NewResourceWizard = () => {
 
   return (
     <Modal
-      title="Add New Resource"
+      title="Create Resource"
       visible={newResourceWizardState.isOpen}
       onOk={onOk}
       onCancel={onCancel}
diff --git a/src/constants/tooltips.ts b/src/constants/tooltips.ts
index 712595720b..8b772b4635 100644
--- a/src/constants/tooltips.ts
+++ b/src/constants/tooltips.ts
@@ -55,3 +55,4 @@ export const NewEmptyProjectTooltip = 'New Empty Project';
 export const SearchProjectTooltip = 'Search for project by name or path';
 export const PluginDrawerTooltip = 'Open Plugins Manager';
 export const QuickFilterTooltip = `Filter results – Hint: quick-filter using ${KEY_CTRL_CMD} + P`;
+export const NewResourceTooltip = `Create new resource (${KEY_CTRL_CMD} + N)`;
diff --git a/src/navsections/K8sResourceSectionBlueprint/ResourceKindSectionNameSuffix.tsx b/src/navsections/K8sResourceSectionBlueprint/ResourceKindSectionNameSuffix.tsx
index 76505982fc..7283069746 100644
--- a/src/navsections/K8sResourceSectionBlueprint/ResourceKindSectionNameSuffix.tsx
+++ b/src/navsections/K8sResourceSectionBlueprint/ResourceKindSectionNameSuffix.tsx
@@ -1,6 +1,6 @@
 import React, {useCallback, useMemo} from 'react';
 
-import {Button} from 'antd';
+import {Button, Tooltip} from 'antd';
 
 import {PlusOutlined} from '@ant-design/icons';
 
@@ -65,14 +65,16 @@ const ResourceKindSectionSuffix: React.FC<SectionCustomComponentProps> = props =
   return (
     <SuffixContainer>
       <ButtonContainer>
-        <Button
-          icon={<PlusOutlined />}
-          type="link"
-          onClick={createResource}
-          size="small"
-          disabled={isInPreviewMode}
-          style={{color: sectionInstance.isSelected && isSectionCollapsed ? Colors.blackPure : undefined}}
-        />
+        <Tooltip title={`Create a new ${resourceKind}`}>
+          <Button
+            icon={<PlusOutlined />}
+            type="link"
+            onClick={createResource}
+            size="small"
+            disabled={isInPreviewMode}
+            style={{color: sectionInstance.isSelected && isSectionCollapsed ? Colors.blackPure : undefined}}
+          />
+        </Tooltip>
       </ButtonContainer>
     </SuffixContainer>
   );