UUI icon indicating copy to clipboard operation
UUI copied to clipboard

Add Blocker to PickerModal component

Open shishka02 opened this issue 4 years ago • 1 comments

we want to have possibility to block modal with some loader until some operations inside will be done possibly need to add some workaround in svc.uuiModals.show((props)) put some new function in props like enableBlocker() want to have some functionality like in attached video

https://user-images.githubusercontent.com/14928263/122574441-5368ab00-d058-11eb-862a-3411cce079c0.mp4

shishka02 avatar Jun 18 '21 14:06 shishka02

In UUI, we return a Promise from showModal. This provides a nice way to chain modal and other async operations:

const modal1Result = await showModal(....);
const apiResult = await api.something(modal1Result); 
const modal2Result = await showModal(...)

However, while we are doing api.something() in this example, there is no modal window displayed. User don't know what's happening. He can also click something in underlying UI, with unpredictable consequences.

This problem can be handled in custom modals - by moving api.something() into first or second modal, and blocking it until it's done. However, it's not convenient to code, and impossible for UUI built-in modals - like PickerModal.

I don't have a good API idea so far. Let's start with documenting how to chain modals as in example above. This can be an example code in the Modals article

jakobz avatar Jun 18 '21 14:06 jakobz