palantir/blueprint

Consider expanding list of available timezones to all those supported by `Intl` browser API

Open

#6305 opened on Jul 26, 2023

View on GitHub
 (3 comments) (0 reactions) (0 assignees)TypeScript (20,263 stars) (2,167 forks)batch import
P2Package: datetimeType: feature requesthelp wanted

Description

Environment

  • Package version(s): @blueprintjs/datetime 5.0.7
  • Browser and OS versions: Chrome 114, macOS

Feature request

We should consider expanding the list of timezones available in <TimezoneSelect>. We could enable an option which supports all the timezones available using the Intl browser API. For example, Intl.suppportedValuesOf(“timeZone”) returns 429 entries in my browser. This is more items than the default list of timezones currently used by the component (250 items).

This feature could (in theory) exist in date-fns-tz, it has been requested but not implemented yet: https://github.com/marnusw/date-fns-tz/issues/232

Motivation

This feature is motivated by user requests to see timezones like America/Indiana/Indianapolis in a TimezoneSelect dropdown. We don't want to expose users to a very long list of timezones by default, but it would be nice make it an available option for certain use cases.

Contributor guide

Tech stack
typescriptreact
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic ReactTypeScriptBlueprint component usage
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
65
Research direction
Review the current timezone list in packages/datetime/src/common/timezoneItems.ts (lines 25-275). Investigate using `Intl.supportedValuesOf('timeZone')` to get all timezones. Consider adding a prop like `allTimezones` to TimezoneSelect. Evaluate performance with 429 items and filtering. See also date fns tz issue #232 for prior discussion.