[kbn-expandable-flyout] - add support for resizable flyout #192906

PhilippeOberti · 2024-09-13T16:37:33Z

Summary

This PR introduces a new behavior for the expandable flyout package. Users can now resize the flyout, both in collapsed and expanded mode. Users can also resize the left and right sections when the flyout is in expanded mode.

The collapsed flyout width, expanded flyout width and left and right section widths are all saved to local storage, to make sure that the next time users open the flyout, the UI will be similar.
We're leveraging the object introduced in this prior PR and are adding 3 new properties:

the collapsed flyout width value resized by users is saved under collapsedWidth
the expanded flyout width value resized by users is saved under expandedWidth
the left and right section width values resized by users is saved under sectionWidths
The complete object would then look like this

{
  pushVsOverlay: string;
  collapsedWidth: number;
  expandedWidth: number;
  sectionWidths: { left: number; right: number};
}

and would be saved under the expandableFlyout.ui key (same as prior PR)
All of the values are independent from each other and can added, updated and removed independantly.

Note: originally, the new resize values were saved for each flyout (using the urlKey). After discussing this (see comment in previous PR), the functionality now saves a unique value that will be applied to all expandable flyouts.

Users can also reset all the before mentioned values to their default by clicking on the Reset size button in the settings menu. The redux store gets updated and all the entries in local storage are removed.

This PR also focuses on some performance improvements, trying to make sure the components are re-rendering when unnecessary. Lots of useMemo and memo have been added. On top of that, a new Content component has been introduced: it moves most of the logic that was previously in the top level ExpandableFlyout component one level lower, to ensure that when the window width value retrieved from the use_window_size hook was 0 nothing was rendering (other reason is also lots of default values are calculated from the window width, and using 0 does not make any sense).

The move to using redux more extensively has allowed to simplify some of the logic and remove hooks. Also the useWindowSize was renamed useWindowWidth and now also calculates all the default widths.

Users can change the collapsed, expanded and left and right sections widths (values are persisted through page refresh)

Screen.Recording.2024-09-13.at.11.32.26.AM.mov

Users can reset all the saved widths

Screen.Recording.2024-09-13.at.11.33.36.AM.mov

Resizing works both in overlay and push modes

Screen.Recording.2024-09-13.at.11.34.43.AM.mov

Checklist

Documentation was added for features that require explanation or tutorials
Unit or functional tests were updated or added to match the most common scenarios

TODO

figure out the issue with types and EuiResizableFlyout
update README

elasticmachine · 2024-09-13T16:37:36Z

Pinging @elastic/security-threat-hunting-investigations (Team:Threat Hunting:Investigations)

christineweng

Desk tested and overall LGTM! Spotted a few things you might want to check out

Resizing does not update when window size changes.

Screen.Recording.2024-09-18.at.2.55.22.PM.mov

This could be a limitation of the resizable container. Notice when dragging the resizable flyout, it fires 1 resize action, but moving the resizable bar in the middle spams redux

Screen.Recording.2024-09-18.at.2.59.01.PM.mov

christineweng · 2024-09-18T18:59:08Z

packages/kbn-expandable-flyout/src/components/preview_section.tsx

  /**
   * Preview banner shown at the top of preview panel
   */
  banner?: PreviewBanner;
+  /**
+   *


good catch, thanks!

christineweng · 2024-09-18T19:06:31Z

packages/kbn-expandable-flyout/src/components/settings_menu.tsx

+                      data-test-subj={SETTINGS_MENU_FLYOUT_RESIZE_INFORMATION_ICON_TEST_ID}
+                      type="iInCircle"
+                      css={css`
+                        margin-left: 4px;


nit: replace with eui sizes $euiSizeXS?

while changing it I actually realized this was not even used, so it must be a left over of an earlier version while I was doing the POC. It's all removed!

christineweng · 2024-09-18T19:09:30Z

packages/kbn-expandable-flyout/src/hooks/use_sections.ts

+  /**
+   * The preview banner to be displayed in preview section.
+   */
+  previewBanner: PreviewBanner | undefined;


is mostRecentPreviewBanner more accurate?

yup made the change!

christineweng · 2024-09-18T19:11:21Z

packages/kbn-expandable-flyout/src/hooks/use_sections.ts

+ * Hook that retrieves the left, right, and preview sections to be displayed in the flyout.
+ */
+export const useSections = ({ registeredPanels }: UseSectionsParams): UseSectionsResult => {
+  const { left, preview, right } = useExpandableFlyoutState();


nit for a future PR, but we should consider changing preview to previewS here

good point!

christineweng · 2024-09-18T19:29:14Z

packages/kbn-expandable-flyout/src/store/reducers.ts

+  builder.addCase(setDefaultWidthsAction, (state, { payload: { right, left, preview } }) => {
+    state.defaultWidths.rightWidth = right;
+    state.defaultWidths.leftWidth = left;
+    state.defaultWidths.previewWidth = preview;


Is there a reason keeping widths for preview? From use_window_width and line 170 in this file, looks like preview width and percentage always equal to that of the right section

const previewSectionWidth: number = rightSectionWidth;

I debated this a few times then decided to keep the values separated. I feel like when I was reading the code is was more clear. Yes they happen to be the same but developers don't have to know about this, that logic lives in the hook that returns those values...
If you have a strong opinion about it I'm not against changing that!

christineweng · 2024-09-18T19:30:06Z

packages/kbn-expandable-flyout/src/store/state.ts

+  /**
+   * Default width for the preview section (calculated from the window width)
+   */
+  previewWidth: number;


similar as above, do we need previewWidth and previewPercentage?

same answer as here

PhilippeOberti · 2024-09-18T20:17:14Z

Desk tested and overall LGTM! Spotted a few things you might want to check out

Resizing does not update when window size changes.

Yes I did notice that during development and it's not as simple to fix as it looked at first! 😆 I created a ticket to take a look at this later https://github.com/elastic/security-team/issues/10575

This could be a limitation of the resizable container. Notice when dragging the resizable flyout, it fires 1 resize action, but moving the resizable bar in the middle spams redux

For the spam of redux it’s indeed unfortunately coming from EUI: their onResizeEnd event doesn’t give the left and right percentage values, so the only way to get the percentages (to my knowledge) is to capture them in their onPanelWidthChange events which are triggered on mouse move... 😞

kibana-ci · 2024-09-18T22:44:53Z

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`discover`	994	996	+2
`securitySolution`	5799	5801	+2
total			+4

Async chunks

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

id	before	after	diff
`discover`	807.2KB	812.5KB	+5.2KB
`securitySolution`	20.4MB	20.4MB	+19.8KB
total			+25.0KB

Unknown metric groups

API count

id	before	after	diff
`@kbn/expandable-flyout`	43	44	+1

History

💔 Build #235395 failed de39ba8edcdb66b2eb6ddfc650631c2758dec490
💚 Build #235036 succeeded d4f57aa24a42ce4086639ebd85c7fa06af865493
💔 Build #234593 failed ff9eef3a508b9762d5d2504ff7bfccf68c6d5984
💚 Build #234182 succeeded 7c2c19ad97d959a82909ad51d94c128b57a3c11d
💔 Build #234158 failed 3fd6291200da1ae142c33e46df73e80d35314220

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

…92906) (cherry picked from commit bcc42d5)

kibanamachine · 2024-09-18T23:07:15Z

💚 All backports created successfully

Status	Branch	Result
✅	8.x

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

…2906) (#193371) # Backport This will backport the following commits from `main` to `8.x`: - [[kbn-expandable-flyout] - add support for resizable flyout (#192906)](#192906)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Philippe Oberti <[email protected]> Co-authored-by: Elastic Machine <[email protected]>

commit 6d568b0 Merge: 1b0aa69 eabb102 Author: Elastic Machine <[email protected]> Date: Thu Sep 19 12:01:52 2024 +0200 Merge branch 'main' into siem-ea-9180-api commit eabb102 Author: Julia <[email protected]> Date: Thu Sep 19 10:28:48 2024 +0200 [ResponseOps][MW] Add telemetry for the maintenance window (elastic#192483) Resolve: elastic#184088 In this PR add telemetry collection of these metrics: - total number of MW in deployments - number of active MW with "repeat" toggle on (time based) - number of active MW with "filter alerts" toggle on (KQL based) ## Testing Create several MW with different settings (toggles on and off) To test changes reflected in telemetry object, modify this file: `x-pack/plugins/alerting/server/usage/task.ts` With: ``` async function scheduleTasks(logger: Logger, taskManager: TaskManagerStartContract) { try { await taskManager.ensureScheduled({ id: TASK_ID, taskType: TELEMETRY_TASK_TYPE, state: emptyState, params: {}, schedule: SCHEDULE, }); } catch (e) { logger.error(`Error scheduling ${TASK_ID}, received ${e.message}`); } await taskManager.runSoon(TASK_ID); } ``` This will cause the telemetry to be sent as soon as the server is restarted. **Run Telemetry usage payload API in your browser console to verify telemetry object:** https://docs.elastic.dev/telemetry/collection/snapshot-telemetry#telemetry-usage-payload-api P.S.: Add space at the beginning of URL ### Checklist - [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 --------- Co-authored-by: Elastic Machine <[email protected]> commit 210f552 Author: Yulia Čech <[email protected]> Date: Thu Sep 19 10:25:33 2024 +0200 [Ingest Pipelines] Fixes processors description (elastic#193183) ## Summary Fixes elastic#191530 This PR adds a stringify helper that is safe to use with objects, arrays, text and numbers. `set` and `append` processors are using this new helper to display `value` in the processor description. Other type of processors don't seem to need it. This PR fixes the pipeline page so that other processors in the pipeline still can be edited via UI. This PR however doesn't fix the processors forms: both processors currently can't handle json objects when editing. This should be fix in a [separate issue](elastic#193186). ### Screenshots <img width="586" alt="Screenshot 2024-09-17 at 16 54 18" src="https://github.com/user-attachments/assets/e1eb64a3-975c-4db7-98a5-b872ec1b016d"> <img width="586" alt="Screenshot 2024-09-17 at 16 54 34" src="https://github.com/user-attachments/assets/ac57406f-ff22-461e-b788-6bdb2d18d7e9"> ### How to test Use this commands in Console to create processors with a json in `value`. ``` PUT _ingest/pipeline/test2 { "processors": [ { "set" : { "field" : "payload", "value" : "test", "if" : "ctx.payload == \"-\"" } } ] } PUT _ingest/pipeline/test1 { "processors": [ { "append": { "field": "test", "value": { "redacted": true } } } ] } ``` ### Checklist Delete any items that are not applicable to this PR. - [ ] 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) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [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 - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] Any UI touched in this PR is usable by keyboard only (learn more about [keyboard accessibility](https://webaim.org/techniques/keyboard/)) - [ ] Any UI touched in this PR does not create any new axe failures (run axe in browser: [FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/), [Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)) - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [ ] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) ### Risk Matrix Delete this section if it is not applicable to this PR. Before closing this PR, invite QA, stakeholders, and other developers to identify risks that should be tested prior to the change/feature release. When forming the risk matrix, consider some of the following examples and how they may potentially impact the change: | Risk | Probability | Severity | Mitigation/Notes | |---------------------------|-------------|----------|-------------------------| | Multiple Spaces—unexpected behavior in non-default Kibana Space. | Low | High | Integration tests will verify that all features are still supported in non-default Kibana Space and when user switches between spaces. | | Multiple nodes—Elasticsearch polling might have race conditions when multiple Kibana nodes are polling for the same tasks. | High | Low | Tasks are idempotent, so executing them multiple times will not result in logical error, but will degrade performance. To test for this case we add plenty of unit tests around this logic and document manual testing procedure. | | Code should gracefully handle cases when feature X or plugin Y are disabled. | Medium | High | Unit tests will verify that any feature flag or plugin combination still results in our service operational. | | [See more potential risk examples](https://github.com/elastic/kibana/blob/main/RISK_MATRIX.mdx) | ### For maintainers - [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) commit c676d2b Author: natasha-moore-elastic <[email protected]> Date: Thu Sep 19 09:13:14 2024 +0100 Improves Exceptions API docs content (elastic#193040) ## Summary Resolves elastic/security-docs-internal#33 by improving the Exceptions API docs content. Adds missing and improves existing operation summaries and operation descriptions to adhere to our [OAS standards](https://elasticco.atlassian.net/wiki/spaces/DOC/pages/450494532/API+reference+docs). --------- Co-authored-by: kibanamachine <[email protected]> commit 9765f73 Author: natasha-moore-elastic <[email protected]> Date: Thu Sep 19 09:03:59 2024 +0100 Improves Timeline API docs content (elastic#192744) ## Summary Resolves elastic/security-docs-internal#35 by improving the Timeline API docs content. Adds missing and improves existing operation summaries and operation descriptions to adhere to our [OAS standards](https://elasticco.atlassian.net/wiki/spaces/DOC/pages/450494532/API+reference+docs). --------- Co-authored-by: Jatin Kathuria <[email protected]> Co-authored-by: kibanamachine <[email protected]> commit f47987f Author: Alex Szabo <[email protected]> Date: Thu Sep 19 09:53:15 2024 +0200 [ci] skip FTRs that fail on chrome 129 (elastic#193293) ## Summary `google-chrome-stable` is now on version 129. Another set of tests started to fail when running against a VM with unpinned chrome version: https://buildkite.com/elastic/kibana-pull-request/builds/235162 This PR skips another 3 tests and adjusts all messages to point to the central issue. Relates to: elastic/kibana-operations#199 commit 854cb15 Author: Walter Rafelsberger <[email protected]> Date: Thu Sep 19 08:10:38 2024 +0200 [ML] Anomaly Detection: Adds popover links menu to anomaly explorer charts. (elastic#186587) ## Summary Adds support for clicking on Anomaly Explorer charts to trigger the actions popover menu. - [x] ExplorerChartSingleMetric - [x] ExplorerChartDistribution - [x] Support for embedded charts Anomaly Explorer [ml-anomaly-charts-actions-0001.webm](https://github.com/elastic/kibana/assets/230104/9502b234-7df8-4290-9914-163936487af8) Embedding [ml-anomaly-charts-actions-embedding-0001.webm](https://github.com/elastic/kibana/assets/230104/ee519b47-e924-4947-b127-4f3ecf62616e) ### Checklist - [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 - [x] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) commit 32d751f Author: Kibana Machine <[email protected]> Date: Thu Sep 19 15:07:39 2024 +1000 [api-docs] 2024-09-19 Daily api_docs build (elastic#193382) Generated by https://buildkite.com/elastic/kibana-api-docs-daily/builds/835 commit 2efd0f0 Author: Vadim Kibana <[email protected]> Date: Thu Sep 19 05:53:05 2024 +0200 [ES|QL] Implement `OrderExpression` for `SORT` command arguments (elastic#189959) ## Summary Closes elastic#189491 - Adds *order expression* AST nodes, which are minted from `SORT` command. - Improves SORT command autocomplete suggestions. Shows fields on first space: <img width="791" alt="image" src="https://github.com/user-attachments/assets/3fec96b4-4e61-4212-a856-ace7a33d9755"> It now shows `NULLS FIRST` and `NULLS LAST`, even before `ASC` or `DESC` was entered, as `ASC` and `DESC` are optional: <img width="871" alt="image" src="https://github.com/user-attachments/assets/4b6d6c28-a7b0-4ac0-bafc-133df1207d54"> Once `ASC` or `DESC` is entered, shows only nulls options: <img width="911" alt="image" src="https://github.com/user-attachments/assets/5b27bd3d-ccdc-4bd0-b09f-fe65e5975e28"> It also now suggests partial modifier, if the in-progress text that user is typing matches it: <img width="504" alt="image" src="https://github.com/user-attachments/assets/9a047c40-b49b-4694-8477-7270cb9c0886"> (However, we are not triggering autocomplete in those cases in UI, so no way to see it in UI right now.) ### Checklist Delete any items that are not applicable to this PR. - [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 ### For maintainers - [x] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: Elastic Machine <[email protected]> Co-authored-by: kibanamachine <[email protected]> commit 6f4be61 Author: Dominique Clarke <[email protected]> Date: Wed Sep 18 21:32:45 2024 -0400 [Synthetics] waterfall chart - handle cached resources (elastic#193089) ## Summary Resolves elastic#184794 Ensures that the cached resources display accurate timing information on the waterfall chart tooltips. The information displayed should match the information displayed in the flyout when the request url is clicked. Tooltip <img width="555" alt="Screenshot 2024-09-16 at 8 49 55 PM" src="https://github.com/user-attachments/assets/516653bc-dcec-4681-965b-08711417ab67"> Flyout <img width="424" alt="Screenshot 2024-09-16 at 2 07 56 PM" src="https://github.com/user-attachments/assets/5fb0bf1c-c65d-4ce3-8a6a-5e95700209dd"> ### Release note Synthetics - resolves an issue for multi step browser journeys where timings for cached resources within the same step were inaccurate within the waterfall chart. ### Testing 1. Create a browser monitor with duplicate requests. For example: ``` step("multi resource step", async () => { await page.goto('https://github.com'); await page.goto('https://github.com'); await page.goto('https://github.com'); }) ``` 2. Navigate to the monitor details page 3. Find the last test run panel, click the view test details button, then click the view performance breakdown button ![image](https://github.com/user-attachments/assets/b66addcb-21f6-4eac-8c60-dc3387b33853) ![image](https://github.com/user-attachments/assets/67f04b9f-4ff6-4ce6-85d1-2a89869e4a2c) 4. Scroll down to the waterfall chart. If you use github, requests after about 115 should be cached. Note: some request may have been aborted and their waterfall tooltip won't show. Find a request that was not aborted, hover to see the tooltip, then click the request to view the flyout and confirm the information. commit f810bb5 Author: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> Date: Wed Sep 18 18:40:34 2024 -0500 Update docker.elastic.co/wolfi/chainguard-base:latest Docker digest to 6fbf078 (main) (elastic#193356) This PR contains the following updates: | Package | Update | Change | |---|---|---| | docker.elastic.co/wolfi/chainguard-base | digest | `d4def25` -> `6fbf078` | --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://togithub.com/renovatebot/renovate).  Co-authored-by: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> commit 10f86c6 Author: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> Date: Wed Sep 18 18:38:57 2024 -0500 Update dependency msw to ^2.4.5 (main) (elastic#193363) This PR contains the following updates: | Package | Type | Update | Change | Pending | |---|---|---|---|---| | [msw](https://mswjs.io) ([source](https://togithub.com/mswjs/msw)) | devDependencies | patch | [`^2.4.4` -> `^2.4.5`](https://renovatebot.com/diffs/npm/msw/2.4.6/2.4.5) | `2.4.8` (+2) | --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://togithub.com/renovatebot/renovate).  Co-authored-by: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> commit bcc42d5 Author: Philippe Oberti <[email protected]> Date: Thu Sep 19 01:02:36 2024 +0200 [kbn-expandable-flyout] - add support for resizable flyout (elastic#192906) commit 3bea483 Author: Davis Plumlee <[email protected]> Date: Wed Sep 18 17:56:10 2024 -0400 [Security Solution] Adds enable on install UI workflow to prebuilt rules page (elastic#191529) ## Summary Adds overflow button UI to all prebuilt rules install buttons in order to enable the rule when it is successfully installed. Previously, a user would have to navigate back to the rules page and find the rule(s) they just installed to enable, this combines those two workflows into a single button action - speeding up the out of the box rule implementation. ### Screenshots **Prebuilt rules table columns** <img width="530" alt="Screenshot 2024-09-04 at 10 38 05 AM" src="https://github.com/user-attachments/assets/4a009afa-a8f0-4eaa-a76b-8f4e509f35a3"> **Prebuilt rules table bulk install** <img width="1478" alt="Screenshot 2024-09-04 at 10 38 16 AM" src="https://github.com/user-attachments/assets/eb6deb9b-9b4e-4be3-a4ac-0da06d6f1e8e"> **Prebuilt rule details flyout** <img width="1489" alt="Screenshot 2024-09-04 at 10 38 44 AM" src="https://github.com/user-attachments/assets/a4bce22d-7e90-42e4-8522-cf411a297659"> ### Checklist Delete any items that are not applicable to this PR. - [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) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [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 - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed ### For maintainers - [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) commit 4c51c00 Author: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> Date: Wed Sep 18 16:10:45 2024 -0500 Update dependency msw to ^2.4.4 (main) (elastic#192955) This PR contains the following updates: | Package | Type | Update | Change | Pending | |---|---|---|---|---| | [msw](https://mswjs.io) ([source](https://togithub.com/mswjs/msw)) | devDependencies | patch | [`^2.4.2` -> `^2.4.4`](https://renovatebot.com/diffs/npm/msw/2.4.2/2.4.4) | `2.4.8` (+3) | --- ### Release Notes <details> <summary>mswjs/msw (msw)</summary> ### [`v2.4.4`](https://togithub.com/mswjs/msw/releases/tag/v2.4.4) [Compare Source](https://togithub.com/mswjs/msw/compare/v2.4.3...v2.4.4) #### v2.4.4 (2024-09-08) ##### Bug Fixes - **fetch:** follow mocked redirect responses ([#&elastic#8203;2268](https://togithub.com/mswjs/msw/issues/2268)) ([`f5785bf`](https://togithub.com/mswjs/msw/commit/f5785bfba1a026075feca4f74cadfcb636ffc257)) [@&elastic#8203;kettanaito](https://togithub.com/kettanaito) - Adopts a new, Socket-based request interception algorithm. ### [`v2.4.3`](https://togithub.com/mswjs/msw/releases/tag/v2.4.3) [Compare Source](https://togithub.com/mswjs/msw/compare/v2.4.2...v2.4.3) #### v2.4.3 (2024-09-07) ##### Bug Fixes - revert "graphql" as optional peer dependency ([#&elastic#8203;2267](https://togithub.com/mswjs/msw/issues/2267)) ([`7cd39e7`](https://togithub.com/mswjs/msw/commit/7cd39e787aa9766eef914bce3d65daec1ce16635)) [@&elastic#8203;kettanaito](https://togithub.com/kettanaito) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://togithub.com/renovatebot/renovate).  Co-authored-by: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> commit 798a26f Author: Steph Milovic <[email protected]> Date: Wed Sep 18 15:05:41 2024 -0600 [Security solution] `naturalLanguageToEsql` Tool added to default assistant graph (elastic#192042) commit d4ee1ca Author: Justin Kambic <[email protected]> Date: Wed Sep 18 16:51:52 2024 -0400 [Synthetics] Remove dead code (elastic#193335) ## Summary Gets rid of unused files and some types, constants, etc. that are no longer referenced in production code. commit 91ca8ab Author: Eyo O. Eyo <[email protected]> Date: Wed Sep 18 22:26:44 2024 +0200 [Reporting] update puppeteer to version 23.3.1 (elastic#192345) ## Summary Update for puppeteer, the following changeset updates puppeteer to version `23.3.1`. The chromium version required for this version of puppeteer is `128.0.6613.137` from revision `1331488`, as such the chromium binary included for windows and darwin platforms either match or were the closest revision to the expectation. The linux headless binary was built from commit `fe621c5aa2d6b987e964fb1b5066833da5fb613d` of the same revision. _**N.B.**_ Puppeteer 23.0.0 is earmarked as containing breaking changes see [here](https://github.com/puppeteer/puppeteer/blob/abda5dcc9912f4fa2c5a566403108db783f48538/packages/puppeteer-core/CHANGELOG.md#2300-2024-08-07), this PR considers the outlined changes and makes relevant adjustments so reporting continues working as is.  ### How to verify linux headless build - clone the following repo https://github.com/tsullivan/kibana-dev-docker - pull this particular PR - follow the steps outlined in the repo, replacing any occurrence of `kibana-<version>-SNAPSHOT-linux-aarch64.tar.gz` from the repo above's step with the output of running build on this changeset. - before running step 4, modify the `kibana.yml` file from the `kibana-dev-docker` repo and include the following so we might be able to verify the version of chromium running; ```yaml logging.loggers: - name: plugins.reporting level: debug ``` - complete the steps outlined in the README, you'll have a linux distro of kibana running on port `5601` - Attempt creating exports of PDF and PNG reports, in dashboard, canvas, and visualizations, on report creation attempt we would see a log output that prints out the chromium version exactly matching this; <img width="1326" alt="Screenshot 2024-09-18 at 14 50 19" src="https://github.com/user-attachments/assets/7206781a-e8f9-469c-ad65-fd13749766b2"> --------- Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Elastic Machine <[email protected]> commit d84eda1 Author: Justin Kambic <[email protected]> Date: Wed Sep 18 16:07:29 2024 -0400 [Uptime] Delete dead code (elastic#193339) ## Summary Removes code that is unused from the Uptime plugin. commit 3c01b13 Author: Alexi Doak <[email protected]> Date: Wed Sep 18 11:53:36 2024 -0700 [ResponseOps] Connector OAS for framework fields (elastic#192767) Resolves elastic#192778 ## Summary This PR updates the following `response` schemas as well as the legacy route schemas for connector APIs to generate OAS documentation: - `POST /api/actions/connector/{id?}` - `GET /api/actions/connector/{id}` - `POST /api/actions/connector/{id}/_execute` - `PUT /api/actions/connector/{id}` The `request` schemas were updated in this [PR](elastic#191678). ### To verify 1. Start ES 2. Add `server.oas.enabled: true` to `kibana.dev.yml` 3. Start Kibana `yarn start --no-base-path` 4. `curl -s -uelastic:changeme http://localhost:5601/api/oas\?pathStartsWith\=/api/actions/ | jq` --------- Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Lisa Cawley <[email protected]> commit e1db296 Author: Marta Bondyra <[email protected]> Date: Wed Sep 18 20:39:25 2024 +0200 [Lens] Corrects incorrect copy for line chart & fix flaky test (elastic#192734) ## Summary Corrects incorrect copy for line chart. Rewrites some of the tests to rtl. Unskips flaky or failing tests. Fixes elastic#192476 Removes some errors from the console that appear during unit test running. --------- Co-authored-by: Elastic Machine <[email protected]> commit 4d4afa5 Author: Rickyanto Ang <[email protected]> Date: Wed Sep 18 10:55:00 2024 -0700 [Cloud Security] User Name Misconfiguration Table and Preview Contextual Flyout (elastic#192946) ## Summary This PR is the implementation of Misconfiguration Preview and Data table on user.name flyout in Alerts Page. <img width="1717" alt="Screenshot 2024-09-14 at 12 54 37 AM" src="https://github.com/user-attachments/assets/ad405a4a-9820-4bb1-87f0-7e915eeb003b"> How to test: Pre req: In order to test this, you need to generate some fake alerts. This [repo](https://github.com/elastic/security-documents-generator) will help you do that 1. Generate Some Alerts 2. Use the Reindex API to get some Findings data in (change the host.name field to match the host.name from alerts generated if you want to test Findings table in the left panel flyout) 3. Turn on Risky Entity Score if you want to test if both Risk Contribution and Insights tabs shows up, follow this [guide](https://www.elastic.co/guide/en/security/current/turn-on-risk-engine.html) to turn on Risk Entity Score commit b9d7de6 Author: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> Date: Wed Sep 18 12:53:01 2024 -0500 Update OpenFeature (main) (elastic#193332) Co-authored-by: elastic-renovate-prod[bot] <174716857+elastic-renovate-prod[bot]@users.noreply.github.com> commit be2d641 Author: Katerina <[email protected]> Date: Wed Sep 18 20:50:22 2024 +0300 [Inventory] Remove inventory dependency from observability plugin (elastic#193251) ## Summary closes elastic#193200 - Remove inventory dependency from observability plugin - Register inventory in different section in classic stateful sidenav https://github.com/user-attachments/assets/6c9c28bc-7483-4deb-b95a-67585a92f89f commit f40bf52 Author: Melissa Alvarez <[email protected]> Date: Wed Sep 18 11:04:17 2024 -0600 [ML] Serverless Security: Adds ES|QL visualizer menu item in nav (elastic#192314) ## Summary Related issue: elastic#192307 This PR add sthe ES|QL visualizer menu item to the Security solution's nav in serverless. <img width="546" alt="image" src="https://github.com/user-attachments/assets/239c25c8-63af-4009-8e37-78a99d7b6719"> <img width="1189" alt="image" src="https://github.com/user-attachments/assets/e0ac66d4-4066-4c15-8cac-ff5a5e0ae716"> ### Checklist Delete any items that are not applicable to this PR. - [ ] 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) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [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 - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] Any UI touched in this PR is usable by keyboard only (learn more about [keyboard accessibility](https://webaim.org/techniques/keyboard/)) - [ ] Any UI touched in this PR does not create any new axe failures (run axe in browser: [FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/), [Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)) - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [ ] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) --------- Co-authored-by: Elastic Machine <[email protected]> commit de51a1a Author: Sid <[email protected]> Date: Wed Sep 18 19:01:45 2024 +0200 Add debug logging for flaky session tests (elastic#193279) ## Summary Add settings to the ES Test cluster to enable debug logs so that if this test fails in the future, we will have more logs to investigate the issue. __Related:__ elastic#152260 commit 004631b Author: Tomasz Ciecierski <[email protected]> Date: Wed Sep 18 18:56:06 2024 +0200 [EDR Workflows] Automated Actions in more rule types (elastic#191874) commit 70b7d26 Author: Nikita Indik <[email protected]> Date: Wed Sep 18 18:21:00 2024 +0200 [Security Solution] ThreeWayDiff UI: Migrate to using `DiffableRule` TS type in `FieldReadOnly` component (elastic#192342) **Partially addresses: elastic#171520 **Is a follow-up PR to: elastic#191499 This is the 2nd of the 3 PRs for `FieldReadOnly`. - The 1st [PR](elastic#191499) added the `FieldReadOnly` and a bunch of field components. - This (2nd) PR moves away from using `DiffableAllFields` type in favour of `DiffableRule` and splits the large `FieldReadOnly` component into smaller ones for readability. - Next (3rd) PR will add the remaining field components. ## Summary This PR changes the TS type (`DiffableAllFields` -> `DiffableRule`) used by the `FieldReadOnly` component. This component displays a read-only view of a particular rule field, similar to how fields are shown on the Rule Details page. Using `DiffableRule` type makes the component compatible with the flyout context and is safer to use than `DiffableAllFields`. ### Changes - TS type used in the `FieldReadOnly` component and Storybook stories changed to `DiffableRule`. - `FieldReadOnly` field rendering was split into multiple files by rule type to make it more readable. - Added rule-mocking functions to Storybook to allow creation of `DiffableRule` mocks. - Added field components for `name`, `description` and `tags` fields. - Rewrote type narrowing for `Filters` component to a type guard (`isFilters`). - Fixed a couple of outdated code comments. ### Running `FinalReadOnly` and its field components are not yet integrated into the flyout, but you can view components in Storybook. 1. Run Storybook: `yarn storybook security_solution` 2. Go to `http://localhost:9001` in browser. <img width="1062" alt="Schermafbeelding 2024-09-03 om 13 05 11" src="https://github.com/user-attachments/assets/13b227d4-1321-47d9-a0a7-93868c9f4a15"> commit 02ce1b9 Author: Alejandro Fernández Haro <[email protected]> Date: Wed Sep 18 18:02:55 2024 +0200 [Feature Flags Service] Hello world 👋 (elastic#188562) Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Jean-Louis Leysens <[email protected]> commit 38d6143 Author: Elena Stoeva <[email protected]> Date: Wed Sep 18 16:45:59 2024 +0100 [Index Management] Restrict dot-prefixed index patterns in template form (elastic#193196) Closes elastic#190251 ## Summary This PR adds validation that restricts creating a template with a dot-prefixed index pattern. <img width="1194" alt="Screenshot 2024-09-18 at 10 49 47" src="https://github.com/user-attachments/assets/f24c3e29-7db0-46fc-97de-52d4654073de"> Note: I tried adding tests for this validation [here](https://github.com/elastic/kibana/blob/6a3adf73dacaeda073674ac4a10e8a2597e67739/x-pack/plugins/index_management/__jest__/client_integration/index_template_wizard/template_create.test.tsx#L163), but it didn't work because the index pattern field is mocked in the tests and errors are not triggered from invalid values. commit 78b21cd Author: Tre <[email protected]> Date: Wed Sep 18 16:31:11 2024 +0100 [Unskip] x-pack/.../summary_actions.ts (elastic#193120) ## Summary Use retryForTime instead. Test against local (fake mki) and mki; both were security projects. Tested against `x-pack/test_serverless/api_integration/test_suites/security/common_configs/config.group1.ts` Resolves: elastic#193061 --------- Co-authored-by: Elastic Machine <[email protected]> commit bfbcf62 Author: Kevin Delemme <[email protected]> Date: Wed Sep 18 11:25:42 2024 -0400 chore(rca): show full name in notes and store profile id in model (elastic#193211) commit 5bf4501 Author: Tim Sullivan <[email protected]> Date: Wed Sep 18 08:19:05 2024 -0700 [Spaces Management] Ensure current badge can only appear for single entry (elastic#193195) ## Summary Closes elastic#192811 ### Checklist Delete any items that are not applicable to this PR. - [X] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or commit e3f3c68 Author: Cauê Marcondes <[email protected]> Date: Wed Sep 18 16:06:13 2024 +0100 [Inventory][ECO] Entities table (elastic#193272) Real data: <img width="1237" alt="Screenshot 2024-09-18 at 14 23 17" src="https://github.com/user-attachments/assets/ecc496aa-1c43-4c3c-9ac8-d6e4e6cb8aad"> Storybook: <img width="1256" alt="Screenshot 2024-09-18 at 14 23 22" src="https://github.com/user-attachments/assets/03d9f940-7b3f-4aea-9221-42b1c07119d1"> Tooltips: <img width="1250" alt="Screenshot 2024-09-18 at 13 49 19" src="https://github.com/user-attachments/assets/dc99b4cc-4eba-4815-8892-8e3fe7a041bb"> - Use ESQL to fetch the top 500 entities sorted by last seen property. - Display 20 entities per page. - Sorting is handles by the server and saved on the URL - Current page is saved on the URL - Filter entities types `service`, `host` or `container` - Filter only entities from the built in definition - LIMITATION: The EuiGrid doesn't have an embedded loading state, for now, I'm switching the entire view to display a loading spinner while data is being fetched. - PLUS: Storybook created with mock data. --------- Co-authored-by: kibanamachine <[email protected]> commit 5040e35 Author: Sébastien Loix <[email protected]> Date: Wed Sep 18 15:54:13 2024 +0100 [Chrome service] Expose handler to toggle the sidenav (elastic#193192) commit 1b0aa69 Merge: 1310ae1 26a50f7 Author: Pablo Machado <[email protected]> Date: Wed Sep 18 16:06:10 2024 +0200 Merge branch 'main' into siem-ea-9180-api commit 1310ae1 Author: machadoum <[email protected]> Date: Wed Sep 18 14:54:27 2024 +0200 Fix CI commit 7eb1118 Merge: c2b1724 61d0b7f Author: Elastic Machine <[email protected]> Date: Wed Sep 18 10:33:28 2024 +0200 Merge branch 'main' into siem-ea-9180-api commit c2b1724 Author: machadoum <[email protected]> Date: Tue Sep 17 17:06:14 2024 +0200 Improve get entity index function commit a8b96d8 Author: machadoum <[email protected]> Date: Tue Sep 17 16:40:48 2024 +0200 Fix build commit 1b94ce7 Author: machadoum <[email protected]> Date: Tue Sep 17 14:47:35 2024 +0200 Add code review suggestions commit 7064282 Author: kibanamachine <[email protected]> Date: Tue Sep 17 12:38:17 2024 +0000 [CI] Auto-commit changed files from 'yarn openapi:bundle' commit ab6e773 Author: machadoum <[email protected]> Date: Tue Sep 17 13:49:10 2024 +0200 Rename User and Host records commit 4216ff3 Author: machadoum <[email protected]> Date: Tue Sep 17 13:45:24 2024 +0200 Fix API tests commit 500b631 Author: kibanamachine <[email protected]> Date: Tue Sep 17 10:17:06 2024 +0000 [CI] Auto-commit changed files from 'yarn openapi:bundle' commit 98250e9 Author: machadoum <[email protected]> Date: Tue Sep 17 11:22:28 2024 +0200 Code review improvements commit fbb7479 Author: machadoum <[email protected]> Date: Tue Sep 10 13:58:47 2024 +0200 Create list entities API add API test Add data client test

PhilippeOberti added release_note:feature Makes this part of the condensed release notes Team:Threat Hunting:Investigations Security Solution Investigations Team v8.16.0 labels Sep 13, 2024

PhilippeOberti requested a review from a team as a code owner September 13, 2024 16:37

PhilippeOberti force-pushed the expandable-flyout-resizable branch 2 times, most recently from 3fd6291 to 7c2c19a Compare September 13, 2024 19:50

PhilippeOberti requested a review from christineweng September 13, 2024 19:55

PhilippeOberti force-pushed the expandable-flyout-resizable branch from 7c2c19a to ff9eef3 Compare September 16, 2024 20:07

PhilippeOberti force-pushed the expandable-flyout-resizable branch from ff9eef3 to 3d39165 Compare September 17, 2024 21:49

PhilippeOberti added the v9.0.0 label Sep 17, 2024

PhilippeOberti force-pushed the expandable-flyout-resizable branch from 3d39165 to d4f57aa Compare September 17, 2024 22:10

christineweng approved these changes Sep 18, 2024

View reviewed changes

PhilippeOberti force-pushed the expandable-flyout-resizable branch from d4f57aa to de39ba8 Compare September 18, 2024 20:50

PhilippeOberti added 2 commits September 18, 2024 16:13

[kbn-expandable-flyout] - add support for resizable flyout

5d4829a

PR comments

bad5cc4

PhilippeOberti force-pushed the expandable-flyout-resizable branch from de39ba8 to bad5cc4 Compare September 18, 2024 21:22

PhilippeOberti merged commit bcc42d5 into elastic:main Sep 18, 2024
23 checks passed

PhilippeOberti deleted the expandable-flyout-resizable branch September 18, 2024 23:02

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Sep 18, 2024

[kbn-expandable-flyout] - add support for resizable flyout (elastic#1…

b641567

…92906) (cherry picked from commit bcc42d5)

kibanamachine mentioned this pull request Sep 18, 2024

[8.x] [kbn-expandable-flyout] - add support for resizable flyout (#192906) #193371

Merged

nastasha-solomon mentioned this pull request Oct 4, 2024

[Request] [Serverless][8.16] Push and overlay display options added to flyout elastic/security-docs#5885

Closed

PhilippeOberti mentioned this pull request Oct 30, 2024

[Security Solution] [UX feature request] Make Event/Alert Details View resizable for Table view/JSON view #179254

Closed

PhilippeOberti mentioned this pull request Jan 10, 2025

[Expandable Flyout] - customize default right, left and preview widths for push mode #206155

Draft

2 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[kbn-expandable-flyout] - add support for resizable flyout #192906

[kbn-expandable-flyout] - add support for resizable flyout #192906

PhilippeOberti commented Sep 13, 2024 •

edited by kibanamachine

Loading

elasticmachine commented Sep 13, 2024

christineweng left a comment

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

christineweng Sep 18, 2024

PhilippeOberti Sep 18, 2024

PhilippeOberti commented Sep 18, 2024

kibana-ci commented Sep 18, 2024

API count

kibanamachine commented Sep 18, 2024

[kbn-expandable-flyout] - add support for resizable flyout #192906

[kbn-expandable-flyout] - add support for resizable flyout #192906

Conversation

PhilippeOberti commented Sep 13, 2024 • edited by kibanamachine Loading

Summary

Users can change the collapsed, expanded and left and right sections widths (values are persisted through page refresh)

Users can reset all the saved widths

Resizing works both in overlay and push modes

Checklist

TODO

elasticmachine commented Sep 13, 2024

christineweng left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

PhilippeOberti commented Sep 18, 2024

kibana-ci commented Sep 18, 2024

💚 Build Succeeded

Metrics [docs]

Module Count

Async chunks

API count

History

kibanamachine commented Sep 18, 2024

💚 All backports created successfully

Questions ?

PhilippeOberti commented Sep 13, 2024 •

edited by kibanamachine

Loading