How to change a global timezone?

I want to make a dropdown select which would hold different time zones. How do I change all the dates in all the tables depending on which timezone I selected.

Can it be set globally somehow?

2 Likes

Hey @adnanm, welcome to the community :hugs:

Uhh, spicy use-case. I like it.

I would solve it somewhat like this:

  • Create your dropdown with all the timezones you're interested in (or all which you can get from here.
    • Set the default to the timezone you want
  • Wherever you're using a date you'll have to modify it to use the components value and convert it with moment like:
moment.tz( {{ selectComponent.value }} )

Would that work for you?

Hey @minijohn, thanks for the answer :smiley: but does that mean that I need to go to every table and change every datetime field?

Can you think of any global change of timezone?

Hey @adnanm, so piggybacking off of minijohn's suggestion. A select component can be used as that global change and you can connect each tables date column to the selectComponent.value. Your data column settings in the inspector would look something like this:

Hey @adnanm,

Exactly what @Jay showcased!

But, yes, you would need to set that up for every date column you have.

Hey @minijohn @Jay ,
It doesnt work for me for some reason: I placed the timezone dropdown like this:

and set the date like this:
Screenshot 2022-04-19 at 19.22.06

I've set the dropdown to change to 4 major USA timezones. But when I change one, it only changes once. The rest are the same, which is not true.

and also how do I set the default timezone?

Hey @adnanm, can I confirm that you put this mapped value into all the tables/columns you want to see changed?

Hey @Jay I was just testing it on a couple of dates from a table, but that didnt work. But figured out the way to do it.

apparently, I just called the .toString() function after the timezone and it worked. Although on the screenshot it says there is an issue with the function. It works good now, and the time looks like this:

Thu Jul 29 2021 02:39:18 GMT-0700

but now how do I format the date to get something like Jul 29, 2021 11:39 AM ?

With moment, you should be able to link on a .format() with a string of the new format inside:

1 Like