Datepicker behaves differently with moment-timezone vs luxon-tz

Date and time pickers
1

the api data timezone is in utc, local timezone is utc+1:
using moment-timezone (with default options):
[timezonePlugin]=“momentTimezone” [controls]="[‘time’]"

  • select a time, say 6PM, then the time saved is ‘2022-12-21T17:00:00.000Z’, as expected.

if I switch the timezone plugin to luxon: then the time offset starts happening in the picker (selecting 6PM auto-selects 7PM) which seems really confusing and unpredictable for a user, especially if timezone difference is more than an hour.

I tried playing with different [dataTimezone] & [displayTimezone] configs but it still wasn’t as intuitive out of the box as with moment-tz, which I’m trying to get rid of.
what am I missing here?

2

Hello @Geom :wave:

Could you please share your relevant code example so I can take a look at it?

3

with luxon:
<input nz-input mbsc-datepicker [(ngModel)]="newTimestamp" [controls]="['time']" [touchUi]="false" theme="ios" [timezonePlugin]="luxonTimezone">

with moment:
<input nz-input mbsc-datepicker [(ngModel)]="newTimestamp" [controls]="['time']" [touchUi]="false" theme="ios" [timezonePlugin]="momentTimezone">

the plugins are imported as expected in the docs:

import * as luxon from ‘luxon’;
import {luxonTimezone} from ‘@mobiscroll/angular’;
luxonTimezone.luxon = luxon;

thanks @Hunor

4

Hi @Geom

I tried to reproduce the problem you described but failed. Can you tell us which version of moment, moment-timezone and luxon were you using in your example? Also did you experience any javascript errors in the console in either of cases?

Thanks,
Zoli

5

thanks for the quick reply @Zoli
that’s weird, was the local timezone also offset? I’m using "luxon": "^1.28.0", "moment-timezone": "^0.5.40", "@mobiscroll/angular": "^5.21.2", "@angular/core": "^14.0.2", no console errors.
Any idea what might be causing this?
Also is support for dayjs timezone planned by any chance?
Thanks again

6

Thanks for the details @Geom
Are you swithcing the timezone plugin dynamically on the same component? Or are these totally different pages/components?

7

Actually I’m only switching the plugin to test the behavior (i.e. just commenting/uncommenting the relevant lines). Ideally I just need one plugin in my bundle (luxon). Does that answer your question? @Zoli