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

[Security Solution] Alerts page KPI visualizations handle querySkip and toggleStatus at panel level #150382

Closed
christineweng opened this issue Feb 6, 2023 · 2 comments
Assignees
Labels
enhancement New value added to drive a business result Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Threat Hunting:Investigations Security Solution Investigations Team Team:Threat Hunting Security Solution Threat Hunting Team

Comments

@christineweng
Copy link
Contributor

Describe the issue:

All 4 chart selections on the Alerts page used to track its own toggleStatus (i.e. when toggle down, show, when up, hide), querySkip is also managed individually depending on toggle state.

Current behavior: currently each panel (treemap, histogram, charts, count table) handle its own querySkip.

const { toggleStatus, setToggleStatus } = useQueryToggle(DETECTIONS_ALERTS_CHARTS_ID);
  const [querySkip, setQuerySkip] = useState(
    isAlertsPageChartsEnabled ? !isExpanded : !toggleStatus

Expected behavior: querySkip can be handled at charts level (same as toggleStatus) and passed down to individual panel components as props

@christineweng christineweng added triage_needed enhancement New value added to drive a business result Team:Threat Hunting Security Solution Threat Hunting Team Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Threat Hunting:Investigations Security Solution Investigations Team labels Feb 6, 2023
@christineweng christineweng self-assigned this Feb 6, 2023
@elasticmachine
Copy link
Contributor

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

@elasticmachine
Copy link
Contributor

Pinging @elastic/security-solution (Team: SecuritySolution)

christineweng added a commit that referenced this issue Mar 6, 2023
…arts (#152402)

## Summary

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names



![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)
 

2. Updated inspect modal titles to match actual tab name (from
#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on #150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.
 
4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields
  

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)


https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov


 
### 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)
- [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
christineweng added a commit to christineweng/kibana that referenced this issue Mar 6, 2023
…arts (elastic#152402)

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names

![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)

2. Updated inspect modal titles to match actual tab name (from
elastic#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on elastic#150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.

4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)

https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov

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)
- [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

(cherry picked from commit 012ec79)
christineweng added a commit to christineweng/kibana that referenced this issue Mar 6, 2023
…arts (elastic#152402)

## Summary

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names

![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)

2. Updated inspect modal titles to match actual tab name (from
elastic#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on elastic#150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.

4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)

https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov

### 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)
- [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

(cherry picked from commit 012ec79)

# Conflicts:
#	x-pack/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx
christineweng added a commit that referenced this issue Mar 7, 2023
…age charts (#152402) (#152769)

# Backport

This will backport the following commits from `main` to `8.7`:
- [[Security Solution] Fix empty fields and tab titles on Alerts page
charts (#152402)](#152402)

<!--- Backport version: 8.9.7 -->

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

<!--BACKPORT
[{"author":{"name":"christineweng","email":"18648970+christineweng@users.noreply.github.com"},"sourceCommit":{"committedDate":"2023-03-06T22:44:57Z","message":"[Security
Solution] Fix empty fields and tab titles on Alerts page charts
(#152402)\n\n## Summary\r\n\r\nThis PR contains fixes/enhancements on
charts section on Alerts Page:\r\n\r\n1. Updated tab
names\r\n\r\n\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)\r\n
\r\n\r\n2. Updated inspect modal titles to match actual tab name
(from\r\nhttps://github.com//issues/151842)\r\n\r\n-
`Counts` (used to be `Aggregations` on alerts page and `Table`
in\r\ninspect modal, they are both `Counts`
now)\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)\r\n\r\n3.
Updated `querySkip` in `Trend`, `Counts`, and `Summary` as
mentioned\r\non #150382
`querySkip` followed the same pattern of `toggleStatus` that
each\r\nchart keeps track of its own `querySkip` based on toggle status
(skip\r\nquery if charts is collapsed). This is no longer necessary
because\r\ntoggle is now managed at a higher level.\r\n \r\n4. Fixed a
bug that the top alerts chart was calculating percentages\r\nbased on
available fields\r\n- For instance, there are 100 alerts, 20 has
`host.name=\"host-1\"`, 30\r\nhas `host.name=\"host-2\"`, the bars will
show 40% and 60% for each, and\r\nit adds up to 100%. This does not
factor in the 50 alerts with\r\nempty/null fields.\r\n- This PR added an
info button that shows the percentage of available\r\nfields, as well as
on-click action to add a filter to show alerts with\r\nempty fields\r\n
\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)\r\n\r\n\r\nhttps://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov\r\n\r\n\r\n
\r\n### Checklist\r\n\r\nDelete any items that are not applicable to
this PR.\r\n\r\n- [x] Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n-
[x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common
scenarios","sha":"012ec798f7c9b512478b55aec2dc686a37c8347c","branchLabelMapping":{"^v8.8.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Threat
Hunting","Team: SecuritySolution","release_note:feature","Team:Threat
Hunting:Investigations","v8.7.0","v8.8.0"],"number":152402,"url":"#152402
Solution] Fix empty fields and tab titles on Alerts page charts
(#152402)\n\n## Summary\r\n\r\nThis PR contains fixes/enhancements on
charts section on Alerts Page:\r\n\r\n1. Updated tab
names\r\n\r\n\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)\r\n
\r\n\r\n2. Updated inspect modal titles to match actual tab name
(from\r\nhttps://github.com//issues/151842)\r\n\r\n-
`Counts` (used to be `Aggregations` on alerts page and `Table`
in\r\ninspect modal, they are both `Counts`
now)\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)\r\n\r\n3.
Updated `querySkip` in `Trend`, `Counts`, and `Summary` as
mentioned\r\non #150382
`querySkip` followed the same pattern of `toggleStatus` that
each\r\nchart keeps track of its own `querySkip` based on toggle status
(skip\r\nquery if charts is collapsed). This is no longer necessary
because\r\ntoggle is now managed at a higher level.\r\n \r\n4. Fixed a
bug that the top alerts chart was calculating percentages\r\nbased on
available fields\r\n- For instance, there are 100 alerts, 20 has
`host.name=\"host-1\"`, 30\r\nhas `host.name=\"host-2\"`, the bars will
show 40% and 60% for each, and\r\nit adds up to 100%. This does not
factor in the 50 alerts with\r\nempty/null fields.\r\n- This PR added an
info button that shows the percentage of available\r\nfields, as well as
on-click action to add a filter to show alerts with\r\nempty fields\r\n
\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)\r\n\r\n\r\nhttps://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov\r\n\r\n\r\n
\r\n### Checklist\r\n\r\nDelete any items that are not applicable to
this PR.\r\n\r\n- [x] Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n-
[x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common
scenarios","sha":"012ec798f7c9b512478b55aec2dc686a37c8347c"}},"sourceBranch":"main","suggestedTargetBranches":["8.7"],"targetPullRequestStates":[{"branch":"8.7","label":"v8.7.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.8.0","labelRegex":"^v8.8.0$","isSourceBranch":true,"state":"MERGED","url":"#152402
Solution] Fix empty fields and tab titles on Alerts page charts
(#152402)\n\n## Summary\r\n\r\nThis PR contains fixes/enhancements on
charts section on Alerts Page:\r\n\r\n1. Updated tab
names\r\n\r\n\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)\r\n
\r\n\r\n2. Updated inspect modal titles to match actual tab name
(from\r\nhttps://github.com//issues/151842)\r\n\r\n-
`Counts` (used to be `Aggregations` on alerts page and `Table`
in\r\ninspect modal, they are both `Counts`
now)\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)\r\n\r\n3.
Updated `querySkip` in `Trend`, `Counts`, and `Summary` as
mentioned\r\non #150382
`querySkip` followed the same pattern of `toggleStatus` that
each\r\nchart keeps track of its own `querySkip` based on toggle status
(skip\r\nquery if charts is collapsed). This is no longer necessary
because\r\ntoggle is now managed at a higher level.\r\n \r\n4. Fixed a
bug that the top alerts chart was calculating percentages\r\nbased on
available fields\r\n- For instance, there are 100 alerts, 20 has
`host.name=\"host-1\"`, 30\r\nhas `host.name=\"host-2\"`, the bars will
show 40% and 60% for each, and\r\nit adds up to 100%. This does not
factor in the 50 alerts with\r\nempty/null fields.\r\n- This PR added an
info button that shows the percentage of available\r\nfields, as well as
on-click action to add a filter to show alerts with\r\nempty fields\r\n
\r\n\r\n![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)\r\n\r\n\r\nhttps://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov\r\n\r\n\r\n
\r\n### Checklist\r\n\r\nDelete any items that are not applicable to
this PR.\r\n\r\n- [x] Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)\r\n-
[x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common
scenarios","sha":"012ec798f7c9b512478b55aec2dc686a37c8347c"}}]}]
BACKPORT-->
sloanelybutsurely pushed a commit to sloanelybutsurely/kibana that referenced this issue Mar 8, 2023
…arts (elastic#152402)

## Summary

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names



![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)
 

2. Updated inspect modal titles to match actual tab name (from
elastic#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on elastic#150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.
 
4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields
  

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)


https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov


 
### 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)
- [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
bmorelli25 pushed a commit to bmorelli25/kibana that referenced this issue Mar 10, 2023
…arts (elastic#152402)

## Summary

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names



![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)
 

2. Updated inspect modal titles to match actual tab name (from
elastic#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on elastic#150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.
 
4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields
  

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)


https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov


 
### 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)
- [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
nkhristinin pushed a commit that referenced this issue Mar 22, 2023
…arts (#152402)

## Summary

This PR contains fixes/enhancements on charts section on Alerts Page:

1. Updated tab names



![image](https://user-images.githubusercontent.com/18648970/222000232-e8681a19-3986-4b7a-a7f1-e92b805ad965.png)
 

2. Updated inspect modal titles to match actual tab name (from
#151842)

- `Counts` (used to be `Aggregations` on alerts page and `Table` in
inspect modal, they are both `Counts` now)

![image](https://user-images.githubusercontent.com/18648970/222000544-575b33ee-dddd-4e8b-b7f6-8bc2b2c67545.png)

3. Updated `querySkip` in `Trend`, `Counts`, and `Summary` as mentioned
on #150382
- `querySkip` followed the same pattern of `toggleStatus` that each
chart keeps track of its own `querySkip` based on toggle status (skip
query if charts is collapsed). This is no longer necessary because
toggle is now managed at a higher level.
 
4. Fixed a bug that the top alerts chart was calculating percentages
based on available fields
- For instance, there are 100 alerts, 20 has `host.name="host-1"`, 30
has `host.name="host-2"`, the bars will show 40% and 60% for each, and
it adds up to 100%. This does not factor in the 50 alerts with
empty/null fields.
- This PR added an info button that shows the percentage of available
fields, as well as on-click action to add a filter to show alerts with
empty fields
  

![image](https://user-images.githubusercontent.com/18648970/222000280-456b435e-193c-45e2-b4a6-9b6cf4cfee08.png)


https://user-images.githubusercontent.com/18648970/222000307-764b1e90-ac88-40c7-9f26-a9372e8592a8.mov


 
### 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)
- [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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New value added to drive a business result Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Threat Hunting:Investigations Security Solution Investigations Team Team:Threat Hunting Security Solution Threat Hunting Team
Projects
None yet
Development

No branches or pull requests

2 participants