forked from elastic/kibana
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Infra][Hosts] Display N/A badge for APM hosts without system metrics (…
…elastic#191181) ## Summary Closes elastic#190516 This PR introduces an "N/A" badge for hosts that are returned by the `metrics/infra/host` API with `hasSystemMetrics` set to `false`. This enhancement will help users quickly identify and address issues with APM hosts that are not monitored by the system integration. The badge will provide an explanation of the problem and suggest troubleshooting steps.  **Automated tests** Upon reviewing the code, I noticed that this screen is covered by functional tests. My initial idea was to add some functional tests to verify the badge display as well as the button and link redirections. However, I found that this is quite complex, as it involves modifying the data used in the tests, and I’m still not very familiar with that process. Given the deadline for this epic, I’ve decided not to include tests in this issue. If we believe they are really necessary, I would need to spend some time understanding how data is managed in our functional testing layer. Any feedback on this would be greatly appreciated.
- Loading branch information
Showing
3 changed files
with
158 additions
and
15 deletions.
There are no files selected for viewing
111 changes: 111 additions & 0 deletions
111
...on/infra/public/pages/metrics/hosts/components/table/add_data_troubleshooting_popover.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,111 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import { | ||
| EuiBadge, | ||
| EuiButton, | ||
| EuiFlexGroup, | ||
| EuiFlexItem, | ||
| EuiLink, | ||
| EuiPopover, | ||
| EuiPopoverFooter, | ||
| EuiPopoverTitle, | ||
| EuiText, | ||
| } from '@elastic/eui'; | ||
|
|
||
| import { | ||
| ObservabilityOnboardingLocatorParams, | ||
| OBSERVABILITY_ONBOARDING_LOCATOR, | ||
| } from '@kbn/deeplinks-observability'; | ||
| import { i18n } from '@kbn/i18n'; | ||
| import { useBoolean } from '@kbn/react-hooks'; | ||
|
|
||
| import { useKibanaContextForPlugin } from '../../../../../hooks/use_kibana'; | ||
| import { APM_HOST_TROUBLESHOOTING_LINK } from '../../../../../components/asset_details/constants'; | ||
|
|
||
| const popoverContent = { | ||
| title: i18n.translate('xpack.infra.addDataPopover.wantToSeeMorePopoverTitleLabel', { | ||
| defaultMessage: 'Want to see more?', | ||
| }), | ||
| content: i18n.translate('xpack.infra.addDataPopover.understandHostPerformanceByTextLabel', { | ||
| defaultMessage: 'Understand host performance by collecting more metrics.', | ||
| }), | ||
| button: i18n.translate('xpack.infra.addDataPopover.understandHostPerformanceByTextLabel', { | ||
| defaultMessage: 'Add data', | ||
| }), | ||
| link: i18n.translate('xpack.infra.addDataPopover.troubleshootingLinkLabel', { | ||
| defaultMessage: 'Troubleshooting', | ||
| }), | ||
| }; | ||
|
|
||
| const badgeContent = i18n.translate('xpack.infra.addDataPopover.naBadgeLabel', { | ||
| defaultMessage: 'N/A', | ||
| }); | ||
|
|
||
| export const AddDataTroubleshootingPopover = () => { | ||
| const [isPopoverOpen, { off: closePopover, toggle: togglePopover }] = useBoolean(false); | ||
|
|
||
| const { | ||
| services: { share }, | ||
| } = useKibanaContextForPlugin(); | ||
| const addDataLinkHref = share.url.locators | ||
| .get<ObservabilityOnboardingLocatorParams>(OBSERVABILITY_ONBOARDING_LOCATOR) | ||
| ?.getRedirectUrl({ category: 'logs' }); | ||
|
|
||
| const onButtonClick = () => togglePopover(); | ||
|
|
||
| return ( | ||
| <EuiPopover | ||
| button={ | ||
| <EuiBadge | ||
| color="hollow" | ||
| iconType="iInCircle" | ||
| iconSide="left" | ||
| onClick={onButtonClick} | ||
| onClickAriaLabel={popoverContent.title} | ||
| iconOnClick={onButtonClick} | ||
| iconOnClickAriaLabel={popoverContent.title} | ||
| > | ||
| {badgeContent} | ||
| </EuiBadge> | ||
| } | ||
| isOpen={isPopoverOpen} | ||
| closePopover={closePopover} | ||
| > | ||
| <EuiPopoverTitle>{popoverContent.title}</EuiPopoverTitle> | ||
| <EuiText size="s" style={{ width: 300 }}> | ||
| {popoverContent.content} | ||
| </EuiText> | ||
| <EuiPopoverFooter> | ||
| <EuiFlexGroup alignItems="center" justifyContent="spaceBetween"> | ||
| <EuiFlexItem grow={false}> | ||
| <EuiButton | ||
| size="s" | ||
| href={addDataLinkHref} | ||
| data-test-subj="infraHostsTableWithoutSystemMetricsPopoverAddMoreButton" | ||
| > | ||
| {popoverContent.button} | ||
| </EuiButton> | ||
| </EuiFlexItem> | ||
| <EuiFlexItem grow={false}> | ||
| <EuiText size="s"> | ||
| <EuiLink | ||
| href={APM_HOST_TROUBLESHOOTING_LINK} | ||
| target="_blank" | ||
| data-test-subj="infraHostsTableWithoutSystemMetricsPopoverTroubleshootingLink" | ||
| external | ||
| > | ||
| {popoverContent.link} | ||
| </EuiLink> | ||
| </EuiText> | ||
| </EuiFlexItem> | ||
| </EuiFlexGroup> | ||
| </EuiPopoverFooter> | ||
| </EuiPopover> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters