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][Detections] Better toast errors #72205

Merged
merged 11 commits into from
Jul 17, 2020

Conversation

rylnd
Copy link
Contributor

@rylnd rylnd commented Jul 16, 2020

Summary

A few changes related to toast messages:

  • Better presentation of error data sent from the API (both general platform errors and app-specific errors)
  • Uses platform's new Toasts service to prevent modal/toast z-index collision issues
  • Updates both the Value Lists Modal and the Exceptions List Modals to use this new hook wrapping the above

This also fixes an issue with useListsConfig where, when the server is nonresponsive, it will not continue to poll awaiting a non-error response.

I'm not replacing all uses of our redux-based toaster implementation for now, but we can/should do that in a subsequent PR.

Example Toasts when trying to upload too large of a value list:

Detections_-_Kibana

Detections_-_Kibana

Checklist

For maintainers

rylnd added 7 commits July 16, 2020 15:46
When receiving error responses from our APIs, this gives us better toast
messages.
The crux of this issue was that we had no steady state when the server
returned a non-API error (!isApiError), as it would if the server was
throwing 500s or just generally misbehaving.

The solution, then, is to addresse these non-API errors in our
underlying useListsIndex and useListsPrivileges hooks.

This also refactors those hooks to:

* collapse multiple error states into one (that's all we currently need)
* use useAppToasts for better UI

TODO: I don't think I need the changes in useListsConfig's useEffect.
The only task in this hook is our readPrivileges task right now, so I'm
shortening the variable until we have a need to disambiguate it further.
If the index hook has an error needsIndex will not be true.
Our isApiError predicate does not work for errors coming back from
Kibana platform itself, e.g. for a request payload error.

I've added a separate predicate for that case, isKibanaError, and then a
wrapping isAppError predicate since most of our use cases just care
about error.body.message, which is common to both.
This fixes two issues:

* toast appears above modal overlay
* Error message from response is now presented in the toast
@rylnd rylnd added Team:SIEM v8.0.0 release_note:skip Skip the PR/issue when compiling release notes v7.9.0 labels Jul 16, 2020
@rylnd rylnd self-assigned this Jul 16, 2020
Because of the way some of the exception modal's hooks are written, a
change to one of its callbacks means that the request will be canceled.

Because the toasts service exports instance methods, the context within
the function (and thus the function itself) can change leading to a
mutable ref.

Because we don't want/need this behavior, we store our exported
functions in refs to 'freeze' them for react.

With our bound functions, we should now be able to declare e.g.
`toast.addError` as a dependency, however react cannot determine that it
is bound (and thus that toast.addError() is equivalent to addError()),
and so we must destructure our functions in order to use them as
dependencies.
@rylnd rylnd force-pushed the better_toast_errors branch from d641573 to b755361 Compare July 16, 2020 23:45
This fixes the z-index issue between modals and toasts.
Copy link
Contributor

@FrankHassanabad FrankHassanabad left a comment

Choose a reason for hiding this comment

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

LGTM

rylnd added 2 commits July 16, 2020 20:40
These tests now call out to the Notifications service (in a context)
instead of our redux implementation.
@kibanamachine
Copy link
Contributor

💚 Build Succeeded

Build metrics

@kbn/optimizer bundle module count

id value diff baseline
securitySolution 1066 +1 1065

async chunks size

id value diff baseline
securitySolution 7.3MB -153.0B 7.3MB

page load bundle size

id value diff baseline
securitySolution 887.7KB +485.0B 887.2KB

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@rylnd rylnd marked this pull request as ready for review July 17, 2020 03:59
@rylnd rylnd requested review from a team as code owners July 17, 2020 03:59
@elasticmachine
Copy link
Contributor

Pinging @elastic/siem (Team:SIEM)

@rylnd rylnd merged commit effab78 into elastic:master Jul 17, 2020
@rylnd rylnd deleted the better_toast_errors branch July 17, 2020 04:00
rylnd added a commit to rylnd/kibana that referenced this pull request Jul 17, 2020
* Add new hook to wrap the toasts service

When receiving error responses from our APIs, this gives us better toast
messages.

* Replace useToasts with useAppToasts in trivial case

* WIP: prevent infinite polling when server is unresponsive

The crux of this issue was that we had no steady state when the server
returned a non-API error (!isApiError), as it would if the server was
throwing 500s or just generally misbehaving.

The solution, then, is to addresse these non-API errors in our
underlying useListsIndex and useListsPrivileges hooks.

This also refactors those hooks to:

* collapse multiple error states into one (that's all we currently need)
* use useAppToasts for better UI

TODO: I don't think I need the changes in useListsConfig's useEffect.

* Slightly more legible variables

The only task in this hook is our readPrivileges task right now, so I'm
shortening the variable until we have a need to disambiguate it further.

* Remove unnecessary conditions around creating our index

If the index hook has an error needsIndex will not be true.

* Better toast errors for Kibana API errors

Our isApiError predicate does not work for errors coming back from
Kibana platform itself, e.g. for a request payload error.

I've added a separate predicate for that case, isKibanaError, and then a
wrapping isAppError predicate since most of our use cases just care
about error.body.message, which is common to both.

* Use new toasts hook on our exceptions modals

This fixes two issues:

* toast appears above modal overlay
* Error message from response is now presented in the toast

* Fix bug with toasts dependencies

Because of the way some of the exception modal's hooks are written, a
change to one of its callbacks means that the request will be canceled.

Because the toasts service exports instance methods, the context within
the function (and thus the function itself) can change leading to a
mutable ref.

Because we don't want/need this behavior, we store our exported
functions in refs to 'freeze' them for react.

With our bound functions, we should now be able to declare e.g.
`toast.addError` as a dependency, however react cannot determine that it
is bound (and thus that toast.addError() is equivalent to addError()),
and so we must destructure our functions in order to use them as
dependencies.

* Alert clipboard toasts through new Toasts service

This fixes the z-index issue between modals and toasts.

* Fix type errors

* Mock external dependency

These tests now call out to the Notifications service (in a context)
instead of our redux implementation.
gmmorris added a commit to gmmorris/kibana that referenced this pull request Jul 17, 2020
* master: (214 commits)
  replacing hard coded links for ela.st (elastic#72240)
  skip flaky suite (elastic#60865)
  chore(NA): teardown dynamic dll plugin (elastic#72096)
  Register navLink actions for declared applications (elastic#72109)
  Fix value for process.hash.sha256 draggable (elastic#72142)
  Call setupIngest before fleet_install tests (elastic#72214)
  [Security Solution][Detections] Better toast errors (elastic#72205)
  skip flaky suite (elastic#64696)
  [Security Solution][Detections] Disable exceptions for Threshold and ML rules (elastic#72137)
  [Security Solution][Detections,Lists] Miscellaneous post-FF fixes (elastic#71990)
  [baseline/capture] use high-memory nodes with ramDisks (elastic#71894)
  skip flaky suite (elastic#77207)
  [Maps] Fix issue preventing TMS from rendering correctly (elastic#71946)
  using test_user with minimum privs (elastic#71988)
  Fixed Webhook connector doesn't retain added HTTP header settings (elastic#71924)
  [Ingest Manager] Do not show enrolling and unenrolling agents as online in agent counters (elastic#71921)
  [Maps] fix 'New Map' from getting added to recently accessed (elastic#72125)
  [Visualizations] Pass 'aggs' parameter to custom request handlers (elastic#71423)
  [Monitoring] Out of the box alert tweaks (elastic#71942)
  [ML] Fix datafeed start time is incorrect when the job has trailing empty buckets (elastic#71976)
  ...
gmmorris added a commit to gmmorris/kibana that referenced this pull request Jul 17, 2020
* master: (55 commits)
  updates 'External alerts' tab text (elastic#72237)
  [Security Solution][Case] Fix connector's dropdown with conflicting requests (elastic#72037)
  replacing hard coded links for ela.st (elastic#72240)
  skip flaky suite (elastic#60865)
  chore(NA): teardown dynamic dll plugin (elastic#72096)
  Register navLink actions for declared applications (elastic#72109)
  Fix value for process.hash.sha256 draggable (elastic#72142)
  Call setupIngest before fleet_install tests (elastic#72214)
  [Security Solution][Detections] Better toast errors (elastic#72205)
  skip flaky suite (elastic#64696)
  [Security Solution][Detections] Disable exceptions for Threshold and ML rules (elastic#72137)
  [Security Solution][Detections,Lists] Miscellaneous post-FF fixes (elastic#71990)
  [baseline/capture] use high-memory nodes with ramDisks (elastic#71894)
  skip flaky suite (elastic#77207)
  [Maps] Fix issue preventing TMS from rendering correctly (elastic#71946)
  using test_user with minimum privs (elastic#71988)
  Fixed Webhook connector doesn't retain added HTTP header settings (elastic#71924)
  [Ingest Manager] Do not show enrolling and unenrolling agents as online in agent counters (elastic#71921)
  [Maps] fix 'New Map' from getting added to recently accessed (elastic#72125)
  [Visualizations] Pass 'aggs' parameter to custom request handlers (elastic#71423)
  ...
gmmorris added a commit to gmmorris/kibana that referenced this pull request Jul 17, 2020
…feature-privileges

* alerting/consumer-based-rbac: (56 commits)
  take into account which features available in the active space
  updates 'External alerts' tab text (elastic#72237)
  [Security Solution][Case] Fix connector's dropdown with conflicting requests (elastic#72037)
  replacing hard coded links for ela.st (elastic#72240)
  skip flaky suite (elastic#60865)
  chore(NA): teardown dynamic dll plugin (elastic#72096)
  Register navLink actions for declared applications (elastic#72109)
  Fix value for process.hash.sha256 draggable (elastic#72142)
  Call setupIngest before fleet_install tests (elastic#72214)
  [Security Solution][Detections] Better toast errors (elastic#72205)
  skip flaky suite (elastic#64696)
  [Security Solution][Detections] Disable exceptions for Threshold and ML rules (elastic#72137)
  [Security Solution][Detections,Lists] Miscellaneous post-FF fixes (elastic#71990)
  [baseline/capture] use high-memory nodes with ramDisks (elastic#71894)
  skip flaky suite (elastic#77207)
  [Maps] Fix issue preventing TMS from rendering correctly (elastic#71946)
  using test_user with minimum privs (elastic#71988)
  Fixed Webhook connector doesn't retain added HTTP header settings (elastic#71924)
  [Ingest Manager] Do not show enrolling and unenrolling agents as online in agent counters (elastic#71921)
  [Maps] fix 'New Map' from getting added to recently accessed (elastic#72125)
  ...
yctercero pushed a commit that referenced this pull request Jul 17, 2020
## Summary

A few changes related to toast messages:

* Better presentation of error data sent from the API (both general platform errors and app-specific errors)
* Uses platform's new Toasts service to prevent modal/toast z-index collision issues
* Updates both the Value Lists Modal and the Exceptions List Modals to use this new hook wrapping the above

This also fixes an issue with `useListsConfig` where, when the server is nonresponsive, it will not continue to poll awaiting a non-error response.
yctercero pushed a commit that referenced this pull request Jul 17, 2020
## Summary

A few changes related to toast messages:

* Better presentation of error data sent from the API (both general platform errors and app-specific errors)
* Uses platform's new Toasts service to prevent modal/toast z-index collision issues
* Updates both the Value Lists Modal and the Exceptions List Modals to use this new hook wrapping the above

This also fixes an issue with `useListsConfig` where, when the server is nonresponsive, it will not continue to poll awaiting a non-error response.
@MindyRS MindyRS added the Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. label Sep 23, 2021
@elasticmachine
Copy link
Contributor

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
release_note:skip Skip the PR/issue when compiling release notes Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:SIEM v7.9.0 v8.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants