Skip to content

[8.x] [Security Solution][Expandable flyout] Introducing Flyout history in document flyout (#184970)#203702

Merged
christineweng merged 1 commit intoelastic:8.xfrom
christineweng:backport/8.x/pr-184970
Dec 11, 2024
Merged

[8.x] [Security Solution][Expandable flyout] Introducing Flyout history in document flyout (#184970)#203702
christineweng merged 1 commit intoelastic:8.xfrom
christineweng:backport/8.x/pr-184970

Conversation

@christineweng
Copy link
Copy Markdown
Contributor

Backport

This will backport the following commits from main to 8.x:

Questions ?

Please refer to the Backport tool documentation

…document flyout (elastic#184970)

## Summary

This PR introduced flyout history in expandable flyouts to keep tracked
of previously opened flyouts. The history button is available when
feature flag `newExpandableFlyoutNavigationEnabled` is enabled.

Flag is currently default `False`

### Changes in
[kbn-expandable-flyout](https://github.com/elastic/kibana/tree/main/packages/kbn-expandable-flyout)
package

- When `openFlyout` is called, the **right** panel will be appended to
the `history` slice in redux.
- History can be accessed via `useExpandableFlyoutHistory` API

![image](https://github.com/user-attachments/assets/081d6d6f-3c10-40f0-8882-73bc8c275e68)

### Changes to expandable flyouts in security solution

- When feature flag is on, opening more than 1 flyout will show a
history icon. Currently max at 10 entries
- When user clicks a flyout from the history, it does not add on top on
history, instead the position will be moved up. There is no duplicate
entries.

![image](https://github.com/user-attachments/assets/3bc68519-5eea-4fb7-9386-f6688b28b525)

**To illustrate how ordering works:**
-> History: [host1, user1, alert1]
-> clicks alert1
-> History: [alert1, host1, user1]
Keep in mind this is slightly different in the actual implementation, as
we do not display the current entry (i.e. alert1 in this example)

### Other changes in order to support flyout history
- Added a preview panel for network. Previously we reused the panel for
both network flyout and network preview. A dedicated network preview
with out history is now available
- Replaced `openRightPanel` with `openFlyout` in applicable places
- Added `isPreview` and `isPreviewMode` checks in EA flyouts

## How to test
- Enable feature flag `newExpandableFlyoutNavigationEnabled`

<details>
<summary>✅  Alerts page</summary>
Available for alert, host, user, rule name and ip's
<img
src="https://github.com/user-attachments/assets/e74a6444-763f-4e18-8370-f6c0c83e0d4c"
/>
</details>

<details>
<summary>✅  Explore pages (event table)</summary>
Available for events, host, user, rule name and ip's
<img
src="https://github.com/user-attachments/assets/d2b9f0b9-a788-4174-bc80-8ac9c51fb16a"
/>
</details>

<details>
<summary>✅  Cases</summary>
Note: the rule and entity link still go to a page, this will be
addressed in a separate PR
<img
src="https://github.com/user-attachments/assets/fa7a5c86-d1e3-4dad-80ed-405c52efc486"
/>
</details>

<details>
<summary>✅  Discover in severless</summary>
- enable `discover.experimental.enabledProfiles:
['security-root-profile']`
<img
src="https://github.com/user-attachments/assets/ebd5de5d-1ed3-42ad-bb6f-1beccdc48e62"
/>
</details>

<details>
<summary>❌ Disabled in alert preview </summary>
<img
src="https://github.com/user-attachments/assets/53e82ded-0db8-4639-afa1-c5cf224cf193"
/>
</details>

<details>
<summary>❌ Disabled in preview mode </summary>
<img
src="https://github.com/user-attachments/assets/a12b741f-2558-4fb5-852f-282af6e10f93"
/>
</details>

## WIP
- [x] Investigate performance with process history
- [ ] Final ui of the entries - pending UIUX team

### Checklist

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [x]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

(cherry picked from commit 5b6887d)

# Conflicts:
#	x-pack/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.test.tsx
#	x-pack/plugins/security_solution/public/timelines/components/timeline/body/renderers/user_name.test.tsx
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
securitySolution 6342 6346 +4

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id before after diff
@kbn/expandable-flyout 17 18 +1

Async chunks

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

id before after diff
securitySolution 13.5MB 13.5MB +5.7KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
securitySolution 86.6KB 86.7KB +40.0B
Unknown metric groups

API count

id before after diff
@kbn/expandable-flyout 44 46 +2

@christineweng christineweng merged commit c4658e7 into elastic:8.x Dec 11, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport This PR is a backport of another PR

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants