Our pure JavaScript Scheduler component


Post by neric »

Hello,
on my scheduler, I'm listening for the onBeforeEventDropFinalize event, and i'm calling an API inside. So as the doc says, I use

context.async = true;

inside to tell the event I will resolve it later.

For my API call, I need to know the new startDate and endDate, data I'm taking from context.startDate and context.endDate.

But here come the problem, I've notice that sometimes, the context.startDate I get is not the same than the one displayed inside the tooltip displayed while dragging an event...

  const handleEventDropFinalize = useCallback(
    async ({ context }: SchedulerOnEventDropProps) => {
      // CF. doc, this is intended
      context.async = true;

  const { id } = context.eventRecord.data;

  console.log({ startDate: context.startDate });

  const isoStartDate = moment(context.startDate).utc(true).toISOString();
  const isoEndDate = moment(context.endDate).utc(true).toISOString();
  
  const finalize = (value: boolean) => () => {
    context.finalize(value);
  };

  await updateSchedulerCampaignDates({
    startDate: isoStartDate,
    endDate: isoEndDate,
    campaignId: id,
    onSuccess: finalize(true),
    onError: finalize(false),
  });
},
[updateSchedulerCampaignDates],
  );

In the code above, I'd say 6 or 7/10 times, it works correctly, but the rest of the time, I have a difference between the date in tooltip and the date in the context. This is totally random..

When dragging the date to the right, I may see 17:00 in the drag tooltip, and I get 18:00 in the context.startDate.
And the problem is reversed when dragging to the left: I see 17:00 in the drag tooltip and I get 16:00 in the context.startDate.

I don't know if it help, but I'm in french actually, so timezone is GMT + 1.

Thanks in advance for your help, much appreciate


Post by neric »

Could it be that I still move the mouse after dropping, so it add one more hour ? (this is the timeResolution configuration of the scheduler) ?


Post by mats »

Hard to say what's going on, any chance you can find the sequence of how to reproduce and upload a minimal test case so we can have a look?


Post by neric »

I would say that the sequence is quite simple: Just dragging an event to the right, and sometimes, the context.startDate is +1 than the one displayed in the tooltip at the drop moment. Or dragging an event to the left, and sometimes, the context.startDate is -1 than the one displayed in the tooltip. I can try to record my screen if it could help ? But I'm a bit busy to upload a test case sadly ..


Post by neric »

This is a video that show you the problem: On the first try, the dates are the same, but not on the second try.. https://youtu.be/69_8NZOdEcw


Post by alex.l »

Hi neric,

Ok, I see it on your video, but it works great in our online demos. Maybe it because of your utc() converting and the way how you save it... We might have a look at your real app and try to figure out, or try it yourself.
It would be great if you'll try to reproduce it in our examples.

All the best,
Alex


Post by neric »

Hi Alex,
I don't think it's due to the utc() because as you can see in the video, there is 2 console.log, and the first one is context.startDate without any moment transformation, so I don't think this is the point here :(


Post by alex.l »

First one shows initial data, from the second one we see a value that has been set with before event drop manipulations. Anyway, that's just an idea, I don't have enough information to say exactly, we have to think a bit how to reproduce it on our side...

All the best,
Alex


Post Reply