Unable to chained dialogs

[comxd]

In case of displaying a new dialog inside a callback, the new dialog is correctly displayed but disappear after component is re-rendered.

import React from "react";
import "./styles.css";
import { useDialog } from "muibox";

export default function App() {
  const dialog = useDialog();
  const handlePrompt = () =>
    dialog
      .prompt({
        message: "Fill your Email and click OK button",
        ok: { text: "OK", color: "primary", variant: "contained" },
        cancel: false
      })
      .then(email => dialog.alert(`Your email: ${email}`))
      .catch(() => {});

  return (
    <div className="App">
      <button onClick={handlePrompt}>Click me</button>
    </div>
  );
}

Codesandbox: https://codesandbox.io/s/muibox-13-bug-chained-dialogs-06lo3

[chunkai1312]

For this example, a simple solution is to use setTimeout() before invoke dialog.alert().

[Ark-kun]

For this example, a simple solution is to use setTimeout() before invoke dialog.alert().

Are you sure that's correct approach? This seems like a bug...