[SECURITY] Add endpoint alerts url (#69707)

* Add back endpoint alerts url

* hack to move on

* fix type

* fix test

x-pack/plugins/security_solution/common/constants.ts

@@ -42,6 +42,9 @@ export const APP_TIMELINES_PATH = `${APP_PATH}/timelines`;
 export const APP_CASES_PATH = `${APP_PATH}/cases`;
 export const APP_MANAGEMENT_PATH = `${APP_PATH}/management`;
 
+export const SHOW_ENDPOINT_ALERTS_NAV = true;
+export const APP_ENDPOINT_ALERTS_PATH = `${APP_PATH}/endpoint-alerts`;
+
 /** The comma-delimited list of Elasticsearch indices from which the SIEM app collects events */
 export const DEFAULT_INDEX_PATTERN = [
   'apm-*-transaction*',

x-pack/plugins/security_solution/public/app/home/home_navigations.tsx

@@ -15,6 +15,7 @@ import {
   APP_TIMELINES_PATH,
   APP_CASES_PATH,
   APP_MANAGEMENT_PATH,
+  APP_ENDPOINT_ALERTS_PATH,
 } from '../../../common/constants';
 
 export const navTabs: SiemNavTab = {
@@ -68,4 +69,11 @@ export const navTabs: SiemNavTab = {
     disabled: false,
     urlKey: SecurityPageName.management,
   },
+  [SecurityPageName.endpointAlerts]: {
+    id: SecurityPageName.endpointAlerts,
+    name: 'Endpoint Alerts', // No Need of i18n since, it is just temporary
+    href: APP_ENDPOINT_ALERTS_PATH,
+    disabled: false,
+    urlKey: SecurityPageName.management, // Just to make type happy, this should go away soon
+  },
 };

x-pack/plugins/security_solution/public/app/types.ts

@@ -27,6 +27,7 @@ export enum SecurityPageName {
   timelines = 'timelines',
   case = 'case',
   management = 'management',
+  endpointAlerts = 'endpointAlerts',
 }
 export interface SecuritySubPluginStore<K extends SecuritySubPluginKeyStore, T> {
   initialState: Record<K, T | undefined>;

x-pack/plugins/security_solution/public/common/components/navigation/index.test.tsx

@@ -140,6 +140,13 @@ describe('SIEM Navigation', () => {
             name: 'Timelines',
             urlKey: 'timeline',
           },
+          endpointAlerts: {
+            disabled: false,
+            href: '/app/security/endpoint-alerts',
+            id: 'endpointAlerts',
+            name: 'Endpoint Alerts',
+            urlKey: 'management',
+          },
         },
         pageName: 'hosts',
         pathName: '/',
@@ -185,7 +192,7 @@ describe('SIEM Navigation', () => {
     wrapper.setProps({
       pageName: 'network',
       pathName: '/',
-      tabName: undefined,
+      tabName: 'authentications',
     });
     wrapper.update();
     expect(setBreadcrumbs).toHaveBeenNthCalledWith(
@@ -209,7 +216,13 @@ describe('SIEM Navigation', () => {
             name: 'Cases',
             urlKey: 'case',
           },
-
+          endpointAlerts: {
+            disabled: false,
+            href: '/app/security/endpoint-alerts',
+            id: 'endpointAlerts',
+            name: 'Endpoint Alerts',
+            urlKey: 'management',
+          },
           hosts: {
             disabled: false,
             href: '/app/security/hosts',
@@ -252,7 +265,7 @@ describe('SIEM Navigation', () => {
         savedQuery: undefined,
         search: '',
         state: undefined,
-        tabName: undefined,
+        tabName: 'authentications',
         timeline: { id: '', isOpen: false },
         timerange: {
           global: {

x-pack/plugins/security_solution/public/common/components/navigation/types.ts

@@ -48,7 +48,8 @@ export type SiemNavTabKey =
   | SecurityPageName.alerts
   | SecurityPageName.timelines
   | SecurityPageName.case
-  | SecurityPageName.management;
+  | SecurityPageName.management
+  | SecurityPageName.endpointAlerts;
 
 export type SiemNavTab = Record<SiemNavTabKey, NavTab>;
 

x-pack/plugins/security_solution/public/endpoint_alerts/routes.tsx

@@ -11,7 +11,7 @@ import { AlertIndex } from './view';
 
 export const EndpointAlertsRoutes: React.FC = () => (
   <Switch>
-    <Route path="/:pageName(endpoint-alerts)">
+    <Route path="/">
       <AlertIndex />
     </Route>
   </Switch>

x-pack/plugins/security_solution/public/endpoint_alerts/store/selectors.ts

@@ -44,7 +44,10 @@ export const alertListPagination = createStructuredSelector({
  * Returns a boolean based on whether or not the user is on the alerts page
  */
 export const isOnAlertPage = (state: Immutable<AlertListState>): boolean => {
-  return state.location ? state.location.pathname === '/endpoint-alerts' : false;
+  return state.location
+    ? state.location.pathname === '/endpoint-alerts' ||
+        window.location.pathname.includes('/endpoint-alerts')
+    : false;
 };
 
 /**

x-pack/plugins/security_solution/public/plugin.tsx

@@ -33,6 +33,8 @@ import {
   APP_TIMELINES_PATH,
   APP_MANAGEMENT_PATH,
   APP_CASES_PATH,
+  SHOW_ENDPOINT_ALERTS_NAV,
+  APP_ENDPOINT_ALERTS_PATH,
 } from '../common/constants';
 import { ConfigureEndpointDatasource } from './management/pages/policy/view/ingest_manager_integration/configure_datasource';
 
@@ -290,6 +292,35 @@ export class Plugin implements IPlugin<PluginSetup, PluginStart, SetupPlugins, S
       },
     });
 
+    if (SHOW_ENDPOINT_ALERTS_NAV) {
+      core.application.register({
+        id: `${APP_ID}:${SecurityPageName.endpointAlerts}`,
+        title: 'Endpoint Alerts',
+        order: 9002,
+        euiIconType: APP_ICON,
+        category: DEFAULT_APP_CATEGORIES.security,
+        appRoute: APP_ENDPOINT_ALERTS_PATH,
+        mount: async (params: AppMountParameters) => {
+          const [
+            { coreStart, startPlugins, store, services },
+            { renderApp, composeLibs },
+            { endpointAlertsSubPlugin },
+          ] = await Promise.all([
+            mountSecurityFactory(),
+            this.downloadAssets(),
+            this.downloadSubPlugins(),
+          ]);
+          return renderApp({
+            ...composeLibs(coreStart),
+            ...params,
+            services,
+            store,
+            SubPluginRoutes: endpointAlertsSubPlugin.start(coreStart, startPlugins).SubPluginRoutes,
+          });
+        },
+      });
+    }
+
     core.application.register({
       id: 'siem',
       appRoute: 'app/siem',