[Core System Flyout Service] Subscribe to CLOSE_SESSION events for cascade close by tsullivan · Pull Request #251146 · elastic/kibana

tsullivan · 2026-01-30T23:39:35Z

Summary

Depends on elastic/eui#9347
Closes: https://github.com/elastic/kibana-team/issues/2725

This PR updates Kibana’s SystemFlyoutService to listen to the EUI flyout manager’s CLOSE_SESSION events and close imperative flyout roots when their session is removed. This makes cascade-close work for openSystemFlyout() flows that render in separate React roots. The flyout system example is adjusted to stop manually closing child refs so it reflects system behavior.

Key changes

Subscribe to getFlyoutManagerStore().subscribeToEvents and close matching flyouts on CLOSE_SESSION.
Make SystemFlyoutRef.isClosed a getter backed by a private flag.
Remove manual child close from the flyout system example.

Notes

Depends on EUI export of subscribeToEvents and CLOSE_SESSION events (see EUI PR [Flyout System] export flyout manager store for read-only subscription eui#9347).

Testing

Run Kibana from source locally with example plugins
```
yarn start --run-examples
```
Navigate to http://localhost:5601/app/flyoutSystemExamples
Make sure the child flyout is automatically closed when testing the Session X flyout, as shown in the following screen recording.

overlays-service-child-flyout-close-automatically.mov

Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

~~[ ] Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support~~
~~[ ] Documentation was added for features that require explanation or tutorials~~
Unit or functional tests were updated or added to match the most common scenarios
~~[ ] 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 was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The release_note:breaking label should be applied in these situations.
~~[ ] Flaky Test Runner was used on any tests changed~~
~~[ ] The PR description includes the appropriate Release Notes section, and the correct release_note:* label is applied per the guidelines~~
~~[ ] Review the backport guidelines and apply applicable backport:* labels.~~

Identify risks

Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss.

None

tsullivan · 2026-02-04T05:45:50Z

examples/flyout_system/public/components/app.tsx


 import React from 'react';

-import { EuiCode, EuiPageTemplate, EuiText, type EuiPageTemplateProps } from '@elastic/eui';


example plugin has been updated to demo a cascading-close bug

tsullivan · 2026-02-11T21:19:25Z

Unblocked by #252315

tsullivan · 2026-02-12T18:54:56Z

src/core/packages/overlays/browser-internal/src/flyout/system_flyout_ref.ts

  constructor(container: HTMLElement) {
    this.container = container;
-    this.onClose = this.closeSubject.toPromise();
+    this.onClose = firstValueFrom(this.closeSubject);


The firstValueFrom is an unrelated deprecated code cleanup

nit: if you want to avoid errors thrown if closeSubject closes the observable before emitting, you can specify a fallback value as a 2nd parameter to firstValueFrom.

afharo · 2026-02-13T16:53:21Z

src/core/packages/overlays/browser-internal/src/flyout/system_flyout_ref.ts

  constructor(container: HTMLElement) {
    this.container = container;
-    this.onClose = this.closeSubject.toPromise();
+    this.onClose = firstValueFrom(this.closeSubject);


nit: if you want to avoid errors thrown if closeSubject closes the observable before emitting, you can specify a fallback value as a 2nd parameter to firstValueFrom.

akowalska622 · 2026-02-18T09:14:52Z

Hey @tsullivan, is there anything blocking the merge?

elasticmachine · 2026-02-18T19:34:42Z

💔 Build Failed

Buildkite Build
Commit: d78fdee

Failed CI Steps

Test Failures

[job] [logs] Serverless Investigations - Security Solution Cypress Tests #7 / Row renderers Selected renderer can be disabled and enabled Selected renderer can be disabled and enabled

Metrics [docs]

Page load bundle

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

id	before	after	diff
`core`	504.3KB	504.6KB	+330.0B

History

💔 Build #397143 failed 6da7eee
💔 Build #396994 failed 2fce48a
💚 Build #394179 succeeded ee0a7c7

…scade close (elastic#251146) ## Summary Depends on elastic/eui#9347 Closes: elastic/kibana-team#2725 This PR updates Kibana’s `SystemFlyoutService` to listen to the EUI flyout manager’s `CLOSE_SESSION` events and close imperative flyout roots when their session is removed. This makes cascade-close work for `openSystemFlyout()` flows that render in separate React roots. The flyout system example is adjusted to stop manually closing child refs so it reflects system behavior. **Key changes** - Subscribe to `getFlyoutManagerStore().subscribeToEvents` and close matching flyouts on `CLOSE_SESSION`. - Make `SystemFlyoutRef.isClosed` a getter backed by a private flag. - Remove manual child close from the flyout system example. **Notes** - Depends on EUI export of `subscribeToEvents` and `CLOSE_SESSION` events (see EUI PR elastic/eui#9347). ### Testing 1. Run Kibana from source locally with example plugins ``` yarn start --run-examples ``` 2. Navigate to `http://localhost:5601/app/flyoutSystemExamples` 3. Make sure the child flyout is automatically closed when testing the `Session X` flyout, as shown in the following screen recording. https://github.com/user-attachments/assets/d645b9a0-1ad7-45e2-8966-35da03b0c341 ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - ~~[ ] 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/src/platform/packages/shared/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~~ - [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 - ~~[ ] 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 was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The `release_note:breaking` label should be applied in these situations.~~ - ~~[ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed~~ - ~~[ ] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)~~ - ~~[ ] Review the [backport guidelines](https://docs.google.com/document/d/1VyN5k91e5OVumlc0Gb9RPa3h1ewuPE705nRtioPiTvY/edit?usp=sharing) and apply applicable `backport:*` labels.~~ ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. None

tsullivan mentioned this pull request Jan 30, 2026

[Flyout System] export flyout manager store for read-only subscription elastic/eui#9347

Merged

2 tasks

tsullivan commented Feb 4, 2026

View reviewed changes

tsullivan force-pushed the eui-flyout/test-flyout-state-update branch from 4b85f14 to dfc2527 Compare February 5, 2026 22:10

tsullivan changed the title ~~[Core System Flyout] subscribe to EUI flyout manager store for cleanup~~ [Core System Flyout] subscribe to EUI flyout manager store auto-closing imperatively opened child flyouts Feb 5, 2026

tsullivan force-pushed the eui-flyout/test-flyout-state-update branch from dfc2527 to d0c3a9f Compare February 5, 2026 22:58

tsullivan changed the title ~~[Core System Flyout] subscribe to EUI flyout manager store auto-closing imperatively opened child flyouts~~ [Core System Flyout Service] Subscribe to CLOSE_SESSION events for cascade close Feb 5, 2026

tsullivan added 3 commits February 12, 2026 11:35

undo workaround for orphaned bug in flyout system examples

b37c33f

subscribe to CLOSE_SESSION from flyout manager store

d208cc3

add unit test

ee0a7c7

tsullivan force-pushed the eui-flyout/test-flyout-state-update branch from 5c5d7cc to ee0a7c7 Compare February 12, 2026 18:48

tsullivan marked this pull request as ready for review February 12, 2026 18:49

tsullivan requested review from a team as code owners February 12, 2026 18:49

tsullivan commented Feb 12, 2026

View reviewed changes

afharo approved these changes Feb 13, 2026

View reviewed changes

Dosant approved these changes Feb 16, 2026

View reviewed changes

tsullivan added release_note:skip Skip the PR/issue when compiling release notes backport:skip This PR does not require backporting labels Feb 18, 2026

Merge branch 'main' into eui-flyout/test-flyout-state-update

2fce48a

tsullivan enabled auto-merge (squash) February 18, 2026 14:33

tsullivan disabled auto-merge February 18, 2026 14:35

tsullivan added 2 commits February 18, 2026 09:12

Merge branch 'main' into eui-flyout/test-flyout-state-update

6da7eee

Merge branch 'main' into eui-flyout/test-flyout-state-update

d78fdee

tsullivan enabled auto-merge (squash) February 18, 2026 18:14

Merge branch 'main' into eui-flyout/test-flyout-state-update

3eb7616

tsullivan merged commit 4329dff into elastic:main Feb 18, 2026
17 checks passed

kibanamachine added the v9.4.0 label Feb 18, 2026

tsullivan deleted the eui-flyout/test-flyout-state-update branch February 19, 2026 03:56

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Core System Flyout Service] Subscribe to CLOSE_SESSION events for cascade close#251146

[Core System Flyout Service] Subscribe to CLOSE_SESSION events for cascade close#251146
tsullivan merged 7 commits intoelastic:mainfrom
tsullivan:eui-flyout/test-flyout-state-update

tsullivan commented Jan 30, 2026 •

edited

Loading

Uh oh!

tsullivan Feb 4, 2026

Uh oh!

tsullivan commented Feb 11, 2026

Uh oh!

tsullivan Feb 12, 2026

Uh oh!

afharo Feb 13, 2026

Uh oh!

afharo Feb 13, 2026

Uh oh!

akowalska622 commented Feb 18, 2026

Uh oh!

elasticmachine commented Feb 18, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants


		import React from 'react';

		import { EuiCode, EuiPageTemplate, EuiText, type EuiPageTemplateProps } from '@elastic/eui';

Conversation

tsullivan commented Jan 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Testing

Checklist

Identify risks

Uh oh!

tsullivan Feb 4, 2026

Choose a reason for hiding this comment

Uh oh!

tsullivan commented Feb 11, 2026

Uh oh!

tsullivan Feb 12, 2026

Choose a reason for hiding this comment

Uh oh!

afharo Feb 13, 2026

Choose a reason for hiding this comment

Uh oh!

afharo Feb 13, 2026

Choose a reason for hiding this comment

Uh oh!

akowalska622 commented Feb 18, 2026

Uh oh!

elasticmachine commented Feb 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

💔 Build Failed

Failed CI Steps

Test Failures

Metrics [docs]

Page load bundle

History

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

tsullivan commented Jan 30, 2026 •

edited

Loading

elasticmachine commented Feb 18, 2026 •

edited

Loading