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 = () => {
@@ -104,7 +104,15 @@ export const LogsPageContent: React.FunctionComponent = () => {
- } />
+ (
+
+ )}
+ />
>
);
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 = () => {
)}
@@ -144,7 +146,15 @@ export const InfrastructurePage = () => {
- } />
+ (
+
+ )}
+ />
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();
const [hoveredId, setHoveredId] = useState();
@@ -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 && }
setSelectedId(option.id)}