Skip to content
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

[ML] Anomaly explorer: Enhancements for embeddables with groups selected #198824

Closed
rbrtj opened this issue Nov 4, 2024 · 2 comments
Closed

[ML] Anomaly explorer: Enhancements for embeddables with groups selected #198824

rbrtj opened this issue Nov 4, 2024 · 2 comments
Assignees
@rbrtj
Labels
bug Fixes for quality problems that affect the customer experience Feature:Anomaly Detection ML anomaly detection :ml v8.18.0

Comments

@rbrtj
Copy link
Contributor

rbrtj commented Nov 4, 2024 •
edited by peteharverson
Loading

There are a few enhancements / bug fixes needed for anomaly detection embeddable with groups selected.

  1. When adding an embeddable as a job group from Anomaly Explorer, jobIds are passed, the resulting embeddable receives jobIds for the selected groups. When creating an embeddable within Dashboards, groupIds are passed correctly.
    Proposed solution: Pass groupIds instead of jobIds when creating an embeddable in Anomaly Explorer.
Screen.Recording.2024-11-04.at.17.39.30.mov
  1. When selecting a group in the initial flyout of Anomaly Explorer, each jobId is shown instead of the groupId.
    Proposed solution: Ensure consistent behavior for group selection in both the initial and next flyouts.
Screen.Recording.2024-11-04.at.17.41.58.mov
  1. When navigating to Anomaly Explorer from a dashboard embeddable with a group selected, the "badge" inside Anomaly Explorer is not displayed properly.
Screen.Recording.2024-11-04.at.17.45.48.mov
@rbrtj rbrtj added :ml bug Fixes for quality problems that affect the customer experience Feature:Anomaly Detection ML anomaly detection v8.17.0 labels Nov 4, 2024
@elasticmachine
Copy link
Contributor

Pinging @elastic/ml-ui (:ml)

@rbrtj rbrtj changed the title [ML] Anomaly detection: Enhancements for embeddables with groups selected [ML] Anomaly explorer: Enhancements for embeddables with groups selected Nov 4, 2024
@rbrtj rbrtj added v8.18.0 and removed v8.17.0 labels Nov 19, 2024
@rbrtj rbrtj mentioned this issue Dec 9, 2024
Merged
rbrtj added a commit that referenced this issue Dec 16, 2024
@rbrtj @kibanamachine
[ML] Anomaly Explorer: Enhancements for Embeddables with Selected Gro…
ea85f05 
…ups & Explorer Refactor (#203224)

## Summary

Fixes issues around handling groupIds in Anomaly Explorer:
[#198824](#198824)

* `UrlStateService` is now more generic, allowing for the creation of
`useGlobalUrlState` and `usePageUrlState` hooks based on it.
* New `useGlobalUrlState` hook: Responsible for managing global state
with proper typing.
* `id_badges.js` converted to typescript -> `id_badges.tsx` 
* The use of `maps` in the `id_badges`, `job_selector` and
`job_selector_flyout` components has been removed. Now, selected group
and job ids are passed directly.
* Instead of manually setting the global state in `job_selector`, an
`onSelectionChange` callback is now expected. In the future, the
`Timeseries explorer` and `Anomaly Explorer` are expected to use a
(maybe) shared context to track selected jobs easily, eliminating the
need to manually update the global state for the `Timeseries explorer`.
* The `AnomalyExplorerCommonStateService` now listens for URL changes to
track properties derived from the URL. This replaces the `useUrlState`
hook, which lacked proper typing, and serves as the single source of
truth for selected jobs and groups.
* The `ExplorerDashboardService`, previously a hybrid of a "service" and
redux-like action handler, has been removed. The state is now managed
within `state_manager` component. In the future, data like `chartsData`
and `influencers` should be decoupled from `ExplorerState` and moved to
individual services.

1. Fix for all issues mentioned in #198824 as visible in the video:
- The initial group selection now results in the correct badge being
displayed.
- Creating an embeddable with a selected group properly propagates the
selected group instead of individual job ids.
- Navigating to the Anomaly Explorer from Dashboards now correctly uses
the selected group instead of individual job ids.


https://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6

---------

Co-authored-by: kibanamachine <[email protected]>
kibanamachine pushed a commit to kibanamachine/kibana that referenced this issue Dec 16, 2024
@rbrtj
[ML] Anomaly Explorer: Enhancements for Embeddables with Selected Gro…
94a8298 
…ups & Explorer Refactor (elastic#203224)

## Summary

Fixes issues around handling groupIds in Anomaly Explorer:
[elastic#198824](elastic#198824)

* `UrlStateService` is now more generic, allowing for the creation of
`useGlobalUrlState` and `usePageUrlState` hooks based on it.
* New `useGlobalUrlState` hook: Responsible for managing global state
with proper typing.
* `id_badges.js` converted to typescript -> `id_badges.tsx`
* The use of `maps` in the `id_badges`, `job_selector` and
`job_selector_flyout` components has been removed. Now, selected group
and job ids are passed directly.
* Instead of manually setting the global state in `job_selector`, an
`onSelectionChange` callback is now expected. In the future, the
`Timeseries explorer` and `Anomaly Explorer` are expected to use a
(maybe) shared context to track selected jobs easily, eliminating the
need to manually update the global state for the `Timeseries explorer`.
* The `AnomalyExplorerCommonStateService` now listens for URL changes to
track properties derived from the URL. This replaces the `useUrlState`
hook, which lacked proper typing, and serves as the single source of
truth for selected jobs and groups.
* The `ExplorerDashboardService`, previously a hybrid of a "service" and
redux-like action handler, has been removed. The state is now managed
within `state_manager` component. In the future, data like `chartsData`
and `influencers` should be decoupled from `ExplorerState` and moved to
individual services.

1. Fix for all issues mentioned in elastic#198824 as visible in the video:
- The initial group selection now results in the correct badge being
displayed.
- Creating an embeddable with a selected group properly propagates the
selected group instead of individual job ids.
- Navigating to the Anomaly Explorer from Dashboards now correctly uses
the selected group instead of individual job ids.

https://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6

---------

Co-authored-by: kibanamachine <[email protected]>
(cherry picked from commit ea85f05)
@peteharverson
Copy link
Contributor

Closing, addressed for 8.18 by #203224.

kibanamachine added a commit that referenced this issue Dec 16, 2024
@kibanamachine @rbrtj
[8.x] [ML] Anomaly Explorer: Enhancements for Embeddables with Select…
f06217c 
…ed Groups &amp; Explorer Refactor (#203224) (#204361)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[ML] Anomaly Explorer: Enhancements for Embeddables with Selected
Groups &amp; Explorer Refactor
(#203224)](#203224)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Robert
Jaszczurek","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-12-16T10:50:38Z","message":"[ML]
Anomaly Explorer: Enhancements for Embeddables with Selected Groups &
Explorer Refactor (#203224)\n\n## Summary\n\nFixes issues around
handling groupIds in Anomaly
Explorer:\n[#198824](https://github.com/elastic/kibana/issues/198824)\n\n*
`UrlStateService` is now more generic, allowing for the creation
of\n`useGlobalUrlState` and `usePageUrlState` hooks based on it.\n* New
`useGlobalUrlState` hook: Responsible for managing global state\nwith
proper typing.\n* `id_badges.js` converted to typescript ->
`id_badges.tsx` \n* The use of `maps` in the `id_badges`, `job_selector`
and\n`job_selector_flyout` components has been removed. Now, selected
group\nand job ids are passed directly.\n* Instead of manually setting
the global state in `job_selector`, an\n`onSelectionChange` callback is
now expected. In the future, the\n`Timeseries explorer` and `Anomaly
Explorer` are expected to use a\n(maybe) shared context to track
selected jobs easily, eliminating the\nneed to manually update the
global state for the `Timeseries explorer`.\n* The
`AnomalyExplorerCommonStateService` now listens for URL changes
to\ntrack properties derived from the URL. This replaces the
`useUrlState`\nhook, which lacked proper typing, and serves as the
single source of\ntruth for selected jobs and groups.\n* The
`ExplorerDashboardService`, previously a hybrid of a \"service\"
and\nredux-like action handler, has been removed. The state is now
managed\nwithin `state_manager` component. In the future, data like
`chartsData`\nand `influencers` should be decoupled from `ExplorerState`
and moved to\nindividual services.\n\n1. Fix for all issues mentioned in
#198824 as visible in the video:\n- The initial group selection now
results in the correct badge being\ndisplayed.\n- Creating an embeddable
with a selected group properly propagates the\nselected group instead of
individual job ids.\n- Navigating to the Anomaly Explorer from
Dashboards now correctly uses\nthe selected group instead of individual
job
ids.\n\n\nhttps://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6\n\n---------\n\nCo-authored-by:
kibanamachine
<[email protected]>","sha":"ea85f0551cea68b6aec8f1382fb859633c159e00","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["bug","release_note:fix",":ml","Feature:Anomaly
Detection","v9.0.0","Team:ML","backport:version","v8.18.0"],"title":"[ML]
Anomaly Explorer: Enhancements for Embeddables with Selected Groups &
Explorer
Refactor","number":203224,"url":"https://github.com/elastic/kibana/pull/203224","mergeCommit":{"message":"[ML]
Anomaly Explorer: Enhancements for Embeddables with Selected Groups &
Explorer Refactor (#203224)\n\n## Summary\n\nFixes issues around
handling groupIds in Anomaly
Explorer:\n[#198824](https://github.com/elastic/kibana/issues/198824)\n\n*
`UrlStateService` is now more generic, allowing for the creation
of\n`useGlobalUrlState` and `usePageUrlState` hooks based on it.\n* New
`useGlobalUrlState` hook: Responsible for managing global state\nwith
proper typing.\n* `id_badges.js` converted to typescript ->
`id_badges.tsx` \n* The use of `maps` in the `id_badges`, `job_selector`
and\n`job_selector_flyout` components has been removed. Now, selected
group\nand job ids are passed directly.\n* Instead of manually setting
the global state in `job_selector`, an\n`onSelectionChange` callback is
now expected. In the future, the\n`Timeseries explorer` and `Anomaly
Explorer` are expected to use a\n(maybe) shared context to track
selected jobs easily, eliminating the\nneed to manually update the
global state for the `Timeseries explorer`.\n* The
`AnomalyExplorerCommonStateService` now listens for URL changes
to\ntrack properties derived from the URL. This replaces the
`useUrlState`\nhook, which lacked proper typing, and serves as the
single source of\ntruth for selected jobs and groups.\n* The
`ExplorerDashboardService`, previously a hybrid of a \"service\"
and\nredux-like action handler, has been removed. The state is now
managed\nwithin `state_manager` component. In the future, data like
`chartsData`\nand `influencers` should be decoupled from `ExplorerState`
and moved to\nindividual services.\n\n1. Fix for all issues mentioned in
#198824 as visible in the video:\n- The initial group selection now
results in the correct badge being\ndisplayed.\n- Creating an embeddable
with a selected group properly propagates the\nselected group instead of
individual job ids.\n- Navigating to the Anomaly Explorer from
Dashboards now correctly uses\nthe selected group instead of individual
job
ids.\n\n\nhttps://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6\n\n---------\n\nCo-authored-by:
kibanamachine
<[email protected]>","sha":"ea85f0551cea68b6aec8f1382fb859633c159e00"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/203224","number":203224,"mergeCommit":{"message":"[ML]
Anomaly Explorer: Enhancements for Embeddables with Selected Groups &
Explorer Refactor (#203224)\n\n## Summary\n\nFixes issues around
handling groupIds in Anomaly
Explorer:\n[#198824](https://github.com/elastic/kibana/issues/198824)\n\n*
`UrlStateService` is now more generic, allowing for the creation
of\n`useGlobalUrlState` and `usePageUrlState` hooks based on it.\n* New
`useGlobalUrlState` hook: Responsible for managing global state\nwith
proper typing.\n* `id_badges.js` converted to typescript ->
`id_badges.tsx` \n* The use of `maps` in the `id_badges`, `job_selector`
and\n`job_selector_flyout` components has been removed. Now, selected
group\nand job ids are passed directly.\n* Instead of manually setting
the global state in `job_selector`, an\n`onSelectionChange` callback is
now expected. In the future, the\n`Timeseries explorer` and `Anomaly
Explorer` are expected to use a\n(maybe) shared context to track
selected jobs easily, eliminating the\nneed to manually update the
global state for the `Timeseries explorer`.\n* The
`AnomalyExplorerCommonStateService` now listens for URL changes
to\ntrack properties derived from the URL. This replaces the
`useUrlState`\nhook, which lacked proper typing, and serves as the
single source of\ntruth for selected jobs and groups.\n* The
`ExplorerDashboardService`, previously a hybrid of a \"service\"
and\nredux-like action handler, has been removed. The state is now
managed\nwithin `state_manager` component. In the future, data like
`chartsData`\nand `influencers` should be decoupled from `ExplorerState`
and moved to\nindividual services.\n\n1. Fix for all issues mentioned in
#198824 as visible in the video:\n- The initial group selection now
results in the correct badge being\ndisplayed.\n- Creating an embeddable
with a selected group properly propagates the\nselected group instead of
individual job ids.\n- Navigating to the Anomaly Explorer from
Dashboards now correctly uses\nthe selected group instead of individual
job
ids.\n\n\nhttps://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6\n\n---------\n\nCo-authored-by:
kibanamachine
<[email protected]>","sha":"ea85f0551cea68b6aec8f1382fb859633c159e00"}},{"branch":"8.x","label":"v8.18.0","branchLabelMappingKey":"^v8.18.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Robert Jaszczurek <[email protected]>
JoseLuisGJ pushed a commit to JoseLuisGJ/kibana that referenced this issue Dec 19, 2024
@rbrtj @kibanamachine @JoseLuisGJ
[ML] Anomaly Explorer: Enhancements for Embeddables with Selected Gro…
d8a7353 
…ups & Explorer Refactor (elastic#203224)

## Summary

Fixes issues around handling groupIds in Anomaly Explorer:
[elastic#198824](elastic#198824)

* `UrlStateService` is now more generic, allowing for the creation of
`useGlobalUrlState` and `usePageUrlState` hooks based on it.
* New `useGlobalUrlState` hook: Responsible for managing global state
with proper typing.
* `id_badges.js` converted to typescript -> `id_badges.tsx` 
* The use of `maps` in the `id_badges`, `job_selector` and
`job_selector_flyout` components has been removed. Now, selected group
and job ids are passed directly.
* Instead of manually setting the global state in `job_selector`, an
`onSelectionChange` callback is now expected. In the future, the
`Timeseries explorer` and `Anomaly Explorer` are expected to use a
(maybe) shared context to track selected jobs easily, eliminating the
need to manually update the global state for the `Timeseries explorer`.
* The `AnomalyExplorerCommonStateService` now listens for URL changes to
track properties derived from the URL. This replaces the `useUrlState`
hook, which lacked proper typing, and serves as the single source of
truth for selected jobs and groups.
* The `ExplorerDashboardService`, previously a hybrid of a "service" and
redux-like action handler, has been removed. The state is now managed
within `state_manager` component. In the future, data like `chartsData`
and `influencers` should be decoupled from `ExplorerState` and moved to
individual services.

1. Fix for all issues mentioned in elastic#198824 as visible in the video:
- The initial group selection now results in the correct badge being
displayed.
- Creating an embeddable with a selected group properly propagates the
selected group instead of individual job ids.
- Navigating to the Anomaly Explorer from Dashboards now correctly uses
the selected group instead of individual job ids.


https://github.com/user-attachments/assets/82c641e0-d930-42eb-8627-fad4bdc417f6

---------

Co-authored-by: kibanamachine <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@rbrtj rbrtj

Labels
bug Fixes for quality problems that affect the customer experience Feature:Anomaly Detection ML anomaly detection :ml v8.18.0
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@peteharverson @elasticmachine @rbrtj