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.

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

[ResponseOps][Grouping] Empty state is shown while first loading groups data #190954

Closed
umbopepato opened this issue Aug 21, 2024 · 3 comments · Fixed by #195777
Closed

[ResponseOps][Grouping] Empty state is shown while first loading groups data #190954

umbopepato opened this issue Aug 21, 2024 · 3 comments · Fixed by #195777
Assignees
Labels
Feature:Alerting Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams)

Comments

@umbopepato
Copy link
Member

umbopepato commented Aug 21, 2024

The @kbn/grouping library shows an empty state while loading groups data, since the default number of groups is 0:

Image

This might be confusing for the user who might think that the grouping query gave no results.
Can be seen in Security > Alerts with Group by active and in Observability > Alerts in @maryam-saeidi's PR.

DoD

We should show the empty state only when the groups have been loaded.

@umbopepato umbopepato self-assigned this Aug 21, 2024
@botelastic botelastic bot added the needs-team Issues missing a team label label Aug 21, 2024
@maryam-saeidi maryam-saeidi added the Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) label Aug 21, 2024
@elasticmachine
Copy link
Contributor

Pinging @elastic/response-ops (Team:ResponseOps)

@botelastic botelastic bot removed the needs-team Issues missing a team label label Aug 21, 2024
@umbopepato
Copy link
Member Author

@logeekal if Security is ok with this I'll just make the empty state and loading view mutually exclusive, otherwise if you want to continue showing the empty state I can make this behavior externally configurable

@logeekal
Copy link
Contributor

Thanks @umbopepato for raising and fixing this. I 100% agree that both views should be mutually exclusive with a default placeholder components.

Additionally, good to have is to have configurable components for both of the states in case solutions do not want default placeholders.

umbopepato added a commit that referenced this issue Oct 14, 2024
…ile first loading (#195777)

## Summary

Makes the loading state and empty state mutually exclusive in the
grouping component to avoid showing the empty state when first loading
the groups data.

## To verify

1. Create one or more O11y rules that fire alerts
2. Open the O11y > Alerts page
3. Toggle on grouping
4. Reload the page (possibly after activating network throttling)
5. Verify that while the loading indicator is shown, the empty state is
not and viceversa

## References

Fixes #190954
kibanamachine pushed a commit to kibanamachine/kibana that referenced this issue Oct 14, 2024
…ile first loading (elastic#195777)

## Summary

Makes the loading state and empty state mutually exclusive in the
grouping component to avoid showing the empty state when first loading
the groups data.

## To verify

1. Create one or more O11y rules that fire alerts
2. Open the O11y > Alerts page
3. Toggle on grouping
4. Reload the page (possibly after activating network throttling)
5. Verify that while the loading indicator is shown, the empty state is
not and viceversa

## References

Fixes elastic#190954

(cherry picked from commit 45a9cf0)
kibanamachine added a commit that referenced this issue Oct 14, 2024
…omponent while first loading (#195777) (#196106)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[ResponseOps][Alerts] Don't show empty state in grouping
component while first loading
(#195777)](#195777)

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

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

<!--BACKPORT [{"author":{"name":"Umberto
Pepato","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-10-14T10:50:55Z","message":"[ResponseOps][Alerts]
Don't show empty state in grouping component while first loading
(#195777)\n\n## Summary\r\n\r\nMakes the loading state and empty state
mutually exclusive in the\r\ngrouping component to avoid showing the
empty state when first loading\r\nthe groups data.\r\n\r\n## To
verify\r\n\r\n1. Create one or more O11y rules that fire alerts\r\n2.
Open the O11y > Alerts page\r\n3. Toggle on grouping\r\n4. Reload the
page (possibly after activating network throttling)\r\n5. Verify that
while the loading indicator is shown, the empty state is\r\nnot and
viceversa\r\n\r\n## References\r\n\r\nFixes
#190954","sha":"45a9cf0e343e6c4045834968fa27f6f468cdf3e3","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:ResponseOps","v9.0.0","backport:prev-major"],"title":"[ResponseOps][Alerts]
Don't show empty state in grouping component while first
loading","number":195777,"url":"https:/elastic/kibana/pull/195777","mergeCommit":{"message":"[ResponseOps][Alerts]
Don't show empty state in grouping component while first loading
(#195777)\n\n## Summary\r\n\r\nMakes the loading state and empty state
mutually exclusive in the\r\ngrouping component to avoid showing the
empty state when first loading\r\nthe groups data.\r\n\r\n## To
verify\r\n\r\n1. Create one or more O11y rules that fire alerts\r\n2.
Open the O11y > Alerts page\r\n3. Toggle on grouping\r\n4. Reload the
page (possibly after activating network throttling)\r\n5. Verify that
while the loading indicator is shown, the empty state is\r\nnot and
viceversa\r\n\r\n## References\r\n\r\nFixes
#190954","sha":"45a9cf0e343e6c4045834968fa27f6f468cdf3e3"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https:/elastic/kibana/pull/195777","number":195777,"mergeCommit":{"message":"[ResponseOps][Alerts]
Don't show empty state in grouping component while first loading
(#195777)\n\n## Summary\r\n\r\nMakes the loading state and empty state
mutually exclusive in the\r\ngrouping component to avoid showing the
empty state when first loading\r\nthe groups data.\r\n\r\n## To
verify\r\n\r\n1. Create one or more O11y rules that fire alerts\r\n2.
Open the O11y > Alerts page\r\n3. Toggle on grouping\r\n4. Reload the
page (possibly after activating network throttling)\r\n5. Verify that
while the loading indicator is shown, the empty state is\r\nnot and
viceversa\r\n\r\n## References\r\n\r\nFixes
#190954","sha":"45a9cf0e343e6c4045834968fa27f6f468cdf3e3"}}]}]
BACKPORT-->

Co-authored-by: Umberto Pepato <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature:Alerting Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams)
Projects
None yet
5 participants