From 5ed698182887e18d2aa6c4b6782cc636a45a1472 Mon Sep 17 00:00:00 2001
From: Alexey Antonov <alexwizp@gmail.com>
Date: Tue, 15 Oct 2024 15:39:10 +0300
Subject: [PATCH] fix: [Stateful: Home page] Most Ingest your content section
 buttons have duplicated actions on them (#196079)

Closes: #194932

## Summary

User reaches the same button two times when navigating using only
keyboard and it can get confusing. Also for the user using screen reader
it is also confusing if reached element is button or link. Better for
element to get focus only one time when navigating in sequence from one
element to another and for the user only to hear one announcement of the
element, button or link (but not button link).

## What was changed?:

1. Removed extra `EuiLinkTo` wrapper
2. `EuiButton` was replaced to `EuiButtonTo`

## Screen

<img width="1792" alt="image"
src="https://github.com/user-attachments/assets/597eb7f0-dd7b-4c14-bccd-d91dc3bdcbcf">
---
 .../shared/ingestion_card/ingestion_card.tsx  | 24 +++++++++++++------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/shared/ingestion_card/ingestion_card.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/shared/ingestion_card/ingestion_card.tsx
index 94bbc515f92bd..f935ea6803c69 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/shared/ingestion_card/ingestion_card.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/shared/ingestion_card/ingestion_card.tsx
@@ -20,7 +20,7 @@ import {
 
 import { i18n } from '@kbn/i18n';
 
-import { EuiLinkTo } from '../../../../shared/react_router_helpers';
+import { EuiButtonTo } from '../../../../shared/react_router_helpers';
 
 interface IngestionCardProps {
   buttonIcon: IconType;
@@ -78,15 +78,25 @@ export const IngestionCard: React.FC<IngestionCardProps> = ({
       }
       footer={
         onClick ? (
-          <EuiButton isDisabled={isDisabled} iconType={buttonIcon} onClick={onClick} fullWidth>
+          <EuiButton
+            data-test-subj="enterpriseSearchIngestionCardButton"
+            isDisabled={isDisabled}
+            iconType={buttonIcon}
+            onClick={onClick}
+            fullWidth
+          >
             {buttonLabel}
           </EuiButton>
         ) : (
-          <EuiLinkTo to={href ?? ''} shouldNotCreateHref>
-            <EuiButton isDisabled={isDisabled} iconType={buttonIcon} fullWidth>
-              {buttonLabel}
-            </EuiButton>
-          </EuiLinkTo>
+          <EuiButtonTo
+            to={href ?? ''}
+            shouldNotCreateHref
+            isDisabled={isDisabled}
+            iconType={buttonIcon}
+            fullWidth
+          >
+            {buttonLabel}
+          </EuiButtonTo>
         )
       }
     />