How to close a modal when navigating away

[mrhighstone]

I'm using this awesome plugin, and on one of the modals a link is being shown. When the link is clicked and the user navigates to another page (within the application) the modal dialog remains open. The page underneath refreshes. How can the modal be closed/dismissed/rejected when the user navigates away from the current page?

I'm successfully using this with headlessui plugin in a Vue application, but I haven't found a decent solution to this. Any ideas?

[AndrewBastin]

@mrhighstone ahhhh, that is an interesting problem that I have missed in the design of the library. Good catch :)

So, here is my proposal I would love to get your feedback on, what if we automatically reject modals when the component which called openModal on it gets unmounted ?

On the technical implementation side, when you call useModals composable to get access to the openModal function, that specific instance of openModal will reject any unresolved modal when that component (which called useModal to get that function) unmounts.

Does this work for you ? Any corner case or better heuristic you think I might have missed ?

[mrhighstone]

I think that would be a perfect, and logical solution to do so.
I cannot think of any edge cases at the moment.