[ResponseOps][Alerts] Fix optional eventId in security cell value

renderers

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

@@ -21,7 +21,7 @@ export type CellValueElementProps = EuiDataGridCellValueElementProps & {
   browserFields?: BrowserFields;
   data: TimelineNonEcsData[];
   ecsData?: Ecs;
-  eventId: string; // _id
+  eventId?: string; // _id
   header: ColumnHeaderOptions;
   isDraggable: boolean;
   isTimeline?: boolean; // Default cell renderer is used for both the alert table and timeline. This allows us to cheaply separate concerns

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

@@ -32,7 +32,7 @@ export const PreviewRenderCellValue: React.FC<
   return (
     <CellValue
       tableType={TableId.rulePreview}
-      scopeId={SourcererScopeName.detections}
+      sourcererScope={SourcererScopeName.detections}
       legacyAlert={(data ?? []) as LegacyField[]}
       ecsAlert={ecsData}
       asPlainText={true}
@@ -46,6 +46,7 @@ export const PreviewRenderCellValue: React.FC<
       rowRenderers={rowRenderers}
       isDraggable={isDraggable}
       truncate={truncate}
+      userProfiles={{ profiles: [], isLoading: false }}
     />
   );
 };

x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.tsx

@@ -28,6 +28,7 @@ import { VIEW_SELECTION } from '../../../../common/constants';
 import { getAllFieldsByName } from '../../../common/containers/source';
 import { eventRenderedViewColumns, getColumns } from './columns';
 import type { GetSecurityAlertsTableProp } from '../../components/alerts_table/types';
+import type { CellValueElementProps, ColumnHeaderOptions } from '../../../../common/types';
 
 /**
  * This implementation of `EuiDataGrid`'s `renderCellValue`
@@ -51,13 +52,15 @@ type RenderCellValueProps = Pick<
   | 'colIndex'
   | 'setCellProps'
   | 'truncate'
+  | 'sourcererScope'
+  | 'userProfiles'
 > &
-  Record<string, unknown>;
+  Partial<Omit<CellValueElementProps, 'browserFields'>>;
 
 export const CellValue = memo(function RenderCellValue({
   columnId,
   rowIndex,
-  scopeId,
+  sourcererScope,
   tableId,
   tableType,
   header,
@@ -73,7 +76,7 @@ export const CellValue = memo(function RenderCellValue({
   eventId,
   setCellProps,
   truncate,
-  context,
+  userProfiles,
 }: RenderCellValueProps) {
   const isTourAnchor = useMemo(
     () =>
@@ -83,7 +86,7 @@ export const CellValue = memo(function RenderCellValue({
       !isDetails,
     [columnId, isDetails, rowIndex, tableType]
   );
-  const { browserFields } = useSourcererDataView(scopeId);
+  const { browserFields } = useSourcererDataView(sourcererScope);
   const browserFieldsByName = useMemo(() => getAllFieldsByName(browserFields), [browserFields]);
   const getTable = useMemo(() => dataTableSelectors.getTableByIdSelector(), []);
   const license = useLicense();
@@ -134,7 +137,8 @@ export const CellValue = memo(function RenderCellValue({
   }, [ecsAlert, legacyAlert]);
 
   const Renderer = useMemo(() => {
-    const myHeader = header ?? { id: columnId, ...browserFieldsByName[columnId] };
+    const myHeader =
+      header ?? ({ id: columnId, ...browserFieldsByName[columnId] } as ColumnHeaderOptions);
     const colHeader = columnHeaders.find((col) => col.id === columnId);
     const localLinkValues = getOr([], colHeader?.linkField ?? '', ecsAlert);
     return (
@@ -159,10 +163,10 @@ export const CellValue = memo(function RenderCellValue({
           colIndex={colIndex}
           rowRenderers={rowRenderers ?? defaultRowRenderers}
           setCellProps={setCellProps}
-          scopeId={scopeId}
+          scopeId={sourcererScope}
           truncate={truncate}
           asPlainText={false}
-          context={context}
+          context={userProfiles}
         />
       </GuidedOnboardingTourStep>
     );
@@ -185,9 +189,9 @@ export const CellValue = memo(function RenderCellValue({
     colIndex,
     rowRenderers,
     setCellProps,
-    scopeId,
+    sourcererScope,
     truncate,
-    context,
+    userProfiles,
   ]);
 
   return columnId === SIGNAL_RULE_NAME_FIELD_NAME && actualSuppressionCount ? (

x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.tsx

@@ -15,7 +15,7 @@ import { PortOrServiceNameLink } from '../../../../common/components/links';
 export const Port = React.memo<{
   contextId: string;
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType?: string;
   isAggregatable?: boolean;

x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.tsx

@@ -18,7 +18,7 @@ export const EVENT_DURATION_FIELD_NAME = 'event.duration';
  */
 export const Duration = React.memo<{
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx

@@ -35,7 +35,7 @@ const getUniqueId = ({
   address,
 }: {
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   address: string | object | null | undefined;
 }) => `formatted-ip-data-provider-${contextId}-${fieldName}-${address}-${eventId}`;
@@ -55,7 +55,7 @@ const getDataProvider = ({
   address,
 }: {
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   address: string | object | null | undefined;
 }): DataProvider => ({
@@ -74,7 +74,7 @@ const getDataProvider = ({
 
 const NonDecoratedIpComponent: React.FC<{
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;
@@ -276,7 +276,7 @@ interface AddressLinksProps {
   addresses: string[];
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;
@@ -357,7 +357,7 @@ const AddressLinks = React.memo(
 const FormattedIpComponent: React.FC<{
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -14,7 +14,7 @@ import { DefaultDraggable } from '../../../../../common/components/draggables';
 
 interface Props {
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.tsx

@@ -18,7 +18,7 @@ export const BYTES_FORMAT = 'bytes';
  */
 export const Bytes = React.memo<{
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/column_renderer.ts

@@ -39,7 +39,7 @@ export interface ColumnRenderer {
     className?: string;
     columnName: string;
     ecsData?: Ecs;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     globalFilters?: Filter[];
     isDetails?: boolean;

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

@@ -34,7 +34,7 @@ export const emptyColumnRenderer: ColumnRenderer = {
     truncate,
   }: {
     columnName: string;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     isDraggable?: boolean;
     scopeId: string;

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

@@ -42,7 +42,7 @@ export const eventSummaryColumnRenderer: ColumnRenderer = {
   }: {
     columnName: string;
     ecsData?: Ecs;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     isDetails?: boolean;
     isDraggable?: boolean;

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

@@ -66,7 +66,7 @@ const FormattedFieldValueComponent: React.FC<{
   /** `Component` is only used with `EuiDataGrid`; the grid keeps a reference to `Component` for show / hide functionality */
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
   contextId: string;
-  eventId: string;
+  eventId?: string;
   isAggregatable?: boolean;
   isObjectArray?: boolean;
   isUnifiedDataTable?: boolean;

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

@@ -36,7 +36,7 @@ interface RenderRuleNameProps {
   children?: React.ReactNode;
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;
@@ -233,7 +233,7 @@ export const renderEventModule = ({
   value,
 }: {
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;
@@ -339,7 +339,7 @@ export const renderUrl = ({
   contextId: string;
   /** `Component` is only used with `EuiDataGrid`; the grid keeps a reference to `Component` for show / hide functionality */
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -20,7 +20,7 @@ import { useIsInSecurityApp } from '../../../../../common/hooks/is_in_security_a
 interface Props {
   contextId: string;
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -34,7 +34,7 @@ export const plainColumnRenderer: ColumnRenderer = {
   }: {
     asPlainText?: boolean;
     columnName: string;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     globalFilters?: Filter[];
     isDraggable?: boolean;

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

@@ -35,7 +35,7 @@ export const reasonColumnRenderer: ColumnRenderer = {
   }: {
     columnName: string;
     ecsData?: Ecs;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     isDetails?: boolean;
     isDraggable?: boolean;

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

@@ -25,7 +25,7 @@ const StyledEuiBadge = styled(EuiBadge)`
 
 interface BaseProps {
   contextId: string;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -21,7 +21,7 @@ import { useIsInSecurityApp } from '../../../../../common/hooks/is_in_security_a
 interface Props {
   contextId: string;
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -20,7 +20,7 @@ import { useIsInSecurityApp } from '../../../../../common/hooks/is_in_security_a
 interface Props {
   contextId: string;
   Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon;
-  eventId: string;
+  eventId?: string;
   fieldName: string;
   fieldType: string;
   isAggregatable: boolean;

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

@@ -33,7 +33,7 @@ export const userProfileColumnRenderer: ColumnRenderer = {
   }: {
     columnName: string;
     ecsData?: Ecs;
-    eventId: string;
+    eventId?: string;
     field: ColumnHeaderOptions;
     isDetails?: boolean;
     isDraggable?: boolean;