Close on navigation

[Dmitry Ishkov]

Right now if browser changes location (in SPA) the dialog stays open, an option for the dialog to be dismissed if this happens would be nice.

[Liran Brimer]

+1

I can think of two solutions for this:

1. Listen to history url changes and dismiss dialog (don't forget to remove event listener to prevent memory leak).
   This option you can implement yourself and not requires PR.
   https://github.com/ReactTraining/history/blob/master/README.md#listening

2. Render the dialog inside the caller and not as portal. Then caller component would be unmounted the dialog would be unmounted as well.
   This option requires PR in the lib.

[Gramoz Krasniqi]

It is not only nice but a must. There must be a way to programmatically close the dialog.
There is nothing in the documentation and i have looked into the code but couldn't find any way.

[Dmitry Ishkov]

I've done something like:

const history = createBrowserHistory()
window.reactRouterHistory = history
...
class ConfirmationDialog extends React.Component {
...
  componentDidMount() {
    this.unlisten = window.reactRouterHistory.listen(() => {
      this.props.cancel()
    })
  }

  componentWillUnmount() {
    this.unlisten()
  }
...
}

[KunihikoHarada]

Thanks for the suggestion.

As TheRusskiy noted, proceed, cancel, dismiss function are available anytime you need.

If there is better solution as a library, PR is welcomed!