diff --git a/packages/kbn-babel-preset/styled_components_files.js b/packages/kbn-babel-preset/styled_components_files.js index e2e737793ec23..cd51f8ea85d91 100644 --- a/packages/kbn-babel-preset/styled_components_files.js +++ b/packages/kbn-babel-preset/styled_components_files.js @@ -225,8 +225,6 @@ module.exports = { /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]drag_and_drop[\/\\]draggable_wrapper.tsx/, /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]drag_and_drop[\/\\]droppable_wrapper.tsx/, /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]drag_and_drop[\/\\]provider_container.tsx/, - /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]draggables[\/\\]field_badge[\/\\]index.tsx/, - /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]draggables[\/\\]index.tsx/, /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]empty_page[\/\\]index.tsx/, /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]empty_value[\/\\]empty_value.test.tsx/, /x-pack[\/\\]solutions[\/\\]security[\/\\]plugins[\/\\]security_solution[\/\\]public[\/\\]common[\/\\]components[\/\\]empty_value[\/\\]index.tsx/, diff --git a/x-pack/platform/plugins/private/translations/translations/fr-FR.json b/x-pack/platform/plugins/private/translations/translations/fr-FR.json index 33fbe2b7ec510..b1c0c0ae8173b 100644 --- a/x-pack/platform/plugins/private/translations/translations/fr-FR.json +++ b/x-pack/platform/plugins/private/translations/translations/fr-FR.json @@ -39096,9 +39096,6 @@ "xpack.securitySolution.dragAndDrop.copyToClipboardTooltip": "Copier dans le Presse-papiers", "xpack.securitySolution.dragAndDrop.draggableKeyboardInstructionsNotDraggingScreenReaderOnly": "Appuyez sur Entrée pour accéder aux options ou sur la barre d'espace pour commencer le glisser-déposer.", "xpack.securitySolution.dragAndDrop.fieldLabel": "Champ", - "xpack.securitySolution.draggables.field.categoryLabel": "Catégorie", - "xpack.securitySolution.draggables.field.fieldLabel": "Champ", - "xpack.securitySolution.draggables.field.typeLabel": "Type", "xpack.securitySolution.editDataProvider.doesNotExistLabel": "n'existe pas", "xpack.securitySolution.editDataProvider.existsLabel": "existe", "xpack.securitySolution.editDataProvider.fieldLabel": "Champ", diff --git a/x-pack/platform/plugins/private/translations/translations/ja-JP.json b/x-pack/platform/plugins/private/translations/translations/ja-JP.json index 1be4124be3d11..39cd840b24a6f 100644 --- a/x-pack/platform/plugins/private/translations/translations/ja-JP.json +++ b/x-pack/platform/plugins/private/translations/translations/ja-JP.json @@ -38952,9 +38952,6 @@ "xpack.securitySolution.dragAndDrop.copyToClipboardTooltip": "クリップボードにコピー", "xpack.securitySolution.dragAndDrop.draggableKeyboardInstructionsNotDraggingScreenReaderOnly": "オプションは Enter キーを押します。ドラッグを開始するには、スペースを押します。", "xpack.securitySolution.dragAndDrop.fieldLabel": "フィールド", - "xpack.securitySolution.draggables.field.categoryLabel": "カテゴリー", - "xpack.securitySolution.draggables.field.fieldLabel": "フィールド", - "xpack.securitySolution.draggables.field.typeLabel": "型", "xpack.securitySolution.editDataProvider.doesNotExistLabel": "存在しない", "xpack.securitySolution.editDataProvider.existsLabel": "存在する", "xpack.securitySolution.editDataProvider.fieldLabel": "フィールド", diff --git a/x-pack/platform/plugins/private/translations/translations/zh-CN.json b/x-pack/platform/plugins/private/translations/translations/zh-CN.json index 39b8e995d91a3..c0d04394723c8 100644 --- a/x-pack/platform/plugins/private/translations/translations/zh-CN.json +++ b/x-pack/platform/plugins/private/translations/translations/zh-CN.json @@ -39048,9 +39048,6 @@ "xpack.securitySolution.dragAndDrop.copyToClipboardTooltip": "复制到剪贴板", "xpack.securitySolution.dragAndDrop.draggableKeyboardInstructionsNotDraggingScreenReaderOnly": "按 enter 键可显示选项，或按空格键开始拖动。", "xpack.securitySolution.dragAndDrop.fieldLabel": "字段", - "xpack.securitySolution.draggables.field.categoryLabel": "类别", - "xpack.securitySolution.draggables.field.fieldLabel": "字段", - "xpack.securitySolution.draggables.field.typeLabel": "类型", "xpack.securitySolution.editDataProvider.doesNotExistLabel": "不存在", "xpack.securitySolution.editDataProvider.existsLabel": "存在", "xpack.securitySolution.editDataProvider.fieldLabel": "字段", diff --git a/x-pack/solutions/security/plugins/security_solution/common/types/timeline/cells/index.ts b/x-pack/solutions/security/plugins/security_solution/common/types/timeline/cells/index.ts index 8435e6ec89845..d540181eaef51 100644 --- a/x-pack/solutions/security/plugins/security_solution/common/types/timeline/cells/index.ts +++ b/x-pack/solutions/security/plugins/security_solution/common/types/timeline/cells/index.ts @@ -19,7 +19,6 @@ export type CellValueElementProps = EuiDataGridCellValueElementProps & { ecsData?: Ecs; 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 linkValues: string[] | undefined; rowRenderers?: RowRenderer[]; diff --git a/x-pack/solutions/security/plugins/security_solution/common/types/timeline/rows/index.ts b/x-pack/solutions/security/plugins/security_solution/common/types/timeline/rows/index.ts index 771000adb6b6f..05f3f1ea2c041 100644 --- a/x-pack/solutions/security/plugins/security_solution/common/types/timeline/rows/index.ts +++ b/x-pack/solutions/security/plugins/security_solution/common/types/timeline/rows/index.ts @@ -14,12 +14,10 @@ export interface RowRenderer { renderRow: ({ contextId, data, - isDraggable, scopeId, }: { contextId?: string; data: Ecs; - isDraggable: boolean; scopeId: string; }) => React.ReactNode; } diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/get_host_flyout_panel_props.ts b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/get_host_flyout_panel_props.ts index 28f326e7bef34..6837b34f64f28 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/get_host_flyout_panel_props.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/get_host_flyout_panel_props.ts @@ -14,7 +14,6 @@ interface HostPanelProps extends Record { contextID: string; scopeId: string; hostName: string; - isDraggable?: boolean; } interface HostPanelExpandableFlyoutProps extends FlyoutPanelProps { diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/index.tsx index 06e252b7686dc..3c34754cbc3b5 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_markdown_formatter/field_markdown_renderer/index.tsx @@ -58,7 +58,6 @@ export const getFieldMarkdownRenderer = (disableActions: boolean) => { eventId="" iconType={icon} isAggregatable={false} - isDraggable={false} field={name} value={value} > diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/draggable_legend_item.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/draggable_legend_item.tsx index d0175b92662a8..11e97cc2fb8dc 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/draggable_legend_item.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/draggable_legend_item.tsx @@ -71,7 +71,6 @@ const DraggableLegendItemComponent: React.FC<{ field={field} hideTopN={true} id={dataProviderId} - isDraggable={false} scopeId={scopeId} value={value} > diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/__snapshots__/draggable_wrapper.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/__snapshots__/draggable_wrapper.test.tsx.snap index 0b25ff2c8c5ee..aa8214938c2b0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/__snapshots__/draggable_wrapper.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/__snapshots__/draggable_wrapper.test.tsx.snap @@ -17,7 +17,6 @@ exports[`DraggableWrapper rendering it renders against the snapshot 1`] = ` }, } } - isDraggable={true} render={[Function]} /> `; diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/drag_drop_context.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/drag_drop_context.tsx deleted file mode 100644 index 80dcac95e98a1..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/drag_drop_context.tsx +++ /dev/null @@ -1,15 +0,0 @@ -/* - * 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. - */ - -// https://github.com/DefinitelyTyped/DefinitelyTyped/pull/40309 - -import type { MovementMode, DraggableId } from '@hello-pangea/dnd'; - -export interface BeforeCapture { - draggableId: DraggableId; - mode: MovementMode; -} diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.test.tsx index cd89220c20620..6cc769debbfa9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.test.tsx @@ -15,12 +15,7 @@ import { TestProviders } from '../../mock'; import { mockDataProviders } from '../../../timelines/components/timeline/data_providers/mock/mock_data_providers'; import { ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID } from '../../../timelines/components/row_renderers_browser/constants'; import { DragDropContextWrapper } from './drag_drop_context_wrapper'; -import { - ConditionalPortal, - disableHoverActions, - DraggableWrapper, - getStyle, -} from './draggable_wrapper'; +import { disableHoverActions, DraggableWrapper, getStyle } from './draggable_wrapper'; import { useMountAppended } from '../../utils/use_mount_appended'; import { TimelineId } from '../../../../common/types'; import { TableId } from '@kbn/securitysolution-data-table'; @@ -85,11 +80,7 @@ describe('DraggableWrapper', () => { const wrapper = shallow( - message} - /> + message} /> ); @@ -101,11 +92,7 @@ describe('DraggableWrapper', () => { const wrapper = mount( - message} - /> + message} /> ); @@ -115,14 +102,11 @@ describe('DraggableWrapper', () => { scopeIdsWithHoverActions.forEach((scopeId) => { test(`it renders hover actions (by default) when 'isDraggable' is false and timelineId is '${scopeId}'`, async () => { - const isDraggable = false; - const { queryByTestId } = render( message} scopeId={scopeId} /> @@ -136,14 +120,11 @@ describe('DraggableWrapper', () => { scopeIdsNoHoverActions.forEach((scopeId) => { test(`it does NOT render hover actions when 'isDraggable' is false and timelineId is '${scopeId}'`, async () => { - const isDraggable = false; - const { queryByTestId } = render( message} scopeId={scopeId} /> @@ -161,30 +142,19 @@ describe('DraggableWrapper', () => { const wrapper = mount( - message} - truncate - /> + message} truncate /> ); - expect(wrapper.find('[data-test-subj="draggable-truncatable-content"]').exists()).toEqual( - true - ); + expect(wrapper.find('[data-test-subj="render-truncatable-content"]').exists()).toEqual(true); }); test('it does NOT apply text truncation styling when truncate is NOT specified', () => { const wrapper = mount( - message} - /> + message} /> ); @@ -197,21 +167,6 @@ describe('DraggableWrapper', () => { }); describe('ConditionalPortal', () => { - const mount = useMountAppended(); - const props = { - registerProvider: jest.fn(), - }; - - it('calls registerProvider when isDragging', () => { - mount( - -
- - ); - - expect(props.registerProvider.mock.calls.length).toEqual(1); - }); - describe('getStyle', () => { const style: DraggingStyle = { boxSizing: 'border-box', diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx index eaa1b850cb70b..04db0f329c33c 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx @@ -5,80 +5,20 @@ * 2.0. */ -import { EuiScreenReaderOnly } from '@elastic/eui'; -import { DRAGGABLE_KEYBOARD_WRAPPER_CLASS_NAME } from '@kbn/securitysolution-t-grid'; -import React, { useCallback, useEffect, useMemo, useState } from 'react'; +import React, { useMemo } from 'react'; import type { DraggableProvided, DraggableStateSnapshot, DraggingStyle, - DroppableProvided, NotDraggingStyle, } from '@hello-pangea/dnd'; -import { Draggable, Droppable } from '@hello-pangea/dnd'; -import { useDispatch } from 'react-redux'; import styled from 'styled-components'; - import { TableId } from '@kbn/securitysolution-data-table'; -import { dragAndDropActions } from '../../store/drag_and_drop'; import type { DataProvider } from '../../../timelines/components/timeline/data_providers/data_provider'; import { ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID } from '../../../timelines/components/row_renderers_browser/constants'; - import { TruncatableText } from '../truncatable_text'; import { CellActionsWrapper } from './cell_actions_wrapper'; - -import { getDraggableId, getDroppableId } from './helpers'; -import { ProviderContainer } from './provider_container'; - -import * as i18n from './translations'; - -// As right now, we do not know what we want there, we will keep it as a placeholder -export const DragEffects = styled.div``; - -DragEffects.displayName = 'DragEffects'; - -/** - * Wraps the `@hello-pangea/dnd` error boundary. See also: - * https://github.com/atlassian/react-beautiful-dnd/blob/v12.0.0/docs/guides/setup-problem-detection-and-error-recovery.md - * - * NOTE: This extends from `PureComponent` because, at the time of this - * writing, there's no hook equivalent for `componentDidCatch`, per - * https://reactjs.org/docs/hooks-faq.html#do-hooks-cover-all-use-cases-for-classes - */ -class DragDropErrorBoundary extends React.PureComponent> { - componentDidCatch() { - this.forceUpdate(); // required for recovery - } - - render() { - return this.props.children; - } -} - -interface WrapperProps { - disabled: boolean; -} - -const Wrapper = styled.div` - display: inline-block; - max-width: 100%; - - [data-rbd-placeholder-context-id] { - display: none !important; - } - - ${({ disabled }) => - disabled && - ` - [data-rbd-draggable-id]:hover, - .euiBadge:hover, - .euiBadge__text:hover { - cursor: default; - } - `} -`; - -Wrapper.displayName = 'Wrapper'; +import { getDraggableId } from './helpers'; export const ProviderContentWrapper = styled.span` > span.euiToolTipAnchor { @@ -101,7 +41,6 @@ export interface DraggableWrapperProps { fieldType?: string; isAggregatable?: boolean; hideTopN?: boolean; - isDraggable?: boolean; render: RenderFunctionProp; scopeId?: string; truncate?: boolean; @@ -129,145 +68,8 @@ export const getStyle = ( }; }; -const DraggableOnWrapper: React.FC = React.memo( - ({ dataProvider, render, scopeId, truncate, hideTopN }) => { - const [providerRegistered, setProviderRegistered] = useState(false); - const isDisabled = dataProvider.id.includes(`-${ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID}-`); - const dispatch = useDispatch(); - - const registerProvider = useCallback(() => { - if (!isDisabled) { - dispatch(dragAndDropActions.registerProvider({ provider: dataProvider })); - setProviderRegistered(true); - } - }, [isDisabled, dispatch, dataProvider]); - - const unRegisterProvider = useCallback( - () => - providerRegistered && - dispatch(dragAndDropActions.unRegisterProvider({ id: dataProvider.id })), - [providerRegistered, dispatch, dataProvider.id] - ); - - useEffect( - () => () => { - unRegisterProvider(); - }, - [unRegisterProvider] - ); - - const RenderClone = useCallback( - (provided: DraggableProvided, snapshot: DraggableStateSnapshot) => ( - -
- - {render(dataProvider, provided, snapshot)} - -
- - ), - [dataProvider, registerProvider, render] - ); - - const DraggableContent = useCallback( - (provided: DraggableProvided, snapshot: DraggableStateSnapshot) => ( - { - provided.innerRef(e); - }} - data-test-subj="providerContainer" - isDragging={snapshot.isDragging} - registerProvider={registerProvider} - tabIndex={-1} - > - -

{dataProvider.queryMatch.field}

- - {truncate && !snapshot.isDragging ? ( - - {render(dataProvider, provided, snapshot)} - - ) : ( - - {render(dataProvider, provided, snapshot)} - - )} - {!snapshot.isDragging && ( - -

{i18n.DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY}

- - )} - - ), - [dataProvider, registerProvider, render, truncate] - ); - - const DroppableContent = useCallback( - (droppableProvided: DroppableProvided) => ( -
-
- - {DraggableContent} - -
- {droppableProvided.placeholder} -
- ), - [DraggableContent, dataProvider.id, isDisabled] - ); - - const content = useMemo( - () => ( - - - - {DroppableContent} - - - - ), - [DroppableContent, RenderClone, dataProvider.id, isDisabled] - ); - - if (isDisabled) return <>{content}; - return ( - - {content} - - ); - } -); -DraggableOnWrapper.displayName = 'DraggableOnWrapper'; - export const DraggableWrapper: React.FC = React.memo( - ({ dataProvider, isDraggable = false, render, scopeId, truncate, hideTopN }) => { + ({ dataProvider, render, scopeId, truncate, hideTopN }) => { const content = useMemo( () => (
@@ -305,47 +107,14 @@ export const DraggableWrapper: React.FC = React.memo( [dataProvider, render, truncate] ); - if (!isDraggable) { - if (disableHoverActions(scopeId)) { - return <>{content}; - } - return ( - - {content} - - ); + if (disableHoverActions(scopeId)) { + return <>{content}; } return ( - + + {content} + ); } ); DraggableWrapper.displayName = 'DraggableWrapper'; -/** - * Conditionally wraps children in an EuiPortal to ensure drag offsets are correct when dragging - * from containers that have css transforms - * - * See: https://github.com/atlassian/react-beautiful-dnd/issues/499 - */ - -interface ConditionalPortalProps { - children: React.ReactNode; - registerProvider: () => void; -} - -export const ConditionalPortal = React.memo( - ({ children, registerProvider }) => { - useEffect(() => { - registerProvider(); - }, [registerProvider]); - - return <>{children}; - } -); - -ConditionalPortal.displayName = 'ConditionalPortal'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/droppable_wrapper.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/droppable_wrapper.tsx index d14a651a027a9..a80844994e3e0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/droppable_wrapper.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/drag_and_drop/droppable_wrapper.tsx @@ -24,11 +24,13 @@ const ReactDndDropTarget = styled.div<{ isDraggingOver: boolean; height: string transition: background-color 0.7s ease; width: 100%; height: ${({ height }) => height}; + .flyout-overlay { .euiPanel { background-color: ${(props) => props.theme.eui.euiFormBackgroundColor}; } } + ${(props) => props.isDraggingOver ? ` @@ -80,6 +82,7 @@ const ReactDndDropTarget = styled.div<{ isDraggingOver: boolean; height: string .drop-and-provider-timeline { display: none; } + & + div { /* Override dragNdrop beautiful so we do not have our droppable moving around for no good reason */ display: none !important; diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/__snapshots__/index.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/__snapshots__/index.test.tsx.snap index 72956a3f89312..33639b851c324 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/__snapshots__/index.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/__snapshots__/index.test.tsx.snap @@ -39,7 +39,6 @@ exports[`draggables rendering it renders the default DefaultDraggable 1`] = ` fieldType="" hideTopN={false} isAggregatable={false} - isDraggable={true} render={[Function]} /> `; diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/index.tsx deleted file mode 100644 index ac93ca3f52389..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/index.tsx +++ /dev/null @@ -1,48 +0,0 @@ -/* - * 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 { rgba } from 'polished'; -import React from 'react'; -import styled from 'styled-components'; - -interface WidthProp { - width?: number; -} - -const Field = styled.div.attrs(({ width }) => { - if (width) { - return { - style: { - width: `${width}px`, - }, - }; - } -})` - background-color: ${({ theme }) => theme.eui.euiColorEmptyShade}; - border: ${({ theme }) => theme.eui.euiBorderThin}; - box-shadow: 0 2px 2px -1px ${({ theme }) => rgba(theme.eui.euiColorMediumShade, 0.3)}, - 0 1px 5px -2px ${({ theme }) => rgba(theme.eui.euiColorMediumShade, 0.3)}; - font-size: ${({ theme }) => theme.eui.euiFontSizeXS}; - font-weight: ${({ theme }) => theme.eui.euiFontWeightSemiBold}; - line-height: ${({ theme }) => theme.eui.euiLineHeight}; - padding: ${({ theme }) => theme.eui.euiSizeXS}; -`; -Field.displayName = 'Field'; - -/** - * Renders a field (e.g. `event.action`) as a draggable badge - */ - -export const DraggableFieldBadge = React.memo<{ fieldId: string; fieldWidth?: number }>( - ({ fieldId, fieldWidth }) => ( - - {fieldId} - - ) -); - -DraggableFieldBadge.displayName = 'DraggableFieldBadge'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/translations.ts b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/translations.ts deleted file mode 100644 index 25e2eaf98329c..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/field_badge/translations.ts +++ /dev/null @@ -1,20 +0,0 @@ -/* - * 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 { i18n } from '@kbn/i18n'; - -export const CATEGORY = i18n.translate('xpack.securitySolution.draggables.field.categoryLabel', { - defaultMessage: 'Category', -}); - -export const FIELD = i18n.translate('xpack.securitySolution.draggables.field.fieldLabel', { - defaultMessage: 'Field', -}); - -export const TYPE = i18n.translate('xpack.securitySolution.draggables.field.typeLabel', { - defaultMessage: 'Type', -}); diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx index d1c90890d7d81..2613714d5d9d1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx @@ -8,8 +8,6 @@ import { shallow } from 'enzyme'; import React from 'react'; import { EuiToolTip } from '@elastic/eui'; - -import { DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY } from '../drag_and_drop/translations'; import { TestProviders } from '../../mock'; import { getEmptyString } from '../empty_value'; import { useMountAppended } from '../../utils/use_mount_appended'; @@ -112,9 +110,7 @@ describe('draggables', () => { ); - expect(wrapper.text()).toEqual( - `${field}${value}${DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY}` - ); + expect(wrapper.text()).toEqual(value); }); test('it returns null if value is undefined', () => { @@ -206,9 +202,7 @@ describe('draggables', () => { /> ); - expect(wrapper.text()).toEqual( - `some-fieldsome value${DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY}` - ); + expect(wrapper.text()).toEqual('some value'); }); test('it returns null if value is undefined', () => { @@ -249,9 +243,7 @@ describe('draggables', () => { /> ); - expect(wrapper.text()).toEqual( - `some-field${getEmptyString()}${DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY}` - ); + expect(wrapper.text()).toEqual(getEmptyString()); }); test('it renders a tooltip with the field name if a tooltip is not explicitly provided', () => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.tsx index a39dab525b5d4..625fbff36568e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.tsx @@ -5,23 +5,21 @@ * 2.0. */ -import { EuiBadge, EuiToolTip } from '@elastic/eui'; import type { IconType, ToolTipPositions } from '@elastic/eui'; +import { EuiBadge, EuiToolTip } from '@elastic/eui'; import React, { useCallback, useMemo } from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import type { DraggableWrapperProps } from '../drag_and_drop/draggable_wrapper'; -import { DragEffects, DraggableWrapper } from '../drag_and_drop/draggable_wrapper'; +import { DraggableWrapper } from '../drag_and_drop/draggable_wrapper'; import { escapeDataProviderId } from '../drag_and_drop/helpers'; import { getEmptyStringTag } from '../empty_value'; import type { DataProvider } from '../../../timelines/components/timeline/data_providers/data_provider'; import { IS_OPERATOR } from '../../../timelines/components/timeline/data_providers/data_provider'; -import { Provider } from '../../../timelines/components/timeline/data_providers/provider'; export interface DefaultDraggableType { hideTopN?: boolean; id: string; - isDraggable?: boolean; fieldType?: string; isAggregatable?: boolean; field: string; @@ -87,7 +85,6 @@ Content.displayName = 'Content'; * that's only displayed when the specified value is non-`null`. * * @param id - a unique draggable id, which typically follows the format `${contextId}-${eventId}-${field}-${value}` - * @param isDraggable - optional prop to disable drag & drop and it will defaulted to true * @param field - the name of the field, e.g. `network.transport` * @param value - value of the field e.g. `tcp` * @param name - defaulting to `field`, this optional human readable name is used by the `DataProvider` that represents the data @@ -102,7 +99,6 @@ export const DefaultDraggable = React.memo( ({ hideTopN = false, id, - isDraggable = true, field, fieldType = '', isAggregatable = false, @@ -133,21 +129,16 @@ export const DefaultDraggable = React.memo( ); const renderCallback = useCallback( - (dataProvider, _, snapshot) => - snapshot.isDragging ? ( - - - - ) : ( - - {children} - - ), + () => ( + + {children} + + ), [children, field, tooltipContent, tooltipPosition, value] ); @@ -159,7 +150,6 @@ export const DefaultDraggable = React.memo( fieldType={fieldType} isAggregatable={isAggregatable} hideTopN={hideTopN} - isDraggable={isDraggable} render={renderCallback} scopeId={scopeId} truncate={truncate} @@ -180,7 +170,6 @@ export type BadgeDraggableType = Omit & { contextId: string; eventId: string; iconType?: IconType; - color?: string; }; /** @@ -191,9 +180,7 @@ export type BadgeDraggableType = Omit & { * @param field - the name of the field, e.g. `network.transport` * @param value - value of the field e.g. `tcp` * @param iconType -the (optional) type of icon e.g. `snowflake` to display on the badge - * @param isDraggable * @param name - defaulting to `field`, this optional human readable name is used by the `DataProvider` that represents the data - * @param color - defaults to `hollow`, optionally overwrite the color of the badge icon * @param children - defaults to displaying `value`, this allows an arbitrary visualization to be displayed in lieu of the default behavior * @param tooltipContent - defaults to displaying `field`, pass `null` to * prevent a tooltip from being displayed, or pass arbitrary content @@ -205,11 +192,9 @@ const DraggableBadgeComponent: React.FC = ({ field, value, iconType, - isDraggable, isAggregatable, fieldType, name, - color = 'hollow', children, scopeId, tooltipContent, @@ -218,7 +203,6 @@ const DraggableBadgeComponent: React.FC = ({ value != null ? ( = ({ tooltipContent={tooltipContent} queryValue={queryValue} > - + {children ? children : value !== '' ? value : getEmptyStringTag()} diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/alerts_by_rule.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/alerts_by_rule.tsx index d213f3026f4e7..4f4e039724867 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/alerts_by_rule.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/alerts_by_rule.tsx @@ -39,7 +39,6 @@ const COLUMNS: Array> = [ render: (rule: string) => ( = ({ const labelWithHoverActions = (key: string) => { return ( ( ` }}; } } + div .euiDataGridRowCell { display: flex; align-items: center; } + div .euiDataGridRowCell > [data-focus-lock-disabled] { display: flex; align-items: center; flex-grow: 1; width: 100%; } + div .euiDataGridRowCell__content { flex-grow: 1; } + div .siemEventsTable__trSupplement--summary { display: block; } + width: 100%; `; + interface DetectionEngineAlertTableProps { configId: string; inputFilters: Filter[]; @@ -269,7 +275,6 @@ export const AlertsTableComponent: FC = ({ rowRenderers: defaultRowRenderers, isDetails: false, truncate: true, - isDraggable: false, }; }, []); diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.test.tsx index b98729b54673a..badeb55f72005 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.test.tsx @@ -43,7 +43,6 @@ describe('RenderCellValue', () => { eventId, header, isDetails: false, - isDraggable: true, isExpandable: false, isExpanded: false, linkValues, diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.tsx index 761ad573a5cd8..e6721110f0388 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/observablity_alerts/render_cell_value.tsx @@ -35,7 +35,6 @@ export const RenderCellValue: React.FC< eventId, header, isDetails, - isDraggable, isExpandable, isExpanded, linkValues, @@ -79,7 +78,6 @@ export const RenderCellValue: React.FC< eventId={eventId} header={header} isDetails={isDetails} - isDraggable={isDraggable} isExpandable={isExpandable} isExpanded={isExpanded} linkValues={linkValues} diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/columns.ts b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/columns.ts deleted file mode 100644 index 4ff885d729322..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/columns.ts +++ /dev/null @@ -1,45 +0,0 @@ -/* - * 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 { EuiDataGridColumn } from '@elastic/eui'; -import type { ColumnHeaderOptions } from '../../../../../common/types'; -import { defaultColumnHeaderType } from '../../../../timelines/components/timeline/body/column_headers/default_headers'; -import { DEFAULT_DATE_COLUMN_MIN_WIDTH } from '../../../../timelines/components/timeline/body/constants'; - -import * as i18n from '../../../components/alerts_table/translations'; - -/** - * columns implements a subset of `EuiDataGrid`'s `EuiDataGridColumn` interface, - * plus additional TGrid column properties - */ -export const columns: Array< - Pick & ColumnHeaderOptions -> = [ - { - columnHeaderType: defaultColumnHeaderType, - id: '@timestamp', - initialWidth: DEFAULT_DATE_COLUMN_MIN_WIDTH + 5, - }, - { - columnHeaderType: defaultColumnHeaderType, - id: 'kibana.alert.rule.name', - displayAsText: i18n.ALERTS_HEADERS_RULE_NAME, - linkField: 'kibana.alert.rule.uuid', - initialWidth: 212, - }, - { - columnHeaderType: defaultColumnHeaderType, - id: 'kibana.alert.severity', - displayAsText: i18n.ALERTS_HEADERS_SEVERITY, - initialWidth: 104, - }, - { - columnHeaderType: defaultColumnHeaderType, - id: 'kibana.alert.reason', - displayAsText: i18n.ALERTS_HEADERS_REASON, - }, -]; diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/index.ts b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/index.ts deleted file mode 100644 index dfd4d9499f6e5..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/index.ts +++ /dev/null @@ -1,11 +0,0 @@ -/* - * 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 { columns } from './columns'; -import { RenderCellValue } from './render_cell_value'; - -export { columns, RenderCellValue }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.test.tsx deleted file mode 100644 index fd3c9d10a7f08..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.test.tsx +++ /dev/null @@ -1,94 +0,0 @@ -/* - * 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 { mount } from 'enzyme'; -import { cloneDeep } from 'lodash/fp'; -import React from 'react'; - -import { mockBrowserFields } from '../../../../common/containers/source/mock'; -import { DragDropContextWrapper } from '../../../../common/components/drag_and_drop/drag_drop_context_wrapper'; -import { defaultHeaders, mockTimelineData, TestProviders } from '../../../../common/mock'; -import type { TimelineNonEcsData } from '../../../../../common/search_strategy/timeline'; -import type { CellValueElementProps } from '../../../../timelines/components/timeline/cell_rendering'; -import { DefaultCellRenderer } from '../../../../timelines/components/timeline/cell_rendering/default_cell_renderer'; - -import { RenderCellValue } from '.'; -import type { ColumnHeaderOptions } from '../../../../../common/types'; - -jest.mock('../../../../common/lib/kibana'); - -describe('RenderCellValue', () => { - const columnId = '@timestamp'; - const eventId = '_id-123'; - const linkValues = ['foo', 'bar', '@baz']; - const rowIndex = 5; - const scopeId = 'table-test'; - - let data: TimelineNonEcsData[]; - let header: ColumnHeaderOptions; - let props: CellValueElementProps; - - beforeEach(() => { - data = cloneDeep(mockTimelineData[0].data); - header = cloneDeep(defaultHeaders[0]); - props = { - columnId, - data, - eventId, - header, - isDetails: false, - isDraggable: false, - isExpandable: false, - isExpanded: false, - linkValues, - rowIndex, - colIndex: 0, - setCellProps: jest.fn(), - scopeId, - }; - }); - - test('it renders a custom severity', () => { - const wrapper = mount( - - - - - - ); - - expect(wrapper.find('[data-test-subj="custom-severity"]').exists()).toBe(true); - }); - - test('it renders a custom reason', () => { - const wrapper = mount( - - - - - - ); - - expect(wrapper.find('[data-test-subj="custom-reason"]').exists()).toBe(true); - }); - - test('it forwards the `CellValueElementProps` to the `DefaultCellRenderer` for any other field', () => { - const aRandomFieldName = 'a.random.field.name'; - const wrapper = mount( - - - - - - ); - - expect(wrapper.find(DefaultCellRenderer).first().props()).toEqual({ - ...props, - columnId: aRandomFieldName, - }); - }); -}); diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.tsx deleted file mode 100644 index 62eddb4b6b49c..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/examples/security_solution_rac/render_cell_value.tsx +++ /dev/null @@ -1,87 +0,0 @@ -/* - * 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 } from '@elastic/eui'; -import { ALERT_SEVERITY, ALERT_REASON } from '@kbn/rule-data-utils'; -import React from 'react'; - -import { useGetMappedNonEcsValue } from '../../../../common/utils/get_mapped_non_ecs_value'; -import { DefaultDraggable } from '../../../../common/components/draggables'; -import { TruncatableText } from '../../../../common/components/truncatable_text'; -import { Severity } from '../../../components/severity'; -import type { CellValueElementProps } from '../../../../timelines/components/timeline/cell_rendering'; -import { DefaultCellRenderer } from '../../../../timelines/components/timeline/cell_rendering/default_cell_renderer'; - -const reason = - 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'; - -/** - * This implementation of `EuiDataGrid`'s `renderCellValue` - * accepts `EuiDataGridCellValueElementProps`, plus `data` - * from the TGrid - */ -export const RenderCellValue: React.FC< - EuiDataGridCellValueElementProps & CellValueElementProps -> = ({ - columnId, - data, - eventId, - header, - isDetails, - isExpandable, - isExpanded, - linkValues, - rowIndex, - colIndex, - setCellProps, - key, - scopeId, -}) => { - const value = - useGetMappedNonEcsValue({ - data, - fieldName: columnId, - })?.reduce((x) => x[0]) ?? ''; - const draggableId = `${key}-${eventId}-${columnId}-${value}`; - - switch (columnId) { - case 'signal.rule.severity': - case ALERT_SEVERITY: - return ( - - - - ); - case 'signal.reason': - case ALERT_REASON: - return {reason}; - default: - return ( - - ); - } -}; diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.test.tsx index 926109d90558d..0af681c3a7ac2 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.test.tsx @@ -51,7 +51,6 @@ describe('RenderCellValue', () => { eventId, header, isDetails: false, - isDraggable: false, isExpandable: false, isExpanded: false, linkValues, diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.tsx index dedc86f50366b..4dbc97fd09310 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/configurations/security_solution_detections/render_cell_value.tsx @@ -5,13 +5,13 @@ * 2.0. */ -import { EuiIcon, EuiToolTip, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; import type { EuiDataGridCellProps } from '@elastic/eui'; -import React, { useMemo, memo } from 'react'; +import { EuiFlexGroup, EuiFlexItem, EuiIcon, EuiToolTip } from '@elastic/eui'; +import React, { memo, useMemo } from 'react'; import { find, getOr } from 'lodash/fp'; import type { TimelineNonEcsData } from '@kbn/timelines-plugin/common'; -import { tableDefaults, dataTableSelectors } from '@kbn/securitysolution-data-table'; import type { TableId } from '@kbn/securitysolution-data-table'; +import { dataTableSelectors, tableDefaults } from '@kbn/securitysolution-data-table'; import { useLicense } from '../../../common/hooks/use_license'; import { useDeepEqualSelector } from '../../../common/hooks/use_selector'; import { defaultRowRenderers } from '../../../timelines/components/timeline/body/renderers'; @@ -51,7 +51,6 @@ export const RenderCellValue: React.FC( id, ip, data, - isDraggable = false, isInDetailsSidePanel = false, // Rather than duplicate the component, alter the structure based on it's location loading, flowTarget, @@ -86,14 +84,13 @@ export const IpOverview = React.memo( description: locationRenderer( [`${flowTarget}.geo.city_name`, `${flowTarget}.geo.region_name`], data, - contextID, - isDraggable + contextID ), }, { title: i18n.AUTONOMOUS_SYSTEM, description: typeData - ? autonomousSystemRenderer(typeData.autonomousSystem, flowTarget, contextID, isDraggable) + ? autonomousSystemRenderer(typeData.autonomousSystem, flowTarget, contextID) : getEmptyTagValue(), }, ]; @@ -148,15 +145,13 @@ export const IpOverview = React.memo( title: i18n.HOST_ID, description: typeData && data.host - ? hostIdRenderer({ host: data.host, isDraggable, ipFilter: ip, contextID }) + ? hostIdRenderer({ host: data.host, ipFilter: ip, contextID }) : getEmptyTagValue(), }, { title: i18n.HOST_NAME, description: - typeData && data.host - ? hostNameRenderer(data.host, ip, contextID, isDraggable) - : getEmptyTagValue(), + typeData && data.host ? hostNameRenderer(data.host, ip, contextID) : getEmptyTagValue(), }, ], [ diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/direction/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/direction/index.tsx index 159b05ce835db..8501d02097597 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/direction/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/direction/index.tsx @@ -60,14 +60,12 @@ export const DirectionBadge = React.memo<{ contextId: string; direction?: string | null; eventId: string; - isDraggable?: boolean; -}>(({ contextId, eventId, direction, isDraggable }) => ( +}>(({ contextId, eventId, direction }) => ( { expect(wrapper.find('[data-test-subj="formatted-ip"]').first().text()).toEqual('10.1.2.3'); }); - test('it dispalys a button which opens the network/ip side panel', () => { + test('it displays a button which opens the network/ip side panel', () => { const wrapper = mount( ); - expect( - wrapper.find('[data-test-subj="draggable-truncatable-content"]').find('a').first().text() - ).toEqual('10.1.2.3'); + expect(wrapper.find('[data-test-subj="network-details"]').find('a').first().text()).toEqual( + '10.1.2.3' + ); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/ip/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/ip/index.tsx index ada0dc97999e5..169e4ebea3530 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/ip/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/ip/index.tsx @@ -22,15 +22,13 @@ export const Ip = React.memo<{ contextId: string; eventId: string; fieldName: string; - isDraggable?: boolean; value?: string | null; -}>(({ contextId, eventId, fieldName, isDraggable, value }) => ( +}>(({ contextId, eventId, fieldName, value }) => ( - - + `; diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.test.tsx index dcadb66c546c6..09b749a8d1858 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.test.tsx @@ -28,46 +28,28 @@ describe('Port', () => { const mount = useMountAppended(); test('renders correctly against snapshot', () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); test('it renders the port', () => { const wrapper = mount( - + ); expect( - removeExternalLinkText(wrapper.find('[data-test-subj="port"]').first().text()) + removeExternalLinkText( + wrapper.find('[data-test-subj="port-or-service-name-link"]').first().text() + ) ).toContain('443'); }); test('it hyperlinks links destination.port to an external service that describes the purpose of the port', () => { const wrapper = mount( - + ); @@ -77,20 +59,4 @@ describe('Port', () => { 'https://www.iana.org/assignments/service-names-port-numbers/service-names-port-numbers.xhtml?search=443' ); }); - - test('it renders only one external link icon', () => { - const wrapper = mount( - - - - ); - - expect(wrapper.find('span [data-euiicon-type="popout"]').length).toBe(1); - }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.tsx index 102143e54c959..392481560e541 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/port/index.tsx @@ -7,57 +7,19 @@ import type { EuiButtonEmpty, EuiButtonIcon } from '@elastic/eui'; import React from 'react'; - -import { DefaultDraggable } from '../../../../common/components/draggables'; import { getEmptyValue } from '../../../../common/components/empty_value'; import { PortOrServiceNameLink } from '../../../../common/components/links'; export const Port = React.memo<{ - contextId: string; Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - eventId: string; - fieldName: string; - fieldType?: string; - isAggregatable?: boolean; - isDraggable?: boolean; title?: string; value: string | undefined | null; -}>( - ({ - Component, - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, - title, - value, - }) => - isDraggable ? ( - - - - ) : ( - - ) -); +}>(({ Component, title, value }) => ( + +)); Port.displayName = 'Port'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/geo_fields.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/geo_fields.tsx index 65521d03f3d38..f6f025a60d229 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/geo_fields.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/geo_fields.tsx @@ -73,9 +73,8 @@ const GeoFieldValues = React.memo<{ contextId: string; eventId: string; fieldName: string; - isDraggable?: boolean; values?: string[] | null; -}>(({ contextId, eventId, fieldName, isDraggable, values }) => +}>(({ contextId, eventId, fieldName, values }) => values != null ? ( <> {uniq(values).map((value) => ( @@ -93,7 +92,6 @@ const GeoFieldValues = React.memo<{ data-test-subj={fieldName} field={fieldName} id={`geo-field-values-default-draggable-${contextId}-${eventId}-${fieldName}-${value}`} - isDraggable={isDraggable} tooltipContent={fieldName} value={value} /> @@ -116,7 +114,7 @@ GeoFieldValues.displayName = 'GeoFieldValues'; * - `source|destination.geo.city_name` */ export const GeoFields = React.memo((props) => { - const { contextId, eventId, isDraggable, type } = props; + const { contextId, eventId, type } = props; const propNameToFieldName = getGeoFieldPropNameToFieldNameMap(type); return ( @@ -126,7 +124,6 @@ export const GeoFields = React.memo((props) => { contextId={contextId} eventId={eventId} fieldName={geo.fieldName} - isDraggable={isDraggable} key={geo.fieldName} values={get(geo.prop, props)} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.test.tsx index 32ceb137ef907..985631be7bb79 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.test.tsx @@ -152,7 +152,7 @@ describe('SourceDestination', () => { test('it renders destination.geo.continent_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.continent_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.continent_name').textContent).toBe( 'North America' ); }); @@ -160,7 +160,7 @@ describe('SourceDestination', () => { test('it renders destination.geo.country_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.country_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.country_name').textContent).toBe( 'United States' ); }); @@ -168,15 +168,15 @@ describe('SourceDestination', () => { test('it renders destination.geo.country_iso_code', () => { render({getSourceDestinationInstance()}); - expect( - screen.getByTestId('draggable-content-destination.geo.country_iso_code').textContent - ).toBe('US'); + expect(screen.getByTestId('render-content-destination.geo.country_iso_code').textContent).toBe( + 'US' + ); }); test('it renders destination.geo.region_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.region_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.region_name').textContent).toBe( 'New York' ); }); @@ -184,7 +184,7 @@ describe('SourceDestination', () => { test('it renders destination.geo.city_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.city_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.city_name').textContent).toBe( 'New York' ); }); @@ -269,7 +269,7 @@ describe('SourceDestination', () => { test('it renders source.geo.continent_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.continent_name').textContent).toBe( + expect(screen.getByTestId('render-content-source.geo.continent_name').textContent).toBe( 'North America' ); }); @@ -277,7 +277,7 @@ describe('SourceDestination', () => { test('it renders source.geo.country_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.country_name').textContent).toBe( + expect(screen.getByTestId('render-content-source.geo.country_name').textContent).toBe( 'United States' ); }); @@ -285,25 +285,19 @@ describe('SourceDestination', () => { test('it renders source.geo.country_iso_code', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.country_iso_code').textContent).toBe( - 'US' - ); + expect(screen.getByTestId('render-content-source.geo.country_iso_code').textContent).toBe('US'); }); test('it renders source.geo.region_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.region_name').textContent).toBe( - 'Georgia' - ); + expect(screen.getByTestId('render-content-source.geo.region_name').textContent).toBe('Georgia'); }); test('it renders source.geo.city_name', () => { render({getSourceDestinationInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.city_name').textContent).toBe( - 'Atlanta' - ); + expect(screen.getByTestId('render-content-source.geo.city_name').textContent).toBe('Atlanta'); }); test('it renders the source ip and port, separated with a colon', () => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.tsx index b546716e58ab4..ecc40a6243d5e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/index.tsx @@ -36,7 +36,6 @@ export const SourceDestination = React.memo( destinationPackets, destinationPort, eventId, - isDraggable, networkBytes, networkCommunityId, networkDirection, @@ -62,7 +61,6 @@ export const SourceDestination = React.memo( contextId={contextId} direction={networkDirection} eventId={eventId} - isDraggable={isDraggable} protocol={networkProtocol} transport={transport} /> @@ -81,7 +79,6 @@ export const SourceDestination = React.memo( destinationPackets={destinationPackets} destinationPort={destinationPort} eventId={eventId} - isDraggable={isDraggable} sourceBytes={sourceBytes} sourceGeoContinentName={sourceGeoContinentName} sourceGeoCountryName={sourceGeoCountryName} diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/ip_with_port.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/ip_with_port.tsx index e99aecbc535e7..e0f17103fbeb8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/ip_with_port.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/ip_with_port.tsx @@ -23,26 +23,15 @@ IpPortSeparator.displayName = 'IpPortSeparator'; * a port is specified */ const PortWithSeparator = React.memo<{ - contextId: string; - eventId: string; - isDraggable?: boolean; port?: string | null; - portFieldName: string; -}>(({ contextId, eventId, isDraggable, port, portFieldName }) => { +}>(({ port }) => { return port != null ? ( {':'} - + ) : null; @@ -59,10 +48,8 @@ export const IpWithPort = React.memo<{ eventId: string; ip?: string | null; ipFieldName: string; - isDraggable?: boolean; port?: string | null; - portFieldName: string; -}>(({ contextId, eventId, ip, ipFieldName, isDraggable, port, portFieldName }) => ( +}>(({ contextId, eventId, ip, ipFieldName, port }) => ( - + )); diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/network.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/network.tsx index ff29cdcb0f5b4..47c27aa542457 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/network.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/network.tsx @@ -45,124 +45,101 @@ export const Network = React.memo<{ contextId: string; direction?: string[] | null; eventId: string; - isDraggable?: boolean; packets?: string[] | null; protocol?: string[] | null; transport?: string[] | null; -}>( - ({ - bytes, - communityId, - contextId, - direction, - eventId, - isDraggable, - packets, - protocol, - transport, - }) => ( - - {direction != null - ? uniq(direction).map((dir) => ( - - - - )) - : null} - - {protocol != null - ? uniq(protocol).map((proto) => ( - - - - )) - : null} +}>(({ bytes, communityId, contextId, direction, eventId, packets, protocol, transport }) => ( + + {direction != null + ? uniq(direction).map((dir) => ( + + + + )) + : null} - {bytes != null - ? uniq(bytes).map((b) => - !isNaN(Number(b)) ? ( - - - - - - - - - - ) : null - ) - : null} + {protocol != null + ? uniq(protocol).map((proto) => ( + + + + )) + : null} - {packets != null - ? uniq(packets).map((p) => ( - + {bytes != null + ? uniq(bytes).map((b) => + !isNaN(Number(b)) ? ( + - {`${p} ${i18n.PACKETS}`} + + + - )) - : null} + ) : null + ) + : null} - {transport != null - ? uniq(transport).map((trans) => ( - - - - )) - : null} + {packets != null + ? uniq(packets).map((p) => ( + + + + {`${p} ${i18n.PACKETS}`} + + + + )) + : null} + + {transport != null + ? uniq(transport).map((trans) => ( + + + + )) + : null} - {communityId != null - ? uniq(communityId).map((trans) => ( - - - - )) - : null} - - ) -); + {communityId != null + ? uniq(communityId).map((trans) => ( + + + + )) + : null} + +)); Network.displayName = 'Network'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_arrows.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_arrows.tsx index 050dedd79325c..b827648445f7e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_arrows.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_arrows.tsx @@ -56,11 +56,10 @@ Data.displayName = 'Data'; const SourceArrow = React.memo<{ contextId: string; eventId: string; - isDraggable?: boolean; sourceBytes: string | undefined; sourceBytesPercent: number | undefined; sourcePackets: string | undefined; -}>(({ contextId, eventId, isDraggable, sourceBytes, sourceBytesPercent, sourcePackets }) => { +}>(({ contextId, eventId, sourceBytes, sourceBytesPercent, sourcePackets }) => { const sourceArrowHeight = sourceBytesPercent != null ? getArrowHeightFromPercent(sourceBytesPercent) @@ -77,7 +76,6 @@ const SourceArrow = React.memo<{ @@ -101,7 +99,6 @@ const SourceArrow = React.memo<{ @@ -134,77 +131,65 @@ const DestinationArrow = React.memo<{ destinationBytesPercent: number | undefined; destinationPackets: string | undefined; eventId: string; - isDraggable?: boolean; -}>( - ({ - contextId, - destinationBytes, - destinationBytesPercent, - destinationPackets, - eventId, - isDraggable, - }) => { - const destinationArrowHeight = - destinationBytesPercent != null - ? getArrowHeightFromPercent(destinationBytesPercent) - : DEFAULT_ARROW_HEIGHT; - - return ( - - - - +}>(({ contextId, destinationBytes, destinationBytesPercent, destinationPackets, eventId }) => { + const destinationArrowHeight = + destinationBytesPercent != null + ? getArrowHeightFromPercent(destinationBytesPercent) + : DEFAULT_ARROW_HEIGHT; - - - + return ( + + + + - {destinationBytes != null && !isNaN(Number(destinationBytes)) ? ( - - - - {destinationBytesPercent != null ? ( - {`(${numeral(destinationBytesPercent).format('0.00')}%)`} - ) : null} - - - - - - - ) : null} + + + + {destinationBytes != null && !isNaN(Number(destinationBytes)) ? ( - + + + {destinationBytesPercent != null ? ( + {`(${numeral(destinationBytesPercent).format('0.00')}%)`} + ) : null} + + + + + + ) : null} - {destinationPackets != null && !isNaN(Number(destinationPackets)) ? ( - - - - {`${numeral(destinationPackets).format('0,0')} ${i18n.PACKETS}`} - - - - ) : null} + + + + {destinationPackets != null && !isNaN(Number(destinationPackets)) ? ( - + + + {`${numeral(destinationPackets).format('0,0')} ${i18n.PACKETS}`} + + - - ); - } -); + ) : null} + + + + + + ); +}); DestinationArrow.displayName = 'DestinationArrow'; @@ -217,78 +202,65 @@ export const SourceDestinationArrows = React.memo<{ destinationBytes?: string[] | null; destinationPackets?: string[] | null; eventId: string; - isDraggable?: boolean; sourceBytes?: string[] | null; sourcePackets?: string[] | null; -}>( - ({ - contextId, - destinationBytes, - destinationPackets, - eventId, - isDraggable, - sourceBytes, - sourcePackets, - }) => { - const maybeSourceBytes = - sourceBytes != null && hasOneValue(sourceBytes) ? sourceBytes[0] : undefined; - - const maybeSourcePackets = - sourcePackets != null && hasOneValue(sourcePackets) ? sourcePackets[0] : undefined; - - const maybeDestinationBytes = - destinationBytes != null && hasOneValue(destinationBytes) ? destinationBytes[0] : undefined; - - const maybeDestinationPackets = - destinationPackets != null && hasOneValue(destinationPackets) - ? destinationPackets[0] - : undefined; - - const maybeSourceBytesPercent = - maybeSourceBytes != null && maybeDestinationBytes != null - ? getPercent({ - numerator: Number(maybeSourceBytes), - denominator: Number(maybeSourceBytes) + Number(maybeDestinationBytes), - }) - : undefined; - - const maybeDestinationBytesPercent = - maybeSourceBytesPercent != null ? 100 - maybeSourceBytesPercent : undefined; - - return ( - - {maybeSourceBytes != null ? ( - - - - ) : null} - {maybeDestinationBytes != null ? ( - - - - ) : null} - - ); - } -); +}>(({ contextId, destinationBytes, destinationPackets, eventId, sourceBytes, sourcePackets }) => { + const maybeSourceBytes = + sourceBytes != null && hasOneValue(sourceBytes) ? sourceBytes[0] : undefined; + + const maybeSourcePackets = + sourcePackets != null && hasOneValue(sourcePackets) ? sourcePackets[0] : undefined; + + const maybeDestinationBytes = + destinationBytes != null && hasOneValue(destinationBytes) ? destinationBytes[0] : undefined; + + const maybeDestinationPackets = + destinationPackets != null && hasOneValue(destinationPackets) + ? destinationPackets[0] + : undefined; + + const maybeSourceBytesPercent = + maybeSourceBytes != null && maybeDestinationBytes != null + ? getPercent({ + numerator: Number(maybeSourceBytes), + denominator: Number(maybeSourceBytes) + Number(maybeDestinationBytes), + }) + : undefined; + + const maybeDestinationBytesPercent = + maybeSourceBytesPercent != null ? 100 - maybeSourceBytesPercent : undefined; + + return ( + + {maybeSourceBytes != null ? ( + + + + ) : null} + {maybeDestinationBytes != null ? ( + + + + ) : null} + + ); +}); SourceDestinationArrows.displayName = 'SourceDestinationArrows'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.test.tsx index 9e26df10e22b5..1fb5f25cd1cb9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.test.tsx @@ -940,7 +940,6 @@ describe('SourceDestinationIp', () => { destinationIp={asArrayIfExists(get(DESTINATION_IP_FIELD_NAME, getMockNetflowData()))} destinationPort={asArrayIfExists(get(DESTINATION_PORT_FIELD_NAME, getMockNetflowData()))} eventId={get(ID_FIELD_NAME, getMockNetflowData())} - isDraggable={true} sourceGeoContinentName={asArrayIfExists( get(SOURCE_GEO_CONTINENT_NAME_FIELD_NAME, getMockNetflowData()) )} @@ -990,7 +989,6 @@ describe('SourceDestinationIp', () => { destinationIp={asArrayIfExists(get(DESTINATION_IP_FIELD_NAME, getMockNetflowData()))} destinationPort={asArrayIfExists(get(DESTINATION_PORT_FIELD_NAME, getMockNetflowData()))} eventId={get(ID_FIELD_NAME, getMockNetflowData())} - isDraggable={true} sourceGeoContinentName={asArrayIfExists( get(SOURCE_GEO_CONTINENT_NAME_FIELD_NAME, getMockNetflowData()) )} @@ -1040,7 +1038,6 @@ describe('SourceDestinationIp', () => { destinationIp={asArrayIfExists(get(DESTINATION_IP_FIELD_NAME, getMockNetflowData()))} destinationPort={asArrayIfExists(get(DESTINATION_PORT_FIELD_NAME, getMockNetflowData()))} eventId={get(ID_FIELD_NAME, getMockNetflowData())} - isDraggable={true} sourceGeoContinentName={asArrayIfExists( get(SOURCE_GEO_CONTINENT_NAME_FIELD_NAME, getMockNetflowData()) )} @@ -1091,7 +1088,6 @@ describe('SourceDestinationIp', () => { destinationIp={undefined} destinationPort={asArrayIfExists(get(DESTINATION_PORT_FIELD_NAME, getMockNetflowData()))} eventId={get(ID_FIELD_NAME, getMockNetflowData())} - isDraggable={true} sourceGeoContinentName={asArrayIfExists( get(SOURCE_GEO_CONTINENT_NAME_FIELD_NAME, getMockNetflowData()) )} @@ -1241,7 +1237,6 @@ describe('SourceDestinationIp', () => { destinationIp={asArrayIfExists(get(DESTINATION_IP_FIELD_NAME, getMockNetflowData()))} destinationPort={asArrayIfExists(get(DESTINATION_PORT_FIELD_NAME, getMockNetflowData()))} eventId={get(ID_FIELD_NAME, getMockNetflowData())} - isDraggable={true} sourceGeoContinentName={asArrayIfExists( get(SOURCE_GEO_CONTINENT_NAME_FIELD_NAME, getMockNetflowData()) )} @@ -1264,7 +1259,7 @@ describe('SourceDestinationIp', () => { ); - expect(screen.getByTestId('draggable-content-source.geo.continent_name').textContent).toBe( + expect(screen.getByTestId('render-content-source.geo.continent_name').textContent).toBe( 'North America' ); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.tsx index 4d06e9fa9d5dc..c5a87b0973bcb 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_ip.tsx @@ -12,7 +12,6 @@ import deepEqual from 'fast-deep-equal'; import { DESTINATION_IP_FIELD_NAME, SOURCE_IP_FIELD_NAME } from '../ip'; import { Port } from '../port'; -import { DESTINATION_PORT_FIELD_NAME, SOURCE_PORT_FIELD_NAME } from '../port/helpers'; import * as i18n from '../../../../timelines/components/timeline/body/renderers/translations'; import { GeoFields } from './geo_fields'; @@ -89,67 +88,52 @@ const IpAdressesWithPorts = React.memo<{ destinationIp?: string[] | null; destinationPort?: Array | null; eventId: string; - isDraggable?: boolean; sourceIp?: string[] | null; sourcePort?: Array | null; type: SourceDestinationType; -}>( - ({ - contextId, - destinationIp, - destinationPort, - eventId, - isDraggable, - sourceIp, - sourcePort, - type, - }) => { - const ip = type === 'source' ? sourceIp : destinationIp; - const ipFieldName = type === 'source' ? SOURCE_IP_FIELD_NAME : DESTINATION_IP_FIELD_NAME; - const port = type === 'source' ? sourcePort : destinationPort; - const portFieldName = type === 'source' ? SOURCE_PORT_FIELD_NAME : DESTINATION_PORT_FIELD_NAME; - - if (ip == null) { - return null; // if ip is not populated as an array, ports will be ignored - } - - // IMPORTANT: The ip and port arrays are parallel arrays; the port at - // index `i` corresponds with the ip address at index `i`. We must - // preserve the relationships between the parallel arrays: - const ipPortPairs: IpPortPair[] = - port != null && ip.length === port.length - ? ip.map((address, i) => ({ - ip: address, - port: port[i] != null ? `${port[i]}` : null, // use the corresponding port in the parallel array - })) - : ip.map((address) => ({ - ip: address, - port: null, // drop the port, because the length of the parallel ip and port arrays is different - })); - - return ( - - {uniqWith(deepEqual, ipPortPairs).map( - (ipPortPair) => - ipPortPair.ip != null && ( - - - - ) - )} - - ); +}>(({ contextId, destinationIp, destinationPort, eventId, sourceIp, sourcePort, type }) => { + const ip = type === 'source' ? sourceIp : destinationIp; + const ipFieldName = type === 'source' ? SOURCE_IP_FIELD_NAME : DESTINATION_IP_FIELD_NAME; + const port = type === 'source' ? sourcePort : destinationPort; + + if (ip == null) { + return null; // if ip is not populated as an array, ports will be ignored } -); + + // IMPORTANT: The ip and port arrays are parallel arrays; the port at + // index `i` corresponds with the ip address at index `i`. We must + // preserve the relationships between the parallel arrays: + const ipPortPairs: IpPortPair[] = + port != null && ip.length === port.length + ? ip.map((address, i) => ({ + ip: address, + port: port[i] != null ? `${port[i]}` : null, // use the corresponding port in the parallel array + })) + : ip.map((address) => ({ + ip: address, + port: null, // drop the port, because the length of the parallel ip and port arrays is different + })); + + return ( + + {uniqWith(deepEqual, ipPortPairs).map( + (ipPortPair) => + ipPortPair.ip != null && ( + + + + ) + )} + + ); +}); IpAdressesWithPorts.displayName = 'IpAdressesWithPorts'; @@ -173,7 +157,6 @@ export const SourceDestinationIp = React.memo( destinationIp, destinationPort, eventId, - isDraggable, sourceGeoContinentName, sourceGeoCountryName, sourceGeoCountryIsoCode, @@ -204,7 +187,6 @@ export const SourceDestinationIp = React.memo( destinationIp={destinationIp} destinationPort={destinationPort} eventId={eventId} - isDraggable={isDraggable} sourceIp={sourceIp} sourcePort={sourcePort} type={type} @@ -213,14 +195,7 @@ export const SourceDestinationIp = React.memo( {getPorts({ destinationPort, sourcePort, type }).map((port, i) => ( - + ))} @@ -235,7 +210,6 @@ export const SourceDestinationIp = React.memo( destinationGeoRegionName={destinationGeoRegionName} destinationGeoCityName={destinationGeoCityName} eventId={eventId} - isDraggable={isDraggable} sourceGeoContinentName={sourceGeoContinentName} sourceGeoCountryName={sourceGeoCountryName} sourceGeoCountryIsoCode={sourceGeoCountryIsoCode} diff --git a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_with_arrows.tsx b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_with_arrows.tsx index 2e90ced97dd83..63ea2fd7a9929 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_with_arrows.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/explore/network/components/source_destination/source_destination_with_arrows.tsx @@ -32,7 +32,6 @@ export const SourceDestinationWithArrows = React.memo @@ -88,7 +85,6 @@ export const SourceDestinationWithArrows = React.memo | null; eventId: string; - isDraggable?: boolean; sourceGeoContinentName?: string[] | null; sourceGeoCountryName?: string[] | null; sourceGeoCountryIsoCode?: string[] | null; @@ -88,7 +85,6 @@ export interface SourceDestinationWithArrowsProps { destinationPackets?: string[] | null; destinationPort?: string[] | null; eventId: string; - isDraggable?: boolean; sourceBytes?: string[] | null; sourceGeoContinentName?: string[] | null; sourceGeoCountryName?: string[] | null; diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/alert_reason/alert_reason.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/alert_reason/alert_reason.tsx index 62e6e9f492b2f..998b1dea11208 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/alert_reason/alert_reason.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/alert_reason/alert_reason.tsx @@ -40,7 +40,6 @@ export const AlertReason: React.FC = () => { ? renderer.renderRow({ contextId: 'event-details', data: dataAsNestedObject, - isDraggable: false, scopeId, }) : null, diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx index bbcef0be38bf1..d0450418536f9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx @@ -8,20 +8,20 @@ import React, { useCallback, useMemo } from 'react'; import { useDispatch } from 'react-redux'; import { v4 as uuid } from 'uuid'; +import type { EuiBasicTableColumn } from '@elastic/eui'; import { - EuiTitle, - EuiSpacer, - EuiInMemoryTable, - EuiText, + EuiFlexGrid, EuiFlexGroup, EuiFlexItem, - EuiToolTip, + EuiHorizontalRule, EuiIcon, + EuiInMemoryTable, EuiPanel, - EuiHorizontalRule, - EuiFlexGrid, + EuiSpacer, + EuiText, + EuiTitle, + EuiToolTip, } from '@elastic/eui'; -import type { EuiBasicTableColumn } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import { i18n } from '@kbn/i18n'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; @@ -51,17 +51,17 @@ import { useHostRelatedUsers } from '../../../../common/containers/related_entit import { useMlCapabilities } from '../../../../common/components/ml/hooks/use_ml_capabilities'; import { getEmptyTagValue } from '../../../../common/components/empty_value'; import { - HOST_DETAILS_TEST_ID, - HOST_DETAILS_RELATED_USERS_TABLE_TEST_ID, - HOST_DETAILS_RELATED_USERS_LINK_TEST_ID, - HOST_DETAILS_RELATED_USERS_IP_LINK_TEST_ID, HOST_DETAILS_ALERT_COUNT_TEST_ID, HOST_DETAILS_MISCONFIGURATIONS_TEST_ID, + HOST_DETAILS_RELATED_USERS_IP_LINK_TEST_ID, + HOST_DETAILS_RELATED_USERS_LINK_TEST_ID, + HOST_DETAILS_RELATED_USERS_TABLE_TEST_ID, + HOST_DETAILS_TEST_ID, HOST_DETAILS_VULNERABILITIES_TEST_ID, } from './test_ids'; import { - USER_NAME_FIELD_NAME, HOST_IP_FIELD_NAME, + USER_NAME_FIELD_NAME, } from '../../../../timelines/components/timeline/body/renderers/constants'; import { useKibana } from '../../../../common/lib/kibana'; import { ENTITY_RISK_LEVEL } from '../../../../entity_analytics/components/risk_score/translations'; @@ -201,7 +201,6 @@ export const HostDetails: React.FC = ({ hostName, timestamp, s rowItems={ips} attrName={HOST_IP_FIELD_NAME} idPrefix={''} - isDraggable={false} render={(ip) => ip == null ? ( getEmptyTagValue() diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx index 4cf55d6e372dd..0e8c454c48807 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx @@ -8,20 +8,20 @@ import React, { useCallback, useMemo } from 'react'; import { useDispatch } from 'react-redux'; import { v4 as uuid } from 'uuid'; +import type { EuiBasicTableColumn } from '@elastic/eui'; import { - EuiTitle, - EuiSpacer, - EuiInMemoryTable, - EuiText, - EuiIcon, + EuiFlexGrid, EuiFlexGroup, EuiFlexItem, - EuiToolTip, - EuiPanel, EuiHorizontalRule, - EuiFlexGrid, + EuiIcon, + EuiInMemoryTable, + EuiPanel, + EuiSpacer, + EuiText, + EuiTitle, + EuiToolTip, } from '@elastic/eui'; -import type { EuiBasicTableColumn } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import { i18n } from '@kbn/i18n'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; @@ -48,16 +48,16 @@ import { useUserRelatedHosts } from '../../../../common/containers/related_entit import { useMlCapabilities } from '../../../../common/components/ml/hooks/use_ml_capabilities'; import { getEmptyTagValue } from '../../../../common/components/empty_value'; import { + USER_DETAILS_ALERT_COUNT_TEST_ID, + USER_DETAILS_MISCONFIGURATIONS_TEST_ID, + USER_DETAILS_RELATED_HOSTS_IP_LINK_TEST_ID, + USER_DETAILS_RELATED_HOSTS_LINK_TEST_ID, USER_DETAILS_RELATED_HOSTS_TABLE_TEST_ID, USER_DETAILS_TEST_ID, - USER_DETAILS_RELATED_HOSTS_LINK_TEST_ID, - USER_DETAILS_RELATED_HOSTS_IP_LINK_TEST_ID, - USER_DETAILS_MISCONFIGURATIONS_TEST_ID, - USER_DETAILS_ALERT_COUNT_TEST_ID, } from './test_ids'; import { - HOST_NAME_FIELD_NAME, HOST_IP_FIELD_NAME, + HOST_NAME_FIELD_NAME, } from '../../../../timelines/components/timeline/body/renderers/constants'; import { useKibana } from '../../../../common/lib/kibana'; import { ENTITY_RISK_LEVEL } from '../../../../entity_analytics/components/risk_score/translations'; @@ -197,7 +197,6 @@ export const UserDetails: React.FC = ({ userName, timestamp, s rowItems={ips} attrName={HOST_IP_FIELD_NAME} idPrefix={''} - isDraggable={false} render={(ip) => ip == null ? ( getEmptyTagValue() diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/event_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/event_renderer.tsx index cd612286f01fb..4de91e4a62c3d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/event_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/event_renderer.tsx @@ -38,7 +38,6 @@ export const EventRenderer: FC = () => { ? renderer.renderRow({ contextId: 'event-details', data: dataAsNestedObject, - isDraggable: false, scopeId, }) : null, diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/status_popover_button.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/status_popover_button.tsx index b5ff44ede0dd7..e0a14985df682 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/status_popover_button.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/status_popover_button.tsx @@ -88,7 +88,6 @@ export const StatusPopoverButton = memo( linkValue={enrichedFieldInfo.linkValue} fieldType={enrichedFieldInfo.data.type} fieldFormat={getFieldFormat(enrichedFieldInfo.data)} - isDraggable={false} truncate={false} isButton={statusPopoverVisible} onClick={statusPopoverVisible ? togglePopover : undefined} diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_value_cell.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_value_cell.tsx index 17ea9980f1ee0..67c8e7c134687 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_value_cell.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_value_cell.tsx @@ -108,7 +108,6 @@ export const TableFieldValueCell = memo( fieldFromBrowserField={fieldFromBrowserField} fieldType={data.type} isAggregatable={fieldFromBrowserField.aggregatable} - isDraggable={false} isObjectArray={data.isObjectArray} value={value} linkValue={getLinkValue && getLinkValue(data.field)} diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.test.tsx index e44dd1b097cf1..5b9c8bf278411 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.test.tsx @@ -18,7 +18,6 @@ const mockProps: HostPreviewPanelFooterProps = { hostName: 'test', contextID: 'test-host-panel', scopeId: 'test-scope-id', - isDraggable: false, }; describe('', () => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.tsx index 6f857aa330bb0..9721fc3b4e7c9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_preview/footer.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { EuiLink, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiFlexGroup, EuiFlexItem, EuiLink } from '@elastic/eui'; import React, { useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; @@ -16,14 +16,12 @@ export interface HostPreviewPanelFooterProps { contextID: string; scopeId: string; hostName: string; - isDraggable?: boolean; } export const HostPreviewPanelFooter = ({ contextID, scopeId, hostName, - isDraggable, }: HostPreviewPanelFooterProps) => { const { openFlyout } = useExpandableFlyoutApi(); @@ -35,11 +33,10 @@ export const HostPreviewPanelFooter = ({ contextID, hostName, scopeId, - isDraggable, }, }, }); - }, [openFlyout, hostName, contextID, isDraggable, scopeId]); + }, [openFlyout, hostName, contextID, scopeId]); return ( diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.stories.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.stories.tsx index 2f1f4de1782ee..183799494b9a7 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.stories.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.stories.tsx @@ -32,7 +32,6 @@ storiesOf('Components/HostPanelContent', module) riskScoreState={riskScoreData} contextID={'test-host-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} hostName={'test-host-name'} onAssetCriticalityChange={() => {}} @@ -58,7 +57,6 @@ storiesOf('Components/HostPanelContent', module) riskScoreState={riskScoreData} contextID={'test-host-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} hostName={'test-host-name'} onAssetCriticalityChange={() => {}} @@ -84,7 +82,6 @@ storiesOf('Components/HostPanelContent', module) riskScoreState={riskScoreData} contextID={'test-host-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} hostName={'test-host-name'} onAssetCriticalityChange={() => {}} diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.tsx index d62ea43d679d4..eb094ba86c358 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/content.tsx @@ -25,7 +25,6 @@ interface HostPanelContentProps { riskScoreState: RiskScoreState; contextID: string; scopeId: string; - isDraggable: boolean; openDetailsPanel: (path: EntityDetailsPath) => void; hostName: string; onAssetCriticalityChange: () => void; @@ -41,7 +40,6 @@ export const HostPanelContent = ({ recalculatingScore, contextID, scopeId, - isDraggable, openDetailsPanel, onAssetCriticalityChange, isPreviewMode, @@ -80,7 +78,6 @@ export const HostPanelContent = ({ observedData={observedHost} contextID={contextID} scopeId={scopeId} - isDraggable={isDraggable} observedFields={observedFields} queryId={HOST_PANEL_OBSERVED_HOST_QUERY_ID} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.test.ts b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.test.ts index 79171ef80c35e..43438712a2797 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.test.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.test.ts @@ -99,7 +99,6 @@ describe('useNavigateToHostDetails', () => { contextID: mockProps.contextID, scopeId: mockProps.scopeId, hostName: mockProps.hostName, - isDraggable: undefined, }, }, left: { diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.ts b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.ts index 2edc7a7c86c4e..39f56adb1d160 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/hooks/use_navigate_to_host_details.ts @@ -24,7 +24,6 @@ interface UseNavigateToHostDetailsParams { hasNonClosedAlerts: boolean; isPreviewMode?: boolean; contextID: string; - isDraggable?: boolean; } interface UseNavigateToHostDetailsResult { @@ -41,7 +40,6 @@ export const useNavigateToHostDetails = ({ hasNonClosedAlerts, isPreviewMode, contextID, - isDraggable, }: UseNavigateToHostDetailsParams): UseNavigateToHostDetailsResult => { const { telemetry } = useKibana().services; const { openLeftPanel, openFlyout } = useExpandableFlyoutApi(); @@ -78,7 +76,6 @@ export const useNavigateToHostDetails = ({ contextID, scopeId, hostName, - isDraggable, }, }; @@ -103,7 +100,6 @@ export const useNavigateToHostDetails = ({ hasVulnerabilitiesFindings, hasNonClosedAlerts, contextID, - isDraggable, ] ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.test.tsx index f66ff0883a4ad..feff2cb54fa35 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.test.tsx @@ -10,14 +10,14 @@ import React from 'react'; import { TestProviders } from '../../../common/mock'; import { mockHostRiskScoreState, mockObservedHostData } from '../mocks'; import type { - FlyoutPanelProps, - ExpandableFlyoutState, ExpandableFlyoutApi, + ExpandableFlyoutState, + FlyoutPanelProps, } from '@kbn/expandable-flyout'; import { useExpandableFlyoutApi, - useExpandableFlyoutState, useExpandableFlyoutHistory, + useExpandableFlyoutState, } from '@kbn/expandable-flyout'; import type { HostPanelProps } from '.'; import { HostPanel } from '.'; @@ -26,7 +26,6 @@ const mockProps: HostPanelProps = { hostName: 'test', contextID: 'test-host -panel', scopeId: 'test-scope-id', - isDraggable: false, isPreviewMode: false, }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.tsx index 698b0aee8db55..1ee85bcf745e6 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/host_right/index.tsx @@ -39,7 +39,6 @@ export interface HostPanelProps extends Record { contextID: string; scopeId: string; hostName: string; - isDraggable?: boolean; isPreviewMode?: boolean; } @@ -57,13 +56,7 @@ const FIRST_RECORD_PAGINATION = { querySize: 1, }; -export const HostPanel = ({ - contextID, - scopeId, - hostName, - isDraggable, - isPreviewMode, -}: HostPanelProps) => { +export const HostPanel = ({ contextID, scopeId, hostName, isPreviewMode }: HostPanelProps) => { const { to, from, isInitializing, setQuery, deleteQuery } = useGlobalTime(); const hostNameFilterQuery = useMemo( () => (hostName ? buildHostNamesFilter([hostName]) : undefined), @@ -123,7 +116,6 @@ export const HostPanel = ({ hasNonClosedAlerts, isPreviewMode, contextID, - isDraggable, }); const openDefaultPanel = useCallback( @@ -179,7 +171,6 @@ export const HostPanel = ({ riskScoreState={riskScoreState} contextID={contextID} scopeId={scopeId} - isDraggable={!!isDraggable} openDetailsPanel={openDetailsPanel} isLinkEnabled={isLinkEnabled} recalculatingScore={recalculatingScore} @@ -187,12 +178,7 @@ export const HostPanel = ({ isPreviewMode={isPreviewMode} /> {isPreviewMode && ( - + )} ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/content.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/content.tsx index 28a899656bee3..1413c2a79c464 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/content.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/content.tsx @@ -29,7 +29,6 @@ interface ServicePanelContentProps { recalculatingScore: boolean; contextID: string; scopeId: string; - isDraggable: boolean; onAssetCriticalityChange: () => void; openDetailsPanel: (path: EntityDetailsPath) => void; isPreviewMode?: boolean; @@ -43,7 +42,6 @@ export const ServicePanelContent = ({ recalculatingScore, contextID, scopeId, - isDraggable, openDetailsPanel, onAssetCriticalityChange, isPreviewMode, @@ -75,7 +73,6 @@ export const ServicePanelContent = ({ observedData={observedService} contextID={contextID} scopeId={scopeId} - isDraggable={isDraggable} observedFields={observedFields} queryId={OBSERVED_SERVICE_QUERY_ID} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/hooks/use_navigate_to_service_details.ts b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/hooks/use_navigate_to_service_details.ts index a8ec9fb80624a..806829080c4bb 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/hooks/use_navigate_to_service_details.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/hooks/use_navigate_to_service_details.ts @@ -19,7 +19,6 @@ interface UseNavigateToServiceDetailsParams { email?: string[]; scopeId: string; contextID: string; - isDraggable?: boolean; isRiskScoreExist: boolean; isPreviewMode?: boolean; } @@ -39,7 +38,6 @@ export const useNavigateToServiceDetails = ({ serviceName, scopeId, contextID, - isDraggable, isRiskScoreExist, isPreviewMode, }: UseNavigateToServiceDetailsParams): UseNavigateToServiceDetailsResult => { @@ -75,7 +73,6 @@ export const useNavigateToServiceDetails = ({ contextID, serviceName, scopeId, - isDraggable, }, }; @@ -89,7 +86,6 @@ export const useNavigateToServiceDetails = ({ }, [ contextID, - isDraggable, isNewNavigationEnabled, isPreviewMode, isRiskScoreExist, diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.test.tsx index 96017d03ff5c0..f39a736d50328 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.test.tsx @@ -11,14 +11,14 @@ import { TestProviders } from '../../../common/mock'; import type { ServicePanelProps } from '.'; import { ServicePanel } from '.'; import type { - FlyoutPanelProps, - ExpandableFlyoutState, ExpandableFlyoutApi, + ExpandableFlyoutState, + FlyoutPanelProps, } from '@kbn/expandable-flyout'; import { useExpandableFlyoutApi, - useExpandableFlyoutState, useExpandableFlyoutHistory, + useExpandableFlyoutState, } from '@kbn/expandable-flyout'; import { mockObservedService } from './mocks'; import { mockServiceRiskScoreState } from '../mocks'; @@ -27,7 +27,6 @@ const mockProps: ServicePanelProps = { serviceName: 'test', contextID: 'test-service-panel', scopeId: 'test-scope-id', - isDraggable: false, }; jest.mock('../../../common/components/visualization_actions/visualization_embeddable'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.tsx index 1f55f19b896a7..18848e6186759 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.tsx @@ -30,7 +30,6 @@ export interface ServicePanelProps extends Record { contextID: string; scopeId: string; serviceName: string; - isDraggable?: boolean; } export interface ServicePanelExpandableFlyoutProps extends FlyoutPanelProps { @@ -44,12 +43,7 @@ const FIRST_RECORD_PAGINATION = { querySize: 1, }; -export const ServicePanel = ({ - contextID, - scopeId, - serviceName, - isDraggable, -}: ServicePanelProps) => { +export const ServicePanel = ({ contextID, scopeId, serviceName }: ServicePanelProps) => { const serviceNameFilterQuery = useMemo( () => (serviceName ? buildEntityNameFilter(EntityType.service, [serviceName]) : undefined), [serviceName] @@ -94,7 +88,6 @@ export const ServicePanel = ({ serviceName, scopeId, contextID, - isDraggable, isRiskScoreExist, }); @@ -126,7 +119,6 @@ export const ServicePanel = ({ onAssetCriticalityChange={calculateEntityRiskScore} contextID={contextID} scopeId={scopeId} - isDraggable={!!isDraggable} openDetailsPanel={openDetailsPanel} isLinkEnabled={isLinkEnabled} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/columns.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/columns.tsx index 403ca7ef28b93..e23f26de03d98 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/columns.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/columns.tsx @@ -17,7 +17,6 @@ import { hasPreview, PreviewLink } from '../../../../shared/components/preview_l export const getEntityTableColumns = ( contextID: string, scopeId: string, - isDraggable: boolean, data: T ): EntityTableColumns => [ { @@ -61,7 +60,6 @@ export const getEntityTableColumns = ( rowItems={values} attrName={field} idPrefix={contextID ? `entityTable-${contextID}` : 'entityTable'} - isDraggable={isDraggable} scopeId={scopeId} render={showPreviewLink ? renderPreviewLink : renderField} data-test-subj="entity-table-value" diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.test.tsx index 7e7d52e879287..b115ab5055e92 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.test.tsx @@ -37,7 +37,6 @@ const testFieldWithPreview: EntityTableRow = { const mockProps = { contextID: 'testContextID', scopeId: 'testScopeId', - isDraggable: false, data: { isLoading: false }, entityFields: [testField], }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.tsx index 84075071e7a9f..8d5448be95745 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/entity_table/index.tsx @@ -13,7 +13,6 @@ import type { BasicEntityData, EntityTableRows } from './types'; interface EntityTableProps { contextID: string; scopeId: string; - isDraggable: boolean; data: T; entityFields: EntityTableRows; } @@ -21,7 +20,6 @@ interface EntityTableProps { export const EntityTable = ({ contextID, scopeId, - isDraggable, data, entityFields, }: EntityTableProps) => { @@ -31,8 +29,8 @@ export const EntityTable = ({ ); const entityTableColumns = useMemo( - () => getEntityTableColumns(contextID, scopeId, isDraggable, data), - [contextID, scopeId, isDraggable, data] + () => getEntityTableColumns(contextID, scopeId, data), + [contextID, scopeId, data] ); return ( { observedData: mockObservedHostData, contextID: '', scopeId: '', - isDraggable: false, queryId: 'TEST_QUERY_ID', observedFields: [], }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/observed_entity/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/observed_entity/index.tsx index 792ad322e631b..a261f64884b40 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/observed_entity/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/shared/components/observed_entity/index.tsx @@ -21,14 +21,12 @@ export const ObservedEntity = ({ observedData, contextID, scopeId, - isDraggable, observedFields, queryId, }: { observedData: ObservedEntityData; contextID: string; scopeId: string; - isDraggable: boolean; observedFields: EntityTableRows>; queryId: string; }) => { @@ -109,7 +107,6 @@ export const ObservedEntity = ({ diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.test.tsx index 5b6abc209652e..3d421c9bff667 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.test.tsx @@ -18,7 +18,6 @@ const mockProps: UserPreviewPanelFooterProps = { userName: 'test', contextID: 'test-user-panel', scopeId: 'test-scope-id', - isDraggable: false, }; describe('', () => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.tsx index 34eaa52bc88d8..5a4288c78e799 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_preview/footer.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { EuiLink, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiFlexGroup, EuiFlexItem, EuiLink } from '@elastic/eui'; import React, { useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; @@ -16,14 +16,12 @@ export interface UserPreviewPanelFooterProps { contextID: string; scopeId: string; userName: string; - isDraggable?: boolean; } export const UserPreviewPanelFooter = ({ contextID, scopeId, userName, - isDraggable, }: UserPreviewPanelFooterProps) => { const { openFlyout } = useExpandableFlyoutApi(); @@ -35,11 +33,10 @@ export const UserPreviewPanelFooter = ({ contextID, userName, scopeId, - isDraggable, }, }, }); - }, [openFlyout, userName, contextID, isDraggable, scopeId]); + }, [openFlyout, userName, contextID, scopeId]); return ( diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.test.tsx index b02f81b0f445e..c34fba354b719 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.test.tsx @@ -18,7 +18,6 @@ describe('ManagedUser', () => { managedUser: mockManagedUserData, contextID: '', scopeId: '', - isDraggable: false, openDetailsPanel: () => {}, isLinkEnabled: true, }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.tsx index 48cb42e2a4335..7805a5df394b5 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/components/managed_user.tsx @@ -6,13 +6,13 @@ */ import { + EuiAccordion, EuiButton, + EuiCallOut, + EuiEmptyPrompt, + EuiPanel, EuiSpacer, - EuiAccordion, EuiTitle, - EuiPanel, - EuiEmptyPrompt, - EuiCallOut, } from '@elastic/eui'; import React, { useMemo } from 'react'; @@ -42,14 +42,12 @@ const accordionStyle = css` export const ManagedUser = ({ managedUser, contextID, - isDraggable, openDetailsPanel, isPreviewMode, isLinkEnabled, }: { managedUser: ManagedUserData; contextID: string; - isDraggable: boolean; openDetailsPanel: (path: EntityDetailsPath) => void; isPreviewMode?: boolean; isLinkEnabled: boolean; @@ -135,7 +133,6 @@ export const ManagedUser = ({ isPreviewMode={isPreviewMode} > { - const managedUserTableColumns = useMemo( - () => getManagedUserTableColumns(contextID, isDraggable), - [isDraggable, contextID] - ); + const managedUserTableColumns = useMemo(() => getManagedUserTableColumns(contextID), [contextID]); const managedItems = useManagedUserItems(tableType, managedUser); return ( diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.stories.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.stories.tsx index 44fbbbaa42a55..fa5e1028c8259 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.stories.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.stories.tsx @@ -33,7 +33,6 @@ storiesOf('Components/UserPanelContent', module) riskScoreState={riskScoreData} contextID={'test-user-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} userName={'test-user-name'} onAssetCriticalityChange={() => {}} @@ -52,7 +51,6 @@ storiesOf('Components/UserPanelContent', module) riskScoreState={riskScoreData} contextID={'test-user-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} userName={'test-user-name'} onAssetCriticalityChange={() => {}} @@ -71,7 +69,6 @@ storiesOf('Components/UserPanelContent', module) riskScoreState={riskScoreData} contextID={'test-user-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} userName={'test-user-name'} onAssetCriticalityChange={() => {}} @@ -110,7 +107,6 @@ storiesOf('Components/UserPanelContent', module) riskScoreState={riskScoreData} contextID={'test-user-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} userName={'test-user-name'} onAssetCriticalityChange={() => {}} @@ -153,7 +149,6 @@ storiesOf('Components/UserPanelContent', module) riskScoreState={riskScoreData} contextID={'test-user-details'} scopeId={'test-scopeId'} - isDraggable={false} openDetailsPanel={() => {}} userName={'test-user-name'} onAssetCriticalityChange={() => {}} diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.tsx index f0f27d4855fbc..522968ce3e557 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/content.tsx @@ -34,7 +34,6 @@ interface UserPanelContentProps { recalculatingScore: boolean; contextID: string; scopeId: string; - isDraggable: boolean; onAssetCriticalityChange: () => void; openDetailsPanel: (path: EntityDetailsPath) => void; isPreviewMode?: boolean; @@ -49,7 +48,6 @@ export const UserPanelContent = ({ recalculatingScore, contextID, scopeId, - isDraggable, openDetailsPanel, onAssetCriticalityChange, isPreviewMode, @@ -89,7 +87,6 @@ export const UserPanelContent = ({ observedData={observedUser} contextID={contextID} scopeId={scopeId} - isDraggable={isDraggable} observedFields={observedFields} queryId={OBSERVED_USER_QUERY_ID} /> @@ -98,7 +95,6 @@ export const UserPanelContent = ({ { contextID: string; scopeId: string; userName: string; - isDraggable?: boolean; isPreviewMode?: boolean; } @@ -54,13 +53,7 @@ const FIRST_RECORD_PAGINATION = { querySize: 1, }; -export const UserPanel = ({ - contextID, - scopeId, - userName, - isDraggable, - isPreviewMode, -}: UserPanelProps) => { +export const UserPanel = ({ contextID, scopeId, userName, isPreviewMode }: UserPanelProps) => { const userNameFilterQuery = useMemo( () => (userName ? buildUserNamesFilter([userName]) : undefined), [userName] @@ -120,7 +113,6 @@ export const UserPanel = ({ email, scopeId, contextID, - isDraggable, isRiskScoreExist, hasMisconfigurationFindings, hasNonClosedAlerts, @@ -186,18 +178,12 @@ export const UserPanel = ({ onAssetCriticalityChange={calculateEntityRiskScore} contextID={contextID} scopeId={scopeId} - isDraggable={!!isDraggable} openDetailsPanel={openDetailsPanel} isPreviewMode={isPreviewMode} isLinkEnabled={isLinkEnabled} /> {isPreviewMode && ( - + )} ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/utils/columns.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/utils/columns.tsx index 22387fadbaf06..84a3594e6c7de 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/utils/columns.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/user_right/utils/columns.tsx @@ -29,10 +29,7 @@ const fieldColumn: EuiBasicTableColumn = { ), }; -export const getManagedUserTableColumns = ( - contextID: string, - isDraggable: boolean -): ManagedUsersTableColumns => [ +export const getManagedUserTableColumns = (contextID: string): ManagedUsersTableColumns => [ fieldColumn, { name: i18n.VALUES_COLUMN_TITLE, @@ -43,7 +40,6 @@ export const getManagedUserTableColumns = ( rowItems={value.map(() => value.toString())} attrName={field} idPrefix={contextID ? `managedUser-${contextID}` : 'managedUser'} - isDraggable={isDraggable} /> ) : ( defaultToEmptyTag(value) diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/network_details/components/network_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/network_details/components/network_details.tsx index b36ef2fd55854..5d6572037afae 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/network_details/components/network_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/network_details/components/network_details.tsx @@ -42,11 +42,7 @@ export interface NetworkDetailsProps { /** * Component rendering all the network details for the expandable flyout */ -export const NetworkDetails = ({ - ip, - flowTarget, - isDraggable, -}: NetworkDetailsProps & { isDraggable?: boolean }) => { +export const NetworkDetails = ({ ip, flowTarget }: NetworkDetailsProps) => { const dispatch = useDispatch(); const { to, from, isInitializing } = useGlobalTime(); const getGlobalQuerySelector = useMemo(() => inputsSelectors.globalQuerySelector(), []); @@ -113,7 +109,6 @@ export const NetworkDetails = ({ loading={loading} isInDetailsSidePanel isLoadingAnomaliesData={isLoadingAnomaliesData} - isDraggable={isDraggable} type={type} flowTarget={flowTarget} startDate={from} diff --git a/x-pack/solutions/security/plugins/security_solution/public/overview/components/host_overview/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/overview/components/host_overview/index.tsx index b84d88cd189d6..2efa0b12f9c39 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/overview/components/host_overview/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/overview/components/host_overview/index.tsx @@ -45,7 +45,6 @@ interface HostSummaryProps { scopeId?: string; data: HostItem; id: string; - isDraggable?: boolean; isInDetailsSidePanel: boolean; loading: boolean; isLoadingAnomaliesData: boolean; @@ -73,7 +72,6 @@ export const HostOverview = React.memo( data, endDate, id, - isDraggable = false, isInDetailsSidePanel = false, // Rather than duplicate the component, alter the structure based on it's location isLoadingAnomaliesData, indexNames, @@ -121,11 +119,10 @@ export const HostOverview = React.memo( rowItems={getOr([], fieldName, fieldData)} attrName={fieldName} idPrefix={contextID ? `host-overview-${contextID}` : 'host-overview'} - isDraggable={isDraggable} scopeId={scopeId} /> ), - [contextID, isDraggable, scopeId] + [contextID, scopeId] ); const [hostRiskScore, hostRiskLevel] = useMemo(() => { @@ -179,7 +176,7 @@ export const HostOverview = React.memo( title: i18n.HOST_ID, description: data && data.host - ? hostIdRenderer({ host: data.host, isDraggable, noLink: true }) + ? hostIdRenderer({ host: data.host, noLink: true }) : getEmptyTagValue(), }, { @@ -205,7 +202,7 @@ export const HostOverview = React.memo( ), }, ], - [data, indexNames, hostName, isDraggable] + [data, indexNames, hostName] ); const firstColumn = useMemo( () => @@ -251,7 +248,6 @@ export const HostOverview = React.memo( attrName={'host.ip'} idPrefix={contextID ? `host-overview-${contextID}` : 'host-overview'} scopeId={scopeId} - isDraggable={isDraggable} render={(ip) => (ip != null ? : getEmptyTagValue())} /> ), @@ -287,7 +283,7 @@ export const HostOverview = React.memo( }, ], ], - [contextID, scopeId, data, firstColumn, getDefaultRenderer, isDraggable] + [contextID, scopeId, data, firstColumn, getDefaultRenderer] ); return ( <> diff --git a/x-pack/solutions/security/plugins/security_solution/public/overview/components/user_overview/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/overview/components/user_overview/index.tsx index ef2e2358877f1..ea23dab8dcb4b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/overview/components/user_overview/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/overview/components/user_overview/index.tsx @@ -44,7 +44,6 @@ export interface UserSummaryProps { scopeId?: string; data: UserItem; id: string; - isDraggable?: boolean; isInDetailsSidePanel: boolean; loading: boolean; isLoadingAnomaliesData: boolean; @@ -71,7 +70,6 @@ export const UserOverview = React.memo( scopeId, data, id, - isDraggable = false, isInDetailsSidePanel = false, // Rather than duplicate the component, alter the structure based on it's location isLoadingAnomaliesData, loading, @@ -120,11 +118,10 @@ export const UserOverview = React.memo( rowItems={getOr([], fieldName, fieldData)} attrName={fieldName} idPrefix={contextID ? `user-overview-${contextID}` : 'user-overview'} - isDraggable={isDraggable} scopeId={scopeId} /> ), - [contextID, isDraggable, scopeId] + [contextID, scopeId] ); const [userRiskScore, userRiskLevel] = useMemo(() => { @@ -264,23 +261,13 @@ export const UserOverview = React.memo( attrName={'host.ip'} idPrefix={contextID ? `user-overview-${contextID}` : 'user-overview'} scopeId={scopeId} - isDraggable={isDraggable} render={(ip) => (ip != null ? : getEmptyTagValue())} /> ), }, ], ], - [ - data, - indexPatterns, - getDefaultRenderer, - contextID, - scopeId, - isDraggable, - userName, - firstColumn, - ] + [data, indexPatterns, getDefaultRenderer, contextID, scopeId, userName, firstColumn] ); return ( <> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/certificate_fingerprint/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/certificate_fingerprint/index.tsx index c910589ceaa5b..013b4031dddfe 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/certificate_fingerprint/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/certificate_fingerprint/index.tsx @@ -40,9 +40,8 @@ export const CertificateFingerprint = React.memo<{ certificateType: CertificateType; contextId: string; fieldName: string; - isDraggable?: boolean; value?: string | null; -}>(({ eventId, certificateType, contextId, fieldName, isDraggable, value }) => { +}>(({ eventId, certificateType, contextId, fieldName, value }) => { return ( {fieldName} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.test.tsx index c4989795de6fe..63cb69852fbe8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.test.tsx @@ -19,15 +19,7 @@ describe('Duration', () => { test('it renders the expected formatted duration', () => { render( - + ); expect(screen.getByText('1ms')).toBeInTheDocument(); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.tsx index cc4950c762401..11c58481bbae4 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/duration/index.tsx @@ -6,8 +6,6 @@ */ import React from 'react'; - -import { DefaultDraggable } from '../../../common/components/draggables'; import { FormattedDuration } from '../formatted_duration'; export const EVENT_DURATION_FIELD_NAME = 'event.duration'; @@ -17,29 +15,10 @@ export const EVENT_DURATION_FIELD_NAME = 'event.duration'; * duration of time, (e.g. `event.duration`) */ export const Duration = React.memo<{ - contextId: string; - eventId: string; fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; value?: string | null; -}>(({ contextId, eventId, fieldName, fieldType, isAggregatable, isDraggable, value }) => - isDraggable ? ( - - - - ) : ( - - ) -); +}>(({ fieldName, value }) => ( + +)); Duration.displayName = 'Duration'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/field_renderers/default_renderer/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/field_renderers/default_renderer/index.tsx index df16f50524095..d314aaafba45b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/field_renderers/default_renderer/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/field_renderers/default_renderer/index.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { EuiFlexGroup, EuiFlexItem, EuiButtonEmpty, EuiPopover } from '@elastic/eui'; +import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiPopover } from '@elastic/eui'; import React, { useCallback, useMemo, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n-react'; import { Spacer } from '../../../../common/components/page'; @@ -18,15 +18,12 @@ interface DefaultFieldRendererProps { attrName: string; displayCount?: number; idPrefix: string; - isDraggable?: boolean; moreMaxHeight?: string; render?: (item: string) => React.ReactNode; rowItems: string[] | null | undefined; scopeId?: string; } -export const IpOverviewId = 'ip-overview'; - /** The default max-height of the popover used to show "+n More" items (e.g. `+9 More`) */ export const DEFAULT_MORE_MAX_HEIGHT = '200px'; @@ -34,7 +31,6 @@ export const DefaultFieldRendererComponent: React.FC attrName, displayCount = 1, idPrefix, - isDraggable = false, moreMaxHeight = DEFAULT_MORE_MAX_HEIGHT, render, rowItems, @@ -56,7 +52,6 @@ export const DefaultFieldRendererComponent: React.FC {typeof rowItem === 'string' && ( fieldNames.length > 0 && fieldNames.every((fieldName) => getOr(null, fieldName, data)) ? ( @@ -40,7 +39,6 @@ export const locationRenderer = ( id={`location-renderer-default-draggable-${IpOverviewId}-${ contextID ? `${contextID}-` : '' }${fieldName}`} - isDraggable={isDraggable ?? false} field={fieldName} value={locationValue} isAggregatable={true} @@ -58,8 +56,7 @@ export const locationRenderer = ( export const autonomousSystemRenderer = ( as: AutonomousSystem, flowTarget: FlowTarget | FlowTargetSourceDest, - contextID?: string, - isDraggable?: boolean + contextID?: string ): React.ReactElement => as && as.organization && as.organization.name && as.number ? ( @@ -68,7 +65,6 @@ export const autonomousSystemRenderer = ( id={`autonomous-system-renderer-default-draggable-${IpOverviewId}-${ contextID ? `${contextID}-` : '' }${flowTarget}.as.organization.name`} - isDraggable={isDraggable ?? false} field={`${flowTarget}.as.organization.name`} value={as.organization.name} /> @@ -79,7 +75,6 @@ export const autonomousSystemRenderer = ( id={`autonomous-system-renderer-default-draggable-${IpOverviewId}-${ contextID ? `${contextID}-` : '' }${flowTarget}.as.number`} - isDraggable={false} field={`${flowTarget}.as.number`} value={`${as.number}`} isAggregatable={true} @@ -95,14 +90,12 @@ interface HostIdRendererTypes { contextID?: string; host: HostEcs; ipFilter?: string; - isDraggable?: boolean; noLink?: boolean; } export const hostIdRenderer = ({ contextID, host, - isDraggable = false, ipFilter, noLink, }: HostIdRendererTypes): React.ReactElement => @@ -113,7 +106,6 @@ export const hostIdRenderer = ({ id={`host-id-renderer-default-draggable-${IpOverviewId}-${ contextID ? `${contextID}-` : '' }host-id`} - isDraggable={isDraggable} field="host.id" value={host.id[0]} isAggregatable={true} @@ -136,8 +128,7 @@ export const hostIdRenderer = ({ export const hostNameRenderer = ( host?: HostEcs, ipFilter?: string, - contextID?: string, - isDraggable?: boolean + contextID?: string ): React.ReactElement => host && host.name && @@ -148,7 +139,6 @@ export const hostNameRenderer = ( id={`host-name-renderer-default-draggable-${IpOverviewId}-${ contextID ? `${contextID}-` : '' }host-name`} - isDraggable={isDraggable ?? false} field={'host.name'} value={host.name[0]} isAggregatable={true} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.test.tsx index a132a1745af63..791917e9da60f 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.test.tsx @@ -63,7 +63,6 @@ describe('FormattedIp', () => { eventId: 'test-event-id', isAggregatable: true, fieldType: 'ip', - isDraggable: false, fieldName: 'host.ip', }; @@ -77,20 +76,6 @@ describe('FormattedIp', () => { expect(screen.getByText(props.value)).toBeInTheDocument(); }); - test('should render DraggableWrapper if isDraggable is true', () => { - const testProps = { - ...props, - isDraggable: true, - }; - render( - - - - ); - - expect(screen.getByTestId('DraggableWrapper')).toBeInTheDocument(); - }); - test('if enableIpDetailsFlyout, should open NetworkDetails expandable flyout', async () => { const context = { enableHostDetailsFlyout: true, diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx index aac07fcc40ecf..26143c149e095 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx @@ -6,39 +6,16 @@ */ import { isArray, isEmpty, isString, uniq } from 'lodash/fp'; -import type { ComponentProps } from 'react'; -import React, { useCallback, useMemo, useContext } from 'react'; +import React, { useCallback, useContext, useMemo } from 'react'; import deepEqual from 'fast-deep-equal'; - import type { EuiButtonEmpty, EuiButtonIcon } from '@elastic/eui'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; import { StatefulEventContext } from '../../../common/components/events_viewer/stateful_event_context'; import { FlowTargetSourceDest } from '../../../../common/search_strategy/security_solution/network'; -import { - DragEffects, - DraggableWrapper, -} from '../../../common/components/drag_and_drop/draggable_wrapper'; -import { escapeDataProviderId } from '../../../common/components/drag_and_drop/helpers'; import { getOrEmptyTagFromValue } from '../../../common/components/empty_value'; -import { parseQueryValue } from '../timeline/body/renderers/parse_query_value'; -import type { DataProvider } from '../timeline/data_providers/data_provider'; -import { IS_OPERATOR } from '../timeline/data_providers/data_provider'; -import { Provider } from '../timeline/data_providers/provider'; import { NetworkDetailsLink } from '../../../common/components/links'; import { NetworkPanelKey } from '../../../flyout/network_details'; -const getUniqueId = ({ - contextId, - eventId, - fieldName, - address, -}: { - contextId: string; - eventId: string; - fieldName: string; - address: string | object | null | undefined; -}) => `formatted-ip-data-provider-${contextId}-${fieldName}-${address}-${eventId}`; - const tryStringify = (value: string | object | null | undefined): string => { try { return JSON.stringify(value); @@ -47,65 +24,9 @@ const tryStringify = (value: string | object | null | undefined): string => { } }; -const getDataProvider = ({ - contextId, - eventId, - fieldName, - address, -}: { - contextId: string; - eventId: string; - fieldName: string; - address: string | object | null | undefined; -}): DataProvider => ({ - enabled: true, - id: escapeDataProviderId(getUniqueId({ contextId, eventId, fieldName, address })), - name: `${fieldName}: ${parseQueryValue(address)}`, - queryMatch: { - field: fieldName, - value: parseQueryValue(address), - operator: IS_OPERATOR, - }, - excluded: false, - kqlQuery: '', - and: [], -}); - const NonDecoratedIpComponent: React.FC<{ - contextId: string; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; - truncate?: boolean; value: string | object | null | undefined; -}> = ({ - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, - truncate, - value, -}) => { - const key = useMemo( - () => - `non-decorated-ip-draggable-wrapper-${getUniqueId({ - contextId, - eventId, - fieldName, - address: value, - })}`, - [contextId, eventId, fieldName, value] - ); - - const dataProviderProp = useMemo( - () => getDataProvider({ contextId, eventId, fieldName, address: value }), - [contextId, eventId, fieldName, value] - ); - +}> = ({ value }) => { const content = useMemo( () => typeof value !== 'object' @@ -114,33 +35,7 @@ const NonDecoratedIpComponent: React.FC<{ [value] ); - const render: ComponentProps['render'] = useCallback( - (dataProvider: DataProvider, _, snapshot) => - snapshot.isDragging ? ( - - - - ) : ( - content - ), - [content] - ); - - if (!isDraggable) { - return content; - } - - return ( - - ); + return content; }; const NonDecoratedIp = React.memo(NonDecoratedIpComponent); @@ -152,31 +47,13 @@ interface AddressLinksItemProps extends Omit { const AddressLinksItemComponent: React.FC = ({ address, Component, - contextId, - eventId, fieldName, - fieldType, - isAggregatable, isButton, - isDraggable, onClick, - truncate, title, }) => { const { openFlyout } = useExpandableFlyoutApi(); - const key = `address-links-draggable-wrapper-${getUniqueId({ - contextId, - eventId, - fieldName, - address, - })}`; - - const dataProviderProp = useMemo( - () => getDataProvider({ contextId, eventId, fieldName, address }), - [address, contextId, eventId, fieldName] - ); - const eventContext = useContext(StatefulEventContext); const isInTimelineContext = address && eventContext?.enableIpDetailsFlyout && eventContext?.timelineID; @@ -229,33 +106,7 @@ const AddressLinksItemComponent: React.FC = ({ [Component, address, isButton, isInTimelineContext, openNetworkDetailsSidePanel, title] ); - const render: ComponentProps['render'] = useCallback( - (_props, _provided, snapshot) => - snapshot.isDragging ? ( - - - - ) : ( - content - ), - [dataProviderProp, content] - ); - - if (!isDraggable) { - return content; - } - - return ( - - ); + return content; }; const AddressLinksItem = React.memo(AddressLinksItemComponent); @@ -263,30 +114,18 @@ const AddressLinksItem = React.memo(AddressLinksItemComponent); interface AddressLinksProps { addresses: string[]; Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - contextId: string; - eventId: string; fieldName: string; - fieldType: string; - isAggregatable: boolean; isButton?: boolean; - isDraggable: boolean; onClick?: () => void; - truncate?: boolean; title?: string; } const AddressLinksComponent: React.FC = ({ addresses, Component, - contextId, - eventId, fieldName, - fieldType, - isAggregatable, isButton, - isDraggable, onClick, - truncate, title, }) => { const uniqAddresses = useMemo(() => uniq(addresses), [addresses]); @@ -298,32 +137,13 @@ const AddressLinksComponent: React.FC = ({ key={address} address={address} Component={Component} - contextId={contextId} - eventId={eventId} fieldName={fieldName} - fieldType={fieldType} - isAggregatable={isAggregatable} isButton={isButton} - isDraggable={isDraggable} onClick={onClick} - truncate={truncate} title={title} /> )), - [ - Component, - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isButton, - isDraggable, - onClick, - title, - truncate, - uniqAddresses, - ] + [Component, fieldName, isButton, onClick, title, uniqAddresses] ); return <>{content}; @@ -332,43 +152,18 @@ const AddressLinksComponent: React.FC = ({ const AddressLinks = React.memo( AddressLinksComponent, (prevProps, nextProps) => - prevProps.contextId === nextProps.contextId && - prevProps.eventId === nextProps.eventId && prevProps.fieldName === nextProps.fieldName && - prevProps.isAggregatable === nextProps.isAggregatable && - prevProps.fieldType === nextProps.fieldType && - prevProps.isDraggable === nextProps.isDraggable && - prevProps.truncate === nextProps.truncate && deepEqual(prevProps.addresses, nextProps.addresses) ); const FormattedIpComponent: React.FC<{ Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - contextId: string; - eventId: string; fieldName: string; - fieldType: string; - isAggregatable: boolean; isButton?: boolean; - isDraggable: boolean; onClick?: () => void; title?: string; - truncate?: boolean; value: string | object | null | undefined; -}> = ({ - Component, - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, - isButton, - onClick, - title, - truncate, - value, -}) => { +}> = ({ Component, fieldName, isButton, onClick, title, value }) => { if (isString(value) && !isEmpty(value)) { try { const addresses = JSON.parse(value); @@ -377,16 +172,10 @@ const FormattedIpComponent: React.FC<{ ); } @@ -399,43 +188,19 @@ const FormattedIpComponent: React.FC<{ ); } else { - return ( - - ); + return ; } }; export const FormattedIp = React.memo( FormattedIpComponent, (prevProps, nextProps) => - prevProps.contextId === nextProps.contextId && - prevProps.eventId === nextProps.eventId && - prevProps.fieldName === nextProps.fieldName && - prevProps.isAggregatable === nextProps.isAggregatable && - prevProps.fieldType === nextProps.fieldType && - prevProps.isDraggable === nextProps.isDraggable && - prevProps.truncate === nextProps.truncate && - deepEqual(prevProps.value, nextProps.value) + prevProps.fieldName === nextProps.fieldName && deepEqual(prevProps.value, nextProps.value) ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/ja3_fingerprint/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/ja3_fingerprint/index.tsx index 785226f74b003..9e163bccbe25b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/ja3_fingerprint/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/ja3_fingerprint/index.tsx @@ -30,16 +30,14 @@ export const Ja3Fingerprint = React.memo<{ eventId: string; contextId: string; fieldName: string; - isDraggable?: boolean; value?: string | null; -}>(({ contextId, eventId, fieldName, isDraggable, value }) => ( +}>(({ contextId, eventId, fieldName, value }) => ( - .c11, -.c11 * { - display: inline-block; - max-width: 100%; - overflow: hidden; - text-overflow: ellipsis; - vertical-align: top; - white-space: nowrap; -} - -.c3 { - border-radius: 2px; - padding: 0 4px 0 8px; - position: relative; - z-index: 0 !important; -} - -.c3::before { - background-image: linear-gradient( 135deg, #535966 25%, transparent 25% ), linear-gradient( -135deg, #535966 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #535966 75% ), linear-gradient( -135deg, transparent 75%, #535966 75% ); - background-position: 0 0,1px 0,1px -1px,0px 1px; - background-size: 2px 2px; - bottom: 2px; - content: ''; + .c1 > span.euiToolTipAnchor { display: block; - left: 2px; - position: absolute; - top: 2px; - width: 4px; } -.c3:hover, -.c3:hover .euiBadge, -.c3:hover .euiBadge__text { - cursor: move; - cursor: -webkit-grab; - cursor: -moz-grab; - cursor: grab; -} - -.event-column-view:hover .c2::before, -tr:hover .c3::before { - background-image: linear-gradient( 135deg, #98a2b3 25%, transparent 25% ), linear-gradient( -135deg, #98a2b3 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #98a2b3 75% ), linear-gradient( -135deg, transparent 75%, #98a2b3 75% ); -} - -.c3:hover, -.c3:focus, -.event-column-view:hover .c3:hover, -.event-column-view:focus .c3:focus, -tr:hover .c3:hover, -tr:hover .c3:focus { - background-color: #36a2ef; -} - -.c3:hover, -.c3:focus, -.event-column-view:hover .c3:hover, -.event-column-view:focus .c3:focus, -tr:hover .c3:hover, -tr:hover .c3:focus, -.c3:hover a, -.c3:focus a, -.event-column-view:hover .c3:hover a, -.event-column-view:focus .c3:focus a, -tr:hover .c3:hover a, -tr:hover .c3:focus a, -.c3:hover a:hover, -.c3:focus a:hover, -.event-column-view:hover .c3:hover a:hover, -.event-column-view:focus .c3:focus a:hover, -tr:hover .c3:hover a:hover, -tr:hover .c3:focus a:hover { - color: #1d1e24; -} - -.c3:hover::before, -.c3:focus::before, -.event-column-view:hover .c3:hover::before, -.event-column-view:focus .c3:focus::before, -tr:hover .c3:hover::before, -tr:hover .c3:focus::before { - background-image: linear-gradient( 135deg, #1d1e24 25%, transparent 25% ), linear-gradient( -135deg, #1d1e24 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #1d1e24 75% ), linear-gradient( -135deg, transparent 75%, #1d1e24 75% ); -} - -.c1 { +.c1 > span.euiToolTipAnchor.eui-textTruncate { display: inline-block; - max-width: 100%; } -.c1 [data-rbd-placeholder-context-id] { - display: none !important; -} - -.c4 > span.euiToolTipAnchor { - display: block; -} - -.c4 > span.euiToolTipAnchor.eui-textTruncate { - display: inline-block; -} - -.c5 { - vertical-align: top; -} - -.c13 svg { +.c8 svg { position: relative; top: -1px; } -.c22 { +.c17 { margin-right: 5px; } -.c21 { +.c16 { margin-right: 5px; } -.c15 { +.c10 { position: relative; top: 1px; } -.c14 { +.c9 { margin-right: 5px; } -.c17 { +.c12 { background-color: #343741; height: 2.8px; width: 25px; } -.c20 { +.c15 { background-color: #343741; height: 2.2px; width: 25px; } -.c19 { +.c14 { margin-right: 5px; } -.c16 { +.c11 { margin: 0 2px; } -.c16 .euiToolTipAnchor { +.c11 .euiToolTipAnchor { white-space: nowrap; } -.c18 { +.c13 { margin: 0 5px; } -.c7 { +.c3 { margin-right: 3px; } -.c8 { +.c4 { margin: 0 5px; } -.c12 { +.c7 { margin: 0 3px; } -.c10 { +.c6 { font-weight: bold; margin-top: 2px; } -.c9 { +.c5 { margin-top: 3px; } -.c6 { +.c2 { margin-right: 3px; position: relative; top: -1px; @@ -217,62 +121,37 @@ tr:hover .c3:focus::before { >
-
-
-
+ - - - - - first.last - - - + first.last -
-
-
+ + +
@@ -283,62 +162,37 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
+ - - - - - rat - - - + rat -
-
-
+ + +
@@ -354,108 +208,58 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
+ - -
- - -
- 1ms -
- -
- -
+ 1ms +
+
-
+
-
-
+ - -
- - - Nov 12, 2018 @ 19:03:25.836 - -
- -
+ Nov 12, 2018 @ 19:03:25.836 +
-
+
-
-
+ - -
- - - Nov 12, 2018 @ 19:03:25.936 - -
- -
+ Nov 12, 2018 @ 19:03:25.936 +
-
+
@@ -537,342 +316,192 @@ tr:hover .c3:focus::before { class="euiFlexGroup emotion-euiFlexGroup-responsive-none-center-center-row" >
-
-
-
+ - - - - - outgoing - - - + outgoing -
-
-
+ + +
-
-
-
- - - - http - - - + http -
-
-
+ + +
-
-
- - -
- - 100B - -
- + + 100B
-
-
+ +
-
-
- - -
- - 3 pkts - -
- + + 3 pkts
-
-
+ +
-
-
-
- - - - tcp - - - + tcp -
-
-
+ + +
-
-
-
- - - - we.live.in.a - - - + we.live.in.a -
-
-
+ + +
Source
@@ -919,61 +548,14 @@ tr:hover .c3:focus::before {
-
-
-
-
-
-
-
-
- - - 192.168.1.2 - - -
-
-
-
-
-
-
-
+ 192.168.1.2 +
: @@ -995,7 +577,7 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
- - - North America - - -
-
-
+ North America + +
-
-
-
- - - United States - - -
-
-
+ United States + +
🇺🇸 @@ -1154,50 +686,25 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
- - - US - - -
-
-
+ US + +
-
-
-
- - - Georgia - - -
-
-
+ Georgia + +
-
-
-
- - - Atlanta - - -
-
-
+ Atlanta + +
@@ -1308,7 +765,7 @@ tr:hover .c3:focus::before {
@@ -1328,62 +785,37 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
- -
- - (60.00%) - - - 60B - -
- + (60.00%) + + + 60B
-
-
+ +
@@ -1391,57 +823,32 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
- - -
- - 2 pkts - -
- + + 2 pkts
-
-
+ +
@@ -1475,7 +882,7 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" > @@ -1491,55 +898,30 @@ tr:hover .c3:focus::before { >
-
-
- -
- - (40.00%) - - - 40B - -
- + (40.00%) + + + 40B
-
-
+ +
@@ -1550,7 +932,7 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" > @@ -1558,57 +940,32 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
- - -
- - 1 pkts - -
- + + 1 pkts
-
-
+ +
@@ -1637,7 +994,7 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
Destination
@@ -1657,61 +1014,14 @@ tr:hover .c3:focus::before {
-
- -
+ 10.1.2.3 +
: @@ -1733,7 +1043,7 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
- - - North America - - -
-
-
+ North America + +
-
-
-
- - - United States - - -
-
-
+ United States + +
🇺🇸 @@ -1892,50 +1152,25 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
- - - US - - -
-
-
+ US + +
-
-
-
- - - New York - - -
-
-
+ New York + +
-
-
-
- - - New York - - -
-
-
+ New York + +
@@ -2062,255 +1247,180 @@ tr:hover .c3:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
+ + ja3 + + + tls.fingerprints.ja3.hash-value + - - - - ja3 - - - tls.fingerprints.ja3.hash-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -
-
-
+ + +
-
-
-
+ + client cert + + + tls.client_certificate.fingerprint.sha1-value + - - - - client cert - - - tls.client_certificate.fingerprint.sha1-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -
-
-
+ + +
-
-
-
+ + server cert + + + tls.server_certificate.fingerprint.sha1-value + - - - - server cert - - - tls.server_certificate.fingerprint.sha1-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -
-
-
+ + +
diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/fingerprints/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/fingerprints/index.tsx index 328d310524070..16ea48890778e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/fingerprints/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/fingerprints/index.tsx @@ -23,7 +23,6 @@ import { JA3_HASH_FIELD_NAME, Ja3Fingerprint } from '../../ja3_fingerprint'; export const Fingerprints = React.memo<{ contextId: string; eventId: string; - isDraggable?: boolean; tlsClientCertificateFingerprintSha1?: string[] | null; tlsFingerprintsJa3Hash?: string[] | null; tlsServerCertificateFingerprintSha1?: string[] | null; @@ -31,7 +30,6 @@ export const Fingerprints = React.memo<{ ({ contextId, eventId, - isDraggable, tlsClientCertificateFingerprintSha1, tlsFingerprintsJa3Hash, tlsServerCertificateFingerprintSha1, @@ -50,7 +48,6 @@ export const Fingerprints = React.memo<{ eventId={eventId} fieldName={JA3_HASH_FIELD_NAME} contextId={contextId} - isDraggable={isDraggable} value={ja3} /> @@ -64,7 +61,6 @@ export const Fingerprints = React.memo<{ certificateType="client" contextId={contextId} fieldName={TLS_CLIENT_CERTIFICATE_FINGERPRINT_SHA1_FIELD_NAME} - isDraggable={isDraggable} value={clientCert} /> @@ -78,7 +74,6 @@ export const Fingerprints = React.memo<{ certificateType="server" contextId={contextId} fieldName={TLS_SERVER_CERTIFICATE_FINGERPRINT_SHA1_FIELD_NAME} - isDraggable={isDraggable} value={serverCert} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.test.tsx index da10fcc3d0ecd..b991165d1334c 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.test.tsx @@ -8,7 +8,6 @@ import { get } from 'lodash/fp'; import React from 'react'; import { render, screen, within } from '@testing-library/react'; - import { asArrayIfExists } from '../../../common/lib/helpers'; import { TestProviders } from '../../../common/mock/test_providers'; import { @@ -45,7 +44,6 @@ import { SOURCE_PACKETS_FIELD_NAME, } from '../../../explore/network/components/source_destination/source_destination_arrows'; import * as i18n from '../timeline/body/renderers/translations'; - import { Netflow } from '.'; import { EVENT_END_FIELD_NAME, @@ -54,8 +52,8 @@ import { import { PROCESS_NAME_FIELD_NAME, USER_NAME_FIELD_NAME } from './netflow_columns/user_process'; import { NETWORK_BYTES_FIELD_NAME, - NETWORK_DIRECTION_FIELD_NAME, NETWORK_COMMUNITY_ID_FIELD_NAME, + NETWORK_DIRECTION_FIELD_NAME, NETWORK_PACKETS_FIELD_NAME, NETWORK_PROTOCOL_FIELD_NAME, NETWORK_TRANSPORT_FIELD_NAME, @@ -156,7 +154,7 @@ describe('Netflow', () => { test('it renders destination.geo.continent_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.continent_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.continent_name').textContent).toBe( 'North America' ); }); @@ -164,7 +162,7 @@ describe('Netflow', () => { test('it renders destination.geo.country_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.country_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.country_name').textContent).toBe( 'United States' ); }); @@ -172,15 +170,15 @@ describe('Netflow', () => { test('it renders destination.geo.country_iso_code', () => { render({getNetflowInstance()}); - expect( - screen.getByTestId('draggable-content-destination.geo.country_iso_code').textContent - ).toBe('US'); + expect(screen.getByTestId('render-content-destination.geo.country_iso_code').textContent).toBe( + 'US' + ); }); test('it renders destination.geo.region_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.region_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.region_name').textContent).toBe( 'New York' ); }); @@ -188,7 +186,7 @@ describe('Netflow', () => { test('it renders destination.geo.city_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-destination.geo.city_name').textContent).toBe( + expect(screen.getByTestId('render-content-destination.geo.city_name').textContent).toBe( 'New York' ); }); @@ -225,7 +223,7 @@ describe('Netflow', () => { test('it renders event.end', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-event.end').textContent).toBe( + expect(screen.getByTestId('render-content-event.end').textContent).toBe( 'Nov 12, 2018 @ 19:03:25.936' ); }); @@ -233,7 +231,7 @@ describe('Netflow', () => { test('it renders event.start', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-event.start').textContent).toBe( + expect(screen.getByTestId('render-content-event.start').textContent).toBe( 'Nov 12, 2018 @ 19:03:25.836' ); }); @@ -289,7 +287,7 @@ describe('Netflow', () => { test('it renders source.geo.continent_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.continent_name').textContent).toBe( + expect(screen.getByTestId('render-content-source.geo.continent_name').textContent).toBe( 'North America' ); }); @@ -297,7 +295,7 @@ describe('Netflow', () => { test('it renders source.geo.country_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.country_name').textContent).toBe( + expect(screen.getByTestId('render-content-source.geo.country_name').textContent).toBe( 'United States' ); }); @@ -305,25 +303,19 @@ describe('Netflow', () => { test('it renders source.geo.country_iso_code', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.country_iso_code').textContent).toBe( - 'US' - ); + expect(screen.getByTestId('render-content-source.geo.country_iso_code').textContent).toBe('US'); }); test('it renders source.geo.region_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.region_name').textContent).toBe( - 'Georgia' - ); + expect(screen.getByTestId('render-content-source.geo.region_name').textContent).toBe('Georgia'); }); test('it renders source.geo.city_name', () => { render({getNetflowInstance()}); - expect(screen.getByTestId('draggable-content-source.geo.city_name').textContent).toBe( - 'Atlanta' - ); + expect(screen.getByTestId('render-content-source.geo.city_name').textContent).toBe('Atlanta'); }); test('it renders the source ip and port, separated with a colon', () => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.tsx index 4bdfa3055a4e3..959e1daac3154 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/index.tsx @@ -37,7 +37,6 @@ export const Netflow = React.memo( eventId, eventEnd, eventStart, - isDraggable, networkBytes, networkCommunityId, networkDirection, @@ -83,7 +82,6 @@ export const Netflow = React.memo( eventId={eventId} eventEnd={eventEnd} eventStart={eventStart} - isDraggable={isDraggable} networkBytes={networkBytes} networkCommunityId={networkCommunityId} networkDirection={networkDirection} @@ -107,7 +105,6 @@ export const Netflow = React.memo( (({ contextId, eventDuration, eventId, eventEnd, eventStart, isDraggable }) => ( +}>(({ contextId, eventDuration, eventId, eventEnd, eventStart }) => ( @@ -94,7 +91,6 @@ export const DurationEventStartEnd = React.memo<{ diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/index.tsx index a784a81f63e52..3530b9b6e515d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/index.tsx @@ -45,7 +45,6 @@ export const NetflowColumns = React.memo( eventId, eventEnd, eventStart, - isDraggable, networkBytes, networkCommunityId, networkDirection, @@ -74,7 +73,6 @@ export const NetflowColumns = React.memo( @@ -87,7 +85,6 @@ export const NetflowColumns = React.memo( eventId={eventId} eventEnd={eventEnd} eventStart={eventStart} - isDraggable={isDraggable} /> @@ -104,7 +101,6 @@ export const NetflowColumns = React.memo( destinationPackets={destinationPackets} destinationPort={destinationPort} eventId={eventId} - isDraggable={isDraggable} networkBytes={networkBytes} networkCommunityId={networkCommunityId} networkDirection={networkDirection} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/types.ts b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/types.ts index 801df93bfcf37..532b35f4cffd0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/types.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/types.ts @@ -21,7 +21,6 @@ export interface NetflowColumnsProps { eventId: string; eventEnd?: string[] | null; eventStart?: string[] | null; - isDraggable?: boolean; networkBytes?: string[] | null; networkCommunityId?: string[] | null; networkDirection?: string[] | null; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/user_process.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/user_process.tsx index 7ed7e7ddd69a7..6d57a41241d03 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/user_process.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/netflow/netflow_columns/user_process.tsx @@ -22,10 +22,9 @@ export const USER_NAME_FIELD_NAME = 'user.name'; export const UserProcess = React.memo<{ contextId: string; eventId: string; - isDraggable?: boolean; processName?: string[] | null; userName?: string[] | null; -}>(({ contextId, eventId, isDraggable, processName, userName }) => ( +}>(({ contextId, eventId, processName, userName }) => ( { <> {alertsRowRenderer.renderRow({ data: demoEndpointProcessExecutionMalwarePreventionAlert, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd.tsx index 5ffbefaafc19d..e35741e76e7c7 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd.tsx @@ -22,7 +22,6 @@ const AuditdExampleComponent: React.FC = () => { <> {auditdRowRenderer.renderRow({ data: demoTimelineData[26].ecs, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd_file.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd_file.tsx index 4d271e91b8eab..1333ca03ff300 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd_file.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/auditd_file.tsx @@ -22,7 +22,6 @@ const AuditdFileExampleComponent: React.FC = () => { <> {auditdFileRowRenderer.renderRow({ data: demoTimelineData[27].ecs, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/library.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/library.tsx index e866ae9c117c7..d92643854f7b0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/library.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/library.tsx @@ -22,7 +22,6 @@ const LibraryExampleComponent: React.FC = () => { <> {libraryRowRenderer.renderRow({ data: demoEndpointLibraryLoadEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/netflow.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/netflow.tsx index 7e7a490640fd2..198bf2584655a 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/netflow.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/netflow.tsx @@ -15,7 +15,6 @@ const NetflowExampleComponent: React.FC = () => ( <> {netflowRowRenderer.renderRow({ data: getDemoNetflowData(), - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/registry.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/registry.tsx index 5693a2880cd6b..555936a82f6e9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/registry.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/registry.tsx @@ -22,7 +22,6 @@ const RegistryExampleComponent: React.FC = () => { <> {registryRowRenderer.renderRow({ data: demoEndpointRegistryModificationEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/suricata.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/suricata.tsx index f273768792980..a2f437e6cfa99 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/suricata.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/suricata.tsx @@ -15,7 +15,6 @@ const SuricataExampleComponent: React.FC = () => ( <> {suricataRowRenderer.renderRow({ data: demoTimelineData[2].ecs, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system.tsx index 6315d1bf79a6f..0cf5310c46449 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system.tsx @@ -22,7 +22,6 @@ const SystemExampleComponent: React.FC = () => { <> {systemRowRenderer.renderRow({ data: demoEndgameTerminationEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_dns.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_dns.tsx index 242eae7a0b108..dd1b8ba448417 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_dns.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_dns.tsx @@ -18,7 +18,6 @@ const SystemDnsExampleComponent: React.FC = () => { <> {systemDnsRowRenderer.renderRow({ data: demoEndgameDnsRequest, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_endgame_process.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_endgame_process.tsx index 13fd5155b96c1..eb913c32b7010 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_endgame_process.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_endgame_process.tsx @@ -22,7 +22,6 @@ const SystemEndgameProcessExampleComponent: React.FC = () => { <> {systemEndgameProcessRowRenderer.renderRow({ data: demoEndgameCreationEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_file.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_file.tsx index 08f75c211df12..b9d68a7c181a9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_file.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_file.tsx @@ -22,7 +22,6 @@ const SystemFileExampleComponent: React.FC = () => { <> {systemFileRowRenderer.renderRow({ data: demoEndgameFileDeleteEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_fim.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_fim.tsx index c22ff32fc75c1..556baeb9e6584 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_fim.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_fim.tsx @@ -22,7 +22,6 @@ const SystemFimExampleComponent: React.FC = () => { <> {systemFimRowRenderer.renderRow({ data: demoEndgameFileCreateEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_security_event.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_security_event.tsx index 29472eb030754..97a7156b29e22 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_security_event.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_security_event.tsx @@ -20,7 +20,6 @@ const SystemSecurityEventExampleComponent: React.FC = () => { <> {systemSecurityEventRowRenderer.renderRow({ data: demoEndgameUserLogon, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_socket.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_socket.tsx index 8ec855dc7089e..da971fb755d27 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_socket.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/system_socket.tsx @@ -21,7 +21,6 @@ const SystemSocketExampleComponent: React.FC = () => { <> {systemSocketRowRenderer.renderRow({ data: demoEndgameIpv4ConnectionAcceptEvent, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/threat_match.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/threat_match.tsx index 8aeb7e19723c4..c7270e57b5606 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/threat_match.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/threat_match.tsx @@ -15,7 +15,6 @@ const ThreatMatchExampleComponent: React.FC = () => ( <> {threatMatchRowRenderer.renderRow({ data: demoTimelineData[31].ecs, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/zeek.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/zeek.tsx index 74e5b7814ad27..2ee442e9328e0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/zeek.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/row_renderers_browser/examples/zeek.tsx @@ -15,7 +15,6 @@ const ZeekExampleComponent: React.FC = () => ( <> {zeekRowRenderer.renderRow({ data: demoTimelineData[13].ecs, - isDraggable: false, scopeId: ROW_RENDERER_BROWSER_EXAMPLE_TIMELINE_ID, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_row_renderer/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_row_renderer/index.tsx index 3d50029f70315..1dd440ca406e0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_row_renderer/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_row_renderer/index.tsx @@ -73,7 +73,6 @@ export const StatefulRowRenderer = React.memo( const row = useMemo(() => { const result = rowRenderer?.renderRow({ data: event.ecs, - isDraggable: false, scopeId: timelineId, }); return result; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/empty_column_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/empty_column_renderer.test.tsx.snap index 26677dca0bc86..0715cf21df17c 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/empty_column_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/empty_column_renderer.test.tsx.snap @@ -2,27 +2,8 @@ exports[`empty_column_renderer renders correctly against snapshot 1`] = ` - + + — + `; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/get_column_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/get_column_renderer.test.tsx.snap index a0a5679eaecba..8efceda8573b4 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/get_column_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/get_column_renderer.test.tsx.snap @@ -9,8 +9,7 @@ exports[`get_column_renderer renders correctly against snapshot 1`] = ` fieldName="event.severity" fieldType="" isAggregatable={false} - isDraggable={true} - key="plain-column-renderer-formatted-field-value-timeline-test-event.severity-1-message-3-0" + key="plain-column-renderer-formatted-field-value-timeline-test-event.severity-1-message" value="3" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/plain_column_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/plain_column_renderer.test.tsx.snap index ef61e08a8a883..295219c341cd8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/plain_column_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/__snapshots__/plain_column_renderer.test.tsx.snap @@ -9,8 +9,7 @@ exports[`plain_column_renderer rendering renders correctly against snapshot 1`] fieldName="event.category" fieldType="string" isAggregatable={true} - isDraggable={true} - key="plain-column-renderer-formatted-field-value-test-event.category-1-event.category-Access-0" + key="plain-column-renderer-formatted-field-value-test-event.category-1-event.category" value="Access" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.test.tsx index 6a90d8bdaf06e..6e9d814f9e212 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.test.tsx @@ -25,7 +25,6 @@ describe('AlertFieldBadge', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} showSeparator={false} scopeId={TableId.alertsOnAlertsPage} value={value} @@ -45,7 +44,6 @@ describe('AlertFieldBadge', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} showSeparator={showSeparator} scopeId={TableId.alertsOnAlertsPage} value={value} @@ -65,7 +63,6 @@ describe('AlertFieldBadge', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} showSeparator={showSeparator} scopeId={TableId.alertsOnAlertsPage} value={value} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.tsx index b74afab33c878..0beb77fd38ab9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/alert_field_badge/index.tsx @@ -19,7 +19,6 @@ interface Props { field: string; fieldType?: string; isAggregatable?: boolean; - isDraggable: boolean; showSeparator: boolean; scopeId: string; value: string | number | null | undefined; @@ -31,7 +30,6 @@ const AlertFieldBadgeComponent: React.FC = ({ field, fieldType = DEFAULT_FIELD_TYPE, isAggregatable = true, - isDraggable, showSeparator, scopeId, value, @@ -49,7 +47,6 @@ const AlertFieldBadgeComponent: React.FC = ({ field={field} fieldType={fieldType} isAggregatable={isAggregatable} - isDraggable={isDraggable} scopeId={scopeId} value={value} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.test.tsx index 6ca3aab4bdec2..a15dbce63f1de 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.test.tsx @@ -30,7 +30,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} scopeId={timelineId} values={undefined} // <-- undefined /> @@ -47,7 +46,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} scopeId={timelineId} values={multipleValues} /> @@ -64,7 +62,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} prefix={prefix} scopeId={timelineId} values={multipleValues} @@ -82,7 +79,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} scopeId={timelineId} values={singleValue} // <-- a single value /> @@ -99,7 +95,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} scopeId={timelineId} values={multipleValues} // <-- multiple values /> @@ -116,7 +111,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} scopeId={timelineId} values={multipleValues} /> @@ -133,7 +127,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} suffix={suffix} scopeId={timelineId} values={multipleValues} @@ -151,7 +144,6 @@ describe('AlertField', () => { contextId={contextId} eventId={eventId} field={field} - isDraggable={false} prefix={prefix} suffix={suffix} scopeId={timelineId} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.tsx index 2d6f38905c855..136218bfb8a0d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/alert_field/index.tsx @@ -20,7 +20,6 @@ interface Props { field: string; fieldType?: string; isAggregatable?: boolean; - isDraggable: boolean; prefix?: React.ReactNode; suffix?: React.ReactNode; scopeId: string; @@ -34,7 +33,6 @@ const AlertFieldComponent: React.FC = ({ field, fieldType = DEFAULT_FIELD_TYPE, isAggregatable = true, - isDraggable, prefix, suffix, scopeId, @@ -60,7 +58,6 @@ const AlertFieldComponent: React.FC = ({ field={field} fieldType={fieldType} isAggregatable={isAggregatable} - isDraggable={isDraggable} showSeparator={i < values.length - 1} scopeId={scopeId} value={x} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.test.tsx index 7245fe7d1f117..2493c55ee86bb 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.test.tsx @@ -173,7 +173,6 @@ describe('alertRenderer', () => { {alertRenderer.renderRow({ data: dataWithAllFields, - isDraggable: false, scopeId: TimelineId.test, })} @@ -189,7 +188,6 @@ describe('alertRenderer', () => { {alertRenderer.renderRow({ data: dataWithAllFields, - isDraggable: false, scopeId: TimelineId.test, })} @@ -204,7 +202,6 @@ describe('alertRenderer', () => { {alertRenderer.renderRow({ data: dataWithAllFields, - isDraggable: false, scopeId: TimelineId.test, })} @@ -218,7 +215,6 @@ describe('alertRenderer', () => { {alertRenderer.renderRow({ data: omit(WITH_FIELD_NAMES, dataWithAllFields) as Ecs, - isDraggable: false, scopeId: TimelineId.test, })} @@ -233,7 +229,6 @@ describe('alertRenderer', () => { {alertRenderer.renderRow({ data: dataWithAllFields, - isDraggable: false, scopeId: TimelineId.test, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.tsx index 5d6506bfcaa9b..dfa99ec65000e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/alert_renderer/index.tsx @@ -13,22 +13,22 @@ import { AlertField } from './alert_field'; import type { RowRenderer } from '../../../../../../../common/types'; import { RowRendererIdEnum } from '../../../../../../../common/api/timeline'; import { - ID, DESTINATION_IP, DESTINATION_PORT, EVENT_CATEGORY, + eventKindMatches, FILE_NAME, HOST_NAME, + ID, KIBANA_ALERT_RULE_NAME, KIBANA_ALERT_SEVERITY, PROCESS_NAME, PROCESS_PARENT_NAME, + showWith, SOURCE_IP, SOURCE_PORT, USER_NAME, WITH_FIELD_NAMES, - eventKindMatches, - showWith, } from './helpers'; import { Details } from '../helpers'; import { RowRendererContainer } from '../row_renderer'; @@ -54,7 +54,7 @@ export const ALERT_RENDERER_FIELDS = [ export const alertRenderer: RowRenderer = { id: RowRendererIdEnum.alert, isInstance: (ecs) => eventKindMatches(get('event.kind', ecs)), - renderRow: ({ contextId = DEFAULT_CONTEXT_ID, data, isDraggable, scopeId }) => { + renderRow: ({ contextId = DEFAULT_CONTEXT_ID, data, scopeId }) => { const eventId = get(ID, data); const destinationIp = get(DESTINATION_IP, data); const destinationPort = get(DESTINATION_PORT, data); @@ -78,7 +78,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={EVENT_CATEGORY} eventId={eventId} field={EVENT_CATEGORY} - isDraggable={isDraggable} scopeId={scopeId} values={eventCategory} /> @@ -101,7 +100,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={PROCESS_NAME} eventId={eventId} field={PROCESS_NAME} - isDraggable={isDraggable} prefix={` ${i18n.PROCESS} `} suffix=", " scopeId={scopeId} @@ -113,7 +111,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={PROCESS_PARENT_NAME} eventId={eventId} field={PROCESS_PARENT_NAME} - isDraggable={isDraggable} prefix={` ${i18n.PARENT_PROCESS} `} suffix=", " scopeId={scopeId} @@ -125,7 +122,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={FILE_NAME} eventId={eventId} field={FILE_NAME} - isDraggable={isDraggable} prefix={` ${i18n.FILE} `} suffix=", " scopeId={scopeId} @@ -137,7 +133,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={SOURCE_IP} eventId={eventId} field={SOURCE_IP} - isDraggable={isDraggable} prefix={` ${i18n.SOURCE} `} scopeId={scopeId} values={sourceIp} @@ -148,7 +143,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={SOURCE_PORT} eventId={eventId} field={SOURCE_PORT} - isDraggable={isDraggable} prefix=":" suffix=", " scopeId={scopeId} @@ -160,7 +154,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={DESTINATION_IP} eventId={eventId} field={DESTINATION_IP} - isDraggable={isDraggable} prefix={` ${i18n.DESTINATION} `} scopeId={scopeId} values={destinationIp} @@ -171,7 +164,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={DESTINATION_PORT} eventId={eventId} field={DESTINATION_PORT} - isDraggable={isDraggable} prefix=":" suffix=", " scopeId={scopeId} @@ -183,7 +175,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={USER_NAME} eventId={eventId} field={USER_NAME} - isDraggable={isDraggable} prefix={` ${i18n.BY} `} scopeId={scopeId} values={userName} @@ -194,7 +185,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={HOST_NAME} eventId={eventId} field={HOST_NAME} - isDraggable={isDraggable} prefix={` ${i18n.ON} `} scopeId={scopeId} values={hostName} @@ -205,7 +195,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={KIBANA_ALERT_SEVERITY} eventId={eventId} field={KIBANA_ALERT_SEVERITY} - isDraggable={isDraggable} prefix={` ${i18n.CREATED} `} suffix={` ${i18n.ALERT} `} scopeId={scopeId} @@ -217,7 +206,6 @@ export const alertRenderer: RowRenderer = { data-test-subj={KIBANA_ALERT_RULE_NAME} eventId={eventId} field={KIBANA_ALERT_RULE_NAME} - isDraggable={isDraggable} suffix="." scopeId={scopeId} values={kibanaAlertRuleName} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/args.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/args.tsx index f1d89e1db0a50..67c7d2d0cbb36 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/args.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/args.tsx @@ -15,10 +15,9 @@ interface Props { contextId: string; eventId: string; processTitle: string | null | undefined; - isDraggable?: boolean; } -export const ArgsComponent = ({ args, contextId, eventId, processTitle, isDraggable }: Props) => { +export const ArgsComponent = ({ args, contextId, eventId, processTitle }: Props) => { if (isNillEmptyOrNotFinite(args) && isNillEmptyOrNotFinite(processTitle)) { return null; } @@ -32,7 +31,6 @@ export const ArgsComponent = ({ args, contextId, eventId, processTitle, isDragga contextId={`${contextId}-args-${i}-${arg}`} eventId={eventId} field="process.args" - isDraggable={isDraggable} value={arg} fieldType="keyword" isAggregatable={true} @@ -46,7 +44,6 @@ export const ArgsComponent = ({ args, contextId, eventId, processTitle, isDragga contextId={contextId} eventId={eventId} field="process.title" - isDraggable={isDraggable} value={processTitle} fieldType="keyword" isAggregatable={true} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.test.tsx index 04f6d5fa8b4df..b09bf62c434a1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.test.tsx @@ -20,7 +20,6 @@ const defaultProps = { fieldName: 'testField', fieldType: 'testType', isAggregatable: true, - isDraggable: true, value: 'low_impact', }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.tsx index ce98498d9523f..fa2421f73942e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/asset_criticality_level.tsx @@ -10,27 +10,12 @@ import { EuiBadge } from '@elastic/eui'; import { isString, startCase } from 'lodash/fp'; import type { CriticalityLevel } from '../../../../../../common/entity_analytics/asset_criticality/types'; import { CRITICALITY_LEVEL_COLOR } from '../../../../../entity_analytics/components/asset_criticality'; -import { DefaultDraggable } from '../../../../../common/components/draggables'; interface Props { - contextId: string; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; value: string | number | undefined | null; } -const AssetCriticalityLevelComponent: React.FC = ({ - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, - value, -}) => { +const AssetCriticalityLevelComponent: React.FC = ({ value }) => { const color = isString(value) ? CRITICALITY_LEVEL_COLOR[value as CriticalityLevel] : 'normal'; const stringValue = isString(value) ? value : ''; @@ -43,21 +28,7 @@ const AssetCriticalityLevelComponent: React.FC = ({ [color, stringValue] ); - return isDraggable ? ( - - {badge} - - ) : ( - badge - ); + return badge; }; export const AssetCriticalityLevel = React.memo(AssetCriticalityLevelComponent); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/__snapshots__/generic_row_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/__snapshots__/generic_row_renderer.test.tsx.snap index 0e61d8a1cec9d..d28fc4f7b5042 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/__snapshots__/generic_row_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/__snapshots__/generic_row_renderer.test.tsx.snap @@ -97,7 +97,6 @@ exports[`GenericRowRenderer #createGenericAuditRowRenderer renders correctly aga }, } } - isDraggable={true} text="connected using" timelineId="timeline-test" /> @@ -221,7 +220,6 @@ exports[`GenericRowRenderer #createGenericFileRowRenderer renders correctly agai } } fileIcon="document" - isDraggable={true} text="opened file using" timelineId="timeline-test" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_details.tsx index bf38784e7595d..efa5cec6e7261 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_details.tsx @@ -14,7 +14,7 @@ import { DraggableBadge } from '../../../../../../common/components/draggables'; import * as i18n from './translations'; import { NetflowRenderer } from '../netflow'; -import { TokensFlexItem, Details } from '../helpers'; +import { Details, TokensFlexItem } from '../helpers'; import { ProcessDraggable } from '../process_draggable'; import { Args } from '../args'; import { SessionUserHostWorkingDir } from './session_user_host_working_dir'; @@ -35,7 +35,6 @@ interface Props { workingDirectory: string | null | undefined; args: string[] | null | undefined; session: string | null | undefined; - isDraggable?: boolean; } export const AuditdGenericLine = React.memo( @@ -55,7 +54,6 @@ export const AuditdGenericLine = React.memo( result, session, text, - isDraggable, }) => ( ( secondary={secondary} workingDirectory={workingDirectory} session={session} - isDraggable={isDraggable} /> {processExecutable != null && ( @@ -83,16 +80,9 @@ export const AuditdGenericLine = React.memo( processPid={processPid} processName={processName} processExecutable={processExecutable} - isDraggable={isDraggable} /> - + {result != null && ( {i18n.WITH_RESULT} @@ -103,7 +93,6 @@ export const AuditdGenericLine = React.memo( contextId={contextId} eventId={id} field="auditd.result" - isDraggable={isDraggable} queryValue={result} value={result} isAggregatable={true} @@ -118,14 +107,13 @@ AuditdGenericLine.displayName = 'AuditdGenericLine'; interface GenericDetailsProps { data: Ecs; - isDraggable?: boolean; contextId: string; text: string; timelineId: string; } export const AuditdGenericDetails = React.memo( - ({ data, contextId, isDraggable, text, timelineId }) => { + ({ data, contextId, text, timelineId }) => { const id = data._id; const session: string | null | undefined = get('auditd.session[0]', data); const hostName: string | null | undefined = get('host.name[0]', data); @@ -158,10 +146,9 @@ export const AuditdGenericDetails = React.memo( primary={primary} result={result} secondary={secondary} - isDraggable={isDraggable} /> - + ); } else { diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_file_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_file_details.tsx index 62d1bdaf86d77..1fe6b333718e1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_file_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_file_details.tsx @@ -15,7 +15,7 @@ import { DraggableBadge } from '../../../../../../common/components/draggables'; import * as i18n from './translations'; import { NetflowRenderer } from '../netflow'; -import { TokensFlexItem, Details } from '../helpers'; +import { Details, TokensFlexItem } from '../helpers'; import { ProcessDraggable } from '../process_draggable'; import { Args } from '../args'; import { SessionUserHostWorkingDir } from './session_user_host_working_dir'; @@ -38,7 +38,6 @@ interface Props { workingDirectory: string | null | undefined; args: string[] | null | undefined; session: string | null | undefined; - isDraggable?: boolean; } export const AuditdGenericFileLine = React.memo( @@ -60,7 +59,6 @@ export const AuditdGenericFileLine = React.memo( session, text, fileIcon, - isDraggable, }) => ( ( secondary={secondary} workingDirectory={workingDirectory} session={session} - isDraggable={isDraggable} /> {(filePath != null || processExecutable != null) && ( @@ -84,7 +81,6 @@ export const AuditdGenericFileLine = React.memo( contextId={contextId} eventId={id} field="file.path" - isDraggable={isDraggable} value={filePath} iconType={fileIcon} /> @@ -100,19 +96,12 @@ export const AuditdGenericFileLine = React.memo( endgamePid={undefined} endgameProcessName={undefined} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={processExecutable} /> - + {result != null && ( {i18n.WITH_RESULT} @@ -123,7 +112,6 @@ export const AuditdGenericFileLine = React.memo( contextId={contextId} eventId={id} field="auditd.result" - isDraggable={isDraggable} queryValue={result} value={result} /> @@ -140,11 +128,10 @@ interface GenericDetailsProps { text: string; fileIcon: IconType; timelineId: string; - isDraggable?: boolean; } export const AuditdGenericFileDetails = React.memo( - ({ data, contextId, text, fileIcon = 'document', timelineId, isDraggable }) => { + ({ data, contextId, text, fileIcon = 'document', timelineId }) => { const id = data._id; const session: string | null | undefined = get('auditd.session[0]', data); const hostName: string | null | undefined = get('host.name[0]', data); @@ -181,10 +168,9 @@ export const AuditdGenericFileDetails = React.memo( secondary={secondary} fileIcon={fileIcon} result={result} - isDraggable={isDraggable} /> - + ); } else { diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.test.tsx index ea1f15200264b..60893c4bb5e4e 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.test.tsx @@ -50,7 +50,6 @@ describe('GenericRowRenderer', () => { test('renders correctly against snapshot', () => { const children = connectedToRenderer.renderRow({ data: auditd, - isDraggable: true, scopeId: TimelineId.test, }); @@ -79,7 +78,6 @@ describe('GenericRowRenderer', () => { test('should render a auditd row', () => { const children = connectedToRenderer.renderRow({ data: auditd, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = mount( @@ -110,7 +108,6 @@ describe('GenericRowRenderer', () => { test('renders correctly against snapshot', () => { const children = fileToRenderer.renderRow({ data: auditdFile, - isDraggable: true, scopeId: TimelineId.test, }); @@ -139,7 +136,6 @@ describe('GenericRowRenderer', () => { test('should render a auditd row', () => { const children = fileToRenderer.renderRow({ data: auditdFile, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = mount( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.tsx index 2d527e0ecec3f..f7fb5e5124d5b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/generic_row_renderer.tsx @@ -35,11 +35,10 @@ export const createGenericAuditRowRenderer = ({ action.toLowerCase() === actionName ); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( ( + renderRow: ({ data, scopeId }) => ( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/primary_secondary_user_info.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/primary_secondary_user_info.tsx index 33a6502fa403b..a19b71b098dac 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/primary_secondary_user_info.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/primary_secondary_user_info.tsx @@ -21,87 +21,79 @@ interface Props { eventId: string; primary: string | null | undefined; secondary: string | null | undefined; - isDraggable?: boolean; } -export const PrimarySecondary = React.memo( - ({ contextId, eventId, primary, secondary, isDraggable }) => { - if (nilOrUnSet(primary) && nilOrUnSet(secondary)) { - return null; - } else if (!nilOrUnSet(primary) && nilOrUnSet(secondary)) { - return ( - - ); - } else if (nilOrUnSet(primary) && !nilOrUnSet(secondary)) { - return ( - - ); - } else if (primary === secondary) { - return ( - - ); - } else { - return ( - - - - - - {i18n.AS} - - - - - - ); - } +export const PrimarySecondary = React.memo(({ contextId, eventId, primary, secondary }) => { + if (nilOrUnSet(primary) && nilOrUnSet(secondary)) { + return null; + } else if (!nilOrUnSet(primary) && nilOrUnSet(secondary)) { + return ( + + ); + } else if (nilOrUnSet(primary) && !nilOrUnSet(secondary)) { + return ( + + ); + } else if (primary === secondary) { + return ( + + ); + } else { + return ( + + + + + + {i18n.AS} + + + + + + ); } -); +}); PrimarySecondary.displayName = 'PrimarySecondary'; @@ -111,11 +103,10 @@ interface PrimarySecondaryUserInfoProps { userName: string | null | undefined; primary: string | null | undefined; secondary: string | null | undefined; - isDraggable?: boolean; } export const PrimarySecondaryUserInfo = React.memo( - ({ contextId, eventId, userName, primary, secondary, isDraggable }) => { + ({ contextId, eventId, userName, primary, secondary }) => { if (nilOrUnSet(userName) && nilOrUnSet(primary) && nilOrUnSet(secondary)) { return null; } else if ( @@ -130,7 +121,6 @@ export const PrimarySecondaryUserInfo = React.memo diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/session_user_host_working_dir.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/session_user_host_working_dir.tsx index bbee0d48d7f0d..6677467417ea4 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/session_user_host_working_dir.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/auditd/session_user_host_working_dir.tsx @@ -23,21 +23,10 @@ interface Props { secondary: string | null | undefined; workingDirectory: string | null | undefined; session: string | null | undefined; - isDraggable?: boolean; } export const SessionUserHostWorkingDir = React.memo( - ({ - eventId, - contextId, - hostName, - userName, - primary, - secondary, - workingDirectory, - session, - isDraggable, - }) => ( + ({ eventId, contextId, hostName, userName, primary, secondary, workingDirectory, session }) => ( <> {i18n.SESSION} @@ -49,7 +38,6 @@ export const SessionUserHostWorkingDir = React.memo( field="auditd.session" value={session} iconType="number" - isDraggable={isDraggable} isAggregatable={true} fieldType="keyword" /> @@ -61,7 +49,6 @@ export const SessionUserHostWorkingDir = React.memo( userName={userName} primary={primary} secondary={secondary} - isDraggable={isDraggable} /> {hostName != null && ( @@ -74,7 +61,6 @@ export const SessionUserHostWorkingDir = React.memo( eventId={eventId} workingDirectory={workingDirectory} hostName={hostName} - isDraggable={isDraggable} /> ) diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.test.tsx index 733afdf0b8e88..b83be98836a82 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.test.tsx @@ -21,15 +21,7 @@ describe('Bytes', () => { test('it renders the expected formatted bytes', () => { const wrapper = mount( - + ); expect(wrapper.find(PreferenceFormattedBytes).first().text()).toEqual('1.2MB'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.tsx index 263a80d16307e..cc771378012ff 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/bytes/index.tsx @@ -6,8 +6,6 @@ */ import React from 'react'; - -import { DefaultDraggable } from '../../../../../../common/components/draggables'; import { PreferenceFormattedBytes } from '../../../../../../common/components/formatted_bytes'; export const BYTES_FORMAT = 'bytes'; @@ -17,33 +15,7 @@ export const BYTES_FORMAT = 'bytes'; * duration of time, (e.g. `event.duration`) */ export const Bytes = React.memo<{ - contextId: string; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; value?: string | null; - scopeId?: string; -}>(({ contextId, eventId, fieldName, fieldType, isAggregatable, isDraggable, value, scopeId }) => - isDraggable ? ( - - - - ) : ( - - ) -); +}>(({ value }) => ); Bytes.displayName = 'Bytes'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/column_renderer.ts b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/column_renderer.ts index 9770f2e6f5b67..e79e2dc077439 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/column_renderer.ts +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/column_renderer.ts @@ -26,7 +26,6 @@ export interface ColumnRenderer { field, globalFilters, isDetails, - isDraggable, linkValues, rowRenderers, scopeId, @@ -43,7 +42,6 @@ export interface ColumnRenderer { field: ColumnHeaderOptions; globalFilters?: Filter[]; isDetails?: boolean; - isDraggable?: boolean; linkValues?: string[] | null | undefined; rowRenderers?: RowRenderer[]; scopeId: string; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.test.tsx index 61ab172d74d8c..e9cdc23c3b2c8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.test.tsx @@ -68,7 +68,6 @@ describe('combineRenderers', () => { }); describe('renderRow', () => { - const isDraggable = false; const scopeId = TimelineId.test; it('renders `a` and `b` when `a` is an instance and `b` is an instance', () => { @@ -78,20 +77,17 @@ describe('combineRenderers', () => { combineRenderers({ a, b, id: a.id }).renderRow({ contextId, data, - isDraggable: false, scopeId, }); expect(a.renderRow).toBeCalledWith({ contextId, data, - isDraggable, scopeId, }); expect(b.renderRow).toBeCalledWith({ contextId, data, - isDraggable, scopeId, }); }); @@ -103,14 +99,12 @@ describe('combineRenderers', () => { combineRenderers({ a, b, id: a.id }).renderRow({ contextId, data, - isDraggable, scopeId, }); expect(a.renderRow).toBeCalledWith({ contextId, data, - isDraggable, scopeId, }); expect(b.renderRow).not.toBeCalled(); @@ -123,7 +117,6 @@ describe('combineRenderers', () => { combineRenderers({ a, b, id: a.id }).renderRow({ contextId, data, - isDraggable, scopeId, }); @@ -131,7 +124,6 @@ describe('combineRenderers', () => { expect(b.renderRow).toBeCalledWith({ contextId, data, - isDraggable, scopeId, }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.tsx index 4d8885209bf24..37d519db65c90 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/combine_renderers/index.tsx @@ -23,24 +23,12 @@ export const combineRenderers = ({ }): RowRenderer => ({ id, isInstance: (data: Ecs) => a.isInstance(data) || b.isInstance(data), - renderRow: ({ - contextId, - data, - isDraggable, - scopeId, - }: { - contextId?: string; - data: Ecs; - isDraggable: boolean; - scopeId: string; - }) => ( + renderRow: ({ contextId, data, scopeId }: { contextId?: string; data: Ecs; scopeId: string }) => ( {a.isInstance(data) && ( - {a.renderRow({ contextId, data, isDraggable, scopeId })} - )} - {b.isInstance(data) && ( - {b.renderRow({ contextId, data, isDraggable, scopeId })} + {a.renderRow({ contextId, data, scopeId })} )} + {b.isInstance(data) && {b.renderRow({ contextId, data, scopeId })}} ), }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/indicator_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/indicator_details.tsx index ebfd869b73a34..087c63bf4d8a8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/indicator_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/indicator_details.tsx @@ -10,8 +10,8 @@ import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import { - INDICATOR_MATCHED_TYPE, FEED_NAME, + INDICATOR_MATCHED_TYPE, INDICATOR_REFERENCE, } from '../../../../../../../common/cti/constants'; import { DraggableBadge } from '../../../../../../common/components/draggables'; @@ -24,7 +24,6 @@ interface IndicatorDetailsProps { feedName: string | undefined; indicatorReference: string | undefined; indicatorType: string | undefined; - isDraggable?: boolean; } export const IndicatorDetails: React.FC = ({ @@ -33,7 +32,6 @@ export const IndicatorDetails: React.FC = ({ feedName, indicatorReference, indicatorType, - isDraggable, }) => ( = ({ data-test-subj="threat-match-indicator-details-indicator-type" eventId={eventId} field={INDICATOR_MATCHED_TYPE} - isDraggable={isDraggable} value={indicatorType} isAggregatable={true} fieldType={'keyword'} @@ -73,7 +70,6 @@ export const IndicatorDetails: React.FC = ({ data-test-subj="threat-match-indicator-details-indicator-feedName" eventId={eventId} field={FEED_NAME} - isDraggable={isDraggable} value={feedName} isAggregatable={true} fieldType={'keyword'} @@ -92,7 +88,6 @@ export const IndicatorDetails: React.FC = ({ data-test-subj="threat-match-indicator-details-indicator-reference" eventId={eventId} fieldName={INDICATOR_REFERENCE} - isDraggable={isDraggable} value={indicatorReference} isAggregatable={true} fieldType={'keyword'} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/match_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/match_details.tsx index 31df9dc26cd0c..e05fbedf990c7 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/match_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/match_details.tsx @@ -16,7 +16,6 @@ import { HorizontalSpacer } from './helpers'; interface MatchDetailsProps { contextId: string; eventId: string; - isDraggable?: boolean; sourceField: string; sourceValue: string; } @@ -24,7 +23,6 @@ interface MatchDetailsProps { export const MatchDetails: React.FC = ({ contextId, eventId, - isDraggable, sourceField, sourceValue, }) => ( @@ -42,7 +40,6 @@ export const MatchDetails: React.FC = ({ data-test-subj="threat-match-details-source-field" eventId={eventId} field={INDICATOR_MATCHED_FIELD} - isDraggable={isDraggable} value={sourceField} isAggregatable={true} fieldType={'keyword'} @@ -62,7 +59,6 @@ export const MatchDetails: React.FC = ({ data-test-subj="threat-match-details-source-value" eventId={eventId} field={sourceField} - isDraggable={isDraggable} value={sourceValue} isAggregatable={true} fieldType={'keyword'} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row.tsx index 958e7b38496d6..0395deec9deba 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row.tsx @@ -11,11 +11,11 @@ import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; import type { Fields } from '../../../../../../../common/search_strategy'; import { + FEED_NAME, MATCHED_ATOMIC, MATCHED_FIELD, MATCHED_TYPE, REFERENCE, - FEED_NAME, } from '../../../../../../../common/cti/constants'; import { MatchDetails } from './match_details'; import { IndicatorDetails } from './indicator_details'; @@ -26,7 +26,6 @@ export interface ThreatMatchRowProps { feedName?: string; indicatorReference?: string; indicatorType?: string; - isDraggable?: boolean; sourceField: string; sourceValue: string; } @@ -35,12 +34,10 @@ export const ThreatMatchRow = ({ contextId, data, eventId, - isDraggable, }: { contextId: string; data: Fields; eventId: string; - isDraggable?: boolean; }) => { const props = { contextId, @@ -48,7 +45,6 @@ export const ThreatMatchRow = ({ indicatorReference: getOr([], REFERENCE, data)[0] as string | undefined, feedName: getOr([], FEED_NAME, data)[0] as string | undefined, indicatorType: getOr([], MATCHED_TYPE, data)[0] as string | undefined, - isDraggable, sourceField: get(MATCHED_FIELD, data)[0] as string, sourceValue: get(MATCHED_ATOMIC, data)[0] as string, }; @@ -62,7 +58,6 @@ export const ThreatMatchRowView = ({ feedName, indicatorReference, indicatorType, - isDraggable, sourceField, sourceValue, }: ThreatMatchRowProps) => { @@ -77,7 +72,6 @@ export const ThreatMatchRowView = ({ @@ -89,7 +83,6 @@ export const ThreatMatchRowView = ({ feedName={feedName} indicatorReference={indicatorReference} indicatorType={indicatorType} - isDraggable={isDraggable} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row_renderer.test.tsx index d705b0ad4f1e5..13c04ea4f8528 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_row_renderer.test.tsx @@ -6,7 +6,7 @@ */ import { TimelineId } from '../../../../../../../common/types/timeline'; -import { render, fireEvent } from '@testing-library/react'; +import { fireEvent, render } from '@testing-library/react'; import React from 'react'; import { get } from 'lodash'; @@ -71,7 +71,6 @@ describe('threatMatchRowRenderer', () => { it('renders with minimum required props', () => { const children = threatMatchRowRenderer.renderRow({ data: threatMatchData, - isDraggable: true, scopeId: TimelineId.test, }); const { getByTestId } = render({children}); @@ -94,7 +93,6 @@ describe('threatMatchRowRenderer', () => { const children = threatMatchRowRenderer.renderRow({ data: modThreatMatchData, - isDraggable: true, scopeId: TimelineId.test, }); const { getByTestId, queryAllByTestId, findAllByTestId, findByTestId } = render( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_rows.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_rows.tsx index 1f907eac582a3..974931bcc07d1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_rows.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/cti/threat_match_rows.tsx @@ -19,7 +19,7 @@ import { } from '@elastic/eui'; import { get } from 'lodash'; import type { FC, ReactElement } from 'react'; -import React, { Fragment, useState, useCallback } from 'react'; +import React, { Fragment, useCallback, useState } from 'react'; import styled from 'styled-components'; import type { EcsSecurityExtension } from '@kbn/securitysolution-ecs'; @@ -39,19 +39,18 @@ const SpacedContainer = styled.div` margin: ${({ theme }) => theme.eui.euiSizeS} 0; `; -export const renderThreatMatchRows: RowRenderer['renderRow'] = ({ data, isDraggable, scopeId }) => { - return ; +export const renderThreatMatchRows: RowRenderer['renderRow'] = ({ data, scopeId }) => { + return ; }; interface ThreatMatchRowProps { data: EcsSecurityExtension; - isDraggable: boolean; scopeId: string; } const MAX_INDICATOR_VISIBLE = 2; -const ThreatMatchRowWrapper: FC = ({ data, isDraggable, scopeId }) => { +const ThreatMatchRowWrapper: FC = ({ data, scopeId }) => { const indicators = get(data, ENRICHMENT_DESTINATION_PATH) as Fields[]; const eventId = get(data, ID_FIELD_NAME); @@ -67,12 +66,7 @@ const ThreatMatchRowWrapper: FC = ({ data, isDraggable, sco const contextId = `threat-match-row-${scopeId}-${eventId}-${index}`; return ( - + {index < indicators.length - 1 && } ); @@ -81,7 +75,7 @@ const ThreatMatchRowWrapper: FC = ({ data, isDraggable, sco ); }, - [indicators, eventId, isDraggable, scopeId] + [indicators, eventId, scopeId] ); const renderModalChildren = useCallback(() => getThreatMatchRows('all'), [getThreatMatchRows]); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details.tsx index aae395042cdeb..824b43499b312 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details.tsx @@ -18,50 +18,46 @@ import { DnsRequestEventDetailsLine } from './dns_request_event_details_line'; interface Props { contextId: string; data: Ecs; - isDraggable?: boolean; timelineId: string; } -export const DnsRequestEventDetails = React.memo( - ({ data, contextId, isDraggable, timelineId }) => { - const dnsQuestionName: string | null | undefined = get('dns.question.name[0]', data); - const dnsQuestionType: string | null | undefined = get('dns.question.type[0]', data); - const dnsResolvedIp: string | null | undefined = get('dns.resolved_ip[0]', data); - const dnsResponseCode: string | null | undefined = get('dns.response_code[0]', data); - const eventCode: string | null | undefined = get('event.code[0]', data); - const hostName: string | null | undefined = get('host.name[0]', data); - const id = data._id; - const processExecutable: string | null | undefined = get('process.executable[0]', data); - const processName: string | null | undefined = get('process.name[0]', data); - const processPid: number | null | undefined = get('process.pid[0]', data); - const userDomain: string | null | undefined = get('user.domain[0]', data); - const userName: string | null | undefined = get('user.name[0]', data); - const winlogEventId: string | null | undefined = get('winlog.event_id[0]', data); +export const DnsRequestEventDetails = React.memo(({ data, contextId, timelineId }) => { + const dnsQuestionName: string | null | undefined = get('dns.question.name[0]', data); + const dnsQuestionType: string | null | undefined = get('dns.question.type[0]', data); + const dnsResolvedIp: string | null | undefined = get('dns.resolved_ip[0]', data); + const dnsResponseCode: string | null | undefined = get('dns.response_code[0]', data); + const eventCode: string | null | undefined = get('event.code[0]', data); + const hostName: string | null | undefined = get('host.name[0]', data); + const id = data._id; + const processExecutable: string | null | undefined = get('process.executable[0]', data); + const processName: string | null | undefined = get('process.name[0]', data); + const processPid: number | null | undefined = get('process.pid[0]', data); + const userDomain: string | null | undefined = get('user.domain[0]', data); + const userName: string | null | undefined = get('user.name[0]', data); + const winlogEventId: string | null | undefined = get('winlog.event_id[0]', data); - return ( -
- - - -
- ); - } -); + return ( +
+ + + +
+ ); +}); DnsRequestEventDetails.displayName = 'DnsRequestEventDetails'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details_line.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details_line.tsx index d71d42ff65495..a808787e9a126 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details_line.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/dns/dns_request_event_details_line.tsx @@ -24,7 +24,6 @@ interface Props { eventCode: string | null | undefined; hostName: string | null | undefined; id: string; - isDraggable?: boolean; processExecutable: string | null | undefined; processName: string | null | undefined; processPid: number | null | undefined; @@ -43,7 +42,6 @@ export const DnsRequestEventDetailsLine = React.memo( eventCode, hostName, id, - isDraggable, processExecutable, processName, processPid, @@ -58,7 +56,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} hostName={hostName} - isDraggable={isDraggable} userDomain={userDomain} userName={userName} workingDirectory={undefined} @@ -74,7 +71,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="dns.question.name" - isDraggable={isDraggable} value={dnsQuestionName} isAggregatable={true} fieldType="keyword" @@ -93,7 +89,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="dns.question.type" - isDraggable={isDraggable} value={dnsQuestionType} isAggregatable={true} fieldType="keyword" @@ -112,7 +107,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="dns.resolved_ip" - isDraggable={isDraggable} value={dnsResolvedIp} isAggregatable={true} fieldType="ip" @@ -134,7 +128,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="dns.response_code" - isDraggable={isDraggable} value={dnsResponseCode} isAggregatable={true} fieldType="keyword" @@ -156,7 +149,6 @@ export const DnsRequestEventDetailsLine = React.memo( endgamePid={undefined} endgameProcessName={undefined} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={processExecutable} @@ -171,7 +163,6 @@ export const DnsRequestEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="event.code" - isDraggable={isDraggable} value={eventCode} isAggregatable={true} fieldType="number" @@ -184,7 +175,6 @@ export const DnsRequestEventDetailsLine = React.memo( eventId={id} iconType="logoWindows" field="winlog.event_id" - isDraggable={isDraggable} value={winlogEventId} isAggregatable={true} fieldType="keyword" diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.test.tsx index 641d675e0bf0c..1cc1aa8d919c8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.test.tsx @@ -8,8 +8,6 @@ import { shallow } from 'enzyme'; import { cloneDeep } from 'lodash/fp'; import React from 'react'; - -import { DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY } from '../../../../../common/components/drag_and_drop/translations'; import type { TimelineNonEcsData } from '../../../../../../common/search_strategy/timeline'; import { defaultHeaders, mockTimelineData, TestProviders } from '../../../../../common/mock'; import { useMountAppended } from '../../../../../common/utils/use_mount_appended'; @@ -75,8 +73,6 @@ describe('empty_column_renderer', () => { ); - expect(wrapper.text()).toEqual( - `source.ip${getEmptyValue()}${DRAGGABLE_KEYBOARD_INSTRUCTIONS_NOT_DRAGGING_SCREEN_READER_ONLY}` - ); + expect(wrapper.text()).toEqual(getEmptyValue()); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.tsx index b5a527a65abb2..629c05703dce3 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/empty_column_renderer.tsx @@ -6,18 +6,9 @@ */ import React from 'react'; -import type { ColumnHeaderOptions } from '../../../../../../common/types'; import type { TimelineNonEcsData } from '../../../../../../common/search_strategy/timeline'; -import { - DraggableWrapper, - DragEffects, -} from '../../../../../common/components/drag_and_drop/draggable_wrapper'; -import { escapeDataProviderId } from '../../../../../common/components/drag_and_drop/helpers'; import { getEmptyValue } from '../../../../../common/components/empty_value'; -import { EXISTS_OPERATOR } from '../../data_providers/data_provider'; -import { Provider } from '../../data_providers/provider'; import type { ColumnRenderer } from './column_renderer'; -import { parseQueryValue } from './parse_query_value'; export const dataNotExistsAtColumn = (columnName: string, data: TimelineNonEcsData[]): boolean => data.findIndex((item) => item.field === columnName) === -1; @@ -25,54 +16,5 @@ export const dataNotExistsAtColumn = (columnName: string, data: TimelineNonEcsDa export const emptyColumnRenderer: ColumnRenderer = { isInstance: (columnName: string, data: TimelineNonEcsData[]) => dataNotExistsAtColumn(columnName, data), - renderColumn: ({ - columnName, - eventId, - field, - isDraggable = true, - scopeId, - truncate, - }: { - columnName: string; - eventId: string; - field: ColumnHeaderOptions; - isDraggable?: boolean; - scopeId: string; - truncate?: boolean; - }) => - isDraggable ? ( - - snapshot.isDragging ? ( - - - - ) : ( - {getEmptyValue()} - ) - } - truncate={truncate} - scopeId={scopeId} - /> - ) : ( - {getEmptyValue()} - ), + renderColumn: () => {getEmptyValue()}, }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details.tsx index efa6b640f6895..811af95583bee 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details.tsx @@ -18,75 +18,65 @@ import { Details } from '../helpers'; interface Props { contextId: string; data: Ecs; - isDraggable?: boolean; timelineId: string; } -export const EndgameSecurityEventDetails = React.memo( - ({ data, contextId, isDraggable, timelineId }) => { - const endgameLogonType: number | null | undefined = get('endgame.logon_type[0]', data); - const endgameSubjectDomainName: string | null | undefined = get( - 'endgame.subject_domain_name[0]', - data - ); - const endgameSubjectLogonId: string | null | undefined = get( - 'endgame.subject_logon_id[0]', - data - ); - const endgameSubjectUserName: string | null | undefined = get( - 'endgame.subject_user_name[0]', - data - ); - const endgameTargetLogonId: string | null | undefined = get('endgame.target_logon_id[0]', data); - const endgameTargetDomainName: string | null | undefined = get( - 'endgame.target_domain_name[0]', - data - ); - const endgameTargetUserName: string | null | undefined = get( - 'endgame.target_user_name[0]', - data - ); - const eventAction: string | null | undefined = get('event.action[0]', data); - const eventCode: string | null | undefined = get('event.code[0]', data); - const eventOutcome: string | null | undefined = get('event.outcome[0]', data); - const hostName: string | null | undefined = get('host.name[0]', data); - const id = data._id; - const processExecutable: string | null | undefined = get('process.executable[0]', data); - const processName: string | null | undefined = get('process.name[0]', data); - const processPid: number | null | undefined = get('process.pid[0]', data); - const userDomain: string | null | undefined = get('user.domain[0]', data); - const userName: string | null | undefined = get('user.name[0]', data); - const winlogEventId: string | null | undefined = get('winlog.event_id[0]', data); +export const EndgameSecurityEventDetails = React.memo(({ data, contextId, timelineId }) => { + const endgameLogonType: number | null | undefined = get('endgame.logon_type[0]', data); + const endgameSubjectDomainName: string | null | undefined = get( + 'endgame.subject_domain_name[0]', + data + ); + const endgameSubjectLogonId: string | null | undefined = get('endgame.subject_logon_id[0]', data); + const endgameSubjectUserName: string | null | undefined = get( + 'endgame.subject_user_name[0]', + data + ); + const endgameTargetLogonId: string | null | undefined = get('endgame.target_logon_id[0]', data); + const endgameTargetDomainName: string | null | undefined = get( + 'endgame.target_domain_name[0]', + data + ); + const endgameTargetUserName: string | null | undefined = get('endgame.target_user_name[0]', data); + const eventAction: string | null | undefined = get('event.action[0]', data); + const eventCode: string | null | undefined = get('event.code[0]', data); + const eventOutcome: string | null | undefined = get('event.outcome[0]', data); + const hostName: string | null | undefined = get('host.name[0]', data); + const id = data._id; + const processExecutable: string | null | undefined = get('process.executable[0]', data); + const processName: string | null | undefined = get('process.name[0]', data); + const processPid: number | null | undefined = get('process.pid[0]', data); + const userDomain: string | null | undefined = get('user.domain[0]', data); + const userName: string | null | undefined = get('user.name[0]', data); + const winlogEventId: string | null | undefined = get('winlog.event_id[0]', data); - return ( -
- - - -
- ); - } -); + return ( +
+ + + +
+ ); +}); EndgameSecurityEventDetails.displayName = 'EndgameSecurityEventDetails'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details_line.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details_line.tsx index 28b632d8c8f5b..538a939f7cae8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details_line.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/endgame/endgame_security_event_details_line.tsx @@ -17,9 +17,9 @@ import { getEventDetails, getHostNameSeparator, getHumanReadableLogonType, + getTargetUserAndTargetDomain, getUserDomainField, getUserNameField, - getTargetUserAndTargetDomain, } from './helpers'; import * as i18n from './translations'; @@ -38,7 +38,6 @@ interface Props { eventOutcome: string | null | undefined; hostName: string | null | undefined; id: string; - isDraggable?: boolean; processExecutable: string | null | undefined; processName: string | null | undefined; processPid: number | null | undefined; @@ -62,7 +61,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( eventOutcome, hostName, id, - isDraggable, processExecutable, processName, processPid, @@ -97,7 +95,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( eventId={id} hostName={hostName} hostNameSeparator={hostNameSeparator} - isDraggable={isDraggable} userDomain={domain} userDomainField={userDomainField} userName={user} @@ -119,7 +116,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="endgame.logon_type" - isDraggable={isDraggable} queryValue={String(endgameLogonType)} value={`${endgameLogonType} - ${getHumanReadableLogonType(endgameLogonType)}`} isAggregatable={true} @@ -142,7 +138,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="endgame.target_logon_id" - isDraggable={isDraggable} value={endgameTargetLogonId} isAggregatable={true} fieldType="keyword" @@ -164,7 +159,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( endgamePid={undefined} endgameProcessName={undefined} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={processExecutable} @@ -186,7 +180,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="endgame.subject_user_name" - isDraggable={isDraggable} iconType="user" value={endgameSubjectUserName} isAggregatable={true} @@ -210,7 +203,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="endgame.subject_domain_name" - isDraggable={isDraggable} value={endgameSubjectDomainName} isAggregatable={true} fieldType="keyword" @@ -232,7 +224,6 @@ export const EndgameSecurityEventDetailsLine = React.memo( contextId={contextId} eventId={id} field="endgame.subject_logon_id" - isDraggable={isDraggable} value={endgameSubjectLogonId} isAggregatable={true} fieldType="keyword" diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/event_summary_column_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/event_summary_column_renderer.tsx index 42b7435e62406..124063523d874 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/event_summary_column_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/event_summary_column_renderer.tsx @@ -16,9 +16,11 @@ import type { ColumnRenderer } from './column_renderer'; import { EVENT_SUMMARY_FIELD_NAME } from './constants'; import { getRowRenderer } from './get_row_renderer'; import { plainColumnRenderer } from './plain_column_renderer'; + const EventRenderedFlexItem = styled(EuiFlexItem)` div:first-child { padding-left: 0px; + div { margin: 0px; } @@ -45,7 +47,6 @@ export const eventSummaryColumnRenderer: ColumnRenderer = { eventId: string; field: ColumnHeaderOptions; isDetails?: boolean; - isDraggable?: boolean; linkValues?: string[] | null | undefined; rowRenderers?: RowRenderer[]; scopeId: string; @@ -68,7 +69,6 @@ export const eventSummaryColumnRenderer: ColumnRenderer = { eventId, field, isDetails, - isDraggable: false, linkValues, scopeId, truncate, @@ -94,7 +94,6 @@ const SummaryCell: React.FC<{ rowRenderer && rowRenderer.renderRow({ data: ecsData, - isDraggable: false, scopeId, }) ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/exit_code_draggable.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/exit_code_draggable.tsx index 04b74d77c922a..8fac6c8b293b1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/exit_code_draggable.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/exit_code_draggable.tsx @@ -15,13 +15,12 @@ interface Props { contextId: string; endgameExitCode: string | null | undefined; eventId: string; - isDraggable?: boolean; processExitCode: number | null | undefined; text: string | null | undefined; } export const ExitCodeDraggable = React.memo( - ({ contextId, endgameExitCode, eventId, isDraggable, processExitCode, text }) => { + ({ contextId, endgameExitCode, eventId, processExitCode, text }) => { if (isNillEmptyOrNotFinite(processExitCode) && isNillEmptyOrNotFinite(endgameExitCode)) { return null; } @@ -40,7 +39,6 @@ export const ExitCodeDraggable = React.memo( contextId={contextId} eventId={eventId} field="process.exit_code" - isDraggable={isDraggable} value={`${processExitCode}`} fieldType="number" isAggregatable={true} @@ -54,7 +52,6 @@ export const ExitCodeDraggable = React.memo( contextId={contextId} eventId={eventId} field="endgame.exit_code" - isDraggable={isDraggable} value={endgameExitCode} fieldType="number" isAggregatable={true} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_draggable.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_draggable.tsx index 819ab310e4587..9c0b350146e4f 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_draggable.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_draggable.tsx @@ -20,7 +20,6 @@ interface Props { fileName: string | null | undefined; filePath: string | null | undefined; fileExtOriginalPath: string | null | undefined; - isDraggable?: boolean; } export const FileDraggable = React.memo( @@ -32,7 +31,6 @@ export const FileDraggable = React.memo( fileExtOriginalPath, fileName, filePath, - isDraggable, }) => { if ( isNillEmptyOrNotFinite(fileName) && @@ -54,7 +52,6 @@ export const FileDraggable = React.memo( contextId={contextId} eventId={eventId} field="file.name" - isDraggable={isDraggable} value={fileName} iconType="document" isAggregatable={true} @@ -67,7 +64,6 @@ export const FileDraggable = React.memo( contextId={contextId} eventId={eventId} field="endgame.file_name" - isDraggable={isDraggable} value={endgameFileName} iconType="document" isAggregatable={true} @@ -88,7 +84,6 @@ export const FileDraggable = React.memo( contextId={contextId} eventId={eventId} field="file.path" - isDraggable={isDraggable} value={filePath} iconType="document" isAggregatable={true} @@ -101,7 +96,6 @@ export const FileDraggable = React.memo( contextId={contextId} eventId={eventId} field="endgame.file_path" - isDraggable={isDraggable} value={endgameFilePath} iconType="document" isAggregatable={true} @@ -120,7 +114,6 @@ export const FileDraggable = React.memo( contextId={contextId} eventId={eventId} field="file.Ext.original.path" - isDraggable={isDraggable} value={fileExtOriginalPath} iconType="document" isAggregatable={true} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_hash.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_hash.tsx index 8b2b0907c6814..4eb1805ff0f7d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_hash.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/file_hash.tsx @@ -21,10 +21,9 @@ interface Props { contextId: string; eventId: string; fileHashSha256: string | null | undefined; - isDraggable?: boolean; } -export const FileHash = React.memo(({ contextId, eventId, fileHashSha256, isDraggable }) => { +export const FileHash = React.memo(({ contextId, eventId, fileHashSha256 }) => { if (isNillEmptyOrNotFinite(fileHashSha256)) { return null; } @@ -36,7 +35,6 @@ export const FileHash = React.memo(({ contextId, eventId, fileHashSha256, contextId={contextId} eventId={eventId} field="file.hash.sha256" - isDraggable={isDraggable} iconType="number" value={fileHashSha256} isAggregatable={true} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field.tsx index 379bf6c544fe3..452aee5291356 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field.tsx @@ -75,7 +75,6 @@ const FormattedFieldValueComponent: React.FC<{ fieldName: string; fieldType?: string; isButton?: boolean; - isDraggable?: boolean; onClick?: () => void; onClickAriaLabel?: string; title?: string; @@ -95,7 +94,6 @@ const FormattedFieldValueComponent: React.FC<{ fieldFromBrowserField, isButton, isObjectArray = false, - isDraggable = true, onClick, onClickAriaLabel, title, @@ -109,17 +107,11 @@ const FormattedFieldValueComponent: React.FC<{ return ( ); } else if (fieldType === GEO_FIELD_TYPE) { @@ -137,57 +129,16 @@ const FormattedFieldValueComponent: React.FC<{ /> ); if (isUnifiedDataTable) return date; - return isDraggable ? ( - - {date} - - ) : ( - date - ); + return date; } else if (PORT_NAMES.some((portName) => fieldName === portName)) { - return ( - - ); + return ; } else if (fieldName === EVENT_DURATION_FIELD_NAME) { - return ( - - ); + return ; } else if (fieldName === EntityTypeToIdentifierField.host) { return ( ); } else if (fieldFormat === BYTES_FORMAT) { - return ( - - ); + return ; } else if (fieldName === SIGNAL_RULE_NAME_FIELD_NAME) { return ( - ); + return ; } else if (fieldName === AGENT_STATUS_FIELD_NAME) { return ( void; linkValue: string | null | undefined; @@ -53,12 +47,7 @@ interface RenderRuleNameProps { export const RenderRuleName: React.FC = ({ children, Component, - contextId, - eventId, fieldName, - fieldType, - isAggregatable, - isDraggable, isButton, onClick, linkValue, @@ -111,7 +100,6 @@ export const RenderRuleName: React.FC = ({ }), [getUrlForApp, ruleId, search] ); - const id = `event-details-value-default-draggable-${contextId}-${eventId}-${fieldName}-${value}-${ruleId}`; const link = useMemo(() => { const content = truncate ? ( {value} @@ -178,37 +166,9 @@ export const RenderRuleName: React.FC = ({ ]); if (isString(value) && ruleName.length > 0 && ruleId != null) { - return isDraggable ? ( - - {link} - - ) : ( - link - ); + return link; } else if (value != null) { - return isDraggable ? ( - - {value} - - ) : ( - <>{value} - ); + return <>{value}; } return getEmptyTagValue(); @@ -222,22 +182,10 @@ const canYouAddEndpointLogo = (moduleName: string, endpointUrl: string | null | endpointUrl.includes('/alerts/'); export const renderEventModule = ({ - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, linkValue, truncate, value, }: { - contextId: string; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; linkValue: string | null | undefined; truncate?: boolean; value: string | number | null | undefined; @@ -255,23 +203,7 @@ export const renderEventModule = ({ endpointRefUrl != null && !isEmpty(endpointRefUrl) ? 'flexStart' : 'spaceBetween' } > - - {isDraggable ? ( - - {content} - - ) : ( - <>{content} - )} - + {content} {endpointRefUrl != null && canYouAddEndpointLogo(moduleName, endpointRefUrl) && ( {formattedValue} ); - return isString(value) && urlName.length > 0 ? ( - isDraggable ? ( - - {content} - - ) : ( - content - ) - ) : ( - getEmptyTagValue() - ); + return isString(value) && urlName.length > 0 ? content : getEmptyTagValue(); }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field_udt.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field_udt.tsx index bd0c01019d63c..6ab563450a0c9 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field_udt.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/formatted_field_udt.tsx @@ -31,7 +31,6 @@ export const getFormattedFields = ({ return ( { const rowRenderer = getRowRenderer({ data: nonSuricata, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: nonSuricata, - isDraggable: true, scopeId: TimelineId.test, }); @@ -76,7 +75,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: nonSuricata, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: nonSuricata, - isDraggable: true, scopeId: TimelineId.test, }); @@ -92,7 +90,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: suricata, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: suricata, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( @@ -110,7 +107,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: suricata, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: suricata, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( @@ -128,7 +124,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: zeek, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: zeek, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( @@ -146,7 +141,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: system, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: system, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( @@ -164,7 +158,6 @@ describe('get_column_renderer', () => { const rowRenderer = getRowRenderer({ data: auditd, rowRenderers: defaultRowRenderers }); const row = rowRenderer?.renderRow({ data: auditd, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( @@ -203,9 +196,7 @@ describe('getRowRenderer', () => { render( - <> - {renderer?.renderRow({ data: auditd, isDraggable: false, scopeId: TimelineId.test })} - + <>{renderer?.renderRow({ data: auditd, scopeId: TimelineId.test })} ); }); @@ -247,7 +238,7 @@ describe('getRowRenderer', () => { render( - <>{renderer?.renderRow({ data, isDraggable: false, scopeId: TimelineId.test })} + <>{renderer?.renderRow({ data, scopeId: TimelineId.test })} ); }); @@ -282,7 +273,7 @@ describe('getRowRenderer', () => { render( - <>{renderer?.renderRow({ data, isDraggable: false, scopeId: TimelineId.test })} + <>{renderer?.renderRow({ data, scopeId: TimelineId.test })} ); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.test.tsx index c3cac287b03fb..c64c134ef599c 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.test.tsx @@ -56,7 +56,6 @@ describe('HostName', () => { fieldName: 'host.name', contextId: 'test-context-id', eventId: 'test-event-id', - isDraggable: false, fieldType: 'keyword', isAggregatable: true, value: 'Mock Host', @@ -74,20 +73,6 @@ describe('HostName', () => { ); }); - test('should render DefaultDraggable if isDraggable is true', () => { - const testProps = { - ...props, - isDraggable: true, - }; - const wrapper = mount( - - - - ); - - expect(wrapper.find('[data-test-subj="DefaultDraggable"]').exists()).toEqual(true); - }); - test('should not open any flyout or panels if context in not defined', async () => { const wrapper = mount( @@ -169,7 +154,6 @@ describe('HostName', () => { hostName: props.value, contextID: props.contextId, scopeId: TableId.alertsOnAlertsPage, - isDraggable: false, }, }, }); @@ -200,7 +184,6 @@ describe('HostName', () => { hostName: props.value, contextID: props.contextId, scopeId: 'timeline-1', - isDraggable: false, }, }, }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx index c0d5ede219741..e90c0f54e0069 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx @@ -12,18 +12,12 @@ import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; import { HostPanelKey } from '../../../../../flyout/entity_details/shared/constants'; import { StatefulEventContext } from '../../../../../common/components/events_viewer/stateful_event_context'; import { HostDetailsLink } from '../../../../../common/components/links'; -import { DefaultDraggable } from '../../../../../common/components/draggables'; import { getEmptyTagValue } from '../../../../../common/components/empty_value'; import { TruncatableText } from '../../../../../common/components/truncatable_text'; interface Props { contextId: string; Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; isButton?: boolean; onClick?: () => void; value: string | number | undefined | null; @@ -31,13 +25,8 @@ interface Props { } const HostNameComponent: React.FC = ({ - fieldName, - fieldType, - isAggregatable, Component, contextId, - eventId, - isDraggable, isButton, onClick, title, @@ -70,12 +59,11 @@ const HostNameComponent: React.FC = ({ hostName, contextID: contextId, scopeId: timelineID, - isDraggable, }, }, }); }, - [contextId, eventContext, hostName, isDraggable, isInTimelineContext, onClick, openFlyout] + [contextId, eventContext, hostName, isInTimelineContext, onClick, openFlyout] ); // The below is explicitly defined this way as the onClick takes precedence when it and the href are both defined @@ -95,25 +83,7 @@ const HostNameComponent: React.FC = ({ [Component, hostName, isButton, isInTimelineContext, openHostDetailsSidePanel, title] ); - return isString(value) && hostName.length > 0 ? ( - isDraggable ? ( - - {content} - - ) : ( - content - ) - ) : ( - getEmptyTagValue() - ); + return isString(value) && hostName.length > 0 ? content : getEmptyTagValue(); }; export const HostName = React.memo(HostNameComponent); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_working_dir.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_working_dir.tsx index 628592a3f45e6..21c5a0f5ee734 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_working_dir.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_working_dir.tsx @@ -17,11 +17,10 @@ interface Props { eventId: string; hostName: string | null | undefined; workingDirectory: string | null | undefined; - isDraggable?: boolean; } export const HostWorkingDir = React.memo( - ({ contextId, eventId, hostName, workingDirectory, isDraggable }) => ( + ({ contextId, eventId, hostName, workingDirectory }) => ( <> ( eventId={eventId} field="host.name" value={hostName} - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -46,7 +44,6 @@ export const HostWorkingDir = React.memo( field="process.working_directory" value={workingDirectory} iconType="folderOpen" - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow.tsx index 6750ea79e3434..af39a40019872 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow.tsx @@ -60,58 +60,52 @@ import { interface NetflowRendererProps { data: Ecs; timelineId: string; - isDraggable?: boolean; } -export const NetflowRenderer = React.memo( - ({ data, timelineId, isDraggable }) => ( - - ) -); +export const NetflowRenderer = React.memo(({ data, timelineId }) => ( + +)); NetflowRenderer.displayName = 'NetflowRenderer'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/__snapshots__/netflow_row_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/__snapshots__/netflow_row_renderer.test.tsx.snap index ba36ad1878592..f3c0ade04d197 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/__snapshots__/netflow_row_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/__snapshots__/netflow_row_renderer.test.tsx.snap @@ -16,182 +16,86 @@ exports[`netflowRowRenderer renders correctly against snapshot 1`] = ` border-radius: 4px; } -.c13, -.c13 * { - display: inline-block; - max-width: 100%; - overflow: hidden; - text-overflow: ellipsis; - vertical-align: top; - white-space: nowrap; -} - -.c5 { - border-radius: 2px; - padding: 0 4px 0 8px; - position: relative; - z-index: 0 !important; -} - -.c5::before { - background-image: linear-gradient( 135deg, #535966 25%, transparent 25% ), linear-gradient( -135deg, #535966 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #535966 75% ), linear-gradient( -135deg, transparent 75%, #535966 75% ); - background-position: 0 0,1px 0,1px -1px,0px 1px; - background-size: 2px 2px; - bottom: 2px; - content: ''; - display: block; - left: 2px; - position: absolute; - top: 2px; - width: 4px; -} - -.c5:hover, -.c5:hover .euiBadge, -.c5:hover .euiBadge__text { - cursor: move; - cursor: -webkit-grab; - cursor: -moz-grab; - cursor: grab; -} - -.event-column-view:hover .c4::before, -tr:hover .c5::before { - background-image: linear-gradient( 135deg, #98a2b3 25%, transparent 25% ), linear-gradient( -135deg, #98a2b3 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #98a2b3 75% ), linear-gradient( -135deg, transparent 75%, #98a2b3 75% ); -} - -.c5:hover, -.c5:focus, -.event-column-view:hover .c5:hover, -.event-column-view:focus .c5:focus, -tr:hover .c5:hover, -tr:hover .c5:focus { - background-color: #36a2ef; -} - -.c5:hover, -.c5:focus, -.event-column-view:hover .c5:hover, -.event-column-view:focus .c5:focus, -tr:hover .c5:hover, -tr:hover .c5:focus, -.c5:hover a, -.c5:focus a, -.event-column-view:hover .c5:hover a, -.event-column-view:focus .c5:focus a, -tr:hover .c5:hover a, -tr:hover .c5:focus a, -.c5:hover a:hover, -.c5:focus a:hover, -.event-column-view:hover .c5:hover a:hover, -.event-column-view:focus .c5:focus a:hover, -tr:hover .c5:hover a:hover, -tr:hover .c5:focus a:hover { - color: #1d1e24; -} - -.c5:hover::before, -.c5:focus::before, -.event-column-view:hover .c5:hover::before, -.event-column-view:focus .c5:focus::before, -tr:hover .c5:hover::before, -tr:hover .c5:focus::before { - background-image: linear-gradient( 135deg, #1d1e24 25%, transparent 25% ), linear-gradient( -135deg, #1d1e24 25%, transparent 25% ), linear-gradient( 135deg, transparent 75%, #1d1e24 75% ), linear-gradient( -135deg, transparent 75%, #1d1e24 75% ); -} - -.c3 { - display: inline-block; - max-width: 100%; -} - -.c3 [data-rbd-placeholder-context-id] { - display: none !important; -} - -.c6 > span.euiToolTipAnchor { +.c3 > span.euiToolTipAnchor { display: block; } -.c6 > span.euiToolTipAnchor.eui-textTruncate { +.c3 > span.euiToolTipAnchor.eui-textTruncate { display: inline-block; } -.c7 { - vertical-align: top; -} - -.c15 svg { +.c10 svg { position: relative; top: -1px; } -.c24 { +.c19 { margin-right: 5px; } -.c23 { +.c18 { margin-right: 5px; } -.c9 { +.c5 { margin-right: 3px; } -.c10 { +.c6 { margin: 0 5px; } -.c19 { +.c14 { background-color: #343741; height: 2.8px; width: 25px; } -.c22 { +.c17 { background-color: #343741; height: 2.2px; width: 25px; } -.c21 { +.c16 { margin-right: 5px; } -.c18 { +.c13 { margin: 0 2px; } -.c18 .euiToolTipAnchor { +.c13 .euiToolTipAnchor { white-space: nowrap; } -.c20 { +.c15 { margin: 0 5px; } -.c17 { +.c12 { position: relative; top: 1px; } -.c16 { +.c11 { margin-right: 5px; } -.c14 { +.c9 { margin: 0 3px; } -.c12 { +.c8 { font-weight: bold; margin-top: 2px; } -.c11 { +.c7 { margin-top: 3px; } -.c8 { +.c4 { margin-right: 3px; position: relative; top: -1px; @@ -241,72 +145,37 @@ tr:hover .c5:focus::before { >
-
-
-
-

- user.name -

+ - - - - - first.last - - - + first.last -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
@@ -317,72 +186,37 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
-

- process.name -

+ - - - - - rat - - - + rat -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
@@ -398,128 +232,58 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
+ -

- event.duration -

- -
- - -
- 1ms -
- -
- -

- Press enter for options, or press space to begin dragging. -

-
+ 1ms +
+
-
+
-
-
+ -

- event.start -

- -
- - - Nov 12, 2018 @ 19:03:25.836 - -
- -

- Press enter for options, or press space to begin dragging. -

-
+ Nov 12, 2018 @ 19:03:25.836 +
-
+
-
-
+ -

- event.end -

- -
- - - Nov 12, 2018 @ 19:03:25.936 - -
- -

- Press enter for options, or press space to begin dragging. -

-
+ Nov 12, 2018 @ 19:03:25.936 +
-
+
@@ -611,402 +340,192 @@ tr:hover .c5:focus::before { class="euiFlexGroup emotion-euiFlexGroup-responsive-none-center-center-row" >
-
-
-
-

- network.direction -

+ - - - - - outgoing - - - + outgoing -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
-
-
-
-

- network.protocol -

- - - - http - - - + http -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
-
-
-

- network.bytes -

- - -
- - 100B - -
- + + 100B -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
-
-
-

- network.packets -

- - -
- - 3 pkts - -
- + + 3 pkts -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
-
-
-
-

- network.transport -

- - - - tcp - - - + tcp -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
-
-
-
-

- network.community_id -

- - - - we.live.in.a - - - + we.live.in.a -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
Source
@@ -1053,71 +572,14 @@ tr:hover .c5:focus::before {
-
-
-
-
-
-
-
-
-

- source.ip -

- - - 192.168.1.2 - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
-
-
-
-
-
+ 192.168.1.2 +
: @@ -1139,88 +601,27 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
+ 9987 + + -
-
-
-
-
-

- source.port -

- - -
- - 9987 - - - (external, opens in a new tab or window) - - -
- - -

- Press enter for options, or press space to begin dragging. -

-
-
-
-
-
-
-
+ (external, opens in a new tab or window) + +
@@ -1236,7 +637,7 @@ tr:hover .c5:focus::before { class="euiFlexGroup emotion-euiFlexGroup-responsive-none-flexStart-center-row" >
-
-
-
-

- source.geo.continent_name -

- - - North America - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ North America + +
-
-
-
-

- source.geo.country_name -

- - - United States - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ United States + +
🇺🇸 @@ -1379,60 +710,25 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
-

- source.geo.country_iso_code -

- - - US - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ US + +
-
-
-
-

- source.geo.region_name -

- - - Georgia - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ Georgia + +
-
-
-
-

- source.geo.city_name -

- - - Atlanta - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ Atlanta + +
@@ -1563,7 +789,7 @@ tr:hover .c5:focus::before {
@@ -1583,72 +809,37 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-

- source.bytes -

- -
- - (60.00%) - - - 60B - -
- + (60.00%) + + + 60B -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
@@ -1656,67 +847,32 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-

- source.packets -

- - -
- - 2 pkts - -
- + + 2 pkts -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
@@ -1750,7 +906,7 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" > @@ -1766,65 +922,30 @@ tr:hover .c5:focus::before { >
-
-
-

- destination.bytes -

- -
- - (40.00%) - - - 40B - -
- + (40.00%) + + + 40B -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
@@ -1835,7 +956,7 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" > @@ -1843,67 +964,32 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-

- destination.packets -

- - -
- - 1 pkts - -
- + + 1 pkts -

- Press enter for options, or press space to begin dragging. -

-
-
+ +
@@ -1932,7 +1018,7 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
Destination
@@ -1952,71 +1038,14 @@ tr:hover .c5:focus::before {
-
-
-
-
-
-
-
-
-

- destination.ip -

- - - 10.1.2.3 - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
-
-
-
-
-
+ 10.1.2.3 +
: @@ -2038,88 +1067,27 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
+ 80 + + -
-
-
-
-
-

- destination.port -

- - -
- - 80 - - - (external, opens in a new tab or window) - - -
- - -

- Press enter for options, or press space to begin dragging. -

-
-
-
-
-
-
-
+ (external, opens in a new tab or window) + +
@@ -2135,7 +1103,7 @@ tr:hover .c5:focus::before { class="euiFlexGroup emotion-euiFlexGroup-responsive-none-flexStart-center-row" >
-
-
-
-

- destination.geo.continent_name -

- - - North America - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ North America + +
-
-
-
-

- destination.geo.country_name -

- - - United States - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ United States + +
🇺🇸 @@ -2278,60 +1176,25 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
-

- destination.geo.country_iso_code -

- - - US - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ US + +
-
-
-
-

- destination.geo.region_name -

- - - New York - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ New York + +
-
-
-
-

- destination.geo.city_name -

- - - New York - - -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ New York + +
@@ -2478,285 +1271,180 @@ tr:hover .c5:focus::before { class="euiFlexItem emotion-euiFlexItem-growZero" >
-
-
-
-

- tls.fingerprints.ja3.hash -

+ + ja3 + + + tls.fingerprints.ja3.hash-value + - - - - ja3 - - - tls.fingerprints.ja3.hash-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
-
-
-
-

- tls.client_certificate.fingerprint.sha1 -

+ + client cert + + + tls.client_certificate.fingerprint.sha1-value + - - - - client cert - - - tls.client_certificate.fingerprint.sha1-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
-
-
-
-

- tls.server_certificate.fingerprint.sha1 -

+ + server cert + + + tls.server_certificate.fingerprint.sha1-value + - - - - server cert - - - tls.server_certificate.fingerprint.sha1-value - - - (external, opens in a new tab or window) - - - + (external, opens in a new tab or window) - + -

- Press enter for options, or press space to begin dragging. -

-
-
-
+ + +
diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.test.tsx index fb399bc8478d7..ade0e6525e2f0 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.test.tsx @@ -7,10 +7,8 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; - import type { EcsSecurityExtension as Ecs } from '@kbn/securitysolution-ecs'; import { getMockNetflowData, TestProviders } from '../../../../../../common/mock'; - import { eventActionMatches, eventCategoryMatches, @@ -30,7 +28,6 @@ describe('netflowRowRenderer', () => { test('renders correctly against snapshot', () => { const children = netflowRowRenderer.renderRow({ data: getMockNetflowData(), - isDraggable: true, scopeId: TimelineId.test, }); @@ -99,7 +96,6 @@ describe('netflowRowRenderer', () => { test('should render netflow data', () => { const children = netflowRowRenderer.renderRow({ data: getMockNetflowData(), - isDraggable: true, scopeId: TimelineId.test, }); render( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.tsx index 097096667171c..e2277993c3aee 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/netflow/netflow_row_renderer.tsx @@ -89,7 +89,7 @@ export const netflowRowRenderer: RowRenderer = { isInstance: (ecs) => eventCategoryMatches(get(EVENT_CATEGORY_FIELD, ecs)) || eventActionMatches(get(EVENT_ACTION_FIELD, ecs)), - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => (
( contextId, endgameParentProcessName, eventId, - isDraggable, processParentName, processParentPid, processPpid, @@ -58,7 +56,6 @@ export const ParentProcessDraggable = React.memo( contextId={contextId} eventId={eventId} field="process.parent.name" - isDraggable={isDraggable} value={processParentName} fieldType="keyword" isAggregatable={true} @@ -72,7 +69,6 @@ export const ParentProcessDraggable = React.memo( contextId={contextId} eventId={eventId} field="endgame.parent_process_name" - isDraggable={isDraggable} value={endgameParentProcessName} fieldType="keyword" isAggregatable={true} @@ -86,7 +82,6 @@ export const ParentProcessDraggable = React.memo( contextId={contextId} eventId={eventId} field="process.parent.pid" - isDraggable={isDraggable} queryValue={String(processParentPid)} value={`(${String(processParentPid)})`} fieldType="keyword" @@ -101,7 +96,6 @@ export const ParentProcessDraggable = React.memo( contextId={contextId} eventId={eventId} field="process.ppid" - isDraggable={isDraggable} queryValue={String(processPpid)} value={`(${String(processPpid)})`} fieldType="keyword" diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.test.tsx index 24f3c3a06074d..4ec6fd83a4b55 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.test.tsx @@ -15,7 +15,7 @@ import { getEmptyValue } from '../../../../../common/components/empty_value'; import { useMountAppended } from '../../../../../common/utils/use_mount_appended'; import { plainColumnRenderer } from './plain_column_renderer'; -import { getValues, deleteItemIdx, findItem } from './helpers'; +import { deleteItemIdx, findItem, getValues } from './helpers'; jest.mock('../../../../../common/lib/kibana'); @@ -195,41 +195,6 @@ describe('plain_column_renderer', () => { expect(wrapper.text()).toEqual('I am a log file message'); }); - test('should NOT render a message as a draggable', () => { - const mockMessageDatum = cloneDeep(mockTimelineData[30].data); - const column = plainColumnRenderer.renderColumn({ - columnName: 'message', - eventId: _id, - values: getValues('message', mockMessageDatum), - field: defaultHeaders.find((h) => h.id === 'message')!, - scopeId: 'test', - }); - const wrapper = mount( - - {column} - - ); - - expect(wrapper.find('[data-test-subj="draggableWrapperDiv"]').first().exists()).toBe(false); - }); - - test('should render a _id as a draggable', () => { - const column = plainColumnRenderer.renderColumn({ - columnName: '_id', - eventId: _id, - values: [mockTimelineData[0]._id], - field: defaultHeaders.find((h) => h.id === '_id')!, - scopeId: 'test', - }); - const wrapper = mount( - - {column} - - ); - - expect(wrapper.find('[data-test-subj="draggableWrapperDiv"]').first().exists()).toBe(true); - }); - test('should join multiple values with a comma [not draggable]', () => { const data = mockTimelineData[19].data; const column = plainColumnRenderer.renderColumn({ @@ -238,7 +203,6 @@ describe('plain_column_renderer', () => { values: getValues('process.args', data), field: defaultHeaders.find((h) => h.id === 'message')!, scopeId: 'test', - isDraggable: false, }); const wrapper = mount( @@ -248,23 +212,5 @@ describe('plain_column_renderer', () => { const values = getValues('process.args', data); expect(wrapper.text()).toEqual(values?.join(', ')); }); - - test('should NOT join multiple values with a comma [draggable]', () => { - const data = mockTimelineData[19].data; - const column = plainColumnRenderer.renderColumn({ - columnName: 'process.args', - eventId: _id, - values: getValues('process.args', data), - field: defaultHeaders.find((h) => h.id === 'message')!, - scopeId: 'test', - isDraggable: true, - }); - const wrapper = mount( - - {column} - - ); - expect(wrapper.find('[data-test-subj="draggableWrapperDiv"]').first().exists()).toBe(true); - }); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.tsx index 5a23f4182355a..0c33e944a3ecc 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_column_renderer.tsx @@ -26,7 +26,6 @@ export const plainColumnRenderer: ColumnRenderer = { columnName, eventId, field, - isDraggable = true, scopeId, truncate, values, @@ -37,7 +36,6 @@ export const plainColumnRenderer: ColumnRenderer = { eventId: string; field: ColumnHeaderOptions; globalFilters?: Filter[]; - isDraggable?: boolean; scopeId: string; truncate?: boolean; values: string[] | undefined | null; @@ -46,46 +44,25 @@ export const plainColumnRenderer: ColumnRenderer = { if (!Array.isArray(values) || values.length === 0) { return getEmptyTagValue(); } - // Draggable columns should render individual fields to give the user - // fine-grained control over the individual values - if (isDraggable) { - return values.map((value, i) => ( - - )); - } else { - // In case the column isn't draggable, fields are joined - // to give users a faster overview of all values. - // (note: the filter-related hover actions still produce individual filters for each value) - return ( - - ); - } + + // In case the column isn't draggable, fields are joined + // to give users a faster overview of all values. + // (note: the filter-related hover actions still produce individual filters for each value) + return ( + + ); }, }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_row_renderer.test.tsx index f8e41dd018e0a..8b3fb5a2dcf62 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/plain_row_renderer.test.tsx @@ -23,7 +23,6 @@ describe('plain_row_renderer', () => { test('renders correctly against snapshot', () => { const children = plainRowRenderer.renderRow({ data: mockDatum, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = shallow({children}); @@ -37,7 +36,6 @@ describe('plain_row_renderer', () => { test('should render a plain row', () => { const children = plainRowRenderer.renderRow({ data: mockDatum, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = mount({children}); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_draggable.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_draggable.tsx index 5247535dbc743..8104aae1a4be3 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_draggable.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_draggable.tsx @@ -21,7 +21,6 @@ interface Props { processExecutable: string | undefined | null; processPid: number | undefined | null; processName: string | undefined | null; - isDraggable?: boolean; } export const ProcessDraggable = React.memo( @@ -33,7 +32,6 @@ export const ProcessDraggable = React.memo( processExecutable, processName, processPid, - isDraggable, }) => { if ( isNillEmptyOrNotFinite(processName) && @@ -55,7 +53,6 @@ export const ProcessDraggable = React.memo( field="process.name" value={processName} iconType="console" - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -68,7 +65,6 @@ export const ProcessDraggable = React.memo( field="process.executable" value={processExecutable} iconType="console" - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -81,7 +77,6 @@ export const ProcessDraggable = React.memo( field="endgame.process_name" value={endgameProcessName} iconType="console" - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -96,7 +91,6 @@ export const ProcessDraggable = React.memo( field="process.pid" queryValue={String(processPid)} value={`(${String(processPid)})`} - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -109,7 +103,6 @@ export const ProcessDraggable = React.memo( field="endgame.pid" queryValue={String(endgamePid)} value={`(${String(endgamePid)})`} - isDraggable={isDraggable} fieldType="keyword" isAggregatable={true} /> @@ -131,7 +124,6 @@ export const ProcessDraggableWithNonExistentProcess = React.memo( processExecutable, processName, processPid, - isDraggable, }) => { if ( endgamePid == null && @@ -151,7 +143,6 @@ export const ProcessDraggableWithNonExistentProcess = React.memo( processExecutable={processExecutable} processName={processName} processPid={processPid} - isDraggable={isDraggable} /> ); } diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_hash.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_hash.tsx index bbf652d886e65..e8babd1985c0d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_hash.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/process_hash.tsx @@ -20,33 +20,29 @@ const HashFlexGroup = styled(EuiFlexGroup)` interface Props { contextId: string; eventId: string; - isDraggable?: boolean; processHashSha256: string | null | undefined; } -export const ProcessHash = React.memo( - ({ contextId, eventId, isDraggable, processHashSha256 }) => { - if (isNillEmptyOrNotFinite(processHashSha256)) { - return null; - } - - return ( - - - - - - ); +export const ProcessHash = React.memo(({ contextId, eventId, processHashSha256 }) => { + if (isNillEmptyOrNotFinite(processHashSha256)) { + return null; } -); + + return ( + + + + + + ); +}); ProcessHash.displayName = 'ProcessHash'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx index 97e5c3fe5f033..d78da7b009f89 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx @@ -26,7 +26,6 @@ export const reasonColumnRenderer: ColumnRenderer = { eventId, field, isDetails, - isDraggable = true, linkValues, rowRenderers = [], scopeId, @@ -38,7 +37,6 @@ export const reasonColumnRenderer: ColumnRenderer = { eventId: string; field: ColumnHeaderOptions; isDetails?: boolean; - isDraggable?: boolean; linkValues?: string[] | null | undefined; rowRenderers?: RowRenderer[]; scopeId: string; @@ -61,7 +59,6 @@ export const reasonColumnRenderer: ColumnRenderer = { eventId, field, isDetails, - isDraggable, linkValues, scopeId, truncate, @@ -87,7 +84,6 @@ const ReasonCell: React.FC<{ rowRenderer && rowRenderer.renderRow({ data: ecsData, - isDraggable: false, scopeId, }) ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details.tsx index fea72a77f99b2..7d00ddd89dd6a 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details.tsx @@ -16,11 +16,10 @@ import { RegistryEventDetailsLine } from './registry_event_details_line'; interface Props { contextId: string; data: Ecs; - isDraggable?: boolean; text: string; } -const RegistryEventDetailsComponent: React.FC = ({ contextId, data, isDraggable, text }) => { +const RegistryEventDetailsComponent: React.FC = ({ contextId, data, text }) => { const hostName: string | null | undefined = get('host.name[0]', data); const id = data._id; const processName: string | null | undefined = get('process.name[0]', data); @@ -40,7 +39,6 @@ const RegistryEventDetailsComponent: React.FC = ({ contextId, data, isDra contextId={contextId} hostName={hostName} id={id} - isDraggable={isDraggable} processName={processName} processPid={processPid} registryKey={registryKey} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details_line.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details_line.tsx index 749c87419b8e3..5becef0b35d49 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details_line.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/registry/registry_event_details_line.tsx @@ -19,7 +19,6 @@ interface Props { contextId: string; hostName: string | null | undefined; id: string; - isDraggable?: boolean; processName: string | null | undefined; processPid: number | null | undefined; registryKey: string | null | undefined; @@ -33,7 +32,6 @@ const RegistryEventDetailsLineComponent: React.FC = ({ contextId, hostName, id, - isDraggable, processName, processPid, registryKey, @@ -73,7 +71,6 @@ const RegistryEventDetailsLineComponent: React.FC = ({ contextId={contextId} eventId={id} hostName={hostName} - isDraggable={isDraggable} userDomain={userDomain} userName={userName} workingDirectory={undefined} @@ -89,7 +86,6 @@ const RegistryEventDetailsLineComponent: React.FC = ({ contextId={contextId} eventId={id} field="registry.key" - isDraggable={isDraggable} tooltipContent={registryKeyTooltipContent} value={registryKey} isAggregatable={true} @@ -109,7 +105,6 @@ const RegistryEventDetailsLineComponent: React.FC = ({ contextId={contextId} eventId={id} field="registry.path" - isDraggable={isDraggable} tooltipContent={registryPathTooltipContent} value={registryPath} isAggregatable={true} @@ -129,7 +124,6 @@ const RegistryEventDetailsLineComponent: React.FC = ({ endgamePid={undefined} endgameProcessName={undefined} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={undefined} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/rule_status.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/rule_status.tsx index a3a2bb17cdd43..8dfde4deb4a9d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/rule_status.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/rule_status.tsx @@ -11,7 +11,6 @@ import { EuiBadge } from '@elastic/eui'; import { getOr } from 'lodash/fp'; import styled from 'styled-components'; -import { DefaultDraggable } from '../../../../../common/components/draggables'; const mapping = { open: 'primary', @@ -24,12 +23,6 @@ const StyledEuiBadge = styled(EuiBadge)` `; interface BaseProps { - contextId: string; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; value: string | number | undefined | null; } @@ -37,12 +30,6 @@ type Props = BaseProps & Pick; const RuleStatusComponent: React.FC = ({ - contextId, - eventId, - fieldName, - fieldType, - isAggregatable, - isDraggable, value, onClick, onClickAriaLabel, @@ -63,21 +50,7 @@ const RuleStatusComponent: React.FC = ({ ); - return isDraggable ? ( - - {badge} - - ) : ( - badge - ); + return badge; }; export const RuleStatus = React.memo(RuleStatusComponent); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/service_name.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/service_name.tsx index 495890f30cab8..a4234dfea39eb 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/service_name.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/service_name.tsx @@ -13,18 +13,12 @@ import { EntityType } from '../../../../../../common/search_strategy'; import { EntityDetailsLink } from '../../../../../common/components/links'; import { ServicePanelKey } from '../../../../../flyout/entity_details/shared/constants'; import { StatefulEventContext } from '../../../../../common/components/events_viewer/stateful_event_context'; -import { DefaultDraggable } from '../../../../../common/components/draggables'; import { getEmptyTagValue } from '../../../../../common/components/empty_value'; import { TruncatableText } from '../../../../../common/components/truncatable_text'; interface Props { contextId: string; Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; isButton?: boolean; onClick?: () => void; value: string | number | undefined | null; @@ -32,13 +26,8 @@ interface Props { } const ServiceNameComponent: React.FC = ({ - fieldName, Component, contextId, - eventId, - fieldType, - isAggregatable, - isDraggable, isButton, onClick, title, @@ -70,12 +59,11 @@ const ServiceNameComponent: React.FC = ({ serviceName, contextID: contextId, scopeId: timelineID, - isDraggable, }, }, }); }, - [contextId, eventContext, isDraggable, isInTimelineContext, onClick, openFlyout, serviceName] + [contextId, eventContext, isInTimelineContext, onClick, openFlyout, serviceName] ); const content = useMemo( @@ -96,25 +84,7 @@ const ServiceNameComponent: React.FC = ({ [serviceName, isButton, isInTimelineContext, openServiceDetailsSidePanel, Component, title] ); - return isString(value) && serviceName.length > 0 ? ( - isDraggable ? ( - - {content} - - ) : ( - content - ) - ) : ( - getEmptyTagValue() - ); + return isString(value) && serviceName.length > 0 ? content : getEmptyTagValue(); }; export const ServiceName = React.memo(ServiceNameComponent); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/__snapshots__/suricata_row_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/__snapshots__/suricata_row_renderer.test.tsx.snap index 6b084dd0eecba..8066a40af2d30 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/__snapshots__/suricata_row_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/__snapshots__/suricata_row_renderer.test.tsx.snap @@ -70,7 +70,6 @@ exports[`suricata_row_renderer renders correctly against snapshot 1`] = ` }, } } - isDraggable={true} timelineId="timeline-test" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_details.tsx index 3d69711f0cabc..69aca83f6857d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_details.tsx @@ -24,9 +24,8 @@ Details.displayName = 'Details'; export const SuricataDetails = React.memo<{ data: Ecs; - isDraggable?: boolean; timelineId: string; -}>(({ data, isDraggable, timelineId }) => { +}>(({ data, timelineId }) => { const signature: string | null | undefined = get('suricata.eve.alert.signature[0]', data); const signatureId: number | null | undefined = get('suricata.eve.alert.signature_id[0]', data); @@ -36,13 +35,12 @@ export const SuricataDetails = React.memo<{ - +
); } else { diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.test.tsx index 998916ea73ed7..c29b117589342 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.test.tsx @@ -49,7 +49,6 @@ describe('suricata_row_renderer', () => { test('renders correctly against snapshot', async () => { const children = suricataRowRenderer.renderRow({ data: nonSuricata, - isDraggable: true, scopeId: TimelineId.test, }); @@ -68,7 +67,6 @@ describe('suricata_row_renderer', () => { test('should render a suricata row', async () => { const children = suricataRowRenderer.renderRow({ data: suricata, - isDraggable: true, scopeId: TimelineId.test, }); @@ -91,7 +89,6 @@ describe('suricata_row_renderer', () => { delete suricata?.suricata?.eve?.alert?.signature; const children = suricataRowRenderer.renderRow({ data: suricata, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = await getWrapper( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.tsx index 044f945375d61..9fe1a6085407c 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_row_renderer.tsx @@ -20,9 +20,9 @@ export const suricataRowRenderer: RowRenderer = { const module: string | null | undefined = get('event.module[0]', ecs); return module != null && module.toLowerCase() === 'suricata'; }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( - + ), }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_signature.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_signature.tsx index fdb1f818f754e..83acb4e7a8f83 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_signature.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/suricata/suricata_signature.tsx @@ -10,13 +10,9 @@ import React, { useCallback, useMemo } from 'react'; import styled from 'styled-components'; import type { DraggableWrapperProps } from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; -import { - DragEffects, - DraggableWrapper, -} from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; +import { DraggableWrapper } from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; import { escapeDataProviderId } from '../../../../../../common/components/drag_and_drop/helpers'; import { GoogleLink } from '../../../../../../common/components/links'; -import { Provider } from '../../../data_providers/provider'; import { TokensFlexItem } from '../helpers'; import { getBeginningTokens } from './suricata_links'; @@ -61,9 +57,8 @@ Tokens.displayName = 'Tokens'; export const DraggableSignatureId = React.memo<{ id: string; - isDraggable?: boolean; signatureId: number; -}>(({ id, isDraggable, signatureId }) => { +}>(({ id, signatureId }) => { const dataProviderProp = useMemo( () => ({ and: [], @@ -82,21 +77,13 @@ export const DraggableSignatureId = React.memo<{ ); const render: DraggableWrapperProps['render'] = useCallback( - (dataProvider, _, snapshot) => - snapshot.isDragging ? ( - - - - ) : ( - - - {signatureId} - - - ), + () => ( + + + {signatureId} + + + ), [signatureId] ); @@ -104,7 +91,6 @@ export const DraggableSignatureId = React.memo<{ (({ contextId, id, isDraggable, signature, signatureId }) => { +}>(({ contextId, id, signature, signatureId }) => { const tokens = getBeginningTokens(signature); return ( @@ -136,7 +120,6 @@ export const SuricataSignature = React.memo<{ data-test-subj="draggable-signature-link" field={SURICATA_SIGNATURE_FIELD_NAME} id={`suricata-signature-default-draggable-${contextId}-${id}-${SURICATA_SIGNATURE_FIELD_NAME}`} - isDraggable={isDraggable} value={signature} tooltipPosition="bottom" > diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/__snapshots__/generic_row_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/__snapshots__/generic_row_renderer.test.tsx.snap index 52c28221a2a36..48a49e93bdd28 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/__snapshots__/generic_row_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/__snapshots__/generic_row_renderer.test.tsx.snap @@ -55,7 +55,6 @@ exports[`GenericRowRenderer #createGenericFileRowRenderer renders correctly agai }, } } - isDraggable={true} text="some text" timelineId="timeline-test" /> @@ -118,7 +117,6 @@ exports[`GenericRowRenderer #createGenericSystemRowRenderer renders correctly ag }, } } - isDraggable={true} text="some text" timelineId="timeline-test" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/auth_ssh.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/auth_ssh.tsx index 4484a43119608..cd5620ab647f8 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/auth_ssh.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/auth_ssh.tsx @@ -13,44 +13,39 @@ import { TokensFlexItem } from '../helpers'; interface Props { contextId: string; eventId: string; - isDraggable?: boolean; sshSignature: string | null | undefined; sshMethod: string | null | undefined; } -export const AuthSsh = React.memo( - ({ contextId, eventId, isDraggable, sshSignature, sshMethod }) => ( - <> - {sshSignature != null && ( - - - - )} - {sshMethod != null && ( - - - - )} - - ) -); +export const AuthSsh = React.memo(({ contextId, eventId, sshSignature, sshMethod }) => ( + <> + {sshSignature != null && ( + + + + )} + {sshMethod != null && ( + + + + )} + +)); AuthSsh.displayName = 'AuthSsh'; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_details.tsx index 4acc15e4fee0d..33720b59aedf5 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_details.tsx @@ -26,7 +26,6 @@ interface Props { contextId: string; hostName: string | null | undefined; id: string; - isDraggable?: boolean; message: string | null | undefined; outcome: string | null | undefined; packageName: string | null | undefined; @@ -48,7 +47,6 @@ export const SystemGenericLine = React.memo( contextId, hostName, id, - isDraggable, message, outcome, packageName, @@ -70,7 +68,6 @@ export const SystemGenericLine = React.memo( contextId={contextId} eventId={id} hostName={hostName} - isDraggable={isDraggable} userDomain={userDomain} userName={userName} workingDirectory={workingDirectory} @@ -84,7 +81,6 @@ export const SystemGenericLine = React.memo( endgamePid={undefined} endgameProcessName={undefined} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={processExecutable} @@ -100,7 +96,6 @@ export const SystemGenericLine = React.memo( contextId={contextId} eventId={id} field="event.outcome" - isDraggable={isDraggable} queryValue={outcome} value={outcome} isAggregatable={true} @@ -110,14 +105,12 @@ export const SystemGenericLine = React.memo( ( - ({ contextId, data, isDraggable, text, timelineId }) => { + ({ contextId, data, text, timelineId }) => { const id = data._id; const message: string | null = data.message != null ? data.message[0] : null; const hostName: string | null | undefined = get('host.name[0]', data); @@ -173,7 +165,6 @@ export const SystemGenericDetails = React.memo( contextId={contextId} hostName={hostName} id={id} - isDraggable={isDraggable} message={message} outcome={outcome} packageName={packageName} @@ -190,7 +181,7 @@ export const SystemGenericDetails = React.memo( workingDirectory={workingDirectory} /> - + ); } diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_file_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_file_details.tsx index d36a89c4da68d..84e503e9b86d2 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_file_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_file_details.tsx @@ -44,7 +44,6 @@ interface Props { filePath: string | null | undefined; hostName: string | null | undefined; id: string; - isDraggable?: boolean; message: string | null | undefined; outcome: string | null | undefined; packageName: string | null | undefined; @@ -87,7 +86,6 @@ export const SystemGenericFileLine = React.memo( filePath, hostName, id, - isDraggable, message, outcome, packageName, @@ -117,7 +115,6 @@ export const SystemGenericFileLine = React.memo( ( fileExtOriginalPath={fileExtOriginalPath} fileName={fileName} filePath={filePath} - isDraggable={isDraggable} /> )} {showVia(eventAction) && ( @@ -150,24 +146,16 @@ export const SystemGenericFileLine = React.memo( endgamePid={endgamePid} endgameProcessName={endgameProcessName} eventId={id} - isDraggable={isDraggable} processPid={processPid} processName={processName} processExecutable={processExecutable} /> - + @@ -176,7 +164,6 @@ export const SystemGenericFileLine = React.memo( contextId={contextId} endgameParentProcessName={endgameParentProcessName} eventId={id} - isDraggable={isDraggable} processParentName={processParentName} processParentPid={processParentPid} processPpid={processPpid} @@ -193,7 +180,6 @@ export const SystemGenericFileLine = React.memo( contextId={contextId} eventId={id} field="event.outcome" - isDraggable={isDraggable} queryValue={outcome} value={outcome} isAggregatable={true} @@ -203,34 +189,22 @@ export const SystemGenericFileLine = React.memo( {!skipRedundantFileDetails && ( - + )} {!skipRedundantProcessDetails && ( - + )} {message != null && showMessage && ( @@ -254,7 +228,6 @@ SystemGenericFileLine.displayName = 'SystemGenericFileLine'; interface GenericDetailsProps { contextId: string; data: Ecs; - isDraggable?: boolean; showMessage?: boolean; skipRedundantFileDetails?: boolean; skipRedundantProcessDetails?: boolean; @@ -266,7 +239,6 @@ export const SystemGenericFileDetails = React.memo( ({ contextId, data, - isDraggable, showMessage = true, skipRedundantFileDetails = false, skipRedundantProcessDetails = false, @@ -351,10 +323,9 @@ export const SystemGenericFileDetails = React.memo( sshSignature={sshSignature} sshMethod={sshMethod} outcome={outcome} - isDraggable={isDraggable} /> - + ); } diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.test.tsx index 9a23c8e1c5d37..0d5ec02d30688 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.test.tsx @@ -13,8 +13,8 @@ import { removeExternalLinkText } from '@kbn/securitysolution-io-ts-utils'; import type { EcsSecurityExtension as Ecs } from '@kbn/securitysolution-ecs'; import { mockDnsEvent, - mockEndpointProcessExecutionMalwarePreventionAlert, mockEndpointLibraryLoadEvent, + mockEndpointProcessExecutionMalwarePreventionAlert, mockEndpointRegistryModificationEvent, mockFimFileCreatedEvent, mockFimFileDeletedEvent, @@ -31,38 +31,38 @@ import { mockEndgameFileCreateEvent, mockEndgameFileDeleteEvent, mockEndgameIpv4ConnectionAcceptEvent, - mockEndgameIpv6ConnectionAcceptEvent, mockEndgameIpv4DisconnectReceivedEvent, + mockEndgameIpv6ConnectionAcceptEvent, mockEndgameIpv6DisconnectReceivedEvent, mockEndgameTerminationEvent, mockEndgameUserLogoff, mockEndgameUserLogon, mockEndpointDisconnectReceivedEvent, mockEndpointFileCreationEvent, - mockEndpointFileCreationMalwarePreventionAlert, mockEndpointFileCreationMalwareDetectionAlert, - mockEndpointFilesEncryptedRansomwarePreventionAlert, - mockEndpointFilesEncryptedRansomwareDetectionAlert, - mockEndpointFileModificationMalwarePreventionAlert, - mockEndpointFileModificationMalwareDetectionAlert, - mockEndpointFileRenameMalwarePreventionAlert, - mockEndpointFileRenameMalwareDetectionAlert, + mockEndpointFileCreationMalwarePreventionAlert, mockEndpointFileDeletionEvent, mockEndpointFileModificationEvent, + mockEndpointFileModificationMalwareDetectionAlert, + mockEndpointFileModificationMalwarePreventionAlert, mockEndpointFileOverwriteEvent, mockEndpointFileRenameEvent, + mockEndpointFileRenameMalwareDetectionAlert, + mockEndpointFileRenameMalwarePreventionAlert, + mockEndpointFilesEncryptedRansomwareDetectionAlert, + mockEndpointFilesEncryptedRansomwarePreventionAlert, mockEndpointNetworkConnectionAcceptedEvent, mockEndpointNetworkHttpRequestEvent, mockEndpointNetworkLookupRequestedEvent, mockEndpointNetworkLookupResultEvent, + mockEndpointProcessEndEvent, mockEndpointProcessExecEvent, mockEndpointProcessExecutionMalwareDetectionAlert, mockEndpointProcessForkEvent, mockEndpointProcessStartEvent, - mockEndpointProcessEndEvent, - mockEndpointSecurityLogOnSuccessEvent, - mockEndpointSecurityLogOnFailureEvent, mockEndpointSecurityLogOffEvent, + mockEndpointSecurityLogOnFailureEvent, + mockEndpointSecurityLogOnSuccessEvent, } from '../../../../../../common/mock/mock_endgame_ecs_data'; import { useMountAppended } from '../../../../../../common/utils/use_mount_appended'; import type { EndpointAlertCriteria } from './generic_row_renderer'; @@ -73,8 +73,8 @@ import { createEndpointLibraryRowRenderer, createEndpointRegistryRowRenderer, createFimRowRenderer, - createGenericSystemRowRenderer, createGenericFileRowRenderer, + createGenericSystemRowRenderer, createSecurityEventRowRenderer, createSocketRowRenderer, } from './generic_row_renderer'; @@ -119,7 +119,7 @@ describe('GenericRowRenderer', () => { test('renders correctly against snapshot', () => { const children = connectedToRenderer.renderRow({ data: system, - isDraggable: true, + scopeId: TimelineId.test, }); @@ -148,7 +148,7 @@ describe('GenericRowRenderer', () => { test('should render a system row', () => { const children = connectedToRenderer.renderRow({ data: system, - isDraggable: true, + scopeId: TimelineId.test, }); const wrapper = mount( @@ -179,7 +179,7 @@ describe('GenericRowRenderer', () => { test('renders correctly against snapshot', () => { const children = fileToRenderer.renderRow({ data: systemFile, - isDraggable: true, + scopeId: TimelineId.test, }); @@ -207,7 +207,7 @@ describe('GenericRowRenderer', () => { test('should render a system row', () => { const children = fileToRenderer.renderRow({ data: systemFile, - isDraggable: true, + scopeId: TimelineId.test, }); const wrapper = mount( @@ -238,7 +238,6 @@ describe('GenericRowRenderer', () => { {endpointAlertsRowRenderer.isInstance(mockEndpointFileCreationMalwarePreventionAlert) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileCreationMalwarePreventionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -265,7 +264,6 @@ describe('GenericRowRenderer', () => { {endpointAlertsRowRenderer.isInstance(mockEndpointFileCreationMalwareDetectionAlert) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileCreationMalwareDetectionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -294,7 +292,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFilesEncryptedRansomwarePreventionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -323,7 +320,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFilesEncryptedRansomwareDetectionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -352,7 +348,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileModificationMalwarePreventionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -381,7 +376,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileModificationMalwareDetectionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -408,7 +402,6 @@ describe('GenericRowRenderer', () => { {endpointAlertsRowRenderer.isInstance(mockEndpointFileRenameMalwarePreventionAlert) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileRenameMalwarePreventionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -435,7 +428,6 @@ describe('GenericRowRenderer', () => { {endpointAlertsRowRenderer.isInstance(mockEndpointFileRenameMalwareDetectionAlert) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointFileRenameMalwareDetectionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -464,7 +456,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointProcessExecutionMalwarePreventionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -493,7 +484,6 @@ describe('GenericRowRenderer', () => { ) && endpointAlertsRowRenderer.renderRow({ data: mockEndpointProcessExecutionMalwareDetectionAlert, - isDraggable: true, scopeId: TimelineId.test, })} @@ -520,7 +510,6 @@ describe('GenericRowRenderer', () => { {endpointProcessStartRowRenderer.isInstance(mockEndpointProcessExecEvent) && endpointProcessStartRowRenderer.renderRow({ data: mockEndpointProcessExecEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -545,7 +534,6 @@ describe('GenericRowRenderer', () => { {endpointProcessStartRowRenderer.isInstance(mockEndpointProcessForkEvent) && endpointProcessStartRowRenderer.renderRow({ data: mockEndpointProcessForkEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -570,7 +558,6 @@ describe('GenericRowRenderer', () => { {endpointProcessStartRowRenderer.isInstance(mockEndpointProcessStartEvent) && endpointProcessStartRowRenderer.renderRow({ data: mockEndpointProcessStartEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -598,7 +585,6 @@ describe('GenericRowRenderer', () => { {endgameProcessCreationEventRowRenderer.isInstance(endgameCreationEvent) && endgameProcessCreationEventRowRenderer.renderRow({ data: endgameCreationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -623,7 +609,6 @@ describe('GenericRowRenderer', () => { {endpointProcessEndRowRenderer.isInstance(mockEndpointProcessEndEvent) && endpointProcessEndRowRenderer.renderRow({ data: mockEndpointProcessEndEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -651,7 +636,6 @@ describe('GenericRowRenderer', () => { {endgameProcessTerminationEventRowRenderer.isInstance(endgameTerminationEvent) && endgameProcessTerminationEventRowRenderer.renderRow({ data: endgameTerminationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -679,7 +663,6 @@ describe('GenericRowRenderer', () => { {endgameProcessCreationEventRowRenderer.isInstance(endgameCreationEvent) && endgameProcessCreationEventRowRenderer.renderRow({ data: endgameCreationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -709,7 +692,6 @@ describe('GenericRowRenderer', () => { {endgameProcessCreationEventRowRenderer.isInstance(endgameCreationEvent) && endgameProcessCreationEventRowRenderer.renderRow({ data: endgameCreationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -739,7 +721,6 @@ describe('GenericRowRenderer', () => { {endgameProcessCreationEventRowRenderer.isInstance(endgameCreationEvent) && endgameProcessCreationEventRowRenderer.renderRow({ data: endgameCreationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -764,7 +745,6 @@ describe('GenericRowRenderer', () => { {endpointFileCreationRowRenderer.isInstance(mockEndpointFileCreationEvent) && endpointFileCreationRowRenderer.renderRow({ data: mockEndpointFileCreationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -792,7 +772,6 @@ describe('GenericRowRenderer', () => { {endgameFileCreateEventRowRenderer.isInstance(endgameFileCreateEvent) && endgameFileCreateEventRowRenderer.renderRow({ data: endgameFileCreateEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -817,7 +796,6 @@ describe('GenericRowRenderer', () => { {endpointFileDeletionRowRenderer.isInstance(mockEndpointFileDeletionEvent) && endpointFileDeletionRowRenderer.renderRow({ data: mockEndpointFileDeletionEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -842,7 +820,6 @@ describe('GenericRowRenderer', () => { {endpointFileModificationRowRenderer.isInstance(mockEndpointFileModificationEvent) && endpointFileModificationRowRenderer.renderRow({ data: mockEndpointFileModificationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -867,7 +844,6 @@ describe('GenericRowRenderer', () => { {endpointFileOverwriteRowRenderer.isInstance(mockEndpointFileOverwriteEvent) && endpointFileOverwriteRowRenderer.renderRow({ data: mockEndpointFileOverwriteEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -892,7 +868,6 @@ describe('GenericRowRenderer', () => { {endpointFileRenameRowRenderer.isInstance(mockEndpointFileRenameEvent) && endpointFileRenameRowRenderer.renderRow({ data: mockEndpointFileRenameEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -920,7 +895,6 @@ describe('GenericRowRenderer', () => { {endgameFileDeleteEventRowRenderer.isInstance(endgameFileDeleteEvent) && endgameFileDeleteEventRowRenderer.renderRow({ data: endgameFileDeleteEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -948,7 +922,6 @@ describe('GenericRowRenderer', () => { {fileCreatedEventRowRenderer.isInstance(fimFileCreatedEvent) && fileCreatedEventRowRenderer.renderRow({ data: fimFileCreatedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -974,7 +947,6 @@ describe('GenericRowRenderer', () => { {fileDeletedEventRowRenderer.isInstance(fimFileDeletedEvent) && fileDeletedEventRowRenderer.renderRow({ data: fimFileDeletedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1002,7 +974,6 @@ describe('GenericRowRenderer', () => { {endgameFileCreateEventRowRenderer.isInstance(endgameFileCreateEvent) && endgameFileCreateEventRowRenderer.renderRow({ data: endgameFileCreateEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1032,7 +1003,6 @@ describe('GenericRowRenderer', () => { {endgameFileCreateEventRowRenderer.isInstance(endgameFileCreateEvent) && endgameFileCreateEventRowRenderer.renderRow({ data: endgameFileCreateEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1062,7 +1032,6 @@ describe('GenericRowRenderer', () => { {fileCreatedEventRowRenderer.isInstance(fimFileCreatedEvent) && fileCreatedEventRowRenderer.renderRow({ data: fimFileCreatedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1089,7 +1058,6 @@ describe('GenericRowRenderer', () => { ) && endpointConnectionAcceptedRowRenderer.renderRow({ data: mockEndpointNetworkConnectionAcceptedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1117,7 +1085,6 @@ describe('GenericRowRenderer', () => { ) && endpointRegistryModificationRowRenderer.renderRow({ data: mockEndpointRegistryModificationEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1144,7 +1111,6 @@ describe('GenericRowRenderer', () => { {endpointLibraryLoadRowRenderer.isInstance(mockEndpointLibraryLoadEvent) && endpointLibraryLoadRowRenderer.renderRow({ data: mockEndpointLibraryLoadEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1170,7 +1136,6 @@ describe('GenericRowRenderer', () => { {endpointHttpRequestEventRowRenderer.isInstance(mockEndpointNetworkHttpRequestEvent) && endpointHttpRequestEventRowRenderer.renderRow({ data: mockEndpointNetworkHttpRequestEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1198,7 +1163,6 @@ describe('GenericRowRenderer', () => { {endgameIpv4ConnectionAcceptEventRowRenderer.isInstance(ipv4ConnectionAcceptEvent) && endgameIpv4ConnectionAcceptEventRowRenderer.renderRow({ data: ipv4ConnectionAcceptEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1226,7 +1190,6 @@ describe('GenericRowRenderer', () => { {endgameIpv6ConnectionAcceptEventRowRenderer.isInstance(ipv6ConnectionAcceptEvent) && endgameIpv6ConnectionAcceptEventRowRenderer.renderRow({ data: ipv6ConnectionAcceptEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1251,7 +1214,6 @@ describe('GenericRowRenderer', () => { {endpointDisconnectReceivedRowRenderer.isInstance(mockEndpointDisconnectReceivedEvent) && endpointDisconnectReceivedRowRenderer.renderRow({ data: mockEndpointDisconnectReceivedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1279,7 +1241,6 @@ describe('GenericRowRenderer', () => { {endgameIpv4DisconnectReceivedEventRowRenderer.isInstance(ipv4DisconnectReceivedEvent) && endgameIpv4DisconnectReceivedEventRowRenderer.renderRow({ data: ipv4DisconnectReceivedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1307,7 +1268,6 @@ describe('GenericRowRenderer', () => { {endgameIpv6DisconnectReceivedEventRowRenderer.isInstance(ipv6DisconnectReceivedEvent) && endgameIpv6DisconnectReceivedEventRowRenderer.renderRow({ data: ipv6DisconnectReceivedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1335,7 +1295,6 @@ describe('GenericRowRenderer', () => { {socketOpenedEventRowRenderer.isInstance(socketOpenedEvent) && socketOpenedEventRowRenderer.renderRow({ data: socketOpenedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1363,7 +1322,6 @@ describe('GenericRowRenderer', () => { {socketClosedEventRowRenderer.isInstance(socketClosedEvent) && socketClosedEventRowRenderer.renderRow({ data: socketClosedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1391,7 +1349,6 @@ describe('GenericRowRenderer', () => { {endgameIpv4ConnectionAcceptEventRowRenderer.isInstance(ipv4ConnectionAcceptEvent) && endgameIpv4ConnectionAcceptEventRowRenderer.renderRow({ data: ipv4ConnectionAcceptEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1412,7 +1369,6 @@ describe('GenericRowRenderer', () => { {securityLogOnRowRenderer.isInstance(mockEndpointSecurityLogOnSuccessEvent) && securityLogOnRowRenderer.renderRow({ data: mockEndpointSecurityLogOnSuccessEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1433,7 +1389,6 @@ describe('GenericRowRenderer', () => { {securityLogOnRowRenderer.isInstance(mockEndpointSecurityLogOnFailureEvent) && securityLogOnRowRenderer.renderRow({ data: mockEndpointSecurityLogOnFailureEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1457,7 +1412,6 @@ describe('GenericRowRenderer', () => { {userLogonEventRowRenderer.isInstance(userLogonEvent) && userLogonEventRowRenderer.renderRow({ data: userLogonEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1481,7 +1435,6 @@ describe('GenericRowRenderer', () => { {adminLogonEventRowRenderer.isInstance(adminLogonEvent) && adminLogonEventRowRenderer.renderRow({ data: adminLogonEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1505,7 +1458,6 @@ describe('GenericRowRenderer', () => { {explicitUserLogonEventRowRenderer.isInstance(explicitUserLogonEvent) && explicitUserLogonEventRowRenderer.renderRow({ data: explicitUserLogonEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1526,7 +1478,6 @@ describe('GenericRowRenderer', () => { {securityLogOffRowRenderer.isInstance(mockEndpointSecurityLogOffEvent) && securityLogOffRowRenderer.renderRow({ data: mockEndpointSecurityLogOffEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1550,7 +1501,6 @@ describe('GenericRowRenderer', () => { {userLogoffEventRowRenderer.isInstance(userLogoffEvent) && userLogoffEventRowRenderer.renderRow({ data: userLogoffEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1574,7 +1524,6 @@ describe('GenericRowRenderer', () => { {userLogonEventRowRenderer.isInstance(userLogonEvent) && userLogonEventRowRenderer.renderRow({ data: userLogonEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1593,7 +1542,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(mockEndpointNetworkLookupRequestedEvent) && dnsRowRenderer.renderRow({ data: mockEndpointNetworkLookupRequestedEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1612,7 +1560,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(mockEndpointNetworkLookupResultEvent) && dnsRowRenderer.renderRow({ data: mockEndpointNetworkLookupResultEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1635,7 +1582,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(requestEvent) && dnsRowRenderer.renderRow({ data: requestEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1658,7 +1604,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(dnsEvent) && dnsRowRenderer.renderRow({ data: dnsEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1687,7 +1632,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(requestEvent) && dnsRowRenderer.renderRow({ data: requestEvent, - isDraggable: true, scopeId: TimelineId.test, })} @@ -1714,7 +1658,6 @@ describe('GenericRowRenderer', () => { {dnsRowRenderer.isInstance(requestEvent) && dnsRowRenderer.renderRow({ data: requestEvent, - isDraggable: true, scopeId: TimelineId.test, })} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.tsx index f9aa64c6d11b4..ce867c049f250 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/generic_row_renderer.tsx @@ -39,12 +39,11 @@ export const createGenericSystemRowRenderer = ({ action.toLowerCase() === actionName ); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( @@ -70,12 +69,11 @@ export const createEndgameProcessRowRenderer = ({ action?.toLowerCase() === actionName ); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( ( + renderRow: ({ data, scopeId }) => ( ( + renderRow: ({ data, scopeId }) => ( ( + renderRow: ({ data, scopeId }) => ( ( + renderRow: ({ data, scopeId }) => ( @@ -238,12 +232,11 @@ export const createSocketRowRenderer = ({ const action: string | null | undefined = get('event.action[0]', ecs); return action != null && action.toLowerCase() === actionName; }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( @@ -267,12 +260,11 @@ export const createSecurityEventRowRenderer = ({ action?.toLowerCase() === actionName ); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( @@ -286,12 +278,11 @@ export const createDnsRowRenderer = (): RowRenderer => ({ const dnsQuestionName: string | null | undefined = get('dns.question.name[0]', ecs); return !isNillEmptyOrNotFinite(dnsQuestionType) && !isNillEmptyOrNotFinite(dnsQuestionName); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( @@ -314,14 +305,9 @@ export const createEndpointRegistryRowRenderer = ({ dataset?.toLowerCase() === 'endpoint.events.registry' && action?.toLowerCase() === actionName ); }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( - + ), }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/package.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/package.tsx index 6232575533688..26165bb805cc2 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/package.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/system/package.tsx @@ -13,14 +13,13 @@ import { TokensFlexItem } from '../helpers'; interface Props { contextId: string; eventId: string; - isDraggable?: boolean; packageName: string | null | undefined; packageSummary: string | null | undefined; packageVersion: string | null | undefined; } export const Package = React.memo( - ({ contextId, eventId, isDraggable, packageName, packageSummary, packageVersion }) => { + ({ contextId, eventId, packageName, packageSummary, packageVersion }) => { if (packageName != null || packageSummary != null || packageVersion != null) { return ( <> @@ -29,7 +28,6 @@ export const Package = React.memo( contextId={contextId} eventId={eventId} field="system.audit.package.name" - isDraggable={isDraggable} value={packageName} iconType="document" isAggregatable={true} @@ -41,7 +39,6 @@ export const Package = React.memo( contextId={contextId} eventId={eventId} field="system.audit.package.version" - isDraggable={isDraggable} value={packageVersion} iconType="document" isAggregatable={true} @@ -53,7 +50,6 @@ export const Package = React.memo( contextId={contextId} eventId={eventId} field="system.audit.package.summary" - isDraggable={isDraggable} value={packageSummary} isAggregatable={true} fieldType="keyword" diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_host_working_dir.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_host_working_dir.test.tsx index 4033f50a48e95..d5bb0bfe96af1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_host_working_dir.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_host_working_dir.test.tsx @@ -240,7 +240,6 @@ describe('UserHostWorkingDir', () => { { { { ( eventId, hostName, hostNameSeparator = '@', - isDraggable, userDomain, userDomainField = 'user.domain', userName, @@ -44,7 +42,6 @@ export const UserHostWorkingDir = React.memo( contextId={contextId} eventId={eventId} field={userNameField} - isDraggable={isDraggable} value={userName} iconType="user" fieldType="keyword" @@ -66,7 +63,6 @@ export const UserHostWorkingDir = React.memo( contextId={contextId} eventId={eventId} field={userDomainField} - isDraggable={isDraggable} value={userDomain} fieldType="keyword" isAggregatable={true} @@ -84,7 +80,6 @@ export const UserHostWorkingDir = React.memo( contextId={contextId} eventId={eventId} hostName={hostName} - isDraggable={isDraggable} workingDirectory={workingDirectory} /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.test.tsx index b4ba8df61df2c..fe9495e44af6a 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.test.tsx @@ -57,7 +57,6 @@ describe('UserName', () => { isAggregatable: true, contextId: 'test-context-id', eventId: 'test-event-id', - isDraggable: false, value: 'Mock User', }; @@ -71,20 +70,6 @@ describe('UserName', () => { expect(wrapper.find('[data-test-subj="users-link-anchor"]').last().text()).toEqual(props.value); }); - test('should render DefaultDraggable if isDraggable is true', () => { - const testProps = { - ...props, - isDraggable: true, - }; - const wrapper = mount( - - - - ); - - expect(wrapper.find('[data-test-subj="DefaultDraggable"]').exists()).toEqual(true); - }); - test('should not open any flyout or panels if context in not defined', async () => { const wrapper = mount( @@ -144,7 +129,6 @@ describe('UserName', () => { userName: props.value, contextID: props.contextId, scopeId: TableId.alertsOnAlertsPage, - isDraggable: false, }, }, }); @@ -175,7 +159,6 @@ describe('UserName', () => { userName: props.value, contextID: props.contextId, scopeId: 'timeline-1', - isDraggable: false, }, }, }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.tsx index e4559c9b6400a..76c9087ecfa77 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.tsx @@ -11,7 +11,6 @@ import { isString } from 'lodash/fp'; import { useExpandableFlyoutApi } from '@kbn/expandable-flyout'; import { UserPanelKey } from '../../../../../flyout/entity_details/shared/constants'; import { StatefulEventContext } from '../../../../../common/components/events_viewer/stateful_event_context'; -import { DefaultDraggable } from '../../../../../common/components/draggables'; import { getEmptyTagValue } from '../../../../../common/components/empty_value'; import { UserDetailsLink } from '../../../../../common/components/links'; import { TruncatableText } from '../../../../../common/components/truncatable_text'; @@ -19,11 +18,6 @@ import { TruncatableText } from '../../../../../common/components/truncatable_te interface Props { contextId: string; Component?: typeof EuiButtonEmpty | typeof EuiButtonIcon; - eventId: string; - fieldName: string; - fieldType: string; - isAggregatable: boolean; - isDraggable: boolean; isButton?: boolean; onClick?: () => void; value: string | number | undefined | null; @@ -31,13 +25,8 @@ interface Props { } const UserNameComponent: React.FC = ({ - fieldName, Component, contextId, - eventId, - fieldType, - isAggregatable, - isDraggable, isButton, onClick, title, @@ -69,12 +58,11 @@ const UserNameComponent: React.FC = ({ userName, contextID: contextId, scopeId: timelineID, - isDraggable, }, }, }); }, - [contextId, eventContext, isDraggable, isInTimelineContext, onClick, openFlyout, userName] + [contextId, eventContext, isInTimelineContext, onClick, openFlyout, userName] ); // The below is explicitly defined this way as the onClick takes precedence when it and the href are both defined @@ -94,25 +82,7 @@ const UserNameComponent: React.FC = ({ [userName, isButton, isInTimelineContext, openUserDetailsSidePanel, Component, title] ); - return isString(value) && userName.length > 0 ? ( - isDraggable ? ( - - {content} - - ) : ( - content - ) - ) : ( - getEmptyTagValue() - ); + return isString(value) && userName.length > 0 ? content : getEmptyTagValue(); }; export const UserName = React.memo(UserNameComponent); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_profile_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_profile_renderer.tsx index 93be8036f0cea..cffd42abbfc39 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_profile_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_profile_renderer.tsx @@ -7,40 +7,17 @@ import { EuiLoadingSpinner } from '@elastic/eui'; import React from 'react'; - -import type { EcsSecurityExtension as Ecs } from '@kbn/securitysolution-ecs'; import { UsersAvatarsPanel } from '../../../../../common/components/user_profiles/users_avatars_panel'; -import type { ColumnHeaderOptions, RowRenderer } from '../../../../../../common/types'; import type { ColumnRenderer } from './column_renderer'; -import { profileUidColumns } from '../../../../../detections/configurations/security_solution_detections/fetch_page_context'; import type { RenderCellValueContext } from '../../../../../detections/configurations/security_solution_detections/fetch_page_context'; +import { profileUidColumns } from '../../../../../detections/configurations/security_solution_detections/fetch_page_context'; export const userProfileColumnRenderer: ColumnRenderer = { isInstance: (columnName, _, context) => profileUidColumns.includes(columnName) && !!context, renderColumn: ({ - columnName, - ecsData, - eventId, - field, - isDetails, - isDraggable = true, - linkValues, - rowRenderers = [], - scopeId, - truncate, values, context, }: { - columnName: string; - ecsData?: Ecs; - eventId: string; - field: ColumnHeaderOptions; - isDetails?: boolean; - isDraggable?: boolean; - linkValues?: string[] | null | undefined; - rowRenderers?: RowRenderer[]; - scopeId: string; - truncate?: boolean; values: string[] | undefined | null; context?: RenderCellValueContext; }) => { diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/__snapshots__/zeek_row_renderer.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/__snapshots__/zeek_row_renderer.test.tsx.snap index a5a9db62f3a43..59f903a17baae 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/__snapshots__/zeek_row_renderer.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/__snapshots__/zeek_row_renderer.test.tsx.snap @@ -70,7 +70,6 @@ exports[`zeek_row_renderer renders correctly against snapshot 1`] = ` }, } } - isDraggable={true} timelineId="timeline-test" /> diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_details.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_details.tsx index 9c21ec25177fa..050f05523c510 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_details.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_details.tsx @@ -22,16 +22,15 @@ Details.displayName = 'Details'; interface ZeekDetailsProps { data: Ecs; - isDraggable?: boolean; timelineId: string; } -export const ZeekDetails = React.memo(({ data, isDraggable, timelineId }) => +export const ZeekDetails = React.memo(({ data, timelineId }) => data.zeek != null ? (
- + - +
) : null ); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.test.tsx index 44000e4144561..fbf1beed988d7 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.test.tsx @@ -41,7 +41,6 @@ describe('zeek_row_renderer', () => { test('renders correctly against snapshot', () => { const children = zeekRowRenderer.renderRow({ data: nonZeek, - isDraggable: true, scopeId: TimelineId.test, }); @@ -60,7 +59,6 @@ describe('zeek_row_renderer', () => { test('should render a zeek row', () => { const children = zeekRowRenderer.renderRow({ data: zeek, - isDraggable: true, scopeId: TimelineId.test, }); const wrapper = mount( diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.tsx index 1908bcf6d5bc4..ac09011b9bcc1 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_row_renderer.tsx @@ -20,9 +20,9 @@ export const zeekRowRenderer: RowRenderer = { const module: string | null | undefined = get('event.module[0]', ecs); return module != null && module.toLowerCase() === 'zeek'; }, - renderRow: ({ data, isDraggable, scopeId }) => ( + renderRow: ({ data, scopeId }) => ( - + ), }; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_signature.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_signature.tsx index 493d6d054a994..8a9c13e58b8e6 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_signature.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/body/renderers/zeek/zeek_signature.tsx @@ -12,13 +12,9 @@ import styled from 'styled-components'; import type { EcsSecurityExtension as Ecs } from '@kbn/securitysolution-ecs'; import type { DraggableWrapperProps } from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; -import { - DragEffects, - DraggableWrapper, -} from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; +import { DraggableWrapper } from '../../../../../../common/components/drag_and_drop/draggable_wrapper'; import { escapeDataProviderId } from '../../../../../../common/components/drag_and_drop/helpers'; import { GoogleLink, ReputationLink } from '../../../../../../common/components/links'; -import { Provider } from '../../../data_providers/provider'; import type { QueryOperator } from '../../../data_providers/data_provider'; import { IS_OPERATOR } from '../../../data_providers/data_provider'; @@ -69,10 +65,9 @@ export const sha1StringRenderer: StringRenderer = (value: string) => export const DraggableZeekElement = React.memo<{ id: string; field: string; - isDraggable?: boolean; value: string | null | undefined; stringRenderer?: StringRenderer; -}>(({ id, field, isDraggable, value, stringRenderer = defaultStringRenderer }) => { +}>(({ id, field, value, stringRenderer = defaultStringRenderer }) => { const dataProviderProp = useMemo( () => ({ and: [], @@ -91,18 +86,13 @@ export const DraggableZeekElement = React.memo<{ ); const render: DraggableWrapperProps['render'] = useCallback( - (dataProvider, _, snapshot) => - snapshot.isDragging ? ( - - - - ) : ( - - - {stringRenderer(String(value))} - - - ), + () => ( + + + {stringRenderer(String(value))} + + + ), [field, stringRenderer, value] ); @@ -110,7 +100,6 @@ export const DraggableZeekElement = React.memo<{ (({ data, isDraggable, timelineId }) => { +export const ZeekSignature = React.memo(({ data, timelineId }) => { const id = `zeek-signature-draggable-zeek-element-${timelineId}-${data._id}`; const sessionId: string | null | undefined = get('zeek.session_id[0]', data); const dataSet: string | null | undefined = get('event.dataset[0]', data); @@ -244,92 +232,42 @@ export const ZeekSignature = React.memo(({ data, isDraggable return ( <> - + - - - - - - - - + + + + + + + + diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.test.tsx index 33a47bc8c0698..47242c743a85b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.test.tsx @@ -62,7 +62,6 @@ describe('DefaultCellRenderer', () => { eventId={eventId} header={header} isDetails={isDetails} - isDraggable={true} isExpandable={isExpandable} isExpanded={isExpanded} linkValues={linkValues} @@ -97,7 +96,6 @@ describe('DefaultCellRenderer', () => { eventId={eventId} header={header} isDetails={isDetails} - isDraggable={true} isExpandable={isExpandable} isExpanded={isExpanded} linkValues={linkValues} @@ -119,7 +117,6 @@ describe('DefaultCellRenderer', () => { eventId, field: header, isDetails, - isDraggable: true, linkValues, rowRenderers: undefined, scopeId, @@ -157,7 +154,6 @@ describe('host link rendering', () => { eventId="_id-123" header={hostNameHeader} isDetails={false} - isDraggable={true} isExpandable={false} isExpanded={false} isTimeline={isTimeline} @@ -191,7 +187,6 @@ describe('host link rendering', () => { eventId="_id-123" header={hostNameHeader} isDetails={false} - isDraggable={true} isExpandable={false} isExpanded={false} isTimeline={isTimeline} @@ -226,7 +221,6 @@ describe('host link rendering', () => { eventId="_id-123" header={timestampHeader} isDetails={false} - isDraggable={true} isExpandable={false} isExpanded={false} isTimeline={isTimeline} diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.tsx index ec230139dc95e..24f7b7f252000 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/cell_rendering/default_cell_renderer.tsx @@ -26,7 +26,6 @@ export const DefaultCellRenderer: React.FC = ({ eventId, header, isDetails, - isDraggable, isTimeline, linkValues, rowRenderers, @@ -57,7 +56,6 @@ export const DefaultCellRenderer: React.FC = ({ eventId, field: header, isDetails, - isDraggable, linkValues, rowRenderers, scopeId, diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/__snapshots__/provider.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/__snapshots__/provider.test.tsx.snap deleted file mode 100644 index 5af5d50dd6f46..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/__snapshots__/provider.test.tsx.snap +++ /dev/null @@ -1,21 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Provider rendering renders correctly against snapshot 1`] = ` - -`; diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.test.tsx deleted file mode 100644 index 1e26710504b4a..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.test.tsx +++ /dev/null @@ -1,33 +0,0 @@ -/* - * 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 { mount, shallow } from 'enzyme'; -import React from 'react'; - -import { TestProviders } from '../../../../common/mock/test_providers'; - -import { mockDataProviders } from './mock/mock_data_providers'; -import { Provider } from './provider'; - -describe('Provider', () => { - describe('rendering', () => { - test('renders correctly against snapshot', () => { - const wrapper = shallow(); - expect(wrapper).toMatchSnapshot(); - }); - - test('it renders the data provider', () => { - const wrapper = mount( - - - - ); - - expect(wrapper.text()).toContain('name: "Provider 1"'); - }); - }); -}); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.tsx deleted file mode 100644 index aae5ba7a73fff..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/data_providers/provider.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/* - * 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 { noop } from 'lodash/fp'; -import React, { useState } from 'react'; - -import type { DataProvider } from './data_provider'; -import { IS_OPERATOR } from './data_provider'; -import { ProviderItemBadge } from './provider_item_badge'; -import { DataProviderTypeEnum } from '../../../../../common/api/timeline'; - -interface OwnProps { - dataProvider: DataProvider; -} - -export const Provider = React.memo(({ dataProvider }) => { - const [isPopoverOpen, setIsPopoverOpen] = useState(false); - - return ( - - ); -}); - -Provider.displayName = 'Provider'; diff --git a/x-pack/solutions/security/plugins/timelines/common/types/timeline/rows/index.ts b/x-pack/solutions/security/plugins/timelines/common/types/timeline/rows/index.ts index 6c3449ad59d35..7477160f69b97 100644 --- a/x-pack/solutions/security/plugins/timelines/common/types/timeline/rows/index.ts +++ b/x-pack/solutions/security/plugins/timelines/common/types/timeline/rows/index.ts @@ -19,12 +19,10 @@ export interface DeprecatedRowRenderer { renderRow: ({ contextId, data, - isDraggable, scopeId, }: { contextId?: string; data: Ecs; - isDraggable: boolean; scopeId: string; }) => React.ReactNode; } diff --git a/x-pack/test/security_solution_cypress/cypress/e2e/detection_response/detection_engine/rule_creation/indicator_match_rule.cy.ts b/x-pack/test/security_solution_cypress/cypress/e2e/detection_response/detection_engine/rule_creation/indicator_match_rule.cy.ts index deccc1a205f61..89788eb689a1e 100644 --- a/x-pack/test/security_solution_cypress/cypress/e2e/detection_response/detection_engine/rule_creation/indicator_match_rule.cy.ts +++ b/x-pack/test/security_solution_cypress/cypress/e2e/detection_response/detection_engine/rule_creation/indicator_match_rule.cy.ts @@ -14,17 +14,17 @@ import { } from '../../../../objects/rule'; import { - ALERT_RULE_NAME, ALERT_RISK_SCORE, + ALERT_RULE_NAME, ALERT_SEVERITY, ALERTS_COUNT, } from '../../../../screens/alerts'; import { CUSTOM_RULES_BTN, RISK_SCORE, - RULES_MANAGEMENT_TABLE, RULE_NAME, RULE_SWITCH, + RULES_MANAGEMENT_TABLE, SEVERITY, } from '../../../../screens/alerts_detection_rules'; import { @@ -58,13 +58,13 @@ import { import { INDICATOR_MATCH_ROW_RENDER, PROVIDER_BADGE } from '../../../../screens/timeline'; import { investigateFirstAlertInTimeline } from '../../../../tasks/alerts'; import { + checkDuplicatedRule, + disableAutoRefresh, duplicateFirstRule, duplicateRuleFromMenu, - checkDuplicatedRule, expectNumberOfRules, - selectAllRules, goToRuleDetailsOf, - disableAutoRefresh, + selectAllRules, } from '../../../../tasks/alerts_detection_rules'; import { duplicateSelectedRulesWithExceptions } from '../../../../tasks/rules_bulk_actions'; import { createRule } from '../../../../tasks/api_calls/rules'; @@ -85,15 +85,15 @@ import { getIndicatorAndButton, getIndicatorAtLeastOneInvalidationText, getIndicatorDeleteButton, - getRuleIndexInput, getIndicatorIndexComboField, getIndicatorIndicatorIndex, getIndicatorInvalidationText, getIndicatorMappingComboField, getIndicatorOrButton, + getRuleIndexInput, + getThreatMatchQueryInvalidationText, selectIndicatorMatchType, waitForAlertsToPopulate, - getThreatMatchQueryInvalidationText, } from '../../../../tasks/create_new_rule'; import { SCHEDULE_INTERVAL_AMOUNT_INPUT, @@ -105,10 +105,10 @@ import { goBackToRuleDetails } from '../../../../tasks/edit_rule'; import { login } from '../../../../tasks/login'; import { visit } from '../../../../tasks/navigation'; import { - goBackToRulesTable, getDetails, - waitForTheRuleToBeExecuted, + goBackToRulesTable, visitRuleDetailsPage, + waitForTheRuleToBeExecuted, } from '../../../../tasks/rule_details'; import { CREATE_RULE_URL } from '../../../../urls/navigation'; import { RULES_MANAGEMENT_URL } from '../../../../urls/rules_management'; diff --git a/x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alerts_cell_actions.cy.ts b/x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alerts_cell_actions.cy.ts index 107a170e9cc2d..3d6bc35bbe192 100644 --- a/x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alerts_cell_actions.cy.ts +++ b/x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alerts_cell_actions.cy.ts @@ -14,14 +14,13 @@ import { ALERT_TABLE_SEVERITY_VALUES, PROVIDER_BADGE, } from '../../../screens/timeline'; - import { - scrollAlertTableColumnIntoViewAndTest, addAlertPropertyToTimeline, - filterForAlertProperty, - showTopNAlertProperty, clickExpandActions, + filterForAlertProperty, filterOutAlertProperty, + scrollAlertTableColumnIntoViewAndTest, + showTopNAlertProperty, } from '../../../tasks/alerts'; import { deleteAlertsAndRules } from '../../../tasks/api_calls/common'; import { createRule } from '../../../tasks/api_calls/rules'; @@ -29,10 +28,10 @@ import { waitForAlertsToPopulate } from '../../../tasks/create_new_rule'; import { login } from '../../../tasks/login'; import { visit } from '../../../tasks/navigation'; import { - removeKqlFilter, fillAddFilterForm, fillKqlQueryBar, openAddFilterPopover, + removeKqlFilter, } from '../../../tasks/search_bar'; import { openActiveTimeline } from '../../../tasks/timeline'; @@ -47,64 +46,74 @@ describe('Alerts cell actions', { tags: ['@ess', '@serverless'] }, () => { waitForAlertsToPopulate(); }); - it('should filter in and out existing values', () => { - scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { - cy.get(ALERT_TABLE_SEVERITY_VALUES) - .first() - .invoke('text') - .then((severityVal) => { - filterForAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 0); - cy.get(FILTER_BADGE).first().should('have.text', `kibana.alert.severity: ${severityVal}`); - }); - removeKqlFilter(); - }); - - cy.log('should work for empty properties'); - // add query condition to make sure the field is empty - fillKqlQueryBar('not file.name: *{enter}'); + // Flaky in Serverless MKI only + // https://github.com/elastic/kibana/issues/201117 + it( + 'should filter in and out existing values', + { + tags: ['@skipInServerlessMKI'], + }, + () => { + scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { + cy.get(ALERT_TABLE_SEVERITY_VALUES) + .first() + .invoke('text') + .then((severityVal) => { + filterForAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 1); + cy.get(FILTER_BADGE) + .first() + .should('have.text', `kibana.alert.severity: ${severityVal.toLowerCase()}`); + }); + removeKqlFilter(); + }); - scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_FILE_NAME_HEADER, () => { - cy.log('filter for alert property'); + cy.log('should work for empty properties'); + // add query condition to make sure the field is empty + fillKqlQueryBar('not file.name: *{enter}'); - filterForAlertProperty(ALERT_TABLE_FILE_NAME_VALUES, 0); + scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_FILE_NAME_HEADER, () => { + cy.log('filter for alert property'); - cy.get(FILTER_BADGE).first().should('have.text', 'NOT file.name: exists'); - removeKqlFilter(); - }); + filterForAlertProperty(ALERT_TABLE_FILE_NAME_VALUES, 0); - cy.log('filter out alert property'); + cy.get(FILTER_BADGE).first().should('have.text', 'NOT file.name: exists'); + removeKqlFilter(); + }); - scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_FILE_NAME_HEADER, () => { - cy.get(ALERT_TABLE_FILE_NAME_VALUES) - .first() - .then(() => { - filterOutAlertProperty(ALERT_TABLE_FILE_NAME_VALUES, 0); - cy.get(FILTER_BADGE).first().should('have.text', 'file.name: exists'); - }); - removeKqlFilter(); - }); + cy.log('filter out alert property'); - cy.log('should filter out a non-empty property'); + scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_FILE_NAME_HEADER, () => { + cy.get(ALERT_TABLE_FILE_NAME_VALUES) + .first() + .then(() => { + filterOutAlertProperty(ALERT_TABLE_FILE_NAME_VALUES, 0); + cy.get(FILTER_BADGE).first().should('have.text', 'file.name: exists'); + }); + removeKqlFilter(); + }); - scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { - cy.get(ALERT_TABLE_SEVERITY_VALUES) - .first() - .invoke('text') - .then((severityVal) => { - filterOutAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 0); - cy.get(FILTER_BADGE) - .first() - .should('have.text', `NOT kibana.alert.severity: ${severityVal}`); - }); - }); - }); + cy.log('should filter out a non-empty property'); + + scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { + cy.get(ALERT_TABLE_SEVERITY_VALUES) + .first() + .invoke('text') + .then((severityVal) => { + filterOutAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 1); + cy.get(FILTER_BADGE) + .first() + .should('have.text', `NOT kibana.alert.severity: ${severityVal.toLowerCase()}`); + }); + }); + } + ); it('should allow copy paste', () => { scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { cy.window().then((win) => { cy.stub(win, 'prompt').returns('DISABLED WINDOW PROMPT'); }); - clickExpandActions(ALERT_TABLE_SEVERITY_VALUES, 0); + clickExpandActions(ALERT_TABLE_SEVERITY_VALUES, 1); // We are not able to test the "copy to clipboard" action execution // due to browsers security limitation accessing the clipboard services. // We assume external `copy` library works @@ -118,11 +127,11 @@ describe('Alerts cell actions', { tags: ['@ess', '@serverless'] }, () => { .first() .invoke('text') .then((severityVal) => { - addAlertPropertyToTimeline(ALERT_TABLE_SEVERITY_VALUES, 0); + addAlertPropertyToTimeline(ALERT_TABLE_SEVERITY_VALUES, 1); openActiveTimeline(); cy.get(PROVIDER_BADGE) .first() - .should('have.text', `kibana.alert.severity: "${severityVal}"`); + .should('have.text', `kibana.alert.severity: "${severityVal.toLowerCase()}"`); }); }); }); @@ -141,7 +150,7 @@ describe('Alerts cell actions', { tags: ['@ess', '@serverless'] }, () => { it('should show top N for a property', () => { scrollAlertTableColumnIntoViewAndTest(ALERT_TABLE_SEVERITY_HEADER, () => { cy.get(ALERT_TABLE_SEVERITY_VALUES); - showTopNAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 0); + showTopNAlertProperty(ALERT_TABLE_SEVERITY_VALUES, 1); cy.get(SHOW_TOP_N_HEADER).first().should('have.text', `Top kibana.alert.severity`); }); }); diff --git a/x-pack/test/security_solution_cypress/cypress/screens/alerts.ts b/x-pack/test/security_solution_cypress/cypress/screens/alerts.ts index f7b606c27f089..8186864929ffa 100644 --- a/x-pack/test/security_solution_cypress/cypress/screens/alerts.ts +++ b/x-pack/test/security_solution_cypress/cypress/screens/alerts.ts @@ -5,7 +5,7 @@ * 2.0. */ -import { IS_SERVERLESS, CLOUD_SERVERLESS } from '../env_var_names_constants'; +import { CLOUD_SERVERLESS, IS_SERVERLESS } from '../env_var_names_constants'; import { getDataTestSubjectSelector } from '../helpers/common'; export const ADD_EXCEPTION_BTN = '[data-test-subj="add-exception-menu-item"]'; @@ -27,15 +27,12 @@ export const ALERT_GRID_CELL = '[data-test-subj="dataGridRowCell"]'; export const ALERT_RULE_NAME = '[data-test-subj="formatted-field-kibana.alert.rule.name"]'; -export const ALERT_RISK_SCORE = '[data-test-subj="formatted-field-kibana.alert.risk_score"]'; +export const ALERT_RISK_SCORE = '[data-test-subj="render-content-kibana.alert.risk_score"]'; -export const ALERT_SEVERITY = '[data-test-subj="formatted-field-kibana.alert.severity"]'; +export const ALERT_SEVERITY = '[data-test-subj="render-content-kibana.alert.severity"]'; export const ALERT_DATA_GRID = '[data-test-subj="euiDataGridBody"]'; -export const ALERT_TABLE_ROW = (rowIndex: number) => - `[data-grid-row-index="${rowIndex}"] [data-test-subj="dataGridRowCell"]`; - export const ALERT_DATA_GRID_ROW = `${ALERT_DATA_GRID} .euiDataGridRow`; export const ALERTS_COUNT = '[data-test-subj="toolbar-alerts-count"]'; @@ -115,12 +112,16 @@ export const FILTER_BADGE_DELETE = '[data-test-subj="deleteFilter"]'; export const CELL_FILTER_IN_BUTTON = '[data-test-subj="dataGridColumnCellAction-security-default-cellActions-filterIn"]'; + export const CELL_FILTER_OUT_BUTTON = '[data-test-subj="dataGridColumnCellAction-security-default-cellActions-filterOut"]'; + export const CELL_ADD_TO_TIMELINE_BUTTON = '[data-test-subj="dataGridColumnCellAction-security-default-cellActions-addToTimeline"]'; + export const CELL_SHOW_TOP_FIELD_BUTTON = '[data-test-subj="dataGridColumnCellAction-security-default-cellActions-showTopN"]'; + export const CELL_COPY_BUTTON = '[data-test-subj="dataGridColumnCellAction-security-default-cellActions-copyToClipboard"]'; @@ -203,17 +204,13 @@ export const EVENT_SUMMARY_ALERT_RENDERER_CONTENT = '[data-test-subj="alertRende export const ALERT_TABLE_EVENT_RENDERED_VIEW_OPTION = '[data-test-subj="eventRenderedView"]'; -export const ALERT_TABLE_SUMMARY_VIEW_SELECTOR = '[data-test-subj="summary-view-selector"]'; - export const ALERT_RENDERER_HOST_NAME = '[data-test-subj="alertFieldBadge"] [data-test-subj="render-content-host.name"]'; export const HOVER_ACTIONS_CONTAINER = getDataTestSubjectSelector('hoverActionsPopover'); -export const SECURITY_SOLUTION_USERS_AVATAR = (user: string) => - `[data-test-subj="securitySolutionUsersAvatar-${user}"]`; - export const ALERT_USERS_PROFILES_SELECTABLE_MENU_ITEM = '.euiSelectableListItem'; + export const ALERT_USERS_PROFILES_CLEAR_SEARCH_BUTTON = '[data-test-subj="clearSearchButton"]'; export const ALERT_ASSIGN_CONTEXT_MENU_ITEM = @@ -240,6 +237,7 @@ export const ALERT_USER_AVATAR = (assignee: string) => { return `[data-test-subj^="securitySolutionUsersAvatar-"][title='${expectedAssignee}']`; }; + export const ALERT_AVATARS_PANEL = '[data-test-subj="securitySolutionUsersAvatarsPanel"]'; export const ALERT_ASIGNEES_COLUMN = @@ -257,6 +255,7 @@ export const ALERT_DETAILS_TAKE_ACTION_BUTTON = '[data-test-subj="securitySolutionFlyoutFooterDropdownButton"]'; export const USER_COLUMN = '[data-gridcell-column-id="user.name"]'; + export const TOOLTIP = '[data-test-subj="message-tool-tip"]'; export const HOVER_ACTIONS = { diff --git a/x-pack/test/security_solution_cypress/cypress/screens/timeline.ts b/x-pack/test/security_solution_cypress/cypress/screens/timeline.ts index fecaf7c169d57..83c21f49cf082 100644 --- a/x-pack/test/security_solution_cypress/cypress/screens/timeline.ts +++ b/x-pack/test/security_solution_cypress/cypress/screens/timeline.ts @@ -265,7 +265,7 @@ export const TIMESTAMP_HOVER_ACTION_OVERFLOW_BTN = export const TIMELINE_STATUS = '[data-test-subj="timeline-save-status"]'; export const ALERT_TABLE_SEVERITY_VALUES = - '[data-test-subj="formatted-field-kibana.alert.severity"]'; + '[data-test-subj="render-content-kibana.alert.severity"]'; export const ALERT_TABLE_FILE_NAME_HEADER = '[data-gridcell-column-id="file.name"]';