Support different timezones

[zainab-ali]

Each meetup page contains a time schedule. For example:

This is currently always in BST.
As our attendees are virtual, they can join from anywhere in the world and consequently any timezone. We should let users choose the timezone they want using a dropdown below the schedule. A rough design would look something like the following image, although the style should be consistent with the rest of the application:

Potential Solution

Converting the time in the client's lsug.ui.meetup.plan schedule component would be preferred.

We use scala-java-time to work with times. It has a companion library containing all timezones that could be used. This might bloat the ScalaJS bundle considerably, but would be worth trying. If that doesn't work well, we could look into creating a bundle of custom timezones only.

Tests

Sadly, we don't yet have any unit tests for client logic. Unless you're comfortable writing some from scratch, we're happy with manual testing.

Prerequisites

You'll find this easier if you've explored HTML and CSS before.

What you'll learn

• The basics of frontend development
• How to use ScalaJS to create a dropdown
• How to use ScalaJS React to manage state
• How to work with time in ScalaJS
• How to style webpages with SASS

Getting started

Read our Contributor Guide to get set up.