Skip to content

Support different timezones #21

@zainab-ali

Description

@zainab-ali

Each meetup page contains a time schedule. For example:

Screenshot of a schedule on a meetup page.  The schedule contains several times.

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:

Screenshot of a dropdown design

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.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions