[REACT] Disable automatic forward scheduling for activities

[vconstruct]

Hi Team,

We are using bryntum gantt to visualize our schedule data but we found that the events where being forward scheduled, to prevent that we added manuallyScheduled: true flag to all our events but they are still being automatically forward scheduled. are we missing something in our configuration which would prevent the activities from being automatically forward scheduled.

We also tried changing the scheduling mode from normal to fixed duration to resolve this but to no avail.

Please advice.

[fabio.mazza]

Hello,
yes, setting manuallyScheduled: true is enough. Could you, please, provide us your config and data?

[vconstruct]

Hi,
we can give you the config but not the original data, let me get back to you after we have sanitized the data

[vconstruct]

Hi,
Below is the configuration that we have been using with bryntum gantt:

Column Def:

  const columnDef: Partial<ColumnStoreConfig>[] | object[] = [

{
  type: 'activityidcolumn',
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  renderer({ record }) {
    const emptyString = " ";
    if(record._data.activityid){
      return record._data.activityid
    }
    else {
        return emptyString
    }
  },
  text: 'Activity Id',
},
{
  type: 'name',
  field: 'name',
  text: 'Activity Name',
  width: 350,
  editor: false,
  tooltipRenderer : false,
},
{
  type: 'statuscolumn',
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  renderer({ record }) {
    const emptyString = " ";
    if(record._data.status){
      return record._data.status
    }
    else {
        return emptyString
    }
}
},
{ type: 'date', field: 'startDate', text: 'Start Date', editor: false},
{ type: 'date', field: 'endDate', text: 'End Date', editor: false},
{ type: 'duration', field: 'duration', editor: false , 
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
//@ts-ignore
  renderer: ({ record, column, isExport }) => {
    // return !record.duration ? parseInt(`0`) : record.duration
    if(isExport) {
      return !record.duration ? parseInt(`0`) : record.duration
    } else {
      return !record.duration ? `0 Days` : `${record.duration} Days`
    }
  }
},
{
  type: 'percentdone',
  field: 'percentDone',
  text: 'Progress',
  editor: false, 
  tooltipRenderer : false
},
{
  type: 'criticalcolumn',
  renderer: (record: any) =>{
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    //@ts-ignore
    if(record.record._data.isCritical){
        return "Yes"
    }else{
        return "No"
    }
  },
},
{
  type   : 'widget',
  text : 'Trade Partners',
  editor: false,
  htmlEncode : false,
  renderer: ({record, isExport}:any) => {
   const assignments = record.getAssigned()
   if(isExport){
      let assignmentList = "";
      assignments?.forEach((assignment: { _data: { resource: { _data: { name: string; }; }; }; }) => {
        assignmentList += `${assignment._data.resource._data.name};`;
      });
      return assignmentList.slice(0,assignmentList.length-1);
    }
    if (assignments?.size === 1) {
      return  `<div class = "chipView"> ${ [...assignments][0]._data.resource._data.name} </div>`
    } else if(assignments?.size > 1) {
      return `<div class = "chipView"> Multiple </div>`
    } else {
      return ''
    }
  },
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore 
  tooltipRenderer : ({record, column,cellElement}) => {
    let assignmentList = "";
    record.getAssigned()?.forEach((assignment: { _data: { resource: { _data: { name: string; }; }; }; }) => {
      assignmentList += `${assignment._data.resource._data.name}; `;
    });
    return assignmentList.slice(0,assignmentList.length-2);
  },
  filterType: 'text',
  filterable: {
    filterField: {
     type: 'text'
    },
    filterFn: ({ value, record }:any) => {
      if(record.getAssigned()?.size && value === ""){
        return true;
      }else if(record.getAssigned()?.size && value !== ""){
        let res = false;
        record.getAssigned().forEach((assignment: { _data: { resource: { _data: { name: string; }; }; }; }) => {
          if(assignment._data.resource._data.name.toLocaleLowerCase().includes(value.toString().toLocaleLowerCase()) ){
            res = true;
          }
        });
        return res;
      }else{
        return false;
      }
    }
  },
  sortable: false
},
{
  type : "hra",
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore  
  renderer : ({ record, isExport }) => {
    if(isExport){
      let hraList = "";
      if(record._data?.hra){
        record._data.hra?.forEach((hra: { hra_id: string; hra_description: string; }) => {
          hraList += `${hra.hra_id} - ${hra.hra_description},`
        });
      }
      return hraList.slice(0,hraList.length-1);
    }
    let hra = "";
   
    if(record._data?.hra?.length > 1){
      
     return  `<div class = "chipView"> Multiple </div>`
    
    }else if(record._data?.hra?.length === 1){
      
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    // @ts-ignore  
        hra += `<div class = "chipView">${record._data.hra[0].hra_id} - ${record._data.hra[0].hra_description}</div>`
    }
    return `<div class="chipViewRenderer">
                ${hra}
            </div>`
  },
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore 
  tooltipRenderer : ({ record, column }) => {
    if(record._data.hra && record._data.hra.length > 0){
      let res = "";
      record._data.hra.forEach((hra: { hra_id: string; hra_description: string; }) => {
        res += `${hra.hra_id}-${hra.hra_description}; `
      });
      return res.slice(0,res.length-2);
    }
  },
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore 
  filterable: ({ value, record }) => {
    if(record._data.hra && value === ""){
      return true;
    }else if(record._data.hra && value !== ""){
      let res = false;
      record._data.hra.forEach((hra: {hra_description: string ; hra_id: string; }) => {
        if(hra.hra_description.toLocaleLowerCase().includes(value.toString().toLocaleLowerCase()) || hra.hra_id.toLocaleLowerCase().includes(value.toString().toLocaleLowerCase())){
          res = true;
        }
      });
      return res;
    }else{
      return false;
    }
  },
  sortable: false
},
  ];

Selection Mode prop:

const selectionMode = {
    row : false,
    cell : false,
    rowCheckboxSelection : true,
    multiSelect : true,
    checkbox : true,
    showCheckAll : true,
    deselectFilteredOutRecords : true,
    includeChildren : true,
    preserveSelectionOnPageChange : true,
    preserveSelectionOnDatasetChange : true,
    deselectOnClick : true,
  }

Toolbar widget Options:

  const toolbarOptions: IToolbarModels = {
    ripple: true,
    zoomIn: true,
    zoomOut: true,
    zoomToFit: true,
    collapseAll: true,
    expandAll: true,
    filterActivities: true,
    hideEmptyWBS: true,
    hideNonCriticalTasks: true,
    hideGantt: true,
    hideCompletedTasks: true,
    showDateFilters: true,
    showHideDependency: true,
    export: true,
  };

Gantt Features prop:

const features: IFeatureModels = {
    // cellMenu : {
    //   disabled : true
    // },
    cellEdit: false,
    dependencyEdit : false,
    taskEdit : false,
    rowReorderFeature: false,
    taskDragFeature: false,
    taskResizeFeature: false,
    cellTooltip : {
      hoverDelay      : 0,
      textContent     : true,
      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
      // @ts-ignore  

      tooltipRenderer : ({ record, column }) => StringHelper.encodeHtml(record[column.field]),
      showOnHover : true,
      hideOnDelegateChange : true,
      hideDelay : 0

}
  };

React Gantt Component:

<BryntumGantt
          tbar={{}}
          onCellClick={(event?: any) =>
            props.scheduleInstance.rowSelection(event)
          }
          height={'inherit'}
          width={'inherit'}
          ref={(ganttRef: any) => {
            if (!props.scheduleInstance.getGanttInstance()) {
              props.scheduleInstance.setGanttInstance(ganttRef);
              // eslint-disable-next-line @typescript-eslint/ban-ts-comment
              //@ts-ignore
              ref.current = ganttRef;
            }
          }}
          percentBarFeature={{ allowResize: false }}
          taskDragFeature={false}
          taskResizeFeature={false}
          taskSegmentDragFeature={false}
          taskSegmentResizeFeature={false}
          rowReorderFeature={false}
          features={{
            excelExporter: {
              dateFormat: 'YYYY-MM-DD HH:mm',
              zipcelx,
            },
            filter: true,
            timeRanges: true,
            projectLines: false,
            cellTooltip: props.features.cellTooltip,
            ...props.features,
            taskMenu: false,
          }}
          dependenciesFeature={{
            allowCreate: false,
          }}
          dependencyEditFeature={false}
          taskEditFeature={getTaskEditorItems(
            emitNotesInput,
            saveTrigger,
            HRAListData,
            emitHraInputForAssign,
            addHRAsTrigger,
            TradepartnerList,
            emitTradepartnerInputForAssign,
            addTPTrigger,
            removeTPTrigger,
            emitTradepartnerInputForRemove,
            removeHRATrigger,
            emitHRAInputForRemove,
            props
          )}
          onAfterTaskEdit={(event: any) => {
            saveNotes(event);
            addTradePartners(event);
            addHRAs(event);
            removeTradePartner(event);
            removeHRA(event);
          }}
          listeners={{
            beforeTaskEditShow(event: any) {
              const { editor, taskRecord } = event;
              const widgetMap = editor.widgetMap;
              const TPCombo = widgetMap.tradePartnersTab.widgetMap.TPCombo;
              const HRACombo = widgetMap.HRATab.widgetMap.HRACombo;
              TPCombo.value = null;
              HRACombo.value = null;
              setSelectedActivity(taskRecord);
              loadCustomTabsData(editor, taskRecord, widgetMap, props);
            },
            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
            // @ts-ignore
            cellDblClick({ record }) {
              props?.scheduleInstance.showTaskEditDialog(record._data.guid);
            },
            beforePresetChange(event: {
              source: any;
              preset: { options: { startDate: any; endDate: any } };
            }) {
              const gantt = event.source;
              event.preset.options.startDate = gantt.project.startDate;
              event.preset.options.endDate = gantt.project.endDate;
            },
          }}
          selectionMode={props.selectionMode}
          displaySchedulingIssueResolutionPopup={false}
        />

The json data that we trying to use comes from mpxj and its larger that 30mb is there anyother way we can send you the sample data?

Please advice

[mats]

The json data that we trying to use comes from mpxj and its larger that 30mb is there anyother way we can send you the sample data?

Yes you could upload it to any file hosting service and post the link here then we can download it to debug.

[vconstruct]

https://drive.google.com/file/d/1yPsi50Yx9oYVEX0P2_h7AIUFRNwmzDmI/view?usp=sharing

this link has the file please let me know if you are facing challenges accessing the data

[alex.l]

Hi, JSON you posted is not valid and cannot be used in our demos. I am not sure what exactly is wrong, it contains 851k lines so it's hard to check all the file.

Screenshot 2023-05-31 at 11.22.05.png (89.61 KiB) Viewed 1572 times

but they are still being automatically forward scheduled.

So you see no difference if you added or not added manuallyScheduled flags for tasks?
Does it reproducible only when you use exactly attached set of data, or you see flag is ignored even if you used 2-5 tasks in a project?

[vconstruct]

Hi, JSON you posted is not valid and cannot be used in our demos. I am not sure what exactly is wrong, it contains 851k lines so it's hard to check all the file.
Screenshot 2023-05-31 at 11.22.05.png

but they are still being automatically forward scheduled.

So you see no difference if you added or not added manuallyScheduled flags for tasks?
Does it reproducible only when you use exactly attached set of data, or you see flag is ignored even if you used 2-5 tasks in a project?

My apologies i have uploaded a new dataset for you to test with,

https://drive.google.com/file/d/1S2AzfWFcnotwxph6tyBHf5d1hohgMB1q/view?usp=sharing

we use this data since we are have thoroughly tested it, please find below the tasks where we found the enddate in bryntum were not matching with what we had provided in the dataset

activity guid --> d018bebb-fbb3-7543-9d9d-e17d6b50d0db
activity name--> test124

activity guid --> 961e28fb-0dcc-6b46-955a-2a9bc7edc7ca
activity name--> test123

activity guid --> 474e2129-3c49-af49-b7be-dcead0f94f7c
activity name--> test256

activity guid --> 378bf5ac-ae1b-d540-babd-b88ce96379a6
activity name--> test789

activity guid --> c2f82f0f-e5f3-5941-b8bf-9bad298b0072
activity name--> test000

[alex.l]

While I am checking that, I want to clarify that manuallyScheduled allows to set manual startDate, but endDate will be calculated according to available time (calendars and other constraints). If you want to ignore project's calendar, you can set own calendar for task/resource with all time as working or any other configuration you want.

[devsoftware@dpr.com]

What configurations do we need to apply at the project or task level to disable any enddate calculations and use the enddate from the data the way it comes.