From 4b5c5a1ac8c1f6ade9f5200df8bad4151747d7aa Mon Sep 17 00:00:00 2001
From: Thom Heymann <190132+thomheymann@users.noreply.github.com>
Date: Wed, 27 Mar 2024 14:19:29 +0000
Subject: [PATCH] =?UTF-8?q?[Observability=20Onboarding]=20Link=20all=20?=
 =?UTF-8?q?=E2=80=9CAdd=20data=E2=80=9D=20buttons=20in=20observability=20t?=
 =?UTF-8?q?o=20onboarding=20landing=20page=20(#179459)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resolves [#178944](https://github.com/elastic/kibana/issues/178944)

## :notebook: Summary

All "Add data" links within Observability link to
`/app/observabilityOnboarding` when on serverless observability.

## :heavy_check_mark: Acceptance criteria
All "Add data" links within Observability link to
`/app/observabilityOnboarding` when on serverless observability:
- Infrastructure > Inventory
- Infrastructure > Hosts
---
 .../infra/public/pages/logs/page_content.tsx       | 12 ++++++++++--
 .../infra/public/pages/metrics/index.tsx           | 14 ++++++++++++--
 .../onboarding_flow_form/onboarding_flow_form.tsx  |  5 ++++-
 3 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/x-pack/plugins/observability_solution/infra/public/pages/logs/page_content.tsx b/x-pack/plugins/observability_solution/infra/public/pages/logs/page_content.tsx
index 99de8fc23b5c0..f398b32501d04 100644
--- a/x-pack/plugins/observability_solution/infra/public/pages/logs/page_content.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/pages/logs/page_content.tsx
@@ -81,7 +81,7 @@ export const LogsPageContent: React.FunctionComponent = () => {
                 </EuiHeaderLink>
                 <LazyAlertDropdownWrapper />
                 <EuiHeaderLink
-                  href={getUrlForApp('/integrations/browse')}
+                  href={getUrlForApp('/observabilityOnboarding')}
                   color="primary"
                   iconType="indexOpen"
                 >
@@ -104,7 +104,15 @@ export const LogsPageContent: React.FunctionComponent = () => {
         <RedirectWithQueryParams from={'/analysis'} to={anomaliesTab.pathname} exact />
         <RedirectWithQueryParams from={'/log-rate'} to={anomaliesTab.pathname} exact />
         <RedirectWithQueryParams from={'/'} to={streamTab.pathname} exact />
-        <Route render={() => <NotFoundPage title="Logs" />} />
+        <Route
+          render={() => (
+            <NotFoundPage
+              title={i18n.translate('xpack.infra.logs.index.logsLabel', {
+                defaultMessage: 'Logs',
+              })}
+            />
+          )}
+        />
       </Routes>
     </>
   );
diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/index.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/index.tsx
index 494ad94830abe..d87706a587b8b 100644
--- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/index.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/index.tsx
@@ -103,7 +103,9 @@ export const InfrastructurePage = () => {
                         <MetricsAlertDropdown />
                       )}
                       <EuiHeaderLink
-                        href={kibana.services?.application?.getUrlForApp('/integrations/browse')}
+                        href={kibana.services?.application?.getUrlForApp(
+                          '/observabilityOnboarding'
+                        )}
                         color="primary"
                         iconType="indexOpen"
                       >
@@ -144,7 +146,15 @@ export const InfrastructurePage = () => {
               <RedirectWithQueryParams from="/metrics-explorer" exact to="/explorer" />
               <RedirectWithQueryParams from="/" exact to="/inventory" />
 
-              <Route render={() => <NotFoundPage title="Infrastructure" />} />
+              <Route
+                render={() => (
+                  <NotFoundPage
+                    title={i18n.translate('xpack.infra.header.infrastructureLabel', {
+                      defaultMessage: 'Infrastructure',
+                    })}
+                  />
+                )}
+              />
             </Routes>
           </InfraMLCapabilitiesProvider>
         </AlertPrefillProvider>
diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/onboarding_flow_form/onboarding_flow_form.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/onboarding_flow_form/onboarding_flow_form.tsx
index 396d3280ca47f..0beca82dbd1e0 100644
--- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/onboarding_flow_form/onboarding_flow_form.tsx
+++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/onboarding_flow_form/onboarding_flow_form.tsx
@@ -21,6 +21,7 @@ import {
   EuiFlexGrid,
   EuiAvatar,
   useEuiTheme,
+  useGeneratedHtmlId,
 } from '@elastic/eui';
 
 interface UseCaseOption {
@@ -159,6 +160,7 @@ export const OnboardingFlowForm: FunctionComponent = () => {
     },
   ];
 
+  const radioGroupId = useGeneratedHtmlId({ prefix: 'onboardingUseCase' });
   const [selectedId, setSelectedId] = useState<string>();
   const [hoveredId, setHoveredId] = useState<string>();
 
@@ -194,7 +196,8 @@ export const OnboardingFlowForm: FunctionComponent = () => {
               {/* Using EuiSpacer instead of EuiFlexGroup to ensure spacing is part of hit area for mouse hover effect */}
               {index > 0 && <EuiSpacer size="m" />}
               <EuiCheckableCard
-                id={option.id}
+                id={`${radioGroupId}_${option.id}`}
+                name={radioGroupId}
                 label={option.label}
                 checked={selectedId === option.id}
                 onChange={() => setSelectedId(option.id)}