# Upgrade guide for Gantt v5.0.0

## Delaying calculations for faster initial render

Gantt now by default renders tasks faster than before after the initial load. This is achieved by postponing the engine
calculations to after the initial rendering, using the raw data as is. Thus, it requires loading pre-normalized data to
render correctly. When given un-normalized data it will render what it can and transition to the normalized result when
calculations are finished.

During the calculation phase, the Gantt component is made read-only. Calculation progress is displayed as a small
progress bar in the time axis header. If you prefer the old way of displaying progress, as a mask, you can configure it
using the [projectProgressReporting](#Gantt/view/Gantt#config-projectProgressReporting) config:

```javascript
new Gantt({
    // Display progress in a mask instead of the default small progress bar
    projectProgressReporting : 'mask'
})
```

If you run into issues with this new "early rendering" mode, you can turn it off at the project level using the
[delayCalculation](#Gantt/model/ProjectModel#config-delayCalculation) config:

```javascript
new ProjectModel({
    // Do not postpone calculations to after rendering, calculate first and delay rendering instead
    delayCalculation : false
})
```

In applications that have code which manipulates task records directly after load, the calculations (and setting up
references etc.) might not yet have finished when your code executes. If this causes issues in your app, try waiting for
them to finish before manipulating the tasks (or dependencies / resources / assignments):

```javascript
// Wait for delayed initial calculations to be performed
await project.commitAsync();

// Tasks are now normalized, references and buckets are set up, etc.
// Perform your custom logic now...
if (project.taskStore.first.resources.length > 1) {
    ...
}
```

## New scheduling issues handling popup

With this release Gantt starts displaying a popup informing about scheduling conflicts, cycles and calendar
misconfigurations found. The user can then choose a suitable remedy.

In order to prevent the popup from showing please set [displaySchedulingIssueResolutionPopup](#Gantt/view/Gantt#config-displaySchedulingIssueResolutionPopup)
to `false`.

```javascript
new Gantt({
    // disable default scheduling resolution popup
    displaySchedulingIssueResolutionPopup : false
});
```

## DependencyModel.active field has been made persistable

The change means that the field will be sent to the server with other dependency data when persisting.
It also means that the field will take part in undo/redo operations (since [StateTrackingManager](#Core/data/stm/StateTrackingManager)
tracks persistable fields only).

In order to revert to previous behavior please override the field and set its
[persist](#Core/data/field/DataField#config-persist) config to `false`:

```js
export class MyDependency extends DependencyModel {

    static get fields() {
        return [
            { name : 'active', persist : false }
        ];
    }

}
```

## Dependency "Active" field has been added to the dependency editor

New `Active` field has been added to the [dependency editor](#SchedulerPro/feature/DependencyEdit).
It allows disabling a dependency so it won't take part in the scheduling process.

To revert to old editor look and get rid of the field please use this code:

```js
new Gantt({
    ...
    features : {
        dependencyEdit : {
            // configure dependency editor to hide "Active" field
            editorConfig : {
                items : {
                    activeField : false
                }
            }
        },
```

## Task editor "Constraint type" field "keepTime" config has been changed to "entered"

This was done to not loose user provided time value. Previously it was `false` by default which resulted in stripping of
time info of the provided value.

To revert to the old behavior please use this code:

```js
new Gantt({
    ...
    features : {
        taskEdit : {
            items : {
                advancedTab : {
                    items : {
                        // adjust constraint type so it would strip time info
                        constraintDateField : {
                            keepTime : false
                        }
                    }
                }
            }
        },
```

## Changes to Engines ResourceAllocationInfo class

The Engine `ResourceAllocationInfo` class `allocation` property has been changed from an `Array` to an `Object` with two
properties `total` and `byAssignments`. The `total` property contains an array of the resource allocation intervals. And
the `byAssignments` is a `Map` keeping individual assignment allocation intervals with assignments as keys and arrays of
allocation intervals as values.

Basically the old `allocation` property content has been moved to the new `allocation.total` property so you need to
adjust your code accordingly.

Old code:
```javascript
allocationInfo.allocation
```

New code:
```javascript
allocationInfo.allocation.total
```

## Manually scheduled tasks do not skip non-working time anymore

Manually scheduled tasks have been changed to not skip non-working time for their proposed start/end date values.
This behavior is regulated by a new project
[skipNonWorkingTimeWhenSchedulingManually](#Gantt/model/ProjectModel#field-skipNonWorkingTimeWhenSchedulingManually)
which is `false` by default.
In order to revert to the previous behaviour when non-working time was skipped please set the config to `true`:

```javascript
new SchedulerPro({
    project : {
        skipNonWorkingTimeWhenSchedulingManually : true,
        ...
    }
});
```

## ResourceHistogram tooltip change

The histogram `getBarTip` config has been deprecated in favor of new
[barTooltipTemplate](#SchedulerPro/view/ResourceHistogram#config-barTooltipTemplate) config.

There are several differences between the two functions interfaces.
The new [barTooltipTemplate](#SchedulerPro/view/ResourceHistogram#config-barTooltipTemplate) function
accepts a single `Object` type argument whose properties provide the tooltip related info:

- `tip` - The tooltip instance
- `activeTarget` - The target bar-element that triggered the show
- `datum` - The hovered histogram bar info (third argument of deprecated `getBarTip` function)
- `datum.rectConfig` - The rectangle DOM configuration object (second argument of deprecated `getBarTip` function)

And the first argument (`series`) of deprecated `getBarTip` function is not supported by new `barTooltipTemplate`.
Since it was decided it's not used.

Please change your code accordingly.

**Old code:**
```javascript
new ResourceHistogram({
    getBarTip : (series, rectConfig, datum, index) => {
        return `<div class="my-tooltip">${datum.effort}</div>`;
    }
})
```

**New code:**
```javascript
new ResourceHistogram({
    barTooltipTemplate : ({ datum, index }) => {
        return `<div class="my-tooltip">${datum.effort}</div>`;
    }
})
```

## React wrappers now use module bundle

The React wrappers previously used the UMD bundle to import required classes:

**Old code:**
```javascript
import { TaskModel } from '@bryntum/gantt.umd.js';
```

UMD bundle is not used anymore in the wrappers so the import line in the above code needs to be changed:

**New code:**
```javascript
import { TaskModel } from '@bryntum/gantt';
```

Imports from `@bryntum/gantt-react` remain same.


<p class="last-modified">Last modified on 2023-10-26 8:19:02</p>