confirm() utility method in Valence.util.Helper

[calexander]

Hello, something that would be really helpful would be a method for creating a simple Yes/No or OK/Cancel confirmation dialog from Javascript. Currently what I do is

Ext.Msg.confirm('my title', 'my message',
    function(btn) { // the callback
        if (btn === 'yes') { // yes/ok
            // do something for Yes
        } else { // no/cancel
            // do something for No
        }
    }
);?

This works great except that the Yes/OK button is on the left and the No/Cancel button is on the right, which isn't consistent with how Valence does it. If there was a method in Valence.util.Helper that worked similarly for a simple confirmation dialog, but with the buttons ordered like they typically are in Valence that would be great.

I've tried to use Ext.Msg.show to let me reorder the buttons:

Ext.Msg.show({
    title: 'my title',
    message: 'my message',
    buttons: [{
        itemId: 'no',
        text: 'No'
    }, {
        itemId: 'yes',
        text: 'Yes'
    }],
    icon: Ext.Msg.QUESTION,
    fn: function(btn) {
        // do something
    }
});?

but the buttons do not show; however, if I run the same exact code here: https://docs.sencha.com/extjs/7.1.0/modern/Ext.Msg.html in one of the Fiddle example sections, then it seems to run it fine. I assume it must be because of something that Valence is overriding that makes that approach not work.
?

[calexander]

Ext.Msg.confirm example: image.png?

[Johnny Major]

Sure, you can use:

Valence.common.util.Dialog.show({
    title: 'My Title',
    msg: 'My Message',
    buttons: [{
        text: 'No',
        parmText: 'no'
    }, {
        text: 'Yes',
        focusOnShow: true,
        ui: 'primary',
        parmText: 'yes'
    }],
    minWidth: 350,
    handler: function (btn) {
        if (btn === 'yes') {
            console.log('You clicked yes');
        } else {
            console.log('You clicked no');
        }
    }
});

[calexander]

That is perfect, thank you!