From 094500f4d25eb4721f6a73e0eb27e78b59c96280 Mon Sep 17 00:00:00 2001 From: Yash Sartanpara <119680679+YashSartanpara1@users.noreply.github.com> Date: Wed, 10 Apr 2024 17:07:50 +0530 Subject: [PATCH] PMM-12847 Fix product tour (#710) * PMM-12847 Fix product tour * PMM-12847 fix prettier issue * PMM-12847 Fix menu control * PMM-12742 Add pmm config menu item and icon * PMM-12742 fix navmenu for access roles * PMM-12742 fix access roles menu item * PMM-12742 Fix navIndex of deep child * PMM-12742 Change menu item nav * PMM-12742 Run prettier * PMM-12847 Change for new pmm menu item * PMM-12742 Fix PMM dump header * PMM-12847 Update main menu toggle logic * PMM-12847 fix according to g10.4 * PMM-12847 remove async --- .../AppChrome/MegaMenu/MegaMenuItem.tsx | 2 +- .../tour/steps/alerting/alerting.steps.tsx | 16 ++++++++-------- .../tour/steps/product/product.messages.ts | 6 +++--- .../percona/tour/steps/product/product.steps.tsx | 16 ++++++++-------- .../percona/tour/steps/product/product.utils.tsx | 6 +++--- 5 files changed, 23 insertions(+), 23 deletions(-) diff --git a/public/app/core/components/AppChrome/MegaMenu/MegaMenuItem.tsx b/public/app/core/components/AppChrome/MegaMenu/MegaMenuItem.tsx index a0cd8c310cc0a..f4a58771cd744 100644 --- a/public/app/core/components/AppChrome/MegaMenu/MegaMenuItem.tsx +++ b/public/app/core/components/AppChrome/MegaMenu/MegaMenuItem.tsx @@ -80,7 +80,7 @@ export function MegaMenuItem({ link, activeItem, level = 0, onClick }: Props) { /> )} -
+
{ diff --git a/public/app/percona/tour/steps/alerting/alerting.steps.tsx b/public/app/percona/tour/steps/alerting/alerting.steps.tsx index ab2f6eaff25d9..af1560eb39d53 100644 --- a/public/app/percona/tour/steps/alerting/alerting.steps.tsx +++ b/public/app/percona/tour/steps/alerting/alerting.steps.tsx @@ -9,7 +9,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ...(isAdmin ? [ { - selector: '[aria-label="Tab Fired alerts"]', + selector: '[aria-label="Fired alerts"]', mutationObservables: ['.page-body'], resizeObservables: ['.page-body'], content: ( @@ -20,7 +20,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ), }, { - selector: '[aria-label="Tab Alert rule templates"]', + selector: '[aria-label="Alert rule templates"]', content: (

{Messages.alertRuleTemplates.effortlessly}

@@ -31,7 +31,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ] : []), { - selector: '[aria-label="Tab Alert rules"]', + selector: '[aria-label="Alert rules"]', content: (

{Messages.alertRules.rules}

@@ -41,7 +41,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ), }, { - selector: '[aria-label="Tab Contact points"]', + selector: '[aria-label="Contact points"]', content: (

{Messages.contactPoints.define}

@@ -50,7 +50,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ), }, { - selector: '[aria-label="Tab Notification policies"]', + selector: '[aria-label="Notification policies"]', content: (

{Messages.notificationPolicies.routed}

@@ -59,7 +59,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ), }, { - selector: '[aria-label="Tab Silences"]', + selector: '[aria-label="Silences"]', content: (

{Messages.silences.create}

@@ -68,7 +68,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ), }, { - selector: '[aria-label="Tab Alert groups"]', + selector: '[aria-label="Alert groups"]', content: (

{Messages.alertGroups.alert}

@@ -79,7 +79,7 @@ export const getAlertingTourSteps = (isAdmin = false): TourStep[] => [ ...(isAdmin ? [ { - selector: '[aria-label="Tab Admin"]', + selector: '[aria-label="Admin"]', content: (

{Messages.admin.configure}

diff --git a/public/app/percona/tour/steps/product/product.messages.ts b/public/app/percona/tour/steps/product/product.messages.ts index c4a46e0325d59..f28d17142279f 100644 --- a/public/app/percona/tour/steps/product/product.messages.ts +++ b/public/app/percona/tour/steps/product/product.messages.ts @@ -39,7 +39,7 @@ export const Messages = { docs: 'Integrated Alerting documentation', }, configPanel: { - title: 'Configuration Panel', + title: 'PMM Configuration Panel', services: "Here you can check Services, Agents and Nodes in your PMM's Inventory, and add new instances for monitoring: PostgreSQL, MySQL, MongoDB, HAProxy, etc.", settings: @@ -48,8 +48,8 @@ export const Messages = { settingsDocsLink: 'here', }, serverAdmin: { - title: 'Server Admin', - userManagement: 'In the Server Admin panel you can assign and control user management for PMM:', + title: 'Administration', + userManagement: 'In the Administration panel you can assign and control user management for PMM:', addEditRemove: 'Add, edit, and remove users.', grant: 'Grant or Revoke admin privileges for a user.', manageOrg: 'Manage organizations to which the user belongs and their assigned role.', diff --git a/public/app/percona/tour/steps/product/product.steps.tsx b/public/app/percona/tour/steps/product/product.steps.tsx index 5e158155a98d8..a56c5dbeae6fd 100644 --- a/public/app/percona/tour/steps/product/product.steps.tsx +++ b/public/app/percona/tour/steps/product/product.steps.tsx @@ -14,7 +14,7 @@ export const getProductTourSteps = ( activeServices?: ServiceType[] ): TourStep[] => [ { - selector: '.dropdown > [aria-label="Dashboards"]', + selector: '[aria-label="Dashboards"]', content: (

{Messages.dashboards.browse}

@@ -25,7 +25,7 @@ export const getProductTourSteps = ( }, getPMMDashboardsStep(activeServices || []), { - selector: '.dropdown > [aria-label="Query Analytics (QAN)"]', + selector: '[aria-label="Query Analytics (QAN)"]', content: (

{Messages.qan.queries}

@@ -36,7 +36,7 @@ export const getProductTourSteps = ( ...(isPmmAdmin ? [ { - selector: '.dropdown > [aria-label="Explore"]', + selector: '[aria-label="Explore"]', content: (

{Messages.explore.data}

@@ -48,7 +48,7 @@ export const getProductTourSteps = ( ] : []), { - selector: '.dropdown > [aria-label="Alerting"]', + selector: '[aria-label="Alerting"]', content: (

@@ -71,7 +71,7 @@ export const getProductTourSteps = ( ...(isPmmAdmin && !!settings?.sttEnabled ? [ { - selector: '.dropdown > [aria-label="Advisors"]', + selector: '[aria-label="Advisors"]', content: (

{Messages.advisors.pmmIncludes}

@@ -90,7 +90,7 @@ export const getProductTourSteps = ( ...(isPmmAdmin && !!settings?.backupEnabled ? [ { - selector: '.dropdown > [aria-label="Backup"]', + selector: '[aria-label="Backup"]', content: (

{Messages.backup.feature}

@@ -104,7 +104,7 @@ export const getProductTourSteps = ( ...(isPmmAdmin ? [ { - selector: '.dropdown > [aria-label="Configuration"]', + selector: '[aria-label="PMM Configuration"]', content: (

{Messages.configPanel.services}

@@ -120,7 +120,7 @@ export const getProductTourSteps = ( ), }, { - selector: '.dropdown > [aria-label="Server admin"]', + selector: '[aria-label="Administration"]', content: (

{Messages.serverAdmin.userManagement}

diff --git a/public/app/percona/tour/steps/product/product.utils.tsx b/public/app/percona/tour/steps/product/product.utils.tsx index 8513431441fef..1b8bab45a93a5 100644 --- a/public/app/percona/tour/steps/product/product.utils.tsx +++ b/public/app/percona/tour/steps/product/product.utils.tsx @@ -24,7 +24,7 @@ export const getPMMDashboardsStep = (services: ServiceType[]): TourStep => { }; const getStep = (ariaLabel: string, navMenuId: string): TourStep => ({ - selector: '#navbar-menu-portal-container [role="dialog"]', + selector: '.scrollbar-view [role="dialog"]', content: (

{Messages.pmmDashboards.grafanaTechnology}

@@ -33,7 +33,7 @@ const getStep = (ariaLabel: string, navMenuId: string): TourStep => ({
), navMenuId, - highlightedSelectors: [`.dropdown > [aria-label="${ariaLabel}"]`, '#navbar-menu-portal-container [role="dialog"]'], - resizeObservables: ['#navbar-menu-portal-container'], + highlightedSelectors: [`[aria-label="${ariaLabel}"]`, '.scrollbar-view [role="dialog"]'], + resizeObservables: ['.scrollbar-view'], position: 'right', });