Inertia before event with callback dialog

[fallen karma]

I am trying to prevent a user from navigating away from my form if it is dirty, to do this I am showing a primevue confirm dialog. The issue is the dialog uses accept and reject callbacks to determine the dialog answer. This causes the before code to return right away and do the navigation after flashing the dialog. Is there a way to make this work or do I have to come up with a different solutions?

code:

router.on("before", (event) => {
        if (isDirty.value) {
            confirm.require({
                message: "You have unsaved changes. Are you sure you want to leave?",
                header: "Warning",
                icon: "pi pi-exclamation-triangle",
                accept: () => {
                    isDirty.value = false;
                    return true;
                },
                reject: () => {
                    return false;
                }
            });
        } else {
          return true;
        }
    });

[burnt charm]

Did you try returning the promise?

[fallen karma]

Not sure what you mean