Skip to content

[Discover] Tab scoped retainable flyout #246612

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
akowalska622 merged 27 commits into from
Jan 14, 2026
Merged

[Discover] Tab scoped retainable flyout #246612

akowalska622 merged 27 commits into from
Jan 14, 2026

Conversation

@akowalska622
Copy link
Contributor

@akowalska622 akowalska622 commented Dec 16, 2025 •
edited
Loading

Summary

A-la-carte: https://akowalska622-pr-246612-retainable-flyout-poc.kbndev.co/

This pull request refactors how the expanded document state and the selected tab in the document viewer are managed in Discover. The main improvement is that these states are now tracked per tab, rather than globally, which leads to more predictable and isolated behavior when working with multiple tabs. Additionally, the document viewer now provides an onUpdateSelectedTabId callback to notify parent components of tab changes, and the state is synchronized with localStorage and Redux accordingly.

Visuals

The flyout open state should be scoped to the tab and remain intact while switching tabs.
Example: user has 2 or more tabs open. They open a flyout in tab A, then switch to tab B and come back to tab A. The flyout in tab A should remain open.

Image

Moreover, the tab selected within the doc viewer (e.g. Table or JSON — not to be confused with the Discover tab itself) should also be scoped to the Discover tab.
Example: user has 2 or more tabs open. They open a flyout in tab A with the Table doc viewer tab selected. They then switch to tab B, open a flyout, and select the JSON doc viewer tab. When switching between tab A and tab B, the doc viewer tab selection should remain scoped to each respective tab.

Image

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
  • 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.

Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging.

@akowalska622 akowalska622 self-assigned this Dec 16, 2025
davismcphee
davismcphee reviewed Dec 17, 2025
View reviewed changes
Copy link
Contributor

@davismcphee davismcphee left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like the right direction to me!

In fact, if we can get it to a point where the doc viewer remains open when switching back to a Discover tab and defaults to the last doc viewer tab, that's probably enough for an initial PR. Then we could tackle the full state restoration piece as a followup since it'll be more complicated.

To default to the last doc viewer tab when switching Discover tabs, we may have to set initialDocViewerTabId when switching tabs or similar. Otherwise it may just default to the last doc viewer tab from local storage.

@akowalska622
Copy link
Contributor Author

akowalska622 commented Dec 17, 2025

@davismcphee thanks for the review! I've addressed code comments and I'll work on doc viewer tab now

@akowalska622 akowalska622 linked an issue Jan 8, 2026 that may be closed by this pull request
[Discover] Keep flyout open when switching tabs #248229
Closed
4 tasks
@akowalska622 akowalska622 mentioned this pull request Jan 8, 2026
Closed
4 tasks
@akowalska622 akowalska622 changed the title [POC] Tab scoped retainable flyout Tab scoped retainable flyout Jan 9, 2026
@akowalska622 akowalska622 changed the title Tab scoped retainable flyout [Discover] Tab scoped retainable flyout Jan 9, 2026
@akowalska622 akowalska622 added release_note:enhancement Feature:Discover Discover Application backport:skip This PR does not require backporting Team:DataDiscovery Discover, search (data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. t// Project:OneDiscover Enrich Discover with contextual awareness Feature:DiscoverTabs Tabs feature within Discover labels Jan 9, 2026
@akowalska622
Copy link
Contributor Author

akowalska622 commented Jan 9, 2026

/ci

@akowalska622 akowalska622 marked this pull request as ready for review January 9, 2026 16:33
@akowalska622 akowalska622 requested a review from a team as a code owner January 9, 2026 16:33
@elasticmachine
Copy link
Contributor

elasticmachine commented Jan 9, 2026

Pinging @elastic/kibana-data-discovery (Team:DataDiscovery)

@kibanamachine
Copy link
Contributor

kibanamachine commented Jan 9, 2026

Flaky Test Runner Stats

🎉 All tests passed! - kibana-flaky-test-suite-runner#10383

[✅] src/platform/test/functional/apps/discover/tabs/config.ts: 75/75 tests passed.

see run history

@akowalska622 akowalska622 requested review from Copilot and removed request for davismcphee January 9, 2026 20:02
Copilot AI reviewed Jan 9, 2026
View reviewed changes
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This pull request refactors the expanded document state management in Discover to be tab-scoped rather than global. The main purpose is to maintain separate document viewer states (including flyout open state and selected doc viewer tab) for each Discover tab, allowing users to switch between tabs without losing their document viewer context.

Changes:

  • Moved expandedDoc and initialDocViewerTabId from global state to per-tab state in Redux store
  • Added onUpdateSelectedTabId callback to document viewer components to track selected doc viewer tabs
  • Updated all dispatches of setExpandedDoc to include tabId parameter for tab-scoped state management

Reviewed changes

Copilot reviewed 17 out of 17 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/platform/plugins/shared/discover/public/application/main/state_management/redux/types.ts Moved expandedDoc and initialDocViewerTabId from global DiscoverInternalState to per-tab TabState
src/platform/plugins/shared/discover/public/application/main/state_management/redux/internal_state.ts Changed setExpandedDoc to use TabAction and removed discardFlyoutsOnTabChange from slice actions
src/platform/plugins/shared/discover/public/application/main/state_management/redux/constants.ts Added expandedDoc: undefined to default tab state
src/platform/plugins/shared/discover/public/application/main/state_management/redux/actions/tabs.ts Updated to use new discardFlyoutsOnTabChange action creator
src/platform/plugins/shared/discover/public/application/main/state_management/redux/actions/data_views.ts Updated setExpandedDoc dispatch to include tabId parameter
src/platform/plugins/shared/discover/public/application/main/state_management/utils/change_data_view.ts Updated to access expandedDoc from current tab instead of global state
src/platform/plugins/shared/discover/public/application/main/hooks/use_inspector.ts Updated setExpandedDoc dispatches to include currentTabId parameter
src/platform/plugins/shared/discover/public/application/main/components/layout/discover_documents.tsx Added tab selection tracking with useUnmount hook and updated to use tab-scoped state selectors
src/platform/plugins/shared/discover/public/components/discover_grid_flyout/discover_grid_flyout.tsx Added onUpdateSelectedTabId prop to component interface
src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_flyout/doc_viewer_flyout.tsx Added onUpdateSelectedTabId prop and passed it through to doc viewer
src/platform/packages/shared/kbn-unified-doc-viewer/src/services/types.ts Added onUpdateSelectedTabId callback to DocViewRenderProps interface
src/platform/packages/shared/kbn-unified-doc-viewer/src/components/doc_viewer/doc_viewer.tsx Implemented onUpdateSelectedTabId callback invocation and updated tab key generation
src/platform/plugins/shared/discover/public/application/main/state_management/redux/internal_state.test.ts Added comprehensive unit tests for tab-scoped expanded doc state management
src/platform/plugins/shared/discover/public/application/main/hooks/use_inspector.test.tsx Updated test to work with tab-scoped state
src/platform/plugins/shared/discover/public/application/main/state_management/redux/tab_mapping_utils.test.ts Updated test snapshots to include new expandedDoc field
src/platform/packages/shared/kbn-unified-doc-viewer/src/components/doc_viewer/doc_viewer.test.tsx Added tests for initialTabId priority and onUpdateSelectedTabId callback
src/platform/test/functional/apps/discover/tabs/_on_tab_change.ts Updated functional test to verify tab-scoped flyout state retention

@akowalska622
remove reduntant change from poc
c615e5a 
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
davismcphee
davismcphee reviewed Jan 10, 2026
View reviewed changes
Copy link
Contributor

@davismcphee davismcphee left a comment •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code changes look good and it worked well when testing! Left a bit of minor feedback, but otherwise this looks good on my end.

@elasticmachine
Copy link
Contributor

elasticmachine commented Jan 14, 2026

💔 Build Failed

Failed CI Steps

Test Failures

  • [job] [logs] FTR Configs #79 / discover/esql discover esql controls when adding an ES|QL panel with controls in dashboards and exploring it in discover should retain the controls and their state
  • [job] [logs] FTR Configs #48 / Endpoint plugin @ess @serverless @skipInServerlessMKI test metadata apis list endpoints GET route "before all" hook for "should return one entry for each host with default paging"

Metrics [docs]

‼️ ERROR: no builds found for mergeBase sha [1cc6859]

History

cc @akowalska622

davismcphee
davismcphee approved these changes Jan 14, 2026
View reviewed changes
Copy link
Contributor

@davismcphee davismcphee left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the updates, LGTM!

@akowalska622 akowalska622 merged commit 833b458 into elastic:main Jan 14, 2026
13 checks passed
smith pushed a commit to smith/kibana that referenced this pull request Jan 16, 2026
@akowalska622
@davismcphee @smith
[Discover] Tab scoped retainable flyout (elastic#246612)
88da52c 
## Summary
A-la-carte:
https://akowalska622-pr-246612-retainable-flyout-poc.kbndev.co/

This pull request refactors how the expanded document state and the
selected tab in the document viewer are managed in Discover. The main
improvement is that these states are now tracked per tab, rather than
globally, which leads to more predictable and isolated behavior when
working with multiple tabs. Additionally, the document viewer now
provides an `onUpdateSelectedTabId` callback to notify parent components
of tab changes, and the state is synchronized with localStorage and
Redux accordingly.

### Visuals
The flyout open state should be scoped to the tab and remain intact
while switching tabs.
Example: user has 2 or more tabs open. They open a flyout in tab A, then
switch to tab B and come back to tab A. The flyout in tab A should
remain open.


![Image](https://github.com/user-attachments/assets/d799e050-fb62-4f00-bb6c-2c9461223cd8)

Moreover, the tab selected within the doc viewer (e.g. `Table` or `JSON`
— not to be confused with the Discover tab itself) should also be scoped
to the Discover tab.
Example: user has 2 or more tabs open. They open a flyout in tab A with
the Table doc viewer tab selected. They then switch to tab B, open a
flyout, and select the `JSON `doc viewer tab. When switching between tab
A and tab B, the doc viewer tab selection should remain scoped to each
respective tab.


![Image](https://github.com/user-attachments/assets/e73ad5cf-1d23-4405-9cfb-358d93eac38a)


### 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
- [ ] [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.

Describe the risk, its severity, and mitigation for each identified
risk. Invite stakeholders and evaluate how to proceed before merging.

- [ ] [See some risk
examples](https://github.com/elastic/kibana/blob/main/RISK_MATRIX.mdx)
- [ ] ...

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Davis McPhee <davis.mcphee@elastic.co>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments

@davismcphee davismcphee davismcphee approved these changes

Assignees

@akowalska622 akowalska622

Labels

backport:skip This PR does not require backporting Feature:Discover Discover Application Feature:DiscoverTabs Tabs feature within Discover Project:OneDiscover Enrich Discover with contextual awareness release_note:enhancement Team:DataDiscovery Discover, search (data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. t// v9.4.0

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Discover] Keep flyout open when switching tabs

4 participants

@akowalska622 @elasticmachine @kibanamachine @davismcphee