Zendesk web widget status not correctly updating and button not hiding

Question

I'm loading the Zendesk web widget into a page, and this is the event handler for when it's loaded in

scriptElement.onload = function () {
    zE(function () {
        $zopim(function () {
            $zopim.livechat.button.setHideWhenOffline(true);

            $zopim.livechat.setOnStatus(function (status) {
                console.log('status',status);

                status === 'online' ? $zopim.livechat.button.show() : $zopim.livechat.button.hide();
            });

            $zopim.livechat.setStatus('offline');
        });
    });
};

It has the setOnStatus event handler which should trigger anytime the status changes. It seems to be triggered once when the page initially loads in. You'd expect it to be triggered as well everytime I call the setStatus method, but that's not the case. Where I log the status, it's always just 'online', and it only happens once.

What I'm trying to do is force the button to disappear when the status is offline. Yet setting the status to 'offline' doesn't hide the button, just displays the offline version (i.e. a button which lets me send an offline message, rather than a live chat).

I thought the setHideWhenOffline method might have helped, but that doesn't seem to make any difference in this case.

Any ideas?

Answer 1

Actually I found the solution I needed here, this prevents the offline button appearing.

window.zESettings = {
    webWidget: {
        contactForm: {
            suppress: true
        }
    }
};

https://developer.zendesk.com/embeddables/docs/widget/settings#suppress