[Security Solution] Decompose Timelines TGrid component and moved to security_solution

x-pack/plugins/observability/public/pages/alerts/components/observability_actions.test.tsx

@@ -60,7 +60,6 @@ describe('ObservabilityActions component', () => {
       },
       data: inventoryThresholdAlert as unknown as TimelineNonEcsData[],
       observabilityRuleTypeRegistry: createObservabilityRuleTypeRegistryMock(),
-      setEventsDeleted: jest.fn(),
       setFlyoutAlert: jest.fn(),
       id: pageId,
     };

x-pack/plugins/observability/public/pages/alerts/components/observability_actions.tsx

@@ -18,7 +18,8 @@ import React, { useMemo, useState, useCallback } from 'react';
 
 import { CaseAttachmentsWithoutOwner } from '@kbn/cases-plugin/public';
 import { CommentType } from '@kbn/cases-plugin/common';
-import type { ActionProps } from '@kbn/timelines-plugin/common';
+import { Ecs } from '@kbn/timelines-plugin/common/ecs';
+import { TimelineNonEcsData } from '@kbn/timelines-plugin/common';
 import { isAlertDetailsEnabledPerApp } from '../../../utils/is_alert_details_enabled';
 import { useKibana } from '../../../utils/kibana_react';
 import { useGetUserCasesPermissions } from '../../../hooks/use_get_user_cases_permissions';
@@ -32,15 +33,15 @@ import { ObservabilityRuleTypeRegistry } from '../../..';
 import { ALERT_DETAILS_PAGE_ID } from '../../alert_details/types';
 import { ConfigSchema } from '../../../plugin';
 
-export type ObservabilityActionsProps = Pick<
-  ActionProps,
-  'data' | 'eventId' | 'ecsData' | 'setEventsDeleted'
-> & {
+export interface ObservabilityActionsProps {
+  data: TimelineNonEcsData[];
+  ecsData: Ecs;
+  eventId: string;
   setFlyoutAlert: React.Dispatch<React.SetStateAction<TopAlert | undefined>>;
   observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry;
   id?: string;
   config: ConfigSchema;
-};
+}
 
 export function ObservabilityActions({
   data,

x-pack/plugins/observability/public/pages/alerts/containers/alerts_table/get_row_actions.tsx

@@ -17,7 +17,6 @@ const buildData = (alerts: EcsFieldsResponse): ObservabilityActionsProps['data']
     []
   );
 };
-const fakeSetEventsDeleted = () => [];
 export const getRowActions = (
   observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry,
   config: ConfigSchema
@@ -35,7 +34,6 @@ export const getRowActions = (
           ecsData={{ _id: alert._id, _index: alert._index }}
           id={id}
           observabilityRuleTypeRegistry={observabilityRuleTypeRegistry}
-          setEventsDeleted={fakeSetEventsDeleted}
           setFlyoutAlert={setFlyoutAlert}
           config={config}
         />

x-pack/plugins/security_solution/common/types/bulk_actions/index.ts

@@ -0,0 +1,20 @@
+/*
+ * 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 type { TimelineItem } from '../../search_strategy';
+export interface CustomBulkAction {
+  key: string;
+  label: string;
+  disableOnQuery?: boolean;
+  disabledLabel?: string;
+  onClick: (items?: TimelineItem[]) => void;
+  ['data-test-subj']?: string;
+}
+
+export type CustomBulkActionProp = Omit<CustomBulkAction, 'onClick'> & {
+  onClick: (eventIds: string[]) => void;
+};

x-pack/plugins/security_solution/common/types/data_table/index.ts

@@ -0,0 +1,49 @@
+/*
+ * 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 * as runtimeTypes from 'io-ts';
+
+export enum Direction {
+  asc = 'asc',
+  desc = 'desc',
+}
+
+export type SortDirectionTable = 'none' | 'asc' | 'desc' | Direction;
+export interface SortColumnTable {
+  columnId: string;
+  columnType: string;
+  esTypes?: string[];
+  sortDirection: SortDirectionTable;
+}
+
+export type { TableById } from '../../../public/common/store/data_table/types';
+
+export enum TableId {
+  usersPageEvents = 'users-page-events',
+  hostsPageEvents = 'hosts-page-events',
+  networkPageEvents = 'network-page-events',
+  hostsPageSessions = 'hosts-page-sessions-v2', // the v2 is to cache bust localstorage settings as default columns were reworked.
+  alertsOnRuleDetailsPage = 'alerts-rules-details-page',
+  alertsOnAlertsPage = 'alerts-page',
+  test = 'table-test', // Reserved for testing purposes
+  alternateTest = 'alternateTest',
+  rulePreview = 'rule-preview',
+  kubernetesPageSessions = 'kubernetes-page-sessions',
+}
+
+const TableIdLiteralRt = runtimeTypes.union([
+  runtimeTypes.literal(TableId.usersPageEvents),
+  runtimeTypes.literal(TableId.hostsPageEvents),
+  runtimeTypes.literal(TableId.networkPageEvents),
+  runtimeTypes.literal(TableId.hostsPageSessions),
+  runtimeTypes.literal(TableId.alertsOnRuleDetailsPage),
+  runtimeTypes.literal(TableId.alertsOnAlertsPage),
+  runtimeTypes.literal(TableId.test),
+  runtimeTypes.literal(TableId.rulePreview),
+  runtimeTypes.literal(TableId.kubernetesPageSessions),
+]);
+export type TableIdLiteral = runtimeTypes.TypeOf<typeof TableIdLiteralRt>;

x-pack/plugins/security_solution/common/types/detail_panel/index.ts

@@ -0,0 +1,63 @@
+/*
+ * 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 type { FlowTargetSourceDest } from '../../search_strategy';
+import type { TimelineTabs } from '../timeline';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type EmptyObject = Record<any, never>;
+
+export type ExpandedEventType =
+  | {
+      panelView?: 'eventDetail';
+      params?: {
+        eventId: string;
+        indexName: string;
+        refetch?: () => void;
+      };
+    }
+  | EmptyObject;
+
+export type ExpandedHostType =
+  | {
+      panelView?: 'hostDetail';
+      params?: {
+        hostName: string;
+      };
+    }
+  | EmptyObject;
+
+export type ExpandedNetworkType =
+  | {
+      panelView?: 'networkDetail';
+      params?: {
+        ip: string;
+        flowTarget: FlowTargetSourceDest;
+      };
+    }
+  | EmptyObject;
+
+export type ExpandedUserType =
+  | {
+      panelView?: 'userDetail';
+      params?: {
+        userName: string;
+      };
+    }
+  | EmptyObject;
+
+export type ExpandedDetailType =
+  | ExpandedEventType
+  | ExpandedHostType
+  | ExpandedNetworkType
+  | ExpandedUserType;
+
+export type ExpandedDetailTimeline = {
+  [tab in TimelineTabs]?: ExpandedDetailType;
+};
+
+export type ExpandedDetail = Partial<Record<string, ExpandedDetailType>>;

x-pack/plugins/security_solution/common/types/header_actions/index.ts

@@ -0,0 +1,175 @@
+/*
+ * 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 type {
+  EuiDataGridCellValueElementProps,
+  EuiDataGridColumn,
+  EuiDataGridColumnCellActionProps,
+  EuiDataGridControlColumn,
+} from '@elastic/eui';
+import type { IFieldSubType } from '@kbn/es-query';
+import type { FieldBrowserOptions } from '@kbn/triggers-actions-ui-plugin/public';
+import type { ComponentType, JSXElementConstructor, ReactNode } from 'react';
+import type { OnRowSelected, SetEventsDeleted, SetEventsLoading } from '..';
+import type { Ecs } from '../../ecs';
+import type { BrowserFields, TimelineNonEcsData } from '../../search_strategy';
+import type { SortColumnTable } from '../data_table';
+
+export type ColumnHeaderType = 'not-filtered' | 'text-filter';
+
+/** Uniquely identifies a column */
+export type ColumnId = string;
+
+/**
+ * A `DataTableCellAction` function accepts `data`, where each row of data is
+ * represented as a `TimelineNonEcsData[]`. For example, `data[0]` would
+ * contain a `TimelineNonEcsData[]` with the first row of data.
+ *
+ * A `DataTableCellAction` returns a function that has access to all the
+ * `EuiDataGridColumnCellActionProps`, _plus_ access to `data`,
+ *  which enables code like the following example to be written:
+ *
+ * Example:
+ * ```
+ * ({ data }: { data: TimelineNonEcsData[][] }) => ({ rowIndex, columnId, Component }) => {
+ *   const value = getMappedNonEcsValue({
+ *     data: data[rowIndex], // access a specific row's values
+ *     fieldName: columnId,
+ *   });
+ *
+ *   return (
+ *     <Component onClick={() => alert(`row ${rowIndex} col ${columnId} has value ${value}`)} iconType="heart">
+ *       {'Love it'}
+ *      </Component>
+ *   );
+ * };
+ * ```
+ */
+export type DataTableCellAction = ({
+  browserFields,
+  data,
+  ecsData,
+  header,
+  pageSize,
+  scopeId,
+  closeCellPopover,
+}: {
+  browserFields: BrowserFields;
+  /** each row of data is represented as one TimelineNonEcsData[] */
+  data: TimelineNonEcsData[][];
+  ecsData: Ecs[];
+  header?: ColumnHeaderOptions;
+  pageSize: number;
+  scopeId: string;
+  closeCellPopover?: () => void;
+}) => (props: EuiDataGridColumnCellActionProps) => ReactNode;
+
+/** The specification of a column header */
+export type ColumnHeaderOptions = Pick<
+  EuiDataGridColumn,
+  | 'actions'
+  | 'defaultSortDirection'
+  | 'display'
+  | 'displayAsText'
+  | 'id'
+  | 'initialWidth'
+  | 'isSortable'
+  | 'schema'
+> & {
+  aggregatable?: boolean;
+  dataTableCellActions?: DataTableCellAction[];
+  category?: string;
+  columnHeaderType: ColumnHeaderType;
+  description?: string | null;
+  esTypes?: string[];
+  example?: string | number | null;
+  format?: string;
+  linkField?: string;
+  placeholder?: string;
+  subType?: IFieldSubType;
+  type?: string;
+};
+export interface HeaderActionProps {
+  width: number;
+  browserFields: BrowserFields;
+  columnHeaders: ColumnHeaderOptions[];
+  fieldBrowserOptions?: FieldBrowserOptions;
+  isEventViewer?: boolean;
+  isSelectAllChecked: boolean;
+  onSelectAll: ({ isSelected }: { isSelected: boolean }) => void;
+  showEventsSelect: boolean;
+  showSelectAllCheckbox: boolean;
+  sort: SortColumnTable[];
+  tabType: string;
+  timelineId: string;
+}
+
+export type HeaderCellRender = ComponentType | ComponentType<HeaderActionProps>;
+
+type GenericActionRowCellRenderProps = Pick<
+  EuiDataGridCellValueElementProps,
+  'rowIndex' | 'columnId'
+>;
+
+export type RowCellRender =
+  | JSXElementConstructor<GenericActionRowCellRenderProps>
+  | ((props: GenericActionRowCellRenderProps) => JSX.Element)
+  | JSXElementConstructor<ActionProps>
+  | ((props: ActionProps) => JSX.Element);
+
+export interface ActionProps {
+  action?: RowCellRender;
+  ariaRowindex: number;
+  checked: boolean;
+  columnId: string;
+  columnValues: string;
+  data: TimelineNonEcsData[];
+  disabled?: boolean;
+  ecsData: Ecs;
+  eventId: string;
+  eventIdToNoteIds?: Readonly<Record<string, string[]>>;
+  index: number;
+  isEventPinned?: boolean;
+  isEventViewer?: boolean;
+  loadingEventIds: Readonly<string[]>;
+  onEventDetailsPanelOpened: () => void;
+  onRowSelected: OnRowSelected;
+  onRuleChange?: () => void;
+  refetch?: () => void;
+  rowIndex: number;
+  setEventsDeleted: SetEventsDeleted;
+  setEventsLoading: SetEventsLoading;
+  showCheckboxes: boolean;
+  showNotes?: boolean;
+  tabType?: string;
+  timelineId: string;
+  toggleShowNotes?: () => void;
+  width?: number;
+}
+
+interface AdditionalControlColumnProps {
+  ariaRowindex: number;
+  actionsColumnWidth: number;
+  columnValues: string;
+  checked: boolean;
+  onRowSelected: OnRowSelected;
+  eventId: string;
+  id: string;
+  columnId: string;
+  loadingEventIds: Readonly<string[]>;
+  onEventDetailsPanelOpened: () => void;
+  showCheckboxes: boolean;
+  // Override these type definitions to support either a generic custom component or the one used in security_solution today.
+  headerCellRender: HeaderCellRender;
+  rowCellRender: RowCellRender;
+}
+
+export type ControlColumnProps = Omit<
+  EuiDataGridControlColumn,
+  keyof AdditionalControlColumnProps
+> &
+  Partial<AdditionalControlColumnProps>;

x-pack/plugins/security_solution/common/types/index.ts

@@ -5,4 +5,18 @@
  * 2.0.
  */
 
+import type { Status } from '../detection_engine/schemas/common';
+
 export * from './timeline';
+export * from './data_table';
+export * from './detail_panel';
+export * from './header_actions';
+export * from './session_view';
+export * from './bulk_actions';
+
+export const FILTER_OPEN: Status = 'open';
+export const FILTER_CLOSED: Status = 'closed';
+export const FILTER_ACKNOWLEDGED: Status = 'acknowledged';
+
+export type SetEventsLoading = (params: { eventIds: string[]; isLoading: boolean }) => void;
+export type SetEventsDeleted = (params: { eventIds: string[]; isDeleted: boolean }) => void;