Skip to content

Comments

Fix UX in alerting UI forms when errors occur#59444

Merged
mikecote merged 13 commits intoelastic:masterfrom
mikecote:alerting/ui-form-server-errors
Mar 11, 2020
Merged

Fix UX in alerting UI forms when errors occur#59444
mikecote merged 13 commits intoelastic:masterfrom
mikecote:alerting/ui-form-server-errors

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 Platform ResponseOps team (formerly the Cases and Alerting teams) t// 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
Contributor

@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 <elasticmachine@users.noreply.github.com>
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 <elasticmachine@users.noreply.github.com>

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
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 Platform ResponseOps team (formerly the Cases and Alerting teams) t// 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