[REACT] change the error window when loading / synchronizing the gantt chart

[tikhonov.a.p]

Good afternoon, tell me if it is possible to change the error window when loading / synchronizing the gantt chart?

[alex.l]

It is. You need to change it in localization. Find localization demo in "/examples/localization" folder, in /locales subfolder you'll see examples of locales. The line you need is

    GridBase : {
        loadFailedMessage  : 'Wird geladen, bitte versuche es erneut!',

Here is the guide how to use custom locales https://bryntum.com/docs/gantt/guide/Gantt/customization/localization

[tikhonov.a.p]

Yes, I found the localization. Meant in general to make other processing of an error. For example, add some elements, information about the error that arrived in the request, etc.

[alex.l]

You can add information about the error, just put the text/html in message param of your response object.

[tikhonov.a.p]

Gantt Version: 4.3.8

Returned response: code 500

body {"status":"FAILED","message":"Something error"}

However, the displayed error has not changed in any way.

Is there some render method that can be changed to affect the content of the error?

If not, can we make a change request?

I really want to be able to generate an error report and display it with such troubles

[alex.l]

Here is my response example

{
    "success"      : false,
    "message"      : "Hello world"
}

Result I see I've attached below. Please try if it works for you.

[tikhonov.a.p]

I found why I could not reproduce for a long time.

This only works if the Response status is 200.

Can I somehow influence this?

So that on other statuses other than 200, if there is a message in the response body, is it displayed on the screen?

[alex.l]

That's a bug, ticket is here https://github.com/bryntum/support/issues/4591

As a temp workaround, try to override CrudManagerView::onCrudManagerRequestFinalize

onCrudManagerRequestFinalize(successful = true, requestType, response) {
        const me = this;

    if (successful) {
        me.masked = null;
        me.toggleEmptyText?.();
    }
    else {
        // Do not remove. Assertion strings for Localization sanity check.
        // 'L{GridBase.loadFailedMessage}'
        // 'L{GridBase.syncFailedMessage}'

        me.applyMaskError(
            `<div class="b-grid-load-failure">
                <div class="b-grid-load-fail">${me.L(`L{GridBase.${requestType}FailedMessage}`)}</div>
                ${response && response.message ? `<div class="b-grid-load-fail">${me.L('L{CrudManagerView.serverResponseLabel}')} ${response.message}</div>` : ''}
            </div>`);
    }
}

response is null now (that's the actual bug). But you can get it using const responseString = this.project.decode();

[tikhonov.a.p]

Can you tell me how to override this method?

Attempt to use Override failed

displayed error don't change

class CrudManagerViewOverride{
    static get target() {
        return {
            class      : CrudManagerView,
            product    : 'grid',
        }
    }
    onCrudManagerRequestFinalize(successful, requestType, response){
        const me = this;

    if (successful) {
        me.masked = null;
        me.toggleEmptyText?.();
    }
    else {
        // Do not remove. Assertion strings for Localization sanity check.
        // 'L{GridBase.loadFailedMessage}'
        // 'L{GridBase.syncFailedMessage}'

        me.applyMaskError(`<div>SOMETHING</div>`);
    }
}
}
Override.apply(CrudManagerViewOverride);

[alex.l]

The easiest way to do that is to define that method in Gantt

const gantt = new Gantt({
    appendTo : 'container',

dependencyIdField : 'wbsCode',

project : {
    // ...
},

onCrudManagerRequestFinalize(successful, requestType, response){
    const me = this;

    if (successful) {
        me.masked = null;
        me.toggleEmptyText?.();
    }
    else {
        // Do not remove. Assertion strings for Localization sanity check.
        // 'L{GridBase.loadFailedMessage}'
        // 'L{GridBase.syncFailedMessage}'

        me.applyMaskError(`<div>SOMETHING</div>`);
    }
},