How can i dismiss Dialog box on click confirm react spectrum ModalTrigger?

Question

I have a dialog box which I am using from ModalTrigger from react spectrum(old version). The dialog box has two buttons, Okay and Cancel.Nothing to do on cancel, but the action should be triggered on clicking of Okay, the dialog box should close and action should initiate. I am able to initiate action but dialog box is not closing.

Code:

 <ModalTrigger>
            <Button label="Do something" variant="action"></Button>
            <Dialog
                    confirmLabel="Confirm"
                    cancelLabel="Cancel"
                    mode="confirmation"
                    onConfirm={props.confirmAction}
                    keyboardConfirm="true"
                    backdropClickable={true}>
                {title}

            </Dialog>
        </ModalTrigger>

How can I close the dialog button when user clicks onConfirm and then start props.confirmAction?As of now, the dialog box don't close until props.confirmAction completes.

Answer 1

We can achieve it in 2 ways.

1. Write a method and trigger dialog.dismiss followed by props. confirmAction

const onClickConfirm ()=>{
  dialog.dismiss()
  props. confirmAction()
}

2. Use onDismiss instead of onConfirm