Hello,
I've upgraded to the latest version 4.1.0 and am using the NPM packages (@bryntum/calendar and @bryntum/calendar-react). When I create a new event and run the sync() function on the crudManager it won't sync my event. However, when I move the event just a tiny bit in the calendar view and then sync() it syncs the event. Any idea why this is happening?
Here's the code I'm running:
import React, { Component, createRef } from "react";
import { BryntumCalendar } from "@bryntum/calendar-react";
class CalendarPlanning extends Component {
calendar = createRef();
state = React.createRef();
crudManager = {
transport: {
load: {
url: "/api/v1/planning/crud",
headers: {
"X-CSRF-TOKEN": document.querySelector("meta[name='csrf-token']").getAttribute("content")
}
},
sync: {
url: "/api/v1/planning/crud",
method: "PATCH",
headers: {
"X-CSRF-TOKEN": document.querySelector("meta[name='csrf-token']").getAttribute("content")
}
}
},
autoLoad: true
};
sidebar = {
items: {
resourceFilter: {
weight: 190,
style: "flex: 0 0 auto; margin-top: 1em",
label: __("Search users"),
id: "b-textfield-users-1",
type: "textfield",
keyStrokeChangeDelay: 100,
onChange: "up.onResourceFilterChange"
},
eventFilter: {
label: __("Search tasks")
}
},
onResourceFilterChange({ value }) {
this.widgetMap.resourceFilter.store.filter({
id: "resourceFilter",
filterBy: (data) => data.name.toLowerCase().includes(value.toLowerCase())
});
}
};
calendarConfig = {
style: "height: 100%",
ref: this.calendar,
crudManager: this.crudManager,
sidebar: this.sidebar,
tbar: {
items: {
commit: {
text: __("Commit"),
icon: "fas fa-code-commit",
onClick: () => this.getCalendar().crudManager.sync()
}
}
},
scheduleMenuFeature: true
};
constructor(props) {
super(props);
}
getCalendar() {
return this.calendar?.current?.calendarInstance;
}
render() {
const { calendarConfig } = this;
return (
<div>
<BryntumCalendar {...calendarConfig} />
</div>
);
}
}
export default CalendarPlanning;