At the moment it's a massive 500-item <select> dropdown. Hopefully 99% of users won't have to interact with it because it prepopulates their system timezone. But for those who do, it's a bit much, especially on mobile.
The simplest thing would be to add a search/filter to it, like a select2 dropdown (but maintaining bootstrap appearance).
Another idea is using optgroups, or consolidating similar timezones.
There's likely a JS library out there already that's thought this through.
At the moment it's a massive 500-item
<select>
dropdown. Hopefully 99% of users won't have to interact with it because it prepopulates their system timezone. But for those who do, it's a bit much, especially on mobile.The simplest thing would be to add a search/filter to it, like a select2 dropdown (but maintaining bootstrap appearance).
Another idea is using optgroups, or consolidating similar timezones.
There's likely a JS library out there already that's thought this through.
Resources for when the time comes:
ActiveSupport::TimeZone
docsActiveSupport::TimeZone::MAPPING
valuesTZInfo
docs