({ field: 'ran', direction: 'desc' });
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+ {'Showing: 39 activites'}
+
+
+
+ {'Selected: 2 activities'}
+
+ {'Stop selected'}
+
+
+
+ {'Clear 7 filters'}
+
+
+
+
+ {
+ setPageState(page);
+ setSortState(sort);
+ }}
+ pagination={{
+ pageIndex: pageState.index,
+ pageSize: pageState.size,
+ totalItemCount: itemsTotalState,
+ pageSizeOptions: [5, 10, 20],
+ }}
+ selection={{
+ selectable: (item: ColumnTypes) => item.status !== 'Completed',
+ selectableMessage: (selectable: boolean) =>
+ selectable ? undefined : 'Completed runs cannot be acted upon',
+ onSelectionChange: (selectedItems: ColumnTypes[]) => {
+ // setSelectedState(selectedItems);
+ },
+ }}
+ sorting={{
+ sort: sortState,
+ }}
+ />
+
+
+ );
+});
+ActivityMonitor.displayName = 'ActivityMonitor';
+
+export const RuleDetailsComponent = React.memo(() => {
+ const [popoverState, setPopoverState] = useState(false);
+
+ return (
+ <>
+
+ {({ indicesExist, indexPattern }) => {
+ return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
+
+
+
+
+
+
+
+ {'Status: Running'}
+ ,
+ ]}
+ title="Automated exfiltration"
+ >
+
+
+ {}} />
+
+
+
+
+
+
+ {'Edit rule settings'}
+
+
+
+
+ setPopoverState(!popoverState)}
+ />
+ }
+ closePopover={() => setPopoverState(false)}
+ isOpen={popoverState}
+ >
+ {'Overflow context menu here.'}
+
+
+
+
+
+
+
+
+ {'Full fail message here.'}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* {'Description'}
*/}
+
+ {/*
+
+ {'Description'}
+
+
+
+ {'Severity'}
+
+
+
+ {'Risk score boost'}
+
+
+
+ {'References'}
+
+
+
+ {'False positives'}
+
+
+
+ {'Mitre ATT&CK types'}
+
+
+
+ {'Tags'}
+
+ */}
+
+
+
+
+
+
+
+
+
+
+
+
+ ,
+ },
+ {
+ id: 'tabActivityMonitor',
+ name: 'Activity monitor',
+ content: ,
+ },
+ ]}
+ />
+
+
+ ) : (
+
+
+
+
+
+ );
+ }}
+
+
+
+
+ );
+});
+RuleDetailsComponent.displayName = 'RuleDetailsComponent';
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/rule_details/translations.ts b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rule_details/translations.ts
new file mode 100644
index 0000000000000..3dd5945ff597c
--- /dev/null
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rule_details/translations.ts
@@ -0,0 +1,11 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+export const PAGE_TITLE = i18n.translate('xpack.siem.detectionEngine.ruleDetails.pageTitle', {
+ defaultMessage: 'Rule details',
+});
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/index.tsx b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/index.tsx
new file mode 100644
index 0000000000000..41a6cf54ff5ab
--- /dev/null
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/index.tsx
@@ -0,0 +1,1076 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import euiLightVars from '@elastic/eui/dist/eui_theme_light.json';
+import {
+ EuiBadge,
+ EuiBasicTable,
+ EuiButton,
+ EuiFieldSearch,
+ EuiFlexGroup,
+ EuiFlexItem,
+ EuiHealth,
+ EuiIconTip,
+ EuiLink,
+ EuiPanel,
+ EuiSpacer,
+ EuiSwitch,
+ EuiTabbedContent,
+ EuiTextColor,
+} from '@elastic/eui';
+import moment from 'moment';
+import React, { useState } from 'react';
+
+import { getEmptyTagValue } from '../../../components/empty_value';
+import { HeaderPage } from '../../../components/header_page';
+import { HeaderSection } from '../../../components/header_section';
+import {
+ UtilityBar,
+ UtilityBarAction,
+ UtilityBarGroup,
+ UtilityBarSection,
+ UtilityBarText,
+} from '../../../components/detection_engine/utility_bar';
+import { WrapperPage } from '../../../components/wrapper_page';
+import { SpyRoute } from '../../../utils/route/spy_routes';
+import * as i18n from './translations';
+
+// Michael: Will need to change this to get the current datetime format from Kibana settings.
+const dateTimeFormat = (value: string) => {
+ return moment(value).format('M/D/YYYY, h:mm A');
+};
+
+const AllRules = React.memo(() => {
+ interface RuleTypes {
+ href: string;
+ name: string;
+ status: string;
+ }
+
+ interface LastResponseTypes {
+ type: string;
+ message?: string;
+ }
+
+ interface ColumnTypes {
+ id: number;
+ rule: RuleTypes;
+ method: string;
+ severity: string;
+ lastCompletedRun: string;
+ lastResponse: LastResponseTypes;
+ tags: string | string[];
+ activate: boolean;
+ }
+
+ interface PageTypes {
+ index: number;
+ size: number;
+ }
+
+ interface SortTypes {
+ field: string;
+ direction: string;
+ }
+
+ const actions = [
+ {
+ description: 'Edit rule settings',
+ icon: 'visControls',
+ name: 'Edit rule settings',
+ onClick: () => {},
+ },
+ {
+ description: 'Run rule manually…',
+ icon: 'play',
+ name: 'Run rule manually…',
+ onClick: () => {},
+ },
+ {
+ description: 'Duplicate rule…',
+ icon: 'copy',
+ name: 'Duplicate rule…',
+ onClick: () => {},
+ },
+ {
+ description: 'Export rule',
+ icon: 'exportAction',
+ name: 'Export rule',
+ onClick: () => {},
+ },
+ {
+ description: 'Delete rule…',
+ icon: 'trash',
+ name: 'Delete rule…',
+ onClick: () => {},
+ },
+ ];
+
+ // Michael: Are we able to do custom, in-table-header filters, as shown in my wireframes?
+ const columns = [
+ {
+ field: 'rule',
+ name: 'Rule',
+ render: (value: ColumnTypes['rule']) => (
+
+ {value.name}{' '}
+ {value.status}
+
+ ),
+ sortable: true,
+ truncateText: true,
+ width: '24%',
+ },
+ {
+ field: 'method',
+ name: 'Method',
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'severity',
+ name: 'Severity',
+ render: (value: ColumnTypes['severity']) => (
+
+ {value}
+
+ ),
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'lastCompletedRun',
+ name: 'Last completed run',
+ render: (value: ColumnTypes['lastCompletedRun']) => {
+ return value === undefined ? (
+ getEmptyTagValue()
+ ) : (
+
+ );
+ },
+ sortable: true,
+ truncateText: true,
+ width: '16%',
+ },
+ {
+ field: 'lastResponse',
+ name: 'Last response',
+ render: (value: ColumnTypes['lastResponse']) => {
+ return value === undefined ? (
+ getEmptyTagValue()
+ ) : (
+ <>
+ {value.type === 'Fail' ? (
+
+ {value.type}
+
+ ) : (
+ {value.type}
+ )}
+
+ );
+ },
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'tags',
+ name: 'Tags',
+ render: (value: ColumnTypes['tags']) => (
+
+ {typeof value !== 'string' ? (
+ <>
+ {value.map((tag, i) => (
+
+ {tag}
+
+ ))}
+
+ ) : (
+ {value}
+ )}
+
+ ),
+ sortable: true,
+ truncateText: true,
+ width: '20%',
+ },
+ {
+ align: 'center',
+ field: 'activate',
+ name: 'Activate',
+ render: (value: ColumnTypes['activate']) => (
+ // Michael: Uncomment props below when EUI 14.9.0 is added to Kibana.
+ {}} showLabel={false} />
+ ),
+ sortable: true,
+ width: '65px',
+ },
+ {
+ actions,
+ width: '40px',
+ },
+ ];
+
+ const sampleTableData = [
+ {
+ id: 1,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Low',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: ['attack.t1234', 'attack.t4321'],
+ activate: true,
+ },
+ {
+ id: 2,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Medium',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Fail',
+ message: 'Full fail message here.',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 3,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'High',
+ tags: 'attack.t1234',
+ activate: false,
+ },
+ {
+ id: 4,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 5,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 6,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 7,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 8,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 9,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 10,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 11,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 12,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 13,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 14,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 15,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 16,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 17,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 18,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 19,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 20,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ {
+ id: 21,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ status: 'Experimental',
+ },
+ method: 'Custom query',
+ severity: 'Critical',
+ lastCompletedRun: '2019-12-28 00:00:00.000-05:00',
+ lastResponse: {
+ type: 'Success',
+ },
+ tags: 'attack.t1234',
+ activate: true,
+ },
+ ];
+
+ const [itemsTotalState] = useState(sampleTableData.length);
+ const [pageState, setPageState] = useState({ index: 0, size: 20 });
+ // const [selectedState, setSelectedState] = useState([]);
+ const [sortState, setSortState] = useState({ field: 'rule', direction: 'asc' });
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+
+
+ {'Showing: 39 rules'}
+
+
+
+ {'Selected: 2 rules'}
+
+ {'Batch actions context menu here.'}}
+ >
+ {'Batch actions'}
+
+
+
+
+ {'Clear 7 filters'}
+
+
+
+
+ {
+ setPageState(page);
+ setSortState(sort);
+ }}
+ pagination={{
+ pageIndex: pageState.index,
+ pageSize: pageState.size,
+ totalItemCount: itemsTotalState,
+ pageSizeOptions: [5, 10, 20],
+ }}
+ selection={{
+ selectable: () => true,
+ onSelectionChange: (selectedItems: ColumnTypes[]) => {
+ // setSelectedState(selectedItems);
+ },
+ }}
+ sorting={{
+ sort: sortState,
+ }}
+ />
+
+
+ );
+});
+AllRules.displayName = 'AllRules';
+
+const ActivityMonitor = React.memo(() => {
+ interface RuleTypes {
+ href: string;
+ name: string;
+ }
+
+ interface ColumnTypes {
+ id: number;
+ rule: RuleTypes;
+ ran: string;
+ lookedBackTo: string;
+ status: string;
+ response: string | undefined;
+ }
+
+ interface PageTypes {
+ index: number;
+ size: number;
+ }
+
+ interface SortTypes {
+ field: string;
+ direction: string;
+ }
+
+ const actions = [
+ {
+ available: (item: ColumnTypes) => item.status === 'Running',
+ description: 'Stop',
+ icon: 'stop',
+ isPrimary: true,
+ name: 'Stop',
+ onClick: () => {},
+ type: 'icon',
+ },
+ {
+ available: (item: ColumnTypes) => item.status === 'Stopped',
+ description: 'Resume',
+ icon: 'play',
+ isPrimary: true,
+ name: 'Resume',
+ onClick: () => {},
+ type: 'icon',
+ },
+ ];
+
+ // Michael: Are we able to do custom, in-table-header filters, as shown in my wireframes?
+ const columns = [
+ {
+ field: 'rule',
+ name: 'Rule',
+ render: (value: ColumnTypes['rule']) => {value.name},
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'ran',
+ name: 'Ran',
+ render: (value: ColumnTypes['ran']) => ,
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'lookedBackTo',
+ name: 'Looked back to',
+ render: (value: ColumnTypes['lookedBackTo']) => (
+
+ ),
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'status',
+ name: 'Status',
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ field: 'response',
+ name: 'Response',
+ render: (value: ColumnTypes['response']) => {
+ return value === undefined ? (
+ getEmptyTagValue()
+ ) : (
+ <>
+ {value === 'Fail' ? (
+
+ {value}
+
+ ) : (
+ {value}
+ )}
+
+ );
+ },
+ sortable: true,
+ truncateText: true,
+ },
+ {
+ actions,
+ width: '40px',
+ },
+ ];
+
+ const sampleTableData = [
+ {
+ id: 1,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Running',
+ },
+ {
+ id: 2,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Stopped',
+ },
+ {
+ id: 3,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Fail',
+ },
+ {
+ id: 4,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 5,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 6,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 7,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 8,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 9,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 10,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 11,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 12,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 13,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 14,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 15,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 16,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 17,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 18,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 19,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 20,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ {
+ id: 21,
+ rule: {
+ href: '#/detection-engine/rules/rule-details',
+ name: 'Automated exfiltration',
+ },
+ ran: '2019-12-28 00:00:00.000-05:00',
+ lookedBackTo: '2019-12-28 00:00:00.000-05:00',
+ status: 'Completed',
+ response: 'Success',
+ },
+ ];
+
+ const [itemsTotalState] = useState(sampleTableData.length);
+ const [pageState, setPageState] = useState({ index: 0, size: 20 });
+ // const [selectedState, setSelectedState] = useState([]);
+ const [sortState, setSortState] = useState({ field: 'ran', direction: 'desc' });
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+ {'Showing: 39 activites'}
+
+
+
+ {'Selected: 2 activities'}
+
+ {'Stop selected'}
+
+
+
+ {'Clear 7 filters'}
+
+
+
+
+ {
+ setPageState(page);
+ setSortState(sort);
+ }}
+ pagination={{
+ pageIndex: pageState.index,
+ pageSize: pageState.size,
+ totalItemCount: itemsTotalState,
+ pageSizeOptions: [5, 10, 20],
+ }}
+ selection={{
+ selectable: (item: ColumnTypes) => item.status !== 'Completed',
+ selectableMessage: (selectable: boolean) =>
+ selectable ? undefined : 'Completed runs cannot be acted upon',
+ onSelectionChange: (selectedItems: ColumnTypes[]) => {
+ // setSelectedState(selectedItems);
+ },
+ }}
+ sorting={{
+ sort: sortState,
+ }}
+ />
+
+
+ );
+});
+ActivityMonitor.displayName = 'ActivityMonitor';
+
+export const RulesComponent = React.memo(() => {
+ return (
+ <>
+
+
+
+
+
+ {'Import rule…'}
+
+
+
+
+
+ {'Add new rule'}
+
+
+
+
+
+ ,
+ },
+ {
+ id: 'tabActivityMonitor',
+ name: 'Activity monitor',
+ content: ,
+ },
+ ]}
+ />
+
+
+
+
+ );
+});
+RulesComponent.displayName = 'RulesComponent';
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/translations.ts b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/translations.ts
new file mode 100644
index 0000000000000..2b20c726d4b3f
--- /dev/null
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/translations.ts
@@ -0,0 +1,11 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+export const PAGE_TITLE = i18n.translate('xpack.siem.detectionEngine.rules.pageTitle', {
+ defaultMessage: 'Rules',
+});
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/translations.ts b/x-pack/legacy/plugins/siem/public/pages/detection_engine/translations.ts
new file mode 100644
index 0000000000000..a7e7fa5133a64
--- /dev/null
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/translations.ts
@@ -0,0 +1,45 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+export const PAGE_TITLE = i18n.translate('xpack.siem.detectionEngine.pageTitle', {
+ defaultMessage: 'Detection engine',
+});
+
+export const PAGE_SUBTITLE = i18n.translate('xpack.siem.detectionEngine.pageSubtitle', {
+ defaultMessage: 'Last signal: X minutes ago',
+});
+
+export const BUTTON_MANAGE_RULES = i18n.translate('xpack.siem.detectionEngine.buttonManageRules', {
+ defaultMessage: 'Manage rules',
+});
+
+export const PANEL_SUBTITLE_SHOWING = i18n.translate(
+ 'xpack.siem.detectionEngine.panelSubtitleShowing',
+ {
+ defaultMessage: 'Showing',
+ }
+);
+
+export const EMPTY_TITLE = i18n.translate('xpack.siem.detectionEngine.emptyTitle', {
+ defaultMessage:
+ 'It looks like you don’t have any indices relevant to the detction engine in the SIEM application',
+});
+
+export const EMPTY_ACTION_PRIMARY = i18n.translate(
+ 'xpack.siem.detectionEngine.emptyActionPrimary',
+ {
+ defaultMessage: 'View setup instructions',
+ }
+);
+
+export const EMPTY_ACTION_SECONDARY = i18n.translate(
+ 'xpack.siem.detectionEngine.emptyActionSecondary',
+ {
+ defaultMessage: 'Go to documentation',
+ }
+);
diff --git a/x-pack/legacy/plugins/siem/public/pages/home/home_navigations.tsx b/x-pack/legacy/plugins/siem/public/pages/home/home_navigations.tsx
index 53bcac028b877..220f8a958aa43 100644
--- a/x-pack/legacy/plugins/siem/public/pages/home/home_navigations.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/home/home_navigations.tsx
@@ -3,14 +3,16 @@
* or more contributor license agreements. Licensed under the Elastic License;
* you may not use this file except in compliance with the Elastic License.
*/
-import * as i18n from './translations';
-import { SiemPageName, SiemNavTab } from './types';
+
import {
+ getDetectionEngineUrl,
getOverviewUrl,
getNetworkUrl,
getTimelinesUrl,
getHostsUrl,
} from '../../components/link_to';
+import * as i18n from './translations';
+import { SiemPageName, SiemNavTab } from './types';
export const navTabs: SiemNavTab = {
[SiemPageName.overview]: {
@@ -34,6 +36,13 @@ export const navTabs: SiemNavTab = {
disabled: false,
urlKey: 'network',
},
+ [SiemPageName.detectionEngine]: {
+ id: SiemPageName.detectionEngine,
+ name: i18n.DETECTION_ENGINE,
+ href: getDetectionEngineUrl(),
+ disabled: false,
+ urlKey: 'detection-engine',
+ },
[SiemPageName.timelines]: {
id: SiemPageName.timelines,
name: i18n.TIMELINES,
diff --git a/x-pack/legacy/plugins/siem/public/pages/home/index.tsx b/x-pack/legacy/plugins/siem/public/pages/home/index.tsx
index da53ac8fceac4..eb816876bdba8 100644
--- a/x-pack/legacy/plugins/siem/public/pages/home/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/home/index.tsx
@@ -4,35 +4,32 @@
* you may not use this file except in compliance with the Elastic License.
*/
-import { EuiButton, EuiFlexGroup, EuiFlexItem, EuiPage, EuiPageBody } from '@elastic/eui';
-import { FormattedMessage } from '@kbn/i18n/react';
import * as React from 'react';
import { Redirect, Route, Switch } from 'react-router-dom';
import { pure } from 'recompose';
import styled from 'styled-components';
-import { i18n } from '@kbn/i18n';
import { AutoSizer } from '../../components/auto_sizer';
import { DragDropContextWrapper } from '../../components/drag_and_drop/drag_drop_context_wrapper';
import { Flyout, flyoutHeaderHeight } from '../../components/flyout';
+import { HeaderGlobal } from '../../components/header_global';
import { HelpMenu } from '../../components/help_menu';
import { LinkToPage } from '../../components/link_to';
-import { SiemNavigation } from '../../components/navigation';
+import { MlHostConditionalContainer } from '../../components/ml/conditional_links/ml_host_conditional_container';
+import { MlNetworkConditionalContainer } from '../../components/ml/conditional_links/ml_network_conditional_container';
import { StatefulTimeline } from '../../components/timeline';
import { AutoSaveWarningMsg } from '../../components/timeline/auto_save_warning';
+import { UseUrlState } from '../../components/url_state';
+import { WithSource } from '../../containers/source';
+import { SpyRoute } from '../../utils/route/spy_routes';
import { NotFoundPage } from '../404';
+import { DetectionEngineContainer } from '../detection_engine';
import { HostsContainer } from '../hosts';
import { NetworkContainer } from '../network';
import { Overview } from '../overview';
import { Timelines } from '../timelines';
-import { WithSource } from '../../containers/source';
-import { MlPopover } from '../../components/ml_popover/ml_popover';
-import { MlHostConditionalContainer } from '../../components/ml/conditional_links/ml_host_conditional_container';
-import { MlNetworkConditionalContainer } from '../../components/ml/conditional_links/ml_network_conditional_container';
import { navTabs } from './home_navigations';
import { SiemPageName } from './types';
-import { UseUrlState } from '../../components/url_state';
-import { SpyRoute } from '../../utils/route/spy_routes';
/*
* This is import is important to keep because if we do not have it
@@ -44,30 +41,8 @@ import 'uiExports/embeddableFactories';
const WrappedByAutoSizer = styled.div`
height: 100%;
`;
-
WrappedByAutoSizer.displayName = 'WrappedByAutoSizer';
-const gutterTimeline = '70px'; // Temporary until timeline is moved - MichaelMarcialis
-
-const Page = styled(EuiPage)`
- ${({ theme }) => `
- padding: 0 ${gutterTimeline} ${theme.eui.euiSizeL} ${theme.eui.euiSizeL};
- `}
-`;
-
-Page.displayName = 'Page';
-
-const NavGlobal = styled.nav`
- ${({ theme }) => `
- background: ${theme.eui.euiColorEmptyShade};
- border-bottom: ${theme.eui.euiBorderThin};
- margin: 0 -${gutterTimeline} 0 -${theme.eui.euiSizeL};
- padding: ${theme.eui.euiSize} ${gutterTimeline} ${theme.eui.euiSize} ${theme.eui.euiSizeL};
- `}
-`;
-
-NavGlobal.displayName = 'NavGlobal';
-
const usersViewing = ['elastic']; // TODO: get the users viewing this timeline from Elasticsearch (persistance)
/** the global Kibana navigation at the top of every page */
@@ -85,8 +60,9 @@ export const HomePage = pure(() => (
{({ measureRef, windowMeasurement: { height: windowHeight = 0 } }) => (
-
-
+
+
+
{({ browserFields, indexPattern }) => (
@@ -111,90 +87,59 @@ export const HomePage = pure(() => (
/>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- }
- />
- (
-
- )}
- />
- (
-
- )}
- />
- }
- />
-
- (
-
- )}
- />
- (
-
- )}
- />
-
-
-
+
+
+ }
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ }
+ />
+
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+
+
)}
-
+
+
+
+
)}
));
-
HomePage.displayName = 'HomePage';
diff --git a/x-pack/legacy/plugins/siem/public/pages/home/translations.ts b/x-pack/legacy/plugins/siem/public/pages/home/translations.ts
index 30725828ac5eb..b87ea1c17a117 100644
--- a/x-pack/legacy/plugins/siem/public/pages/home/translations.ts
+++ b/x-pack/legacy/plugins/siem/public/pages/home/translations.ts
@@ -18,6 +18,10 @@ export const NETWORK = i18n.translate('xpack.siem.navigation.network', {
defaultMessage: 'Network',
});
+export const DETECTION_ENGINE = i18n.translate('xpack.siem.navigation.detectionEngine', {
+ defaultMessage: 'Detection engine',
+});
+
export const TIMELINES = i18n.translate('xpack.siem.navigation.timelines', {
defaultMessage: 'Timelines',
});
diff --git a/x-pack/legacy/plugins/siem/public/pages/home/types.ts b/x-pack/legacy/plugins/siem/public/pages/home/types.ts
index 4adf4485d8e29..101c6a69b08d1 100644
--- a/x-pack/legacy/plugins/siem/public/pages/home/types.ts
+++ b/x-pack/legacy/plugins/siem/public/pages/home/types.ts
@@ -10,6 +10,7 @@ export enum SiemPageName {
overview = 'overview',
hosts = 'hosts',
network = 'network',
+ detectionEngine = 'detection-engine',
timelines = 'timelines',
}
@@ -17,6 +18,7 @@ export type SiemNavTabKey =
| SiemPageName.overview
| SiemPageName.hosts
| SiemPageName.network
+ | SiemPageName.detectionEngine
| SiemPageName.timelines;
export type SiemNavTab = Record;
diff --git a/x-pack/legacy/plugins/siem/public/pages/hosts/details/index.tsx b/x-pack/legacy/plugins/siem/public/pages/hosts/details/index.tsx
index 738c0771ffc32..d30665c5a2142 100644
--- a/x-pack/legacy/plugins/siem/public/pages/hosts/details/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/hosts/details/index.tsx
@@ -6,39 +6,40 @@
import { EuiHorizontalRule, EuiSpacer } from '@elastic/eui';
import React, { useContext, useEffect } from 'react';
-import { compose } from 'redux';
import { connect } from 'react-redux';
import { StickyContainer } from 'react-sticky';
+import { compose } from 'redux';
-import { inputsSelectors, State } from '../../../store';
import { FiltersGlobal } from '../../../components/filters_global';
import { HeaderPage } from '../../../components/header_page';
-import { KpiHostDetailsQuery } from '../../../containers/kpi_host_details';
import { LastEventTime } from '../../../components/last_event_time';
+import { AnomalyTableProvider } from '../../../components/ml/anomaly/anomaly_table_provider';
import { hostToCriteria } from '../../../components/ml/criteria/host_to_criteria';
-import { MlCapabilitiesContext } from '../../../components/ml/permissions/ml_capabilities_provider';
import { hasMlUserPermissions } from '../../../components/ml/permissions/has_ml_user_permissions';
-import { AnomalyTableProvider } from '../../../components/ml/anomaly/anomaly_table_provider';
+import { MlCapabilitiesContext } from '../../../components/ml/permissions/ml_capabilities_provider';
import { scoreIntervalToDateTime } from '../../../components/ml/score/score_interval_to_datetime';
-import { setHostDetailsTablesActivePageToZero as dispatchHostDetailsTablesActivePageToZero } from '../../../store/hosts/actions';
import { SiemNavigation } from '../../../components/navigation';
-import { manageQuery } from '../../../components/page/manage_query';
-import { HostOverview } from '../../../components/page/hosts/host_overview';
import { KpiHostsComponent } from '../../../components/page/hosts';
+import { HostOverview } from '../../../components/page/hosts/host_overview';
+import { manageQuery } from '../../../components/page/manage_query';
import { SiemSearchBar } from '../../../components/search_bar';
+import { WrapperPage } from '../../../components/wrapper_page';
import { HostOverviewByNameQuery } from '../../../containers/hosts/overview';
+import { KpiHostDetailsQuery } from '../../../containers/kpi_host_details';
import { indicesExistOrDataTemporarilyUnavailable, WithSource } from '../../../containers/source';
import { LastEventIndexKey } from '../../../graphql/types';
+import { useKibanaCore } from '../../../lib/compose/kibana_core';
import { convertToBuildEsQuery } from '../../../lib/keury';
+import { inputsSelectors, State } from '../../../store';
+import { setHostDetailsTablesActivePageToZero as dispatchHostDetailsTablesActivePageToZero } from '../../../store/hosts/actions';
import { setAbsoluteRangeDatePicker as dispatchAbsoluteRangeDatePicker } from '../../../store/inputs/actions';
import { SpyRoute } from '../../../utils/route/spy_routes';
-import { useKibanaCore } from '../../../lib/compose/kibana_core';
import { esQuery } from '../../../../../../../../src/plugins/data/public';
import { HostsEmptyPage } from '../hosts_empty_page';
+import { HostDetailsTabs } from './details_tabs';
import { navTabsHostDetails } from './nav_tabs';
import { HostDetailsComponentProps, HostDetailsProps } from './types';
-import { HostDetailsTabs } from './details_tabs';
import { type } from './utils';
const HostOverviewManage = manageQuery(HostOverview);
@@ -63,6 +64,7 @@ const HostDetailsComponent = React.memo(
}, [detailName]);
const capabilities = useContext(MlCapabilitiesContext);
const core = useKibanaCore();
+
return (
<>
@@ -96,14 +98,16 @@ const HostDetailsComponent = React.memo(
...filters,
],
});
+
return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
- <>
-
-
-
-
+
+
+
+
+
(
}
title={detailName}
/>
+
(
-
-
-
+
+
+
+
) : (
- <>
-
+
+
+
-
+
);
}}
+
);
}
);
-
HostDetailsComponent.displayName = 'HostDetailsComponent';
export const makeMapStateToProps = () => {
diff --git a/x-pack/legacy/plugins/siem/public/pages/hosts/hosts.tsx b/x-pack/legacy/plugins/siem/public/pages/hosts/hosts.tsx
index a149b5224bd67..4ff666464404e 100644
--- a/x-pack/legacy/plugins/siem/public/pages/hosts/hosts.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/hosts/hosts.tsx
@@ -6,35 +6,35 @@
import { EuiSpacer } from '@elastic/eui';
import * as React from 'react';
-import { compose } from 'redux';
import { connect } from 'react-redux';
import { StickyContainer } from 'react-sticky';
+import { compose } from 'redux';
import { FiltersGlobal } from '../../components/filters_global';
-import { GlobalTimeArgs } from '../../containers/global_time';
import { HeaderPage } from '../../components/header_page';
-import { KpiHostsQuery } from '../../containers/kpi_hosts';
import { LastEventTime } from '../../components/last_event_time';
+import { hasMlUserPermissions } from '../../components/ml/permissions/has_ml_user_permissions';
+import { MlCapabilitiesContext } from '../../components/ml/permissions/ml_capabilities_provider';
import { SiemNavigation } from '../../components/navigation';
import { KpiHostsComponent } from '../../components/page/hosts';
import { manageQuery } from '../../components/page/manage_query';
-import { hasMlUserPermissions } from '../../components/ml/permissions/has_ml_user_permissions';
-import { MlCapabilitiesContext } from '../../components/ml/permissions/ml_capabilities_provider';
import { SiemSearchBar } from '../../components/search_bar';
+import { WrapperPage } from '../../components/wrapper_page';
+import { GlobalTimeArgs } from '../../containers/global_time';
+import { KpiHostsQuery } from '../../containers/kpi_hosts';
import { indicesExistOrDataTemporarilyUnavailable, WithSource } from '../../containers/source';
import { LastEventIndexKey } from '../../graphql/types';
+import { useKibanaCore } from '../../lib/compose/kibana_core';
import { convertToBuildEsQuery } from '../../lib/keury';
import { inputsSelectors, State, hostsModel } from '../../store';
import { setAbsoluteRangeDatePicker as dispatchSetAbsoluteRangeDatePicker } from '../../store/inputs/actions';
import { SpyRoute } from '../../utils/route/spy_routes';
-import { useKibanaCore } from '../../lib/compose/kibana_core';
-
import { esQuery } from '../../../../../../../src/plugins/data/public';
import { HostsEmptyPage } from './hosts_empty_page';
+import { HostsTabs } from './hosts_tabs';
import { navTabsHosts } from './nav_tabs';
import * as i18n from './translations';
import { HostsComponentProps, HostsComponentReduxProps } from './types';
-import { HostsTabs } from './hosts_tabs';
const KpiHostsComponentManage = manageQuery(KpiHostsComponent);
@@ -64,76 +64,77 @@ const HostsComponent = React.memo(
filters,
});
return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
- <>
-
-
-
-
+
+
+
+
+
}
title={i18n.PAGE_TITLE}
/>
- <>
-
- {({ kpiHosts, loading, id, inspect, refetch }) => (
- {
- setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
- }}
- />
- )}
-
-
-
-
-
-
-
-
+
+
+ {({ kpiHosts, loading, id, inspect, refetch }) => (
+ {
+ setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
+ }}
+ />
+ )}
+
+
+
+
+
+
+
+
+
+
+
) : (
- <>
-
+
+
+
-
+
);
}}
+
);
}
);
-
HostsComponent.displayName = 'HostsComponent';
const makeMapStateToProps = () => {
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.test.tsx b/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.test.tsx
index 174b6fc5ad5d1..a059c4beeaa28 100644
--- a/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.test.tsx
@@ -163,7 +163,7 @@ describe('Ip Details', () => {
wrapper.update();
expect(
wrapper
- .find('[data-test-subj="ip-details-headline"] [data-test-subj="page_headline_title"]')
+ .find('[data-test-subj="ip-details-headline"] [data-test-subj="header-page-title"]')
.text()
).toEqual('fe80::24ce:f7ff:fede:a571');
});
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.tsx b/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.tsx
index 66a96e71808ef..96111f0479938 100644
--- a/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/network/ip_details/index.tsx
@@ -20,9 +20,11 @@ import { manageQuery } from '../../../components/page/manage_query';
import { FlowTargetSelectConnected } from '../../../components/page/network/flow_target_select_connected';
import { IpOverview } from '../../../components/page/network/ip_overview';
import { SiemSearchBar } from '../../../components/search_bar';
+import { WrapperPage } from '../../../components/wrapper_page';
import { IpOverviewQuery } from '../../../containers/ip_overview';
import { indicesExistOrDataTemporarilyUnavailable, WithSource } from '../../../containers/source';
import { FlowTargetSourceDest, LastEventIndexKey } from '../../../graphql/types';
+import { useKibanaCore } from '../../../lib/compose/kibana_core';
import { decodeIpv6 } from '../../../lib/helpers';
import { convertToBuildEsQuery } from '../../../lib/keury';
import { ConditionalFlexGroup } from '../../../pages/network/navigation/conditional_flex_group';
@@ -31,16 +33,15 @@ import { setAbsoluteRangeDatePicker as dispatchAbsoluteRangeDatePicker } from '.
import { setIpDetailsTablesActivePageToZero as dispatchIpDetailsTablesActivePageToZero } from '../../../store/network/actions';
import { SpyRoute } from '../../../utils/route/spy_routes';
import { NetworkEmptyPage } from '../network_empty_page';
-
-import { IPDetailsComponentProps } from './types';
-export { getBreadcrumbs } from './utils';
-import { TlsQueryTable } from './tls_query_table';
-import { UsersQueryTable } from './users_query_table';
-import { NetworkTopNFlowQueryTable } from './network_top_n_flow_query_table';
import { NetworkHttpQueryTable } from './network_http_query_table';
import { NetworkTopCountriesQueryTable } from './network_top_countries_query_table';
+import { NetworkTopNFlowQueryTable } from './network_top_n_flow_query_table';
+import { TlsQueryTable } from './tls_query_table';
+import { IPDetailsComponentProps } from './types';
+import { UsersQueryTable } from './users_query_table';
import { esQuery } from '../../../../../../../../src/plugins/data/public';
-import { useKibanaCore } from '../../../lib/compose/kibana_core';
+
+export { getBreadcrumbs } from './utils';
const IpOverviewManage = manageQuery(IpOverview);
@@ -85,193 +86,197 @@ export const IPDetailsComponent = React.memo(
queries: [query],
filters,
});
+
return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
- }
- title={ip}
- draggableArguments={{ field: `${flowTarget}.ip`, value: ip }}
- >
-
-
+
+ }
+ title={ip}
+ >
+
+
-
- {({ id, inspect, ipOverviewData, loading, refetch }) => (
-
- {({ isLoadingAnomaliesData, anomaliesData }) => (
- {
- const fromTo = scoreIntervalToDateTime(score, interval);
- setAbsoluteRangeDatePicker({
- id: 'global',
- from: fromTo.from,
- to: fromTo.to,
- });
- }}
- />
- )}
-
- )}
-
+
+ {({ id, inspect, ipOverviewData, loading, refetch }) => (
+
+ {({ isLoadingAnomaliesData, anomaliesData }) => (
+ {
+ const fromTo = scoreIntervalToDateTime(score, interval);
+ setAbsoluteRangeDatePicker({
+ id: 'global',
+ from: fromTo.from,
+ to: fromTo.to,
+ });
+ }}
+ />
+ )}
+
+ )}
+
-
+
-
-
-
-
+
+
+
+
-
-
-
-
+
+
+
+
-
+
-
-
-
-
+
+
+
+
-
-
-
-
+
+
+
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
+
) : (
- <>
-
+
+
-
+
);
}}
+
);
}
);
-
IPDetailsComponent.displayName = 'IPDetailsComponent';
const makeMapStateToProps = () => {
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/network.tsx b/x-pack/legacy/plugins/siem/public/pages/network/network.tsx
index 33e901d5dbac8..aa7572e5741bd 100644
--- a/x-pack/legacy/plugins/siem/public/pages/network/network.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/network/network.tsx
@@ -17,6 +17,7 @@ import { SiemNavigation } from '../../components/navigation';
import { manageQuery } from '../../components/page/manage_query';
import { KpiNetworkComponent } from '../../components/page/network';
import { SiemSearchBar } from '../../components/search_bar';
+import { WrapperPage } from '../../components/wrapper_page';
import { KpiNetworkQuery } from '../../containers/kpi_network';
import { indicesExistOrDataTemporarilyUnavailable, WithSource } from '../../containers/source';
import { LastEventIndexKey } from '../../graphql/types';
@@ -48,6 +49,7 @@ const NetworkComponent = React.memo(
capabilitiesFetched,
}) => {
const core = useKibanaCore();
+
return (
<>
@@ -58,95 +60,95 @@ const NetworkComponent = React.memo(
queries: [query],
filters,
});
+
return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
- }
- title={i18n.PAGE_TITLE}
- />
-
-
-
-
-
-
- {({ kpiNetwork, loading, id, inspect, refetch }) => (
- {
- setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
- }}
- />
+
+ }
+ title={i18n.PAGE_TITLE}
+ />
+
+
+
+
+
+
+ {({ kpiNetwork, loading, id, inspect, refetch }) => (
+ {
+ setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
+ }}
+ />
+ )}
+
+
+ {capabilitiesFetched && !isInitializing ? (
+ <>
+
+
+
+
+
+
+
+
+ ) : (
+
)}
-
-
- {capabilitiesFetched && !isInitializing ? (
- <>
-
-
-
-
-
-
-
-
- ) : (
-
- )}
-
-
+
+
+
) : (
- <>
-
+
+
-
+
);
}}
+
);
}
);
-
NetworkComponent.displayName = 'NetworkComponent';
const makeMapStateToProps = () => {
diff --git a/x-pack/legacy/plugins/siem/public/pages/overview/overview.tsx b/x-pack/legacy/plugins/siem/public/pages/overview/overview.tsx
index d8965f4d49491..de976b1a5c5a3 100644
--- a/x-pack/legacy/plugins/siem/public/pages/overview/overview.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/overview/overview.tsx
@@ -7,68 +7,72 @@
import { EuiFlexGroup } from '@elastic/eui';
import moment from 'moment';
import React from 'react';
-import { pure } from 'recompose';
import chrome from 'ui/chrome';
import { documentationLinks } from 'ui/documentation_links';
+import { EmptyPage } from '../../components/empty_page';
import { HeaderPage } from '../../components/header_page';
import { OverviewHost } from '../../components/page/overview/overview_host';
import { OverviewNetwork } from '../../components/page/overview/overview_network';
+import { WrapperPage } from '../../components/wrapper_page';
import { GlobalTime } from '../../containers/global_time';
-
-import { Summary } from './summary';
-import { EmptyPage } from '../../components/empty_page';
import { WithSource, indicesExistOrDataTemporarilyUnavailable } from '../../containers/source';
import { SpyRoute } from '../../utils/route/spy_routes';
-
+import { Summary } from './summary';
import * as i18n from './translations';
const basePath = chrome.getBasePath();
-export const OverviewComponent = pure(() => {
+export const OverviewComponent = React.memo(() => {
const dateEnd = Date.now();
const dateRange = moment.duration(24, 'hours').asMilliseconds();
const dateStart = dateEnd - dateRange;
return (
<>
-
+
+
+
+
+ {({ indicesExist }) =>
+ indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
+
+ {({ setQuery }) => (
+
+
+
+
+
+ )}
+
+ ) : (
+
+ )
+ }
+
+
-
- {({ indicesExist }) =>
- indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (
-
- {({ setQuery }) => (
-
-
-
-
-
- )}
-
- ) : (
-
- )
- }
-
);
});
-
OverviewComponent.displayName = 'OverviewComponent';
diff --git a/x-pack/legacy/plugins/siem/public/pages/timelines/timelines_page.tsx b/x-pack/legacy/plugins/siem/public/pages/timelines/timelines_page.tsx
index 90eae605de4b7..93c8397e21431 100644
--- a/x-pack/legacy/plugins/siem/public/pages/timelines/timelines_page.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/timelines/timelines_page.tsx
@@ -10,14 +10,13 @@ import styled from 'styled-components';
import { HeaderPage } from '../../components/header_page';
import { StatefulOpenTimeline } from '../../components/open_timeline';
+import { WrapperPage } from '../../components/wrapper_page';
import { SpyRoute } from '../../utils/route/spy_routes';
-
import * as i18n from './translations';
const TimelinesContainer = styled.div`
width: 100%:
`;
-
TimelinesContainer.displayName = 'TimelinesContainer';
interface TimelinesProps {
@@ -30,16 +29,19 @@ export const DEFAULT_SEARCH_RESULTS_PER_PAGE = 10;
export const TimelinesPage = React.memo(({ apolloClient }) => (
<>
-
-
-
-
-
+
+
+
+
+
+
+
+
));
diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
index 645b8c427dc15..a5c950a3f2be0 100644
--- a/x-pack/plugins/translations/translations/ja-JP.json
+++ b/x-pack/plugins/translations/translations/ja-JP.json
@@ -10511,7 +10511,6 @@
"xpack.siem.formatted.duration.noDurationTooltip": "期間がありません",
"xpack.siem.formatted.duration.zeroNanosecondsTooltip": "0ナノ秒",
"xpack.siem.formattedDuration.tooltipLabel": "生",
- "xpack.siem.global.addData": "データの投入",
"xpack.siem.headerPage.pageSubtitle": "前回のイベント: {beat}",
"xpack.siem.host.details.architectureLabel": "アーキテクチャー",
"xpack.siem.host.details.firstSeenTitle": "初回の認識",
diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
index d542e66b247ec..bb876ca1eb8b9 100644
--- a/x-pack/plugins/translations/translations/zh-CN.json
+++ b/x-pack/plugins/translations/translations/zh-CN.json
@@ -10601,7 +10601,6 @@
"xpack.siem.formatted.duration.noDurationTooltip": "无持续时间",
"xpack.siem.formatted.duration.zeroNanosecondsTooltip": "零纳秒",
"xpack.siem.formattedDuration.tooltipLabel": "原始",
- "xpack.siem.global.addData": "添加数据",
"xpack.siem.headerPage.pageSubtitle": "最后事件：{beat}",
"xpack.siem.host.details.architectureLabel": "架构",
"xpack.siem.host.details.firstSeenTitle": "首次看到时间",