Hello,
I am struggling with the implementation of the CrudManager with sync of changes to recurring events.
I am using the Angular basic example as a basis: https://bryntum.com/products/calendar/examples/frameworks/angular/basic/dist/basic
I changed the CrudManager configuration to include a sync url and enabled autoSync
. Nothing else has been changed from the example:
crudManager : {
transport : {
load : {
url : 'http://localhost:3000/api/calendar/load',
method: 'POST',
credentials: 'omit',
},
sync : {
url : 'http://localhost:3000/api/calendar/sync',
method: 'POST',
credentials: 'omit',
}
},
autoLoad : true,
autoSync : true
},
When creating a recurring event, the sync performs well and adds the recurring event to the UI.
Sync Request:
{
"type": "sync",
"requestId": 17115702491131,
"events": {
"added": [
{
"startDate": "2024-04-29T04:00:00+02:00",
"endDate": "2024-04-29T05:00:00+02:00",
"duration": 1,
"durationUnit": "hour",
"cls": "",
"name": "Recurring",
"recurrenceRule": "FREQ=DAILY",
"exceptionDates": [],
"allDay": false,
"$PhantomId": "_generatedf_b48a9a1c-cc5e-481b-acc1-edbc46c3ac84"
}
]
}
}
Sync Response:
{
"type": "sync",
"success": true,
"events": {
"rows": [
{
"id": "66047d49b36fdbc2515332da",
"$PhantomId": "_generatedf_b48a9a1c-cc5e-481b-acc1-edbc46c3ac84"
}
],
"removed": []
}
}
When changing the second occurrence of the series by shifting it by one hour and selection option "all future events", the sync request is also executed according to the documentation.
Sync Request:
{
"type": "sync",
"requestId": 17115702997732,
"events": {
"added": [
{
"startDate": "2024-04-30T05:00:00+02:00",
"endDate": "2024-04-30T06:00:00+02:00",
"duration": 1,
"durationUnit": "hour",
"cls": "",
"name": "Recurring",
"recurrenceRule": "FREQ=DAILY",
"exceptionDates": [],
"allDay": false,
"$PhantomId": "_generated:66047d49b36fdbc2515332da:2024-04-30"
}
],
"updated": [
{
"recurrenceRule": "FREQ=DAILY;UNTIL=20240430T035900",
"exceptionDates": ["2024-04-30T00:00:00+02:00"],
"id": "66047d49b36fdbc2515332da"
}
]
}
}
Sync Response:
{
"type": "sync",
"success": true,
"events": {
"rows": [
{
"id": "66047d7bb36fdbc2515332eb",
"$PhantomId": "_generated:66047d49b36fdbc2515332da:2024-04-30"
},
{
"id": "66047d49b36fdbc2515332da",
"name": "Recurring",
"startDate": "2024-04-29T02:00:00.000Z",
"endDate": "2024-04-29T03:00:00.000Z",
"recurrenceRule": "FREQ=DAILY;UNTIL=20240430T015900Z",
"exceptionDates": [
"2024-04-29T22:00:00.000Z"
]
}
],
"removed": []
}
}
However, it seems that the application cannot correctly identify the response of the newly added series, as the change is kept in the changes
queue of the store.
Whenever another UI operation is performed - like adding another unrelated one-time event - the added event of the previous series split operation is sent as added
again and again (with the id of the split series as $PhantomId
). Resulting in a lot of new series, as the backend interprets this as a newly added event.
Additional (unexpected) Sync Request:
The $PhantomId
is the real id
of the previously created event of the split series.
{
"type": "sync",
"requestId": 17115703960873,
"events": {
"added": [
{
"startDate": "2024-04-30T05:00:00+02:00",
"endDate": "2024-04-30T06:00:00+02:00",
"duration": 1,
"durationUnit": "hour",
"cls": "",
"name": "Recurring",
"recurrenceRule": "FREQ=DAILY",
"exceptionDates": [],
"resourceId": null,
"allDay": false,
"$PhantomId": "66047d7bb36fdbc2515332eb"
}
]
}
}
Sync Response:
Again, a new recurring event has been created in the backend.
{
"type": "sync",
"success": true,
"events": {
"rows": [
{
"id": "66047ddcb36fdbc251533312",
"$PhantomId": "66047d7bb36fdbc2515332eb"
}
],
"removed": []
}
}
As mentioned, this additional added
sync request is repeatedly sent to the backend whenever another action is performed in the calendar UI. It seems that the added
change is never completed and removed from the changes queue in the CrudManager or Store.
What am I doing wrong?
Best regards,
Alex