diff --git a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.test.tsx b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.test.tsx
index d90709f69ee03..45eebab8c093f 100644
--- a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.test.tsx
@@ -126,4 +126,22 @@ describe('Table Navigation', () => {
`/app/securitySolutionUI/hosts/siem-window/authentications${SEARCH_QUERY}`
);
});
+
+ test('it renders a EuiBetaBadge only on the sessions tab', () => {
+ Object.keys(HostsTableType).forEach((tableType) => {
+ if (tableType !== HostsTableType.sessions) {
+ const wrapper = mount();
+
+ const betaBadge = wrapper.find(
+ `EuiTab[data-test-subj="navigation-${tableType}"] EuiBetaBadge`
+ );
+
+ if (tableType === HostsTableType.sessions) {
+ expect(betaBadge).toBeTruthy();
+ } else {
+ expect(betaBadge).toEqual({});
+ }
+ }
+ });
+ });
});
diff --git a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.tsx b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.tsx
index 4d9a8a704dde5..03437bab93f38 100644
--- a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/index.tsx
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { EuiTab, EuiTabs } from '@elastic/eui';
+import { EuiTab, EuiTabs, EuiBetaBadge } from '@elastic/eui';
import { getOr } from 'lodash/fp';
import React, { useEffect, useState, useCallback, useMemo } from 'react';
import { useLocation } from 'react-router-dom';
@@ -14,6 +14,7 @@ import deepEqual from 'fast-deep-equal';
import { useNavigation } from '../../../lib/kibana';
import { track, METRIC_TYPE, TELEMETRY_EVENT } from '../../../lib/telemetry';
import { TabNavigationProps, TabNavigationItemProps } from './types';
+import { BETA } from '../../../translations';
const TabNavigationItemComponent = ({
disabled,
@@ -21,6 +22,7 @@ const TabNavigationItemComponent = ({
id,
name,
isSelected,
+ isBeta,
}: TabNavigationItemProps) => {
const { getAppUrl, navigateTo } = useNavigation();
@@ -45,6 +47,7 @@ const TabNavigationItemComponent = ({
isSelected={isSelected}
href={appHref}
onClick={handleClick}
+ append={isBeta && }
>
{name}
@@ -92,6 +95,7 @@ export const TabNavigationComponent: React.FC = ({
name={tab.name}
disabled={tab.disabled}
isSelected={isSelected}
+ isBeta={tab.isBeta}
/>
);
}),
diff --git a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/types.ts b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/types.ts
index 75f18abf75559..5630978bae87a 100644
--- a/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/types.ts
+++ b/x-pack/plugins/security_solution/public/common/components/navigation/tab_navigation/types.ts
@@ -32,4 +32,5 @@ export interface TabNavigationItemProps {
disabled: boolean;
name: string;
isSelected: boolean;
+ isBeta?: boolean;
}
diff --git a/x-pack/plugins/security_solution/public/common/components/navigation/types.ts b/x-pack/plugins/security_solution/public/common/components/navigation/types.ts
index b1903ef869d3d..1cb8a918ea481 100644
--- a/x-pack/plugins/security_solution/public/common/components/navigation/types.ts
+++ b/x-pack/plugins/security_solution/public/common/components/navigation/types.ts
@@ -38,6 +38,7 @@ export interface NavTab {
disabled: boolean;
urlKey?: UrlStateType;
pageId?: SecurityPageName;
+ isBeta?: boolean;
}
export type SecurityNavKey =
diff --git a/x-pack/plugins/security_solution/public/common/translations.ts b/x-pack/plugins/security_solution/public/common/translations.ts
index 2058eaf03b5e1..64d31e7f6530d 100644
--- a/x-pack/plugins/security_solution/public/common/translations.ts
+++ b/x-pack/plugins/security_solution/public/common/translations.ts
@@ -63,6 +63,10 @@ export const EMPTY_ACTION_ENDPOINT_DESCRIPTION = i18n.translate(
}
);
+export const BETA = i18n.translate('xpack.securitySolution.pages.common.beta', {
+ defaultMessage: 'Beta',
+});
+
export const UPDATE_ALERT_STATUS_FAILED = (conflicts: number) =>
i18n.translate('xpack.securitySolution.pages.common.updateAlertStatusFailed', {
values: { conflicts },
diff --git a/x-pack/plugins/security_solution/public/hosts/pages/nav_tabs.tsx b/x-pack/plugins/security_solution/public/hosts/pages/nav_tabs.tsx
index 59fb0d08f7dc7..ea46180f8df80 100644
--- a/x-pack/plugins/security_solution/public/hosts/pages/nav_tabs.tsx
+++ b/x-pack/plugins/security_solution/public/hosts/pages/nav_tabs.tsx
@@ -71,6 +71,7 @@ export const navTabsHosts = ({
name: i18n.NAVIGATION_SESSIONS_TITLE,
href: getTabsOnHostsUrl(HostsTableType.sessions),
disabled: false,
+ isBeta: true,
},
};
diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs_content/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs_content/index.tsx
index 2f5262c7c598f..b8b9d73932afd 100644
--- a/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs_content/index.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs_content/index.tsx
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { EuiBadge, EuiLoadingContent, EuiTabs, EuiTab } from '@elastic/eui';
+import { EuiBadge, EuiBetaBadge, EuiLoadingContent, EuiTabs, EuiTab } from '@elastic/eui';
import { isEmpty } from 'lodash/fp';
import React, { lazy, memo, Suspense, useCallback, useEffect, useMemo } from 'react';
import { useDispatch } from 'react-redux';
@@ -37,6 +37,7 @@ import {
getEventIdToNoteIdsSelector,
} from './selectors';
import * as i18n from './translations';
+import { BETA } from '../../../../common/translations';
const HideShowContainer = styled.div.attrs<{ $isVisible: boolean; isOverflowYScroll: boolean }>(
({ $isVisible = false, isOverflowYScroll = false }) => ({
@@ -357,6 +358,7 @@ const TabsContentComponent: React.FC = ({
isSelected={activeTab === TimelineTabs.session}
disabled={sessionViewConfig === null}
key={TimelineTabs.session}
+ append={}
>
{i18n.SESSION_TAB}