[alt]+Enter not working correctly in 2nd modal overlay

[metas-dh]

Is this a bug or feature request?

Bug

What is the current behavior?

[alt]+Enter is not working correctly in 2nd modal overlay: instead of closing the 2nd modal overlay only, it closes both the 1st and 2nd one. The action is called correctly though, e.g. in manufacturing order, the received HUs are created.

Which are the steps to reproduce?

e.g. transform a HU in material receipt candidates: http://recordit.co/IRcvCHL1RW

e.g. manufacturing order, receive: http://recordit.co/3jE5r25hbw

What is the expected or desired behavior?

After [alt]+Enter only the 2nd modal overlay shall be closed, not both the 1st and the 2nd.

[ionut-movila]

@siemiatj I have looked a bit over this task and I would need help to figure out a correct solution.

Steps to describe the issue:

1. Let's take for instance window for Manufacturing Order: http://localhost:3000/window/53009.
2. Here we open Issue/Receipt for article no. 630070. This will open a RawModal.
3. Now I select the first row in RawModal table, then from actions select "Receive HUs"
4. As a result it will now open a Modal component.
5. When pressing Alt+Enter both actions CLOSE_RAW_MODAL and CLOSE_MODAL are dispatched so both modals are close.

Possible solution: There should be a mechanism to tell which modal is top most and Alt+Enter should only close top most. Do we have such a logic? And I will also have to understand how close shortcut works.

[siemiatj]

Here's some code that might be helpful here. There's a logic to control the order of firing events I've added exactly for this case (when there are multiple event listeners on the same key combination):

https://github.com/metasfresh/metasfresh-webui-frontend/blob/master/src/components/keyshortcuts/ShortcutProvider.js#L109

So the way it works is:

• we add shortcut handlers to an ordered list in a reverse order (and because of the way the app is built, element added last would normally have it's shortcuts added last as well)
• when the combination is used, we call the handler functions
• now handler can control if it should be called or not (check the example code below)
• if it was fired, we're done. Otherwise call the next one in queue

and here's a valid use case:

• shortcut handler in DocumentListContextShortcuts for ADVANCED_EDIT: https://github.com/metasfresh/metasfresh-webui-frontend/blob/master/src/components/keyshortcuts/DocumentListContextShortcuts.js#L22

which is called only when a handleAdvancedEdit prop is given. Otherwise it's skipped

• and here's where we control if this prop should exist:

https://github.com/metasfresh/metasfresh-webui-frontend/blob/master/src/components/table/Table.js#L1277

[ionut-movila]

This should be fixed with the previous commit. And I also fixed a memory leak (setState on unmounted component).

[metas-dh]

works fine, see IT of me03 issue.