Hi there,
Have you checked our guide on upgrading?
For Gantt: https://bryntum.com/products/gantt/docs/api/guides-upgrading-gantt
As you're upgrading from 5.0.5 to 5.5.4, you should start checking from 5.1.0 to 5.6.2.
For Scheduler: https://bryntum.com/products/scheduler/docs/api/guides-upgrading-scheduler
Start checking from 5.1.0 to 5.6.2.
For SchedulerPro: https://bryntum.com/products/schedulerpro/docs/api/guides-upgrading-scheduler-pro
Start checking from 5.1.0 to 5.6.2.
For Calendar: https://bryntum.com/products/calendar/docs/api/guides-upgrading-calendar
Start checking from 5.1.0 to 5.6.2.
Regards,
Ghous
Thanks @Ghulam, this tool looks amazing !
What would be heaven: having the tool that scans our codebase, and then suggest things to update regarding the API diff generated (which is every time quite heavy, cf https://bryntum.com/products/gantt/docs/?v=5.1.0#apidiff)
Hi @Ghulam,
I have a problem with our custom columns, for some reason doesn't work with Gantt version v5.6.6
const columns:
| ColumnStore
| Partial<ColumnStoreConfig>
| Partial<GridColumnConfig>[]
| undefined = React.useMemo(() => {
return [
{
autoWidth: true,
field: "taskNumber",
renderData: ({
record,
value,
}: {
value: string;
record: { originalData: GanttDataType };
}) => {
/** TODO:
* - Fix render our custom number of task
*/
return record.originalData.type === "task" ? (
<TaskNumber
color={record.originalData.firstLabelColor as Color}
closed={record.originalData.percentDone === 100}
size="small"
>
{value}
</TaskNumber>
) : null;
},
text: "N°",
type: "number",
},
{
field: "name",
renderData: ({
column,
grid,
record,
value,
}: {
column: Column;
grid: GridBase;
record: {
id: string;
name: string;
type: string;
};
value: Date;
}) => {
const isSubTask = record.type === "subtask";
return isSubTask ? (
<SubTaskDescription
subtaskId={record.id}
description={record.name}
onSucess={() => grid.refreshColumn(column)}
>
{value}
</SubTaskDescription>
) : (
<TaskDescription
description={record.name}
taskId={record.id}
onSucess={() => grid.refreshColumn(column)}
>
{value}
</TaskDescription>
);
},
text: t("screens.ProjectTasksGantt.columnNameLabel", "Name"),
type: "name",
width: 300,
},
{
autoWidth: true,
renderData: ({
column,
grid,
record,
value,
}: {
column: Column;
grid: GridBase;
record: {
id: string;
startDate: Date;
endDate: Date;
type: string;
};
value: Date;
}) => {
const isSubTask = record.type === "subtask";
return isSubTask ? (
<SubTaskDates
startDate={record.startDate}
endDate={record.endDate}
projectId={props.projectId}
subtaskId={record.id}
onSucess={() => grid.refreshColumn(column)}
>
{value ? dayjs(value).format("ll") : undefined}
</SubTaskDates>
) : (
<TaskDates
startDate={record.startDate}
endDate={record.endDate}
projectId={props.projectId}
taskId={record.id}
onSucess={() => grid.refreshColumn(column)}
>
{value ? dayjs(value).format("ll") : undefined}
</TaskDates>
);
},
text: t("screens.ProjectTasksGantt.columnStartDateLabel", "Start date"),
type: "startdate",
},
{
autoWidth: true,
renderData: ({
column,
grid,
record,
value,
}: {
column: Column;
grid: GridBase;
record: {
id: string;
startDate: Date;
endDate: Date;
type: string;
};
value: Date;
}) => {
const isSubTask = record.type === "subtask";
return isSubTask ? (
<SubTaskDates
startDate={record.startDate}
endDate={record.endDate}
projectId={props.projectId}
subtaskId={record.id}
onSucess={() => grid.refreshColumn(column)}
>
{value ? dayjs(value).format("ll") : undefined}
</SubTaskDates>
) : (
<TaskDates
startDate={record.startDate}
endDate={record.endDate}
projectId={props.projectId}
taskId={record.id}
onSucess={() => grid.refreshColumn(column)}
>
{value ? dayjs(value).format("ll") : undefined}
</TaskDates>
);
},
text: t("screens.ProjectTasksGantt.columnEndDateLabel", "End date"),
type: "enddate",
},
{
autoWidth: true,
renderData: ({
column,
grid,
record,
}: {
column: Column;
grid: GridBase;
record: {
assignations: ProjectTasksGantt_AssignationsFragment;
id: string;
};
}) => (
<TaskAssignees
assignations={record.assignations}
projectId={props.projectId}
taskId={record.id}
onSuccess={() => grid.refreshColumn(column)}
/>
),
text: t("screens.ProjectTasksGantt.columnAssigneesLabel", "Assignees"),
},
{
autoWidth: true,
field: "duration",
renderData: ({
record,
}: {
record: { startDate: Date; endDate: Date; type: string };
}) =>
record.startDate && record.endDate ? (
<Text tone="secondary">
{dayjs(record.startDate).to(record.endDate, true)}
</Text>
) : undefined,
text: t("screens.ProjectTasksGantt.columnDurationLabel", "Duration"),
type: "duration",
},
];
}, [props.projectId]);
Hi @tasnim,
We have a problem when we try to upgrade the packages from 5.6.5 to 5.6.6, this error is coming out, I read the documentation but don't help me, can you please check it if we need a special mode to fixed on React?
That happen when we try the upgrade for the Calendar, Gantt or Schedulerpro
chunk-BAQODGDL.js?v=0d79547c:872 Uncaught Error: The Bryntum Grid bundle was loaded multiple times by the application.
Common reasons you are getting this error includes:
* Imports point to different types of the bundle (e.g. *.module.js and *.umd.js)
* Imports point to both sources and bundle
* Imports do not use the shortest relative path, JS treats them as different files
* Cache busters differ between imports, JS treats grid.module.js?1 and grid.module.js?2 as different files
* Imports missing file type, verify they all end in .js
Another thing @tasnim,
When I made the upgrade I lost those events for my components with version v5.6.5, can you help me with the new events that I can replace for it?
BryntumCalendar:
onEventClick, onBeforeDragMoveEnd, onBeforeDragResizeEnd and onDragCreateEndBryntumSchedulerPro:
onScheduleDblClick, onBeforeEventDropFinalize
When I made the upgrade I lost those events for my components with version v5.6.5, can you help me with the new events that I can replace for it?
Of course, Is it possible for you to provide a runnable test case so we can check what's wrong?
By the way, aren't you using thin bundles to combine products?