Skip to content

Localize dates on UI

Coung Ngo requested to merge cngo-localize-dates-on-ui into master

What does this MR do and why?

Localize dates on UI, as part of our guidelines in https://design.gitlab.com/content/date-and-time/

These changes use the Intl.DateTimeFormat web api which implement the unicode standard https://cldr.unicode.org/translation/date-time/date-time-patterns

Changelog: fixed

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Screenshots taken with browser locale as en-GB

Before After
Boards Screenshot_2024-10-16_at_16-53-52_Development Screenshot_2024-10-16_at_17-05-52_Development
Epic reference popover Screenshot_2024-10-16_at_17-13-55_another_task___65____Task___flightjs_Flight Screenshot_2024-10-16_at_17-16-39_another_task___65____Task___flightjs_Flight
Epic reference popover Screenshot_2024-10-16_at_17-14-04_another_task___65____Task___flightjs_Flight Screenshot_2024-10-16_at_17-16-45_another_task___65____Task___flightjs_Flight
Epic reference popover Screenshot_2024-10-16_at_17-14-11_another_task___65____Task___flightjs_Flight Screenshot_2024-10-16_at_17-16-52_another_task___65____Task___flightjs_Flight
Epic reference popover Screenshot_2024-10-16_at_17-14-18_another_task___65____Task___flightjs_Flight Screenshot_2024-10-16_at_17-16-58_another_task___65____Task___flightjs_Flight
Billings page Screenshot_2024-10-16_at_16-42-57_Billing___Settings___Flightjs___GitLab Screenshot_2024-10-16_at_16-48-16_Billing___Settings___Flightjs___GitLab
What's new Screenshot_2024-10-16_at_16-48-42_Billing___Settings___Flightjs___GitLab Screenshot_2024-10-16_at_16-50-38_Billing___Settings___Flightjs___GitLab

How to set up and validate locally

  1. Go to boards and check the due dates of issues http://127.0.0.1:3000/flightjs/Flight/-/boards
  2. Go to issue, edit description to have references to epics with start/due dates, hover over epic reference http://127.0.0.1:3000/flightjs/flight/-/issues/1
  3. Go to billings page, check subscription dates http://127.0.0.1:3000/groups/flightjs/-/billings
  4. Go to left sidebar, check "What's new"
Edited by Coung Ngo

Merge request reports