[Search] Fix button without a11y aria-label (elastic#201236)

Also adds a tooltip to the document count to explain why the count might differ.
paulinashakirova · Nov 26, 2024 · a964699 · a964699
1 parent dc4b0fa
commit a964699
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 0 deletions.
diff --git a/packages/kbn-search-index-documents/components/result/result_field.tsx b/packages/kbn-search-index-documents/components/result/result_field.tsx
@@ -85,6 +85,12 @@ export const ResultField: React.FC<ResultFieldProps> = ({
             <EuiPopover
               button={
                 <EuiButtonIcon
+                  aria-label={i18n.translate(
+                    'searchIndexDocuments.result.fieldTypeButtonAriaLabel',
+                    {
+                      defaultMessage: "Show this field's type",
+                    }
+                  )}
                   onClick={() => setIsPopoverOpen(!isPopoverOpen)}
                   iconType={iconType || (fieldType ? iconMap[fieldType] : defaultToken)}
                 />

diff --git a/x-pack/plugins/search_indices/public/components/quick_stats/quick_stat.tsx b/x-pack/plugins/search_indices/public/components/quick_stats/quick_stat.tsx
@@ -18,6 +18,7 @@ import {
   EuiText,
   useEuiTheme,
   useGeneratedHtmlId,
+  EuiIconTip,
 } from '@elastic/eui';
 
 interface BaseQuickStatProps {
@@ -33,6 +34,7 @@ interface BaseQuickStatProps {
   }>;
   setOpen: (open: boolean) => void;
   first?: boolean;
+  tooltipContent?: string;
 }
 
 export const QuickStat: React.FC<BaseQuickStatProps> = ({
@@ -45,6 +47,7 @@ export const QuickStat: React.FC<BaseQuickStatProps> = ({
   secondaryTitle,
   iconColor,
   content,
+  tooltipContent,
   ...rest
 }) => {
   const { euiTheme } = useEuiTheme();
@@ -93,6 +96,11 @@ export const QuickStat: React.FC<BaseQuickStatProps> = ({
                 {secondaryTitle}
               </EuiText>
             </EuiFlexItem>
+            {tooltipContent && (
+              <EuiFlexItem>
+                <EuiIconTip content={tooltipContent} />
+              </EuiFlexItem>
+            )}
           </EuiFlexGroup>
         </EuiPanel>
       }

diff --git a/x-pack/plugins/search_indices/public/components/quick_stats/quick_stats.tsx b/x-pack/plugins/search_indices/public/components/quick_stats/quick_stats.tsx
@@ -28,6 +28,7 @@ export interface QuickStatsProps {
   index: Index;
   mappings: Mappings;
   indexDocuments: IndexDocuments;
+  tooltipContent?: string;
 }
 
 export const SetupAISearchButton: React.FC = () => {
@@ -107,6 +108,10 @@ export const QuickStats: React.FC<QuickStatsProps> = ({ index, mappings, indexDo
                 description: index.size ?? '0b',
               },
             ]}
+            tooltipContent={i18n.translate('xpack.searchIndices.quickStats.documentCountTooltip', {
+              defaultMessage:
+                'This excludes nested documents, which Elasticsearch uses internally to store chunks of vectors.',
+            })}
             first
           />
         </EuiFlexItem>