From 5f652dc7847c908ab3bc32b4e64c067f3db7d3e5 Mon Sep 17 00:00:00 2001 From: Xavier Mouligneau <189600+XavierM@users.noreply.github.com> Date: Thu, 19 Nov 2020 10:38:28 -0500 Subject: [PATCH] review with Patryk --- .../timeline_toggle_column.spec.ts | 4 -- x-pack/plugins/security_solution/package.json | 2 +- .../events_viewer/event_details_flyout.tsx | 17 ++++---- .../timeline/body/actions/index.tsx | 3 +- .../timeline/body/events/stateful_event.tsx | 8 ++-- .../timelines/store/timeline/actions.ts | 10 ++--- .../timelines/store/timeline/helpers.ts | 39 ------------------- .../timelines/store/timeline/reducer.ts | 17 ++++---- 8 files changed, 28 insertions(+), 72 deletions(-) diff --git a/x-pack/plugins/security_solution/cypress/integration/timeline_toggle_column.spec.ts b/x-pack/plugins/security_solution/cypress/integration/timeline_toggle_column.spec.ts index 4a9dbfe3960a0..e4f303fb89fda 100644 --- a/x-pack/plugins/security_solution/cypress/integration/timeline_toggle_column.spec.ts +++ b/x-pack/plugins/security_solution/cypress/integration/timeline_toggle_column.spec.ts @@ -41,7 +41,6 @@ describe('toggle column in timeline', () => { it('displays a checked Toggle field checkbox for `@timestamp`, a default timeline column', () => { expandFirstTimelineEventDetails(); cy.get(TIMESTAMP_TOGGLE_FIELD).should('be.checked'); - expandFirstTimelineEventDetails(); }); it('displays an Unchecked Toggle field checkbox for `_id`, because it is NOT a default timeline column', () => { @@ -53,7 +52,6 @@ describe('toggle column in timeline', () => { uncheckTimestampToggleField(); cy.get(TIMESTAMP_HEADER_FIELD).should('not.exist'); - expandFirstTimelineEventDetails(); }); it('adds the _id field to the timeline when the user checks the field', () => { @@ -61,7 +59,6 @@ describe('toggle column in timeline', () => { checkIdToggleField(); cy.get(ID_HEADER_FIELD).should('exist'); - expandFirstTimelineEventDetails(); }); it('adds the _id field to the timeline via drag and drop', () => { @@ -69,6 +66,5 @@ describe('toggle column in timeline', () => { dragAndDropIdToggleFieldToTimeline(); cy.get(ID_HEADER_FIELD).should('exist'); - expandFirstTimelineEventDetails(); }); }); diff --git a/x-pack/plugins/security_solution/package.json b/x-pack/plugins/security_solution/package.json index 97410d8a97cef..048f3846cc322 100644 --- a/x-pack/plugins/security_solution/package.json +++ b/x-pack/plugins/security_solution/package.json @@ -10,7 +10,7 @@ "build-graphql-types": "node scripts/generate_types_from_graphql.js", "cypress:open": "../../../node_modules/.bin/cypress open --config-file ./cypress/cypress.json", "cypress:open-as-ci": "node ../../../scripts/functional_tests --config ../../test/security_solution_cypress/visual_config.ts", - "cypress:run": "../../../node_modules/.bin/cypress run --browser chrome --headless --spec ./cypress/integration/**/*.spec.ts --config-file ./cypress/cypress.json --reporter ../../../node_modules/cypress-multi-reporters --reporter-options configFile=./cypress/reporter_config.json; status=$?; ../../node_modules/.bin/mochawesome-merge ../../../target/kibana-security-solution/cypress/results/mochawesome*.json > ../../../target/kibana-security-solution/cypress/results/output.json; ../../../node_modules/.bin/marge ../../../target/kibana-security-solution/cypress/results/output.json --reportDir ../../../target/kibana-security-solution/cypress/results; mkdir -p ../../../target/junit && cp ../../../target/kibana-security-solution/cypress/results/*.xml ../../../target/junit/ && exit $status;", + "cypress:run": "../../../node_modules/.bin/cypress run --browser chrome --headless --spec ./cypress/integration/**/*.spec.ts --config-file ./cypress/cypress.json --reporter ../../../node_modules/cypress-multi-reporters --reporter-options configFile=./cypress/reporter_config.json; status=$?; ../../../node_modules/.bin/mochawesome-merge ../../../target/kibana-security-solution/cypress/results/mochawesome*.json > ../../../target/kibana-security-solution/cypress/results/output.json; ../../../node_modules/.bin/marge ../../../target/kibana-security-solution/cypress/results/output.json --reportDir ../../../target/kibana-security-solution/cypress/results; mkdir -p ../../../target/junit && cp ../../../target/kibana-security-solution/cypress/results/*.xml ../../../target/junit/ && exit $status;", "cypress:run-as-ci": "node --max-old-space-size=2048 ../../../scripts/functional_tests --config ../../test/security_solution_cypress/cli_config.ts", "test:generate": "node scripts/endpoint/resolver_generator" } diff --git a/x-pack/plugins/security_solution/public/common/components/events_viewer/event_details_flyout.tsx b/x-pack/plugins/security_solution/public/common/components/events_viewer/event_details_flyout.tsx index 352652c1c92c1..ad332b2759048 100644 --- a/x-pack/plugins/security_solution/public/common/components/events_viewer/event_details_flyout.tsx +++ b/x-pack/plugins/security_solution/public/common/components/events_viewer/event_details_flyout.tsx @@ -10,7 +10,6 @@ import styled from 'styled-components'; import deepEqual from 'fast-deep-equal'; import { useDispatch } from 'react-redux'; -import { TimelineExpandedEventType } from '../../../../common/types/timeline'; import { ColumnHeaderOptions } from '../../../timelines/store/timeline/model'; import { timelineActions } from '../../../timelines/store/timeline'; import { BrowserFields, DocValueFields } from '../../containers/source'; @@ -43,15 +42,13 @@ const EventDetailsFlyoutComponent: React.FC = ({ ); const handleClearSelection = useCallback(() => { - if (expandedEvent.eventId) { - dispatch( - timelineActions.toggleExpandedEvent({ - timelineId, - ...(expandedEvent as TimelineExpandedEventType), - }) - ); - } - }, [dispatch, expandedEvent, timelineId]); + dispatch( + timelineActions.toggleExpandedEvent({ + timelineId, + event: {}, + }) + ); + }, [dispatch, timelineId]); if (!expandedEvent.eventId) { return null; diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/actions/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/actions/index.tsx index 88eb1721d60db..e942dce724520 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/actions/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/actions/index.tsx @@ -69,7 +69,8 @@ const ActionsComponent: React.FC = ({ diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_event.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_event.tsx index ebbaca558ffd7..6c28c0ce16df1 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_event.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/stateful_event.tsx @@ -116,9 +116,11 @@ const StatefulEventComponent: React.FC = ({ dispatch( timelineActions.toggleExpandedEvent({ timelineId, - eventId, - indexName, - loading: false, + event: { + eventId, + indexName, + loading: false, + }, }) ); diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/actions.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/actions.ts index 73c71f6291ecb..c2fff49afdcbf 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/actions.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/actions.ts @@ -35,11 +35,11 @@ export const addNoteToEvent = actionCreator<{ id: string; noteId: string; eventI 'ADD_NOTE_TO_EVENT' ); -export const toggleExpandedEvent = actionCreator< - TimelineExpandedEvent & { - timelineId: string; - } ->('TOGGLE_EXPANDED_EVENT'); +interface ToggleExpandedEvent { + timelineId: string; + event: TimelineExpandedEvent; +} +export const toggleExpandedEvent = actionCreator('TOGGLE_EXPANDED_EVENT'); export const upsertColumn = actionCreator<{ column: ColumnHeaderOptions; diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts index da3bd2cd0f20a..241b8c5030de7 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts @@ -115,45 +115,6 @@ export const addTimelineNoteToEvent = ({ }; }; -interface ToggleTimelineExpandedEventParams { - timelineId: string; - eventId: string; - indexName: string; - loading: boolean; - timelineById: TimelineById; -} - -export const toggleTimelineExpandedEvent = ({ - timelineId, - eventId, - indexName, - loading, - timelineById, -}: ToggleTimelineExpandedEventParams): TimelineById => { - const timeline = timelineById[timelineId]; - const existingExpandedEvent = timeline.expandedEvent; - - let newExpandedEvent; - - if ( - existingExpandedEvent && - existingExpandedEvent.eventId === eventId && - existingExpandedEvent.loading === loading - ) { - newExpandedEvent = {}; - } else { - newExpandedEvent = { eventId, indexName, loading }; - } - - return { - ...timelineById, - [timelineId]: { - ...timeline, - expandedEvent: newExpandedEvent, - }, - }; -}; - interface AddTimelineParams { id: string; timeline: TimelineModel; diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.ts index 07ba317a7a0ca..3f2b56b3f7dba 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.ts @@ -74,7 +74,6 @@ import { setDeletedTimelineEvents, setLoadingTimelineEvents, setSelectedTimelineEvents, - toggleTimelineExpandedEvent, unPinTimelineEvent, updateExcludedRowRenderersIds, updateKqlFilterQueryDraft, @@ -179,15 +178,15 @@ export const timelineReducer = reducerWithInitialState(initialTimelineState) ...state, timelineById: addTimelineNoteToEvent({ id, noteId, eventId, timelineById: state.timelineById }), })) - .case(toggleExpandedEvent, (state, { timelineId, eventId, indexName, loading }) => ({ + .case(toggleExpandedEvent, (state, { timelineId, event }) => ({ ...state, - timelineById: toggleTimelineExpandedEvent({ - timelineId, - eventId, - indexName, - loading, - timelineById: state.timelineById, - }), + timelineById: { + ...state.timelineById, + [timelineId]: { + ...state.timelineById[timelineId], + expandedEvent: event, + }, + }, })) .case(addProvider, (state, { id, provider }) => ({ ...state,