[Security Solution] add prevalence expanded section to expandable flyout #158606

PhilippeOberti · 2023-05-26T21:46:31Z

Summary

This PR adds the Prevalence details section under the Insights section of the left expanded panel of the expandable flyout.

The PR introduces the following main changes:

the PrevalenceDetails placeholder component now retrieves the highlighted fields (using the same hook the PrevalenceOverview component was using, then displays a table with the calculated values
2 new PrevalenceDetailsCountCell and PrevalenceDetailsPrevalenceCell components, that are using within the EuiBasicTable cell render methods
the above 2 cell components leverage a couple of hooks (useFetchUniqueByField, useFetchFieldValuePairWithAggregation and useFetchFieldValuePairByEventType) to fetch the data and do the necessary calculations. The hooks were very similar to the work done in the previous prevalence overview PR and were therefore made more generic and extracted to the shared folder at the root of the flyout folder. The hooks used within the right folder were replaced by these new generic ones

Some smaller changes were also made:

LeftFlyoutContext was renamed to LeftPanelContext to be consistent with the RightPanelContext used in the other folder

Data is being fetched using ReactQuery.

How to test

add xpack.securitySolution.enableExperimental: ['securityFlyoutEnabled'] to the kibana.json file
run yarn es snapshot --license trial, yarn test:generate and yarn start --no-base-path
go to the Alerts page, and click on the expand detail button on any row of the table
navigate to the Overview tab

How to generate correlations data

See the description of the previous PR and this comment to learn how to generate data.

https://github.com/elastic/security-team/issues/6423

TODO

implement e2e tests
verify interfaces and functions documentations

christineweng

Desk tested and it looks great!

I noticed the (%) in Host Prevalence (%) is cut off, unless i have kibana full screen AND on a ultra-wide monitor. In that case showing just numbers look a little off. I wonder if adding % to the numbers makes more sense to customers, wdyt?

x-pack/plugins/security_solution/public/flyout/left/context.tsx

x-pack/plugins/security_solution/public/flyout/shared/utils/fetch_data.ts

...ins/security_solution/public/flyout/shared/hooks/use_fetch_field_value_pair_by_event_type.ts

...rity_solution/public/flyout/shared/hooks/use_fetch_field_value_pair_with_aggregation.test.ts

x-pack/plugins/security_solution/public/flyout/left/components/prevalence_details.tsx

PhilippeOberti · 2023-06-07T15:52:25Z

Desk tested and it looks great!

I noticed the (%) in Host Prevalence (%) is cut off, unless i have kibana full screen AND on a ultra-wide monitor. In that case showing just numbers look a little off. I wonder if adding % to the numbers makes more sense to customers, wdyt?

I kept going back and fourth on this when I was developing it. I just added back the % in the cells directly and yeah it definitely looks better. Thanks!

lgestc

looking good, one thing is that undefined returned inside LeftFlyoutContext, see my comment please:)

...ss/e2e/investigations/alerts/expandable_flyout/alert_details_left_panel_prevalence_tab.cy.ts

x-pack/plugins/security_solution/public/flyout/left/components/analyze_graph.stories.tsx

x-pack/plugins/security_solution/public/flyout/left/components/prevalence_details.test.tsx

x-pack/plugins/security_solution/public/flyout/left/components/prevalence_details.tsx

lgestc · 2023-06-07T17:38:19Z

...ck/plugins/security_solution/public/flyout/left/components/prevalence_details_count_cell.tsx

+  }
+
+  if (error) {
+    return null;


actually maybe we should return something here?:)

I originally thought that having an empty cell would be ok, but I agree that showing some sort of error is better. I decided to return an error icon, let me know what you think... did you have something else in mind?

this looks okay to me, but maybe @ferenrigue has some better idea:)

.../security_solution/public/flyout/left/components/prevalence_details_prevalence_cell.test.tsx

...ugins/security_solution/public/flyout/left/components/prevalence_details_prevalence_cell.tsx

x-pack/plugins/security_solution/public/flyout/left/context.tsx

...ins/security_solution/public/flyout/shared/hooks/use_fetch_field_value_pair_by_event_type.ts

christineweng

Desk tested and LGTM!

christineweng · 2023-06-12T16:36:53Z

x-pack/plugins/security_solution/public/flyout/left/components/translations.ts

+export const PREVALENCE_TABLE_ALERT_COUNT_COLUMN_TITLE = i18n.translate(
+  'xpack.securitySolution.flyout.prevalenceTableAlertCountColumnTitle',
+  {
+    defaultMessage: 'Alert Count',


elastic styles prefer sentence case: i.e. 'Alert count'

yup, good point, fixed!

- add doc - lefft and right context more consistent - add table column title translations - more % to cells instead of column title

- remove unnecessary Storybook stories (analyzer graph and session view) - replace as jest.Mock by jest.mocked where appropriate - improve useMemo inside PrevalenceDetails - cell components return error EuiIcon instead of null in case of errors

kibana-ci · 2023-06-12T22:15:34Z

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

[job] [logs] FTR Configs #40 / Endpoint plugin test metadata apis list endpoints GET route "before all" hook for "should return one entry for each host with default paging"
[job] [logs] Defend Workflows Cypress Tests #1 / Endpoints page "before all" hook for "Loads the endpoints page"

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`securitySolution`	4104	4108	+4

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`securitySolution`	10.8MB	10.8MB	+16.5KB

Unknown metric groups

ESLint disabled line counts

id	before	after	diff
`enterpriseSearch`	19	21	+2
`securitySolution`	410	414	+4
total			+6

References to deprecated APIs

id	before	after	diff
`securitySolution`	607	609	+2

Total ESLint disabled count

id	before	after	diff
`enterpriseSearch`	20	22	+2
`securitySolution`	491	495	+4
total			+6

History

💔 Build #134515 failed d34e775ba6d5e3b71bfc131c1a332b445d739436
💔 Build #134485 failed ce46f89e8ffc495959ae01702b96db9f700eca72
💔 Build #134164 failed 64a8a5fb80ce1c826f00fea64dee7213ed4653c6
💛 Build #134070 was flaky 2c8f2af
💔 Build #133543 failed 50774b370a5808ca24f5591edf8d1b5d41ef6316

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

PhilippeOberti force-pushed the expanded-flyout-6423 branch 3 times, most recently from 75334bf to d722b0f Compare May 31, 2023 14:03

PhilippeOberti marked this pull request as ready for review May 31, 2023 14:03

PhilippeOberti requested review from a team as code owners May 31, 2023 14:03

PhilippeOberti requested review from lgestc and christineweng May 31, 2023 14:03

PhilippeOberti added release_note:feature Makes this part of the condensed release notes Team:Threat Hunting:Investigations Security Solution Investigations Team v8.9.0 labels May 31, 2023

PhilippeOberti force-pushed the expanded-flyout-6423 branch from d722b0f to bc59e78 Compare May 31, 2023 19:19

christineweng reviewed Jun 2, 2023

View reviewed changes

PhilippeOberti force-pushed the expanded-flyout-6423 branch from bc59e78 to 45adce3 Compare June 7, 2023 14:54

lgestc reviewed Jun 7, 2023

View reviewed changes

PhilippeOberti force-pushed the expanded-flyout-6423 branch 6 times, most recently from 2c8f2af to 64a8a5f Compare June 10, 2023 04:58

christineweng reviewed Jun 12, 2023

View reviewed changes

PhilippeOberti force-pushed the expanded-flyout-6423 branch 3 times, most recently from ce46f89 to d34e775 Compare June 12, 2023 18:22

PhilippeOberti added 4 commits June 12, 2023 15:38

[Security Solution] add prevalence expanded section to expandable flyout

9ac78d7

PR comments:

85c3b67

- add doc - lefft and right context more consistent - add table column title translations - more % to cells instead of column title

PR comments:

dbba883

- remove unnecessary Storybook stories (analyzer graph and session view) - replace as jest.Mock by jest.mocked where appropriate - improve useMemo inside PrevalenceDetails - cell components return error EuiIcon instead of null in case of errors

combine field and values into highlightedField prop

8919e87

PhilippeOberti added 3 commits June 12, 2023 15:38

fix after rebase

c90d3be

sentence case on table headers

c919247

fix linting and unit tests

241c92b

PhilippeOberti force-pushed the expanded-flyout-6423 branch from d34e775 to 241c92b Compare June 12, 2023 20:38

PhilippeOberti requested review from lgestc and christineweng June 12, 2023 20:49

christineweng approved these changes Jun 13, 2023

View reviewed changes

PhilippeOberti merged commit 39c68b5 into main Jun 13, 2023

PhilippeOberti deleted the expanded-flyout-6423 branch June 13, 2023 22:17

kibanamachine added the backport:skip This commit does not require backporting label Jun 13, 2023

PhilippeOberti mentioned this pull request Jul 31, 2023

[Security Solution] expandable flyout - prevalence data is calculated from 30d to now #162791

Merged

1 task

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Security Solution] add prevalence expanded section to expandable flyout #158606

[Security Solution] add prevalence expanded section to expandable flyout #158606

PhilippeOberti commented May 26, 2023 •

edited

Loading

christineweng left a comment •

edited

Loading

PhilippeOberti commented Jun 7, 2023

lgestc left a comment

lgestc Jun 7, 2023

PhilippeOberti Jun 7, 2023 •

edited

Loading

lgestc Jun 9, 2023

christineweng left a comment •

edited

Loading

christineweng Jun 12, 2023 •

edited

Loading

PhilippeOberti Jun 12, 2023

kibana-ci commented Jun 12, 2023

ESLint disabled line counts

References to deprecated APIs

Total ESLint disabled count

[Security Solution] add prevalence expanded section to expandable flyout #158606

[Security Solution] add prevalence expanded section to expandable flyout #158606

Conversation

PhilippeOberti commented May 26, 2023 • edited Loading

Summary

How to test

How to generate correlations data

TODO

christineweng left a comment • edited Loading

Choose a reason for hiding this comment

PhilippeOberti commented Jun 7, 2023

lgestc left a comment

Choose a reason for hiding this comment

lgestc Jun 7, 2023

Choose a reason for hiding this comment

PhilippeOberti Jun 7, 2023 • edited Loading

Choose a reason for hiding this comment

lgestc Jun 9, 2023

Choose a reason for hiding this comment

christineweng left a comment • edited Loading

Choose a reason for hiding this comment

christineweng Jun 12, 2023 • edited Loading

Choose a reason for hiding this comment

PhilippeOberti Jun 12, 2023

Choose a reason for hiding this comment

kibana-ci commented Jun 12, 2023

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

Metrics [docs]

Module Count

Async chunks

ESLint disabled line counts

References to deprecated APIs

Total ESLint disabled count

History

PhilippeOberti commented May 26, 2023 •

edited

Loading

christineweng left a comment •

edited

Loading

PhilippeOberti Jun 7, 2023 •

edited

Loading

christineweng left a comment •

edited

Loading

christineweng Jun 12, 2023 •

edited

Loading