Recurrence Rule in the getRecurrenceDates()

Question

Hello,We are running into a problem with the Recurrence Editor. In our case, we created a recurrence starting at

13/06/2022 07:00PM-08:00pm(Mountain Time, UTC -7), set to repeat weekly, every Monday. (We saved it as 14/06/2022 01:00AM-02:00AM(UTC) in our database ). But when we passed this rule through the getRecurrenceDates function, it started the recurrence at 20/06/2022 01:00AM-02:00AM(UTC) instead of 21/06/2022

01:00AM-02:00AM(UTC), so after the conversion to mountain time, it goes to 19/06/2022. We found out this only happens if we have the BYDAY parameter in the Recurrence Rule. There is any way to fix it?With BYDAY: Without BYDAY:

Ravikumar Venkatesan · Answer

Hi Rodrigo,Greetings from Syncfusion support.We have validated your query “Recurrence date at
20/06/2022 01:00AM-02:00AM(UTC) instead of 21/06/2022 01:00AM-02:00AM(UTC)”
at our end. The scenario that you explained is the behavior of the Recurrence
editor.With BYDAY:In your shared images you have passed May 31, 2022(Tuesday)
and you set the BYDAY value as Monday. In that week, no more Monday
after May 31, So on recurrence date generation you will get the first Monday(June
6, 2022).Without BYDAY:In your shared images you have passed May 31, 2022(Tuesday)
and you didn’t set the BYDAY value. In that BYDAY is taken from start date. So,
the recurrence editor automatically takes May 31, 2022(Tuesday) as the
BYDAY value. So, on recurrence date generation you will get the first Tuesday(May
31, 2022) and the second Tuesday(June 7, 2022).  Note:If you pass June 13, 2022(Monday)(Mountain Time, UTC -7)
to the getRecurrenceDates method. You will get May, 13 and May 20, 2022,
as the recurrence dates.Kindly let us know if you need any further assistance.Regards,Ravikumar Venkatesan

Rodrigo Bergel · Answer

Hi,We are passing a Date object as startTime, but this Date object is in UTC by default. So, there is a parameter we can use to pass the timezone for the getRecurrenceDates?Thanks.

Ravikumar Venkatesan · Answer

Hi Rodrigo,  We have validated your query “Is a parameter we
can use to pass the timezone for the getRecurrenceDates?” at our end. We
suggest you use the Schedule Timezone module add a method to
convert the date to your required timezone then send the converted date to the getRecurrenceDates
method to achieve your requirement.[app.component.ts]

export class AppComponent {
    public recurrenceEditor;
    public timezone;
    public getRecurrenceDates() {
      const data: Record<string, any>[] = [
        {
          Id: 1,
          Subject: 'Meeting',
          StartTime: '2022-06-13T01:00:00.000Z',
          EndTime: '2022-06-13T02:00:00.000Z',
          RecurrenceRule: 'FREQ=WEEKLY;BYDAY=MO;INTERVAL=1;'
        }];
      if (!this.recurrenceEditor) {
        this.recurrenceEditor = new RecurrenceEditor({});
        this.recurrenceEditor.appendTo('#recurrence-editor');
      }
      if (!this.timezone) {
        this.timezone = new Timezone();
      }
      // Converting UTC to UTC -7 date time
      let start = this.timezone.add(new Date(data[0].StartTime), 'America/Denver');
      // Sending converted date time to getRecurrenceDates
      const recurrenceDates: number[] = this.recurrenceEditor.getRecurrenceDates(start, 'FREQ=WEEKLY;BYDAY=MO;INTERVAL=1;', '', 2);
      alert('Dates: ' + new Date(recurrenceDates[0]).toString() + " " + new Date(recurrenceDates[1]));
    }
  }

Sample: https://stackblitz.com/edit/ej2-angular-generating-recurrence-dates-sample?file=app.component.tsKindly try the shared sample and let us know if you
need any further assistance.Regards,Ravikumar Venkatesan

Rodrigo Bergel · Answer

Hi  Ravikumar Venkatesan!Thank you for being very helpful so far, we have tested your solution and it partially works for our needs. Since we are using  getRecurrenceDates to generate recurrences on our server (please let me know if there is a better way to do that using Node.js), the server is in UTC. Which means that the output from  getRecurrenceDates will be a date in UTC as well, which after sending to frontend will be converted to the user's timezone and then giving the wrong time.In a practical example we have a UTC date:﻿﻿2022-05-24T01:00:00.000Zafter parsing to desired timezone using your solution, in that case will be US/Mountain.﻿﻿`const start = timezone.add(new Date("2022-05-24T01:00:00.000Z"), 'US/Mountain')`//start value is: 2022-05-23T19:00:00.000ZThen inserting the parsed time to the library:const recurrenceStartTimes = recHelper.getRecurrenceDates(              start,             "FREQ=WEEKLY;BYDAY=MO;INTERVAL=1;",              null,              365            )One sample of the library output will be:recurrenceStartTimes.forEach((startTime) => {    console.log(new Date(startTime)) })`2022-06-06T19:00:00.000Z`Then sending this date to frontend will parse the time to client's timezone which assuming that the client is on US/Mountain will result in: 2022-06-06T13:00:00.000ZWhich means that the correct output from library should be "2022-06-07T01:00:00.000Z" because this date when sended to frontend and parsed to client's timezone will give the correct time  2022-06-06T19:00:00.000Z.So basically here what should solve our problem is if there is a way to add back the offset from timezone parsing to the getRecurrenceDates output something like converting the output time back to UTC-0 like:recurrenceStartTimes.forEach((startTime) => {              console.log(timezone.add(new Date(startTime), 'Etc/UTC'))            })But the log from the sample above is returning the same time that we input, probably because new Date() already generates the Date object in UTC so there should be no conversion when parsing to UTC, right?Is there a way that we could solve this problem?Again thank you for your assistance so far!

Ravikumar Venkatesan · Answer

Hi Rodrigo,Q: Which means that the correct output from the
library should be "2022-06-07T01:00:00.000Z" because this date when
sent to the frontend and parsed to the client's timezone will give the correct
time 2022-06-06T19:00:00.000Z We have validated your above query at our end and we
suggest you use the convert method of the Schedule Timezone
module to reverse the generated recurrence date to the UTC date-time as
mentioned in the below code snippet.[app.component.ts]

export class AppComponent {
    public recurrenceEditor;
    public timezone;
    public getRecurrenceDates() {
      const data: Record<string, any>[] = [
        {
          Id: 1,
          Subject: 'Meeting',
          StartTime: '2022-06-13T01:00:00.000Z',
          EndTime: '2022-06-13T02:00:00.000Z',
          RecurrenceRule: 'FREQ=WEEKLY;BYDAY=MO;INTERVAL=1;'
        }];
      if (!this.recurrenceEditor) {
        this.recurrenceEditor = new RecurrenceEditor({});
        this.recurrenceEditor.appendTo('#recurrence-editor');
      }
      if (!this.timezone) {
        this.timezone = new Timezone();
      }
      // Converting UTC to UTC -6 date time
      let start = this.timezone.add(new Date(data[0].StartTime), 'America/Denver');
      // Sending converted date time to getRecurrenceDates
      const recurrenceDates: number[] = this.recurrenceEditor.getRecurrenceDates(start, 'FREQ=WEEKLY;BYDAY=MO;INTERVAL=1;', '', 1);
      console.log('Generated recurrence date: ' + new Date(recurrenceDates[0]).toString());
      // Converting UTC -6 to UTC date time
      let convertedDate: Date = this.timezone.convert(new Date(recurrenceDates[0]), 'America/Denver', 'Etc/UTC');
      console.log('Date converted to UTC: ', convertedDate);
    }
  }

Sample: https://stackblitz.com/edit/ej2-angular-generating-recurrence-dates-sample-mznjsg?file=app.component.tsSchedule timezone methods: https://ej2.syncfusion.com/angular/documentation/schedule/timezone/#timezone-methodsKindly try the shared solution and let us know if you
need any further assistance.Regards,Ravikumar Venkatesan