From dea622a188ea8cd8825ef4a2d106159150658b76 Mon Sep 17 00:00:00 2001
From: Alexey Antonov <alexwizp@gmail.com>
Date: Tue, 24 Sep 2024 17:28:05 +0300
Subject: [PATCH] fix: [Obs Applications > Services | Traces |
 Dependencies][SCREEN READER]: H1 tag should not include secondary information

Closes: https://github.com/elastic/observability-accessibility/issues/58; Closes: https://github.com/elastic/observability-accessibility/issues/57; Closes: https://github.com/elastic/observability-accessibility/issues/56
---
 .../routing/templates/apm_main_template.tsx   | 48 ++++++++-----------
 1 file changed, 19 insertions(+), 29 deletions(-)

diff --git a/x-pack/plugins/observability_solution/apm/public/components/routing/templates/apm_main_template.tsx b/x-pack/plugins/observability_solution/apm/public/components/routing/templates/apm_main_template.tsx
index fca4f3809edb5..8768c49aad953 100644
--- a/x-pack/plugins/observability_solution/apm/public/components/routing/templates/apm_main_template.tsx
+++ b/x-pack/plugins/observability_solution/apm/public/components/routing/templates/apm_main_template.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { EuiFlexGroup, EuiFlexItem, EuiPageHeaderProps } from '@elastic/eui';
+import { EuiFlexGroup, EuiPageHeaderProps } from '@elastic/eui';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
 import { entityCentricExperience } from '@kbn/observability-plugin/common';
 import { ObservabilityPageTemplateProps } from '@kbn/observability-shared-plugin/public';
@@ -139,34 +139,24 @@ export function ApmMainTemplate({
     noDataConfig,
   });
 
-  const rightSideItems = [...(showServiceGroupSaveButton ? [<ServiceGroupSaveButton />] : [])];
-
   const sanitizedPath = getPathForFeedback(window.location.pathname);
-  const pageHeaderTitle = (
-    <EuiFlexGroup justifyContent="spaceBetween" wrap={true}>
-      {pageHeader?.pageTitle ?? pageTitle}
-      <EuiFlexItem grow={false} />
-      <EuiFlexItem grow={false}>
-        <EuiFlexGroup justifyContent="center">
-          <EuiFlexItem grow={false}>
-            <FeatureFeedbackButton
-              data-test-subj="infraApmFeedbackLink"
-              formUrl={
-                isEntityCentricExperienceViewEnabled && sanitizedPath.includes('service')
-                  ? APM_NEW_EXPERIENCE_FEEDBACK_LINK
-                  : APM_FEEDBACK_LINK
-              }
-              kibanaVersion={kibanaVersion}
-              isCloudEnv={isCloudEnv}
-              isServerlessEnv={isServerlessEnv}
-              sanitizedPath={sanitizedPath}
-            />
-          </EuiFlexItem>
-          <EuiFlexItem grow={false}>{environmentFilter && <ApmEnvironmentFilter />}</EuiFlexItem>
-        </EuiFlexGroup>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-  );
+
+  const rightSideItems = [
+    ...(showServiceGroupSaveButton ? [<ServiceGroupSaveButton />] : []),
+    ...(environmentFilter ? [<ApmEnvironmentFilter />] : []),
+    <FeatureFeedbackButton
+      data-test-subj="infraApmFeedbackLink"
+      formUrl={
+        isEntityCentricExperienceViewEnabled && sanitizedPath.includes('service')
+          ? APM_NEW_EXPERIENCE_FEEDBACK_LINK
+          : APM_FEEDBACK_LINK
+      }
+      kibanaVersion={kibanaVersion}
+      isCloudEnv={isCloudEnv}
+      isServerlessEnv={isServerlessEnv}
+      sanitizedPath={sanitizedPath}
+    />,
+  ];
 
   const pageTemplate = showCustomEmptyState ? (
     <CustomNoDataTemplate isPageDataLoaded={isLoading === false} noDataConfig={noDataConfig} />
@@ -182,7 +172,7 @@ export function ApmMainTemplate({
       pageHeader={{
         rightSideItems,
         ...pageHeader,
-        pageTitle: pageHeaderTitle,
+        pageTitle: pageHeader?.pageTitle ?? pageTitle,
         children: (
           <EuiFlexGroup direction="column">
             {isEntityCentricExperienceSettingEnabled &&