github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

[ObsUX][Profiling, Infra] Add NEW badge to the Profiling tab (#174242)

Browse source 
Closes #173156 

## Summary

This PR adds a `NEW` badge to the profiling tab and changes the
profiling prompt badge color to pink

## Testing
The badges can be checked on the node details page and inside the host
details flyout:

![image](30f4ca24-b460-4fe9-8c2c-372e435a1c64)

![image](423232b2-fc2e-4718-a089-180157db22da)
This commit is contained in:
jennypavlova 2024-01-04 17:09:09 +01:00 • committed by GitHub
parent 0a90b66ed3
commit 1182ce678c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

3
x-pack/plugins/infra/public/common/asset_details_config/asset_details_tabs.tsx
View file

@ -6,7 +6,9 @@
*/
import { i18n } from '@kbn/i18n';
import React from 'react';
import { ContentTabIds, type Tab } from '../../components/asset_details/types';
import { NewBadge } from '../../components/new_badge';
export const commonFlyoutTabs: Tab[] = [
{
@ -32,6 +34,7 @@ export const commonFlyoutTabs: Tab[] = [
name: i18n.translate('xpack.infra.metrics.nodeDetails.tabs.profiling', {
defaultMessage: 'Universal Profiling',
}),
append: <NewBadge />,
},
{
id: ContentTabIds.LOGS,

8
x-pack/plugins/infra/public/components/asset_details/tabs/overview/kpis/cpu_profiling_prompt.tsx
View file

@ -8,8 +8,8 @@
import React from 'react';
import { i18n } from '@kbn/i18n';
import { EuiButtonEmpty } from '@elastic/eui';
import { EuiBadge } from '@elastic/eui';
import { EuiFlexGroup } from '@elastic/eui';
import { NewBadge } from '../../../../new_badge';
import { useProfilingIntegrationSetting } from '../../../../../hooks/use_profiling_integration_setting';
import { useTabSwitcherContext } from '../../../hooks/use_tab_switcher';
@ -28,11 +28,7 @@ export function CpuProfilingPrompt() {
gutterSize="s"
data-test-subj="infraAssetDetailsCPUProfilingPrompt"
>
<EuiBadge color="success">
{i18n.translate('xpack.infra.cpuProfilingPrompt.newBadgeLabel', {
defaultMessage: 'NEW',
})}
</EuiBadge>
<NewBadge />
<EuiFlexGroup alignItems="baseline" justifyContent="flexStart" gutterSize="xs">
{i18n.translate('xpack.infra.cpuProfilingPrompt.promptText', {
defaultMessage: 'View CPU Breakdown using',

1
x-pack/plugins/infra/public/components/asset_details/types.ts
View file

@ -60,6 +60,7 @@ export type RenderMode = FlyoutProps | FullPageProps;
export interface Tab {
id: ContentTabIds;
name: string;
append?: JSX.Element;
}
export type LinkOptions = 'alertRule' | 'nodeDetails' | 'apmServices';

18
x-pack/plugins/infra/public/components/new_badge.tsx Normal file
View file

@ -0,0 +1,18 @@
/*
* 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 { EuiBadge } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
export const NewBadge = () => (
<EuiBadge color="accent">
{i18n.translate('xpack.infra.newBadgeLabel', {
defaultMessage: 'NEW',
})}
</EuiBadge>
);