Skip to content

Introduce ErrorAlert Component to purchase flows

Angelo Gulina requested to merge ag/386722-apply-error-mapping-to-purchase-flows into master

What does this MR do and why?

Describe in detail what your merge request does and why.

This MR finalised the work of &9543 (closed) – from #386722 (closed), by introducing the ErrorAlert component to the purchase flows. Error handling (presentation, capture) is now centralised in the purchase flows. Additionally, the dictionary to map the system to friendly errors, introduced with #386710 (closed), is now implemented. See screenshots.

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

When there is no error message When the error is not mapped in the dictionary When the error is mapped in the dictionary Error reset after changes
Subscription Flow
Screenshot_2023-02-13_at_17.59.08 Screenshot_2023-02-13_at_17.59.50 Screenshot_2023-02-13_at_18.00.11 https://www.loom.com/share/619f05e6bfc0485bac028f385ee9891e
Add-ons Flow
Screenshot_2023-02-16_at_04.40.51 Screenshot_2023-02-14_at_21.55.49 Screenshot_2023-02-14_at_21.56.38 N/A

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

Note that testing the scenarios properly is not always possible during to the nature of errors. However, errors can be manually generated to see how the application behaves in some instances.

  1. Make sure to have both gdk and CustomersDot running (installation steps)
  2. Login into gdk
  3. Be sure you're an owner of at least one group (or create one)
  4. Copy the group id
  5. Visit <your-gdk-url>/-/subscriptions/buy_minutes?selected_group=<your-group-id>
  6. The best way to see the error as soon as you land on the page is to use this patch
  7. Mapped error: addons-mapped-error.patch
  8. Non mapped error: addons-non-mapped-error.patch
  9. Empty error: empty-error.patch
  10. You can try a similar approach in children component (need to emit an error) and in ee/app/assets/javascripts/subscriptions/new/components/app.vue, by visiting <your-gdk-url>/-/subscriptions/new?plan_id=2c92c0f876e0f4cc0176e176a08f1b70

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Angelo Gulina

Merge request reports