Skip to content

Open two modals. Hit ESC then hit ECS but nothing happens  #218

Closed
@cristian-sima

Description

@cristian-sima

I am using this great idea http://stackoverflow.com/questions/35623656/how-can-i-display-a-modal-dialog-in-redux-that-performs-asynchronous-actions/35641680 in order to display modals.

In order to display them, I have this code:

const ModalRoot = ({ list } : ModalRootPropTypes) : any => {

  if (list.size === 0) {
    return null;
  }

  return (
    <div>
      {
        list.map(({ type, props }, index) => {
          const Component = getComponent(type);

          return (
            <Component key={index} {...props} />
          );
        })
      }
    </div>
  );
};

The getComponent is like this:

const DeleteArticle = (
 <Modal>
...
</Modal>
);

const MODAL_DELETE_ARTICLE = "MODAL_DELETE_ARTICLE";

const getComponent = (type : ModalActionType) : any => {
  switch (type) {

  case MODAL_DELETE_ARTICLE:
    return DeleteArticle;
....

So, essentially, for 2 modals, these pieces of code generates this view:

image

The HTML code is:

image

Which is very good, correct and right. But:

Now, when I hit ESC, the second modal hides (which is good). Then, if I press again ESC, nothing happens. That's because the Modal 1 is not logger focused.

If I click on it and hit ECS it is closed.

My question is:

Can I somehow focus the next modal when one is closed? (Focus Modal 1 when Modal 2 is closed)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions