[Security Solution] cleanup types for row actions

Author: wildemat

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

@@ -17,7 +17,7 @@ import type { EcsSecurityExtension as Ecs } from '@kbn/securitysolution-ecs';
 import type { SortColumnTable } from '@kbn/securitysolution-data-table';
 import type { SerializedFieldFormat } from '@kbn/field-formats-plugin/common';
 import type { OnRowSelected, SetEventsDeleted, SetEventsLoading } from '..';
-import type { BrowserFields, TimelineNonEcsData } from '../../search_strategy';
+import type { BrowserFields } from '../../search_strategy';
 
 export type ColumnHeaderType = 'not-filtered' | 'text-filter';
 
@@ -81,40 +81,33 @@ export type RowCellRender =
   | ((props: ActionProps) => JSX.Element);
 
 export interface ActionProps {
-  action?: RowCellRender;
   ariaRowindex: number;
   checked: boolean;
-  columnId: string;
   columnValues: string;
-  data: TimelineNonEcsData[];
-  disableExpandAction?: boolean;
   disabled?: boolean;
+  disableExpandAction?: boolean;
+  disablePinAction?: boolean;
+  disableTimelineAction?: boolean;
   ecsData: Ecs;
   eventId: string;
   eventIdToNoteIds?: Readonly<Record<string, string[]>>;
-  index: number;
-  isEventPinned?: boolean;
+  index?: number;
   isEventViewer?: boolean;
+  isEventPinned?: boolean;
   loadingEventIds: Readonly<string[]>;
   onEventDetailsPanelOpened: () => void;
   onRowSelected: OnRowSelected;
   onRuleChange?: () => void;
+  pinnedEventIds?: Readonly<Record<string, boolean>>;
   refetch?: () => void;
-  rowIndex: number;
-  setEventsDeleted: SetEventsDeleted;
-  setEventsLoading: SetEventsLoading;
-  showCheckboxes: boolean;
-  /**
-   * This prop is used to determine if the notes button should be displayed
-   * as the part of Row Actions
-   * */
+  setEventsDeleted?: SetEventsDeleted;
+  setEventsLoading?: SetEventsLoading;
+  showCheckboxes?: boolean;
   showNotes?: boolean;
   tabType?: string;
   timelineId: string;
   toggleShowNotes?: () => void;
   width?: number;
-  disablePinAction?: boolean;
-  disableTimelineAction?: boolean;
 }
 
 interface AdditionalControlColumnProps {

x-pack/solutions/security/plugins/security_solution/public/cases/components/case_events/table.tsx

@@ -12,18 +12,18 @@ import type {
 import type { CaseViewEventsTableProps } from '@kbn/cases-plugin/common/ui';
 import type { EuiTheme } from '@kbn/react-kibana-context-styled';
 import type { SubsetDataTableModel } from '@kbn/securitysolution-data-table';
-import { type DataView } from '@kbn/data-views-plugin/public';
 import {
-  getPageRowIndex,
   addBuildingBlockStyle,
-  defaultHeaders,
-  DataTableComponent,
   dataTableActions,
+  DataTableComponent,
+  defaultHeaders,
+  getPageRowIndex,
   getTableByIdSelector,
   tableDefaults,
 } from '@kbn/securitysolution-data-table';
+import { type DataView } from '@kbn/data-views-plugin/public';
 import type { DeprecatedRowRenderer } from '@kbn/timelines-plugin/common';
-import React, { useMemo, useEffect, useContext, type FC, useState, useCallback } from 'react';
+import React, { type FC, useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 
 import { ThemeContext } from 'styled-components';

x-pack/solutions/security/plugins/security_solution/public/common/components/control_columns/checkbox.test.tsx

@@ -5,34 +5,22 @@
  * 2.0.
  */
 
-import { render, fireEvent } from '@testing-library/react';
+import { fireEvent, render } from '@testing-library/react';
+import type { RowCheckBoxProps } from './checkbox';
 import { HeaderCheckBox, RowCheckBox } from './checkbox';
 import React from 'react';
-import type { ActionProps, HeaderActionProps } from '../../../../common/types';
+import type { HeaderActionProps } from '../../../../common/types';
 import { TimelineTabs } from '../../../../common/types';
 
 describe('checkbox control column', () => {
   describe('RowCheckBox', () => {
-    const defaultProps: ActionProps = {
+    const defaultProps: RowCheckBoxProps = {
       ariaRowindex: 1,
-      columnId: 'test-columnId',
-      columnValues: 'test-columnValues',
       checked: false,
+      columnValues: 'test-columnValues',
       onRowSelected: jest.fn(),
       eventId: 'test-event-id',
       loadingEventIds: [],
-      onEventDetailsPanelOpened: jest.fn(),
-      showCheckboxes: true,
-      data: [],
-      ecsData: {
-        _id: 'test-ecsData-id',
-      },
-      index: 1,
-      rowIndex: 1,
-      showNotes: true,
-      timelineId: 'test-timelineId',
-      setEventsLoading: jest.fn(),
-      setEventsDeleted: jest.fn(),
     };
     test('displays loader when id is included on loadingEventIds', () => {
       const { getByTestId } = render(

x-pack/solutions/security/plugins/security_solution/public/common/components/control_columns/checkbox.tsx

@@ -10,15 +10,26 @@ import React, { useCallback } from 'react';
 import type { ActionProps, HeaderActionProps } from '../../../../common/types';
 import * as i18n from './translations';
 
+export type RowCheckBoxProps = Pick<
+  ActionProps,
+  | 'ariaRowindex'
+  | 'checked'
+  | 'columnValues'
+  | 'disabled'
+  | 'eventId'
+  | 'loadingEventIds'
+  | 'onRowSelected'
+>;
+
 export const RowCheckBox = ({
-  eventId,
-  onRowSelected,
-  checked,
   ariaRowindex,
+  checked,
   columnValues,
   disabled,
+  eventId,
   loadingEventIds,
-}: ActionProps) => {
+  onRowSelected,
+}: RowCheckBoxProps) => {
   const handleSelectEvent = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
       if (!disabled) {

x-pack/solutions/security/plugins/security_solution/public/common/components/control_columns/row_action/index.tsx

@@ -15,14 +15,14 @@ import {
   DocumentDetailsRightPanelKey,
 } from '../../../../flyout/document_details/shared/constants/panel_keys';
 import type {
+  ControlColumnProps,
   SetEventsDeleted,
   SetEventsLoading,
-  ControlColumnProps,
 } from '../../../../../common/types';
 import type { TimelineItem, TimelineNonEcsData } from '../../../../../common/search_strategy';
 import type { ColumnHeaderOptions, OnRowSelected } from '../../../../../common/types/timeline';
 import { useIsExperimentalFeatureEnabled } from '../../../hooks/use_experimental_features';
-import { NotesEventTypes, DocumentEventTypes } from '../../../lib/telemetry';
+import { DocumentEventTypes, NotesEventTypes } from '../../../lib/telemetry';
 import { getMappedNonEcsValue } from '../../../utils/get_mapped_non_ecs_value';
 import { useUserPrivileges } from '../../user_privileges';
 
@@ -36,15 +36,15 @@ export type RowActionProps = EuiDataGridCellValueElementProps & {
   loadingEventIds: Readonly<string[]>;
   onRowSelected: OnRowSelected;
   onRuleChange?: () => void;
+  pageRowIndex: number;
+  refetch?: () => void;
   selectedEventIds: Readonly<Record<string, TimelineNonEcsData[]>>;
+  setEventsDeleted: SetEventsDeleted;
+  setEventsLoading: SetEventsLoading;
   showCheckboxes: boolean;
   tabType?: string;
   tableId: string;
   width: number;
-  setEventsLoading: SetEventsLoading;
-  setEventsDeleted: SetEventsDeleted;
-  pageRowIndex: number;
-  refetch?: () => void;
 };
 
 const RowActionComponent = ({
@@ -58,15 +58,15 @@ const RowActionComponent = ({
   onRowSelected,
   onRuleChange,
   pageRowIndex,
+  refetch,
   rowIndex,
   selectedEventIds,
+  setEventsLoading,
+  setEventsDeleted,
   showCheckboxes,
   tabType,
   tableId,
-  setEventsLoading,
-  setEventsDeleted,
   width,
-  refetch,
 }: RowActionProps) => {
   const { data: timelineNonEcsData, ecs: ecsData, _id: eventId, _index: indexName } = data ?? {};
   const { telemetry } = useKibana().services;
@@ -158,9 +158,9 @@ const RowActionComponent = ({
           checked={Object.keys(selectedEventIds).includes(eventId)}
           columnId={controlColumn.id || ''}
           columnValues={columnValues || ''}
-          data={timelineNonEcsData}
           data-test-subj="actions"
           disabled={disabled}
+          disableTimelineAction={!canReadTimelines}
           ecsData={ecsData}
           eventId={eventId}
           index={index}
@@ -169,17 +169,16 @@ const RowActionComponent = ({
           onEventDetailsPanelOpened={handleOnEventDetailPanelOpened}
           onRowSelected={onRowSelected}
           onRuleChange={onRuleChange}
+          refetch={refetch}
           rowIndex={rowIndex}
+          setEventsLoading={setEventsLoading}
+          setEventsDeleted={setEventsDeleted}
           showCheckboxes={showCheckboxes}
+          showNotes={showNotes}
           tabType={tabType}
           timelineId={tableId}
           toggleShowNotes={securitySolutionNotesDisabled ? undefined : toggleShowNotes}
           width={width}
-          setEventsLoading={setEventsLoading}
-          setEventsDeleted={setEventsDeleted}
-          refetch={refetch}
-          showNotes={showNotes}
-          disableTimelineAction={!canReadTimelines}
         />
       )}
     </>

x-pack/solutions/security/plugins/security_solution/public/common/components/control_columns/transform_control_columns.tsx

@@ -10,20 +10,20 @@ import type { EuiDataGridCellValueElementProps, EuiDataGridControlColumn } from
 import type { ComponentType } from 'react';
 import React from 'react';
 import type { EuiTheme } from '@kbn/kibana-react-plugin/common';
-import { addBuildingBlockStyle, getPageRowIndex } from '@kbn/securitysolution-data-table';
 import type { SortColumnTable } from '@kbn/securitysolution-data-table';
+import { addBuildingBlockStyle, getPageRowIndex } from '@kbn/securitysolution-data-table';
 import type {
   BrowserFields,
   TimelineItem,
   TimelineNonEcsData,
 } from '../../../../common/search_strategy';
 import type {
-  SetEventsDeleted,
-  SetEventsLoading,
   ColumnHeaderOptions,
   ControlColumnProps,
   OnRowSelected,
   OnSelectAll,
+  SetEventsDeleted,
+  SetEventsLoading,
 } from '../../../../common/types';
 import { RowAction } from './row_action';
 

x-pack/solutions/security/plugins/security_solution/public/common/components/header_actions/actions.tsx

@@ -48,23 +48,43 @@ const ActionsContainer = styled.div`
 
 const emptyNotes: string[] = [];
 
-const ActionsComponent: React.FC<ActionProps> = ({
+type ActionsComponentProps = Pick<
+  ActionProps,
+  | 'ariaRowindex'
+  | 'columnValues'
+  | 'disableExpandAction'
+  | 'disablePinAction'
+  | 'disableTimelineAction'
+  | 'ecsData'
+  | 'eventId'
+  | 'eventIdToNoteIds'
+  | 'isEventViewer'
+  | 'isEventPinned'
+  | 'onEventDetailsPanelOpened'
+  | 'onRuleChange'
+  | 'refetch'
+  | 'showNotes'
+  | 'timelineId'
+  | 'toggleShowNotes'
+>;
+
+const ActionsComponent: React.FC<ActionsComponentProps> = ({
   ariaRowindex,
   columnValues,
   disableExpandAction = false,
+  disablePinAction = true,
+  disableTimelineAction = false,
   ecsData,
   eventId,
   eventIdToNoteIds,
-  isEventPinned = false,
   isEventViewer = false,
+  isEventPinned = false,
   onEventDetailsPanelOpened,
   onRuleChange,
+  refetch,
   showNotes,
   timelineId,
-  refetch,
   toggleShowNotes,
-  disablePinAction = true,
-  disableTimelineAction = false,
 }) => {
   const dispatch = useDispatch();
 
@@ -186,11 +206,11 @@ const ActionsComponent: React.FC<ActionProps> = ({
   );
 
   // we hide the analyzer icon if the data is not available for the resolver
-  // or if we are on the cases alerts table and the the visualization in flyout advanced setting is disabled
+  // or if we are on the cases alerts table and the visualization in flyout advanced setting is disabled
   const showAnalyzerIcon = useIsInvestigateInResolverActionEnabled(ecsData);
 
   // we hide the session view icon if the session view is not available
-  // or if we are on the cases alerts table and the the visualization in flyout advanced setting is disabled
+  // or if we are on the cases alerts table and the visualization in flyout advanced setting is disabled
   // or if the user is not on an enterprise license or on the kubernetes page
   const isEnterprisePlus = useLicense().isEnterprise();
   const showSessionViewIcon = useMemo(

x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/rule_preview/preview_table_control_columns.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { EuiToolTip, EuiButtonIcon } from '@elastic/eui';
+import { EuiButtonIcon, EuiToolTip } from '@elastic/eui';
 import React from 'react';
 import styled from 'styled-components';
 import {
@@ -47,7 +47,12 @@ const ActionsContainer = styled.div`
   display: flex;
 `;
 
-const PreviewActionsComponent: React.FC<ActionProps> = ({
+type PreviewActionsComponentProps = Pick<
+  ActionProps,
+  'ariaRowindex' | 'columnValues' | 'onEventDetailsPanelOpened'
+>;
+
+const PreviewActionsComponent: React.FC<PreviewActionsComponentProps> = ({
   ariaRowindex,
   columnValues,
   onEventDetailsPanelOpened,

x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/helpers.test.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { eventHasNotes, eventIsPinned, getPinOnClick, getPinTooltip } from './helpers';
+import { eventHasNotes, getPinOnClick, getPinTooltip } from './helpers';
 import { TimelineTypeEnum } from '../../../../../common/api/timeline';
 
 describe('helpers', () => {
@@ -131,22 +131,6 @@ describe('helpers', () => {
     });
   });
 
-  describe('eventIsPinned', () => {
-    test('returns true when the specified event id is contained in the pinnedEventIds', () => {
-      const eventId = 'race-for-the-prize';
-      const pinnedEventIds = { [eventId]: true, 'waiting-for-superman': true };
-
-      expect(eventIsPinned({ eventId, pinnedEventIds })).toEqual(true);
-    });
-
-    test('returns false when the specified event id is NOT contained in the pinnedEventIds', () => {
-      const eventId = 'safety-pin';
-      const pinnedEventIds = { 'thumb-tack': true };
-
-      expect(eventIsPinned({ eventId, pinnedEventIds })).toEqual(false);
-    });
-  });
-
   describe('getPinOnClick', () => {
     const eventId = 'abcd';
 

x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/helpers.tsx

@@ -44,9 +44,6 @@ export interface IsPinnedParams {
   pinnedEventIds: Readonly<Record<string, boolean>>;
 }
 
-export const eventIsPinned = ({ eventId, pinnedEventIds }: IsPinnedParams): boolean =>
-  pinnedEventIds[eventId] === true;
-
 export interface GetPinOnClickParams {
   allowUnpinning: boolean;
   eventId: string;