Delete confirmation

[pankajshivpuje]

Requesting design recommendations/demo for delete confirmation

While working on delete component feature for App Studio design, I came across several variations of delete confirmation modal designs across RH products. The primary use case to support this feature is the ability for the user to be able to delete a said object from the system. Delete is a detrimental action so when user decides to delete an object, we would like to make sure user understand it is irreversible permanent action. We would also like to make sure that user is deleting the correct object so asking user the confirm before proceeding with this action. The confirmation model presented to the user allows user to doublecheck the action and then proceed.

Few areas that needs be to explored as a part of this issue:

1. When to enable/disable primary action button on the forms/modals? This can go beyond the delete confirmation and will allow the exploration of forms and model in various scenarios across the RH products.
2. Ask user to type the name of object being deleted and provide feedback as they start typing.
3. After delete interaction is completed, how is the object removed from the list?

PF recommendations around designing the confirmation modals will help bring the consistency across the product, reduce learning curve, and reduce errors. In addition, the recommendations/demo can help guide the future design efforts for similar use case.

Here are some examples delete confirmation modals from various RH products.

Example 1:

Example 2:

Example 3:

[mcarrano]

Discovery doc from @pankajshivpuje : https://docs.google.com/document/d/1l8BDhnNeXEQlFWus1dUbdgoFKZcHhVHYS_MlznKonOc/edit#

[pankajshivpuje]

@mcarrano Here are the latest proposal for delete confirmation modal
We need to discuss the process to figure if the outcome of this issue lives on PF site or the in the design conventions.

[mmenestr]

Design doc issue: patternfly/patternfly-org#3420

[mcarrano]

Will document on the website as a new pattern. See the linked Org issue.