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

Fix UX in alerting UI forms when errors occur #59444

Merged
merged 13 commits into from
Mar 11, 2020

Conversation

mikecote
Copy link
Contributor

@mikecote mikecote commented Mar 5, 2020

Resolves #58181.

In this PR, I'm making a few changes to alert and connector forms to improve the UX whenever a user encounters an error:

  • First field will be focused. Whenever the user focuses out, validation error will display right away
  • Instead of using a callout for server errors on save, they will show up as a toast message
  • Creating a connector from a modal, error handling will remain unchanged

Screenshots

Create connector modal

Screen Shot 2020-03-10 at 12 17 33 PM

Create connector flyout

Screen Shot 2020-03-10 at 12 17 55 PM

Edit connector flyout

Screen Shot 2020-03-10 at 12 18 50 PM

cc @mdefazio for screenshots

@mikecote mikecote added Feature:Alerting v8.0.0 release_note:skip Skip the PR/issue when compiling release notes v7.7.0 Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) labels Mar 5, 2020
@mikecote mikecote self-assigned this Mar 5, 2020
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-alerting-services (Team:Alerting Services)

@mikecote
Copy link
Contributor Author

mikecote commented Mar 6, 2020

@elasticmachine merge upstream

@mikecote mikecote marked this pull request as ready for review March 9, 2020 13:36
@mikecote mikecote requested a review from a team as a code owner March 9, 2020 13:36
@mikecote
Copy link
Contributor Author

mikecote commented Mar 9, 2020

@elasticmachine merge upstream

Copy link
Member

@pmuellr pmuellr left a comment

Choose a reason for hiding this comment

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

code LGTM, left a comment about if check on toastNotifications

Copy link
Contributor

@YulNaumenko YulNaumenko left a comment

Choose a reason for hiding this comment

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

LGTM!

@kibanamachine
Copy link
Contributor

💚 Build Succeeded

History

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

@mikecote mikecote merged commit c51d287 into elastic:master Mar 11, 2020
mikecote added a commit to mikecote/kibana that referenced this pull request Mar 11, 2020
* Fix UX in UI forms when errors occur

* Create connector modal won't change

* ESLint fixes

* Fix type check

* Add some tests

* Remove if checks

Co-authored-by: Elastic Machine <[email protected]>
gmmorris added a commit to gmmorris/kibana that referenced this pull request Mar 11, 2020
* master:
  [ML] Transforms: Use EuiInMemoryTable instead of custom typed table. (elastic#59782)
  Alerting/fix flaky instance test (elastic#58994)
  ci: disable all Mocha rules for tape tests (elastic#59798)
  Fix UX in alerting UI forms when errors occur (elastic#59444)
  [DOCS] Updated and added jump tables (elastic#59774)
  [DOCS] Moved rolled up index content (elastic#59372)
  Regenerate core api docs (elastic#59814)
  [Lens] remove react warnings (elastic#59574)
  The scripts/backport.js file isn't an executable (elastic#59800)
  [Alerting] add more alert properties to action parameter templating (elastic#59718)
  [Design] Branding changes in Elastic to focus more towards the Elastic brand (elastic#58160)
  [SIEM] Adds 'Create new rule' Cypress test (elastic#59790)
  Updating svgo -> css-tree -> mdn-data, all so we get mdn-data > 2.0 (elastic#58913)
  Use EUI test environment build with Jest (elastic#55877)
  update typescript version in all packages to avoid warnings (elastic#59787)
  [SIEM] [Case] Insert timeline into case textarea (elastic#59586)
  [ML] Functional tests - stabilize saved search tests (elastic#59652)
mikecote added a commit that referenced this pull request Mar 11, 2020
* Fix UX in UI forms when errors occur

* Create connector modal won't change

* ESLint fixes

* Fix type check

* Add some tests

* Remove if checks

Co-authored-by: Elastic Machine <[email protected]>

Co-authored-by: Elastic Machine <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature:Alerting release_note:skip Skip the PR/issue when compiling release notes Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) v7.7.0 v8.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Error experience in create alert flow
5 participants