jasonleibowitz/react-add-to-calendar-hoc

Unable to set timezone for events

nabrams opened this issue ยท 5 comments

Bug report

Describe the bug

By formatting each datetime in .utc(), it sets the event to be the time of the local browser. I want to be able to set the date in eastern standard time so that customers booking an appointment out of state do not book the wrong time.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

  1. when setting the start and end times in {event}

const startDatetime = moment(slot.time)
.utc()
.format("YYYYMMDDTHHmmssZ");

2.if I do not include .utc() per your examples, the date is formatted wrong and will not work when trying to add the event to any of the calendars.

Expected behavior

I am expecting to be able to specify a timezone.

Screenshots

System information

  • OS: [e.g. macOS]
  • Browser [chrome]
  • Version of Library: [e.g. 1.0.3]

Nevermind my previous (now deleted) comment; I noticed my timezones were off too. I'll let you know if I find a workaround :)

@nabrams I messed with this a bit more and realized my timezones were actually working. ๐Ÿ˜…

So to fully understand, are you having an issue where you're making an event that's, for example, 9am in your time zone but people three hours behind are also seeing 9am?

I've had luck passing in a time like: 2018-08-07 18:00:00-04:00 and not calling utc() anywhere. I end up with proper timezone-adjusted times after that, except for when the timezone ends up being in a different calendar date. That issue I'll probably be looking into tomorrow.

Are you saying that you want the calendar event to include timezone information rather than just adjust the time. For instance, for an appointment at 5pm on Jan 10, 2018 in New York you want a user in LA who adds it to have an event that reads Jan 10, 2018 5pm EST rather than Jan 10, 2018 2pm?

I found this forum post that seems to answer the question of how to do this on Google Calendar. There's another query param to specify timezone: &ctz=America/Los_Angeles.

It looks like you still have to use UTC/convert the date to the proper timezone before passing into the URL, but at least ctz lets you specify the time zone.

I probably won't have time to work on this until the weekend. If one of you guys have time, feel free to make a PR.

@nabrams Sorry for the long delay. Just committed #15 which solves your issue. I added an example to the demo page that shows how to properly handle timezones.

Let me know if you're still having issues.

FYI just published v1.0.7 that includes better timezone support with better docs.