diff --git a/x-pack/platform/plugins/shared/fleet/cypress/e2e/fleet_settings_outputs.cy.ts b/x-pack/platform/plugins/shared/fleet/cypress/e2e/fleet_settings_outputs.cy.ts index c5e69bd7dd661..570abd5039a1b 100644 --- a/x-pack/platform/plugins/shared/fleet/cypress/e2e/fleet_settings_outputs.cy.ts +++ b/x-pack/platform/plugins/shared/fleet/cypress/e2e/fleet_settings_outputs.cy.ts @@ -436,7 +436,7 @@ queue: cy.get(`a[href="/app/fleet/settings/outputs/${kafkaOutputId}"]`) .parents('tr') .within(() => { - cy.get('[title="Delete"]').click(); + cy.getBySel('deleteOutputBtn').click(); }); cy.getBySel(SETTINGS_CONFIRM_MODAL_BTN).click(); cy.get(`a[href="app/fleet/settings/outputs/${kafkaOutputId}"]`).should('not.exist'); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/components/custom_fields/global_data_tags_table.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/components/custom_fields/global_data_tags_table.tsx index fd91627b43ad4..9b66d2cc60f0b 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/components/custom_fields/global_data_tags_table.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/components/custom_fields/global_data_tags_table.tsx @@ -11,19 +11,20 @@ import { i18n } from '@kbn/i18n'; import { EuiBasicTable, - EuiPanel, - EuiText, - EuiFlexGroup, - EuiFlexItem, EuiButton, - EuiFormRow, - EuiFieldText, EuiButtonIcon, EuiCode, - EuiSpacer, EuiConfirmModal, - useGeneratedHtmlId, + EuiFieldText, + EuiFlexGroup, + EuiFlexItem, + EuiFormRow, + EuiPanel, + EuiSpacer, + EuiText, + EuiToolTip, type EuiBasicTableColumn, + useGeneratedHtmlId, } from '@elastic/eui'; import type { NewAgentPolicy, AgentPolicy, GlobalDataTag } from '../../../../../common/types'; @@ -328,24 +329,28 @@ export const GlobalDataTagsTable: React.FunctionComponent = ({ return isEditing || isAddingRow ? ( - confirmEditChanges(index)} - aria-label="Confirm" - /> + + confirmEditChanges(index)} + aria-label="Confirm" + /> + ) : ( - handleStartEdit(index)} - /> + + handleStartEdit(index)} + /> + ); }, }, @@ -359,24 +364,28 @@ export const GlobalDataTagsTable: React.FunctionComponent = ({ return isEditing || isAddingRow ? ( - cancelEditChanges(index)} - aria-label="Cancel" - /> + + cancelEditChanges(index)} + aria-label="Cancel" + /> + ) : ( - deleteTag(index)} - /> + + deleteTag(index)} + /> + ); }, }, diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/multi_text_input.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/multi_text_input.tsx index 8ae652a3491dc..0b69492f2c5c4 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/multi_text_input.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/multi_text_input.tsx @@ -8,13 +8,14 @@ import React, { useCallback, useState, useEffect } from 'react'; import type { FunctionComponent, ChangeEvent } from 'react'; import { - EuiFlexGroup, - EuiFlexItem, EuiButtonEmpty, - EuiFieldText, - EuiFieldPassword, EuiButtonIcon, + EuiFieldPassword, + EuiFieldText, + EuiFlexGroup, + EuiFlexItem, EuiSpacer, + EuiToolTip, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; @@ -96,19 +97,30 @@ const Row: FunctionComponent = ({ {isMultiRow && ( - + disableScreenReaderOutput + > + + )} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/agent_list_page/components/tag_options.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/agent_list_page/components/tag_options.tsx index d9f69fa00dbcb..ba628cb5682a2 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/agent_list_page/components/tag_options.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/agent_list_page/components/tag_options.tsx @@ -16,6 +16,7 @@ import { EuiLink, EuiSpacer, EuiText, + EuiToolTip, EuiWrappingPopover, } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; @@ -96,17 +97,24 @@ export const TagOptions: React.FC = ({ tagName, isTagHovered, onTagsUpdat return ( <> {tagMenuButtonVisible && ( - ) => { - setTagOptionsButton(event.currentTarget); - setTagOptionsVisible(!tagOptionsVisible); - }} - /> + disableScreenReaderOutput + > + ) => { + setTagOptionsButton(event.currentTarget); + setTagOptionsVisible(!tagOptionsVisible); + }} + /> + )} {tagOptionsVisible && ( = ( {button.children} ) : ( - + disableScreenReaderOutput + > + + ); return ( diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/enrollment_token_list_page/components/columns.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/enrollment_token_list_page/components/columns.tsx index 0b314696d6165..6e797dbc0b0e9 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/enrollment_token_list_page/components/columns.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/enrollment_token_list_page/components/columns.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { EuiIcon } from '@elastic/eui'; +import { EuiIcon, EuiTextTruncate } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedDate } from '@kbn/i18n-react'; @@ -42,11 +42,7 @@ export const getColumns = ({ render: (policyId: string) => { const agentPolicy = agentPoliciesById[policyId]; const value = agentPolicy ? agentPolicy.name : policyId; - return ( - - {value} - - ); + return ; }, }, { diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_flyout/download_source_headers.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_flyout/download_source_headers.tsx index b24230389aebb..25e76fbd207c9 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_flyout/download_source_headers.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_flyout/download_source_headers.tsx @@ -15,6 +15,7 @@ import { EuiFormRow, EuiSpacer, EuiTitle, + EuiToolTip, } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import React, { useCallback, useMemo, useState } from 'react'; @@ -182,19 +183,29 @@ export const DownloadSourceHeaders: React.FunctionComponent<{ - deleteKeyValuePair(index)} - iconType="cross" - disabled={deleteButtonDisabled} - aria-label={i18n.translate( + + disableScreenReaderOutput + > + deleteKeyValuePair(index)} + iconType="cross" + disabled={deleteButtonDisabled} + aria-label={i18n.translate( + 'xpack.fleet.settings.editDownloadSourcesFlyout.deleteHeaderButton', + { + defaultMessage: 'Delete header', + } + )} + /> + diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_table/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_table/index.tsx index 613dbf4d9c8f0..cbf35781bf912 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_table/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/download_source_table/index.tsx @@ -7,7 +7,14 @@ import React, { useMemo } from 'react'; import styled from 'styled-components'; -import { EuiBasicTable, EuiButtonIcon, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui'; +import { + EuiBasicTable, + EuiButtonIcon, + EuiFlexGroup, + EuiFlexItem, + EuiIcon, + EuiToolTip, +} from '@elastic/eui'; import type { EuiBasicTableColumn } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -116,27 +123,29 @@ export const DownloadSourceTable: React.FunctionComponent {isDeleteVisible && ( - deleteDownloadSource(downloadSource)} - title={deleteDownloadSourceLabel} - data-test-subj="editDownloadSourceTable.delete.btn" - /> + + deleteDownloadSource(downloadSource)} + data-test-subj="editDownloadSourceTable.delete.btn" + /> + )} - + + + ); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_kafka_headers.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_kafka_headers.tsx index 10f1b6eccae62..defc9806cc134 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_kafka_headers.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_kafka_headers.tsx @@ -16,6 +16,7 @@ import { EuiPanel, EuiSpacer, EuiTitle, + EuiToolTip, } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import React, { useCallback, useMemo, useState } from 'react'; @@ -172,16 +173,23 @@ export const OutputFormKafkaHeaders: React.FunctionComponent<{ inputs: OutputFor - deleteKeyValuePair(index)} - iconType="cross" - disabled={deleteButtonDisabled} - aria-label={i18n.translate('xpack.fleet.kafkaHeadersInput.deleteButton', { + + disableScreenReaderOutput + > + deleteKeyValuePair(index)} + iconType="cross" + disabled={deleteButtonDisabled} + aria-label={i18n.translate('xpack.fleet.kafkaHeadersInput.deleteButton', { + defaultMessage: 'Delete row', + })} + /> + diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_proxies_table/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_proxies_table/index.tsx index 1543a8251cbf3..404d88cc2044d 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_proxies_table/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_proxies_table/index.tsx @@ -7,7 +7,14 @@ import React, { useMemo } from 'react'; import styled from 'styled-components'; -import { EuiBasicTable, EuiButtonIcon, EuiFlexGroup, EuiFlexItem, EuiIconTip } from '@elastic/eui'; +import { + EuiBasicTable, + EuiButtonIcon, + EuiFlexGroup, + EuiFlexItem, + EuiIconTip, + EuiToolTip, +} from '@elastic/eui'; import type { EuiBasicTableColumn } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -92,27 +99,29 @@ export const FleetProxiesTable: React.FunctionComponent {isDeleteVisible && ( - deleteFleetProxy(fleetProxy)} - title={deleteButtonLabel} - data-test-subj="fleetProxiesTable.delete.btn" - /> + + deleteFleetProxy(fleetProxy)} + data-test-subj="fleetProxiesTable.delete.btn" + /> + )} - + + + ); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_server_hosts_table/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_server_hosts_table/index.tsx index 717bb9ef81c65..1ee43afca909c 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_server_hosts_table/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/fleet_server_hosts_table/index.tsx @@ -15,6 +15,8 @@ import { EuiIconTip, EuiIcon, EuiButtonIcon, + EuiTextTruncate, + EuiToolTip, } from '@elastic/eui'; import type { EuiBasicTableColumn } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -49,9 +51,7 @@ export const FleetServerHostsTable: React.FunctionComponent ( -

- {fleetServerHost.name} -

+
{fleetServerHost.is_preconfigured && ( @@ -83,9 +83,7 @@ export const FleetServerHostsTable: React.FunctionComponent {urls.map((url) => ( -

- {url} -

+
))} @@ -125,47 +123,55 @@ export const FleetServerHostsTable: React.FunctionComponent {isDeleteVisible && ( - deleteFleetServerHost(fleetServerHost)} - title={i18n.translate( + + disableScreenReaderOutput + > + deleteFleetServerHost(fleetServerHost)} + aria-label={i18n.translate( + 'xpack.fleet.settings.fleetServerHostsTable.deleteButtonAriaLabel', + { + defaultMessage: 'Delete host', + } + )} + data-test-subj="fleetServerHostsTable.delete.btn" + /> + )} - + disableScreenReaderOutput + > + +
); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/logstash_instructions/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/logstash_instructions/index.tsx index a32dd9429d5e9..0a3ebc8df6442 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/logstash_instructions/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/logstash_instructions/index.tsx @@ -8,14 +8,15 @@ import React, { useState, useMemo } from 'react'; import { - EuiCallOut, EuiButton, - EuiSpacer, - EuiLink, + EuiButtonIcon, + EuiCallOut, EuiCode, EuiCodeBlock, EuiCopy, - EuiButtonIcon, + EuiLink, + EuiSpacer, + EuiToolTip, } from '@elastic/eui'; import type { EuiCallOutProps } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; @@ -136,18 +137,28 @@ const LogstashInstructionSteps = ({ isSSLEnabled }: LogstashInstructionStepsProp
{(copy) => ( - + disableScreenReaderOutput + > + + )}
diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/multi_row_input/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/multi_row_input/index.tsx index 40ede1c8c9b1b..afe82a62f9d97 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/multi_row_input/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/multi_row_input/index.tsx @@ -9,21 +9,22 @@ import type { ReactNode, FunctionComponent, ChangeEvent } from 'react'; import sytled, { useTheme } from 'styled-components'; import { - EuiFlexGroup, - EuiFlexItem, EuiButtonEmpty, - EuiFormRow, - EuiFieldText, + EuiButtonIcon, EuiDragDropContext, - EuiDroppable, EuiDraggable, + EuiDroppable, + EuiFieldText, + EuiFlexGroup, + EuiFlexItem, + EuiFormErrorText, + EuiFormHelpText, + EuiFormRow, EuiIcon, - EuiButtonIcon, EuiSpacer, - EuiFormHelpText, - euiDragDropReorder, - EuiFormErrorText, EuiTextArea, + EuiToolTip, + euiDragDropReorder, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; @@ -161,15 +162,22 @@ const SortableTextField: FunctionComponent = React.memo( {displayErrors(errors)} - + disableScreenReaderOutput + > + + )} @@ -228,15 +236,22 @@ const NonSortableTextField: FunctionComponent = React {deletable && ( - + disableScreenReaderOutput + > + + )} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/outputs_table/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/outputs_table/index.tsx index e6aa47a26b053..ffba0b5789f53 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/outputs_table/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/settings/components/outputs_table/index.tsx @@ -7,7 +7,15 @@ import React, { useMemo } from 'react'; import styled from 'styled-components'; -import { EuiBasicTable, EuiButtonIcon, EuiFlexGroup, EuiFlexItem, EuiIconTip } from '@elastic/eui'; +import { + EuiBasicTable, + EuiButtonIcon, + EuiFlexGroup, + EuiFlexItem, + EuiIconTip, + EuiTextTruncate, + EuiToolTip, +} from '@elastic/eui'; import type { EuiBasicTableColumn } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -67,9 +75,7 @@ export const OutputsTable: React.FunctionComponent = ({ render: (output: Output) => ( -

- {output.name} -

+
{output.is_preconfigured && ( @@ -103,9 +109,7 @@ export const OutputsTable: React.FunctionComponent = ({ {(output.hosts || []).map((host) => ( -

- {host} -

+
))}
@@ -154,35 +158,50 @@ export const OutputsTable: React.FunctionComponent = ({ {isDeleteVisible && ( - deleteOutput(output)} - title={i18n.translate('xpack.fleet.settings.outputSection.deleteButtonTitle', { - defaultMessage: 'Delete', - })} - aria-label={i18n.translate( + + disableScreenReaderOutput + > + deleteOutput(output)} + aria-label={i18n.translate( + 'xpack.fleet.settings.outputSection.deleteButtonTitle', + { + defaultMessage: 'Delete', + } + )} + data-test-subj="deleteOutputBtn" + /> + )} - + disableScreenReaderOutput + > + + ); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/package_list_grid/index.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/package_list_grid/index.tsx index 175ec14de7e88..95564c2b87f27 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/package_list_grid/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/package_list_grid/index.tsx @@ -11,14 +11,15 @@ import React, { useCallback, useState } from 'react'; import styled from 'styled-components'; import { - EuiFlexGroup, - EuiFlexItem, - EuiSpacer, EuiButton, EuiButtonIcon, - EuiPopover, - EuiContextMenuPanel, EuiContextMenuItem, + EuiContextMenuPanel, + EuiFlexGroup, + EuiFlexItem, + EuiPopover, + EuiSpacer, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; @@ -282,13 +283,15 @@ export const PackageListGrid: FunctionComponent = ({ data-test-subj="epmList.showMoreSubCategoriesButton" id="moreSubCategories" button={ - + + + } isOpen={isPopoverOpen} closePopover={closePopover} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/create_new_integration.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/create_new_integration.tsx index 556975445b62b..7c88cb1b7a8fb 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/create_new_integration.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/create_new_integration.tsx @@ -11,9 +11,10 @@ import { EuiButtonIcon, EuiContextMenuItem, EuiContextMenuPanel, - EuiFlexItem, EuiFlexGroup, + EuiFlexItem, EuiPopover, + EuiToolTip, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { useHistory } from 'react-router-dom'; @@ -60,24 +61,31 @@ export const CreateNewIntegrationButton: React.FC = () => { anchorPosition="downRight" style={{ display: 'flex', height: '100%' }} button={ - setIsPopoverOpen((prev) => !prev)} - style={{ - borderTopLeftRadius: 0, - borderBottomLeftRadius: 0, - borderLeft: '1px solid rgba(255,255,255,0.3)', - height: 40, - minHeight: 0, - }} - data-test-subj="createNewIntegrationDropdownBtn" - /> + + setIsPopoverOpen((prev) => !prev)} + style={{ + borderTopLeftRadius: 0, + borderBottomLeftRadius: 0, + borderLeft: '1px solid rgba(255,255,255,0.3)', + height: 40, + minHeight: 0, + }} + data-test-subj="createNewIntegrationDropdownBtn" + /> + } > + disableScreenReaderOutput + > + + } isOpen={isPopoverOpen} closePopover={closePopover} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/review_approve_modal.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/review_approve_modal.tsx index 77c00caa0d0bd..0cd55ae95de47 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/review_approve_modal.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/review_approve_modal.tsx @@ -30,6 +30,7 @@ import { EuiPopover, EuiSpacer, EuiText, + EuiToolTip, htmlIdGenerator, } from '@elastic/eui'; import type { EuiBasicTableColumn, EuiComboBoxOptionOption } from '@elastic/eui'; @@ -397,14 +398,22 @@ export const ReviewApproveModal: React.FC<{ name: '', width: '32px', render: (item: ReviewTableRow) => ( - setSelectedDataStreamForFlyout(item.dataStream)} - /> + disableScreenReaderOutput + > + setSelectedDataStreamForFlyout(item.dataStream)} + /> + ), }, { diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/search_and_filters_bar.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/search_and_filters_bar.tsx index dda4b8a9c871a..6e920c65a60d6 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/search_and_filters_bar.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/browse_integrations/components/search_and_filters_bar.tsx @@ -9,8 +9,8 @@ import React, { useCallback, useMemo, useState } from 'react'; import { EuiButton, EuiButtonIcon, - EuiContextMenuPanel, EuiContextMenuItem, + EuiContextMenuPanel, EuiFieldSearch, EuiFilterButton, EuiFilterGroup, @@ -22,6 +22,7 @@ import { EuiScreenReaderOnly, EuiSelectable, EuiSpacer, + EuiToolTip, mathWithUnits, useEuiTheme, } from '@elastic/eui'; @@ -587,16 +588,24 @@ export const SearchAndFiltersBar: React.FC = ({ data-test-subj="browseIntegrations.showMoreSubCategoriesButton" id="browseIntegrationsMoreSubCategories" button={ - setIsSubCategoryPopoverOpen((prev) => !prev)} - iconType="boxesHorizontal" - aria-label={i18n.translate( + + disableScreenReaderOutput + > + setIsSubCategoryPopoverOpen((prev) => !prev)} + iconType="boxesHorizontal" + aria-label={i18n.translate( + 'xpack.fleet.epm.browseIntegrations.searchAndFilterBar.showMoreSubCategories', + { defaultMessage: 'Show more subcategories' } + )} + size="s" + /> + } isOpen={isSubCategoryPopoverOpen} closePopover={() => setIsSubCategoryPopoverOpen(false)} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agent_based_table.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agent_based_table.tsx index be2c9a2174901..e4f0e8e583be8 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agent_based_table.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agent_based_table.tsx @@ -201,7 +201,7 @@ export const AgentBasedPackagePoliciesTable = ({ }), truncateText: true, render(updatedBy: PackagePolicy['updated_by']) { - return ; + return ; }, }, { diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx index 83876a6b5694c..3a12edea3657b 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx @@ -201,7 +201,7 @@ export const AgentlessPackagePoliciesTable = ({ }), truncateText: true, render(updatedBy: PackagePolicy['updated_by']) { - return ; + return ; }, }, { diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/persona.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/persona.tsx index aa1bbcc3dc838..1c57c6258a69d 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/persona.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/persona.tsx @@ -15,7 +15,7 @@ const MIN_WIDTH: CSSProperties = { minWidth: 0 }; * Shows a user's name along with an avatar. Name is truncated if its wider than the availble space */ export const Persona = memo( - ({ name, className, 'data-test-subj': dataTestSubj, title, ...otherAvatarProps }) => { + ({ name, className, 'data-test-subj': dataTestSubj, ...otherAvatarProps }) => { const getTestId = useCallback( (suffix: any) => { if (dataTestSubj) { @@ -31,7 +31,6 @@ export const Persona = memo( style={MIN_WIDTH} className={className} data-test-subj={dataTestSubj} - title={title} responsive={false} > diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/installed_integrations/components/resizable_panel.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/installed_integrations/components/resizable_panel.tsx index de641c3f4d3c4..727d07be77bd9 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/installed_integrations/components/resizable_panel.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/installed_integrations/components/resizable_panel.tsx @@ -11,6 +11,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiPortal, + EuiToolTip, useEuiPaddingCSS, useEuiTheme, } from '@elastic/eui'; @@ -178,38 +179,59 @@ export const ResizablePanel: React.FunctionComponent<{ {isCollapsed ? ( - + + + ) : ( - + + + )} - + disableScreenReaderOutput + > + + diff --git a/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.test.tsx b/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.test.tsx index 3ef1dcf3086a0..37bb8cae5e75f 100644 --- a/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.test.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.test.tsx @@ -149,7 +149,7 @@ describe('AgentPolicySummaryLine', () => { test('it should render a tooltip with the policy ID when showPolicyId is true', () => { const results = renderWithPolicyId(true); - expect(results.getByTitle('My Policy').closest('[data-popover-open]')).toBeDefined(); + expect(results.getByText('My Policy').closest('[data-popover-open]')).toBeDefined(); const tooltipAnchor = results.container.querySelector( '[data-test-subj="agentPolicyNameLink"]' ); diff --git a/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.tsx b/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.tsx index 4b2a070dcf8ae..73d276c97f98f 100644 --- a/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/components/agent_policy_summary_line.tsx @@ -171,7 +171,6 @@ export const AgentPolicySummaryLine = memo<{ {policyDisplayName} @@ -240,9 +239,11 @@ export const AgentPolicySummaryLine = memo<{ {withDescription && description && ( - - {description} - + + + {description} + + )}
diff --git a/x-pack/platform/plugins/shared/fleet/public/components/context_menu_actions.tsx b/x-pack/platform/plugins/shared/fleet/public/components/context_menu_actions.tsx index 56b36a4b2e3e0..8ac855dad385d 100644 --- a/x-pack/platform/plugins/shared/fleet/public/components/context_menu_actions.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/components/context_menu_actions.tsx @@ -60,18 +60,28 @@ export const ContextMenuActions = React.memo( {button.children} ) : ( - + disableScreenReaderOutput + > + + ); return ( diff --git a/x-pack/platform/plugins/shared/fleet/public/components/otel_ui/collector_config_view/component_detail/component_detail.tsx b/x-pack/platform/plugins/shared/fleet/public/components/otel_ui/collector_config_view/component_detail/component_detail.tsx index 8eb187f193567..00a13484f1106 100644 --- a/x-pack/platform/plugins/shared/fleet/public/components/otel_ui/collector_config_view/component_detail/component_detail.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/components/otel_ui/collector_config_view/component_detail/component_detail.tsx @@ -16,6 +16,7 @@ import { EuiTab, EuiTabs, EuiTitle, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -150,17 +151,24 @@ export const OTelComponentDetail: React.FunctionComponent {componentHealth && healhtLabel} - + + +