fix: respect locale date order for Asian languages in DatePresenter #10779 (#10781)

* fix: respect locale date order for Asian languages in DatePresenter

Signed-off-by: Learnobug <gunjanaggarwal12345@gmail.com>

* fix: apply formatting fixes

Signed-off-by: Learnobug <gunjanaggarwal12345@gmail.com>

---------

Signed-off-by: Learnobug <gunjanaggarwal12345@gmail.com>
Co-authored-by: Artyom Savchenko <armisav@gmail.com>
This commit is contained in:
Gunjan
2026-09-29 07:42:46 +02:00
committed by GitHub
co-authored by Artyom Savchenko
parent 7d01eb2cd3
commit f030c2a337
3 changed files with 31 additions and 35 deletions
@@ -25,7 +25,7 @@
import DatePopup from './DatePopup.svelte'
import DPCalendar from './icons/DPCalendar.svelte'
import DPCalendarOver from './icons/DPCalendarOver.svelte'
import { getMonthName } from './internal/DateUtils'
import { formatDate } from './internal/DateUtils'
import { registerFocus } from '../../focus'
export let value: number | null | undefined
@@ -127,11 +127,7 @@
{#if value !== null && value !== undefined}
{#if shouldShowLabel}
{#if mode !== DateRangeMode.TIMEONLY}
{new Date(value).getDate()}
{getMonthName(new Date(value), 'short')}
{#if new Date(value).getFullYear() !== today.getFullYear()}
{new Date(value).getFullYear()}
{/if}
{formatDate(new Date(value), new Date(value).getFullYear() !== today.getFullYear())}
{/if}
{#if withTime}
{#if mode !== DateRangeMode.TIMEONLY}
@@ -24,7 +24,7 @@
import DatePopup from './DatePopup.svelte'
import DPCalendar from './icons/DPCalendar.svelte'
import DPCalendarOver from './icons/DPCalendarOver.svelte'
import { daysInMonth, getMonthName } from './internal/DateUtils'
import { daysInMonth, formatDate } from './internal/DateUtils'
export let value: number | null | undefined = null
export let mode: DateRangeMode = DateRangeMode.DATE
@@ -312,11 +312,7 @@
{/if}
{#if value !== undefined && value !== null && value.toString() !== ''}
{#if withDate}
{new Date(value).getDate()}
{getMonthName(new Date(value), 'short')}
{#if new Date(value).getFullYear() !== today.getFullYear()}
{new Date(value).getFullYear()}
{/if}
{formatDate(new Date(value), new Date(value).getFullYear() !== today.getFullYear())}
{/if}
{#if withTime}
{#if withDate}
@@ -487,11 +483,7 @@
{/if}
{#if value !== undefined && value !== null && value.toString() !== ''}
{#if withDate}
{new Date(value).getDate()}
{getMonthName(new Date(value), 'short')}
{#if new Date(value).getFullYear() !== today.getFullYear()}
{new Date(value).getFullYear()}
{/if}
{formatDate(new Date(value), new Date(value).getFullYear() !== today.getFullYear())}
{/if}
{#if withTime}
{#if withDate}
@@ -20,7 +20,7 @@ export const MILLISECONDS_IN_MINUTE = 60000
export const MILLISECONDS_IN_DAY = 86400000
export const MILLISECONDS_IN_WEEK = DAYS_IN_WEEK * MILLISECONDS_IN_DAY
export function firstDay (date: Date, firstDay: number = 1): Date {
export function firstDay(date: Date, firstDay: number = 1): Date {
const firstDayOfMonth = new Date(new Date(date).setHours(0, 0, 0, 0))
firstDayOfMonth.setDate(1) // First day of month
const result = new Date(firstDayOfMonth)
@@ -32,23 +32,23 @@ export function firstDay (date: Date, firstDay: number = 1): Date {
return result
}
export function getWeek (date: Date): number {
export function getWeek(date: Date): number {
const onejan = new Date(date.getFullYear(), 0, 1)
return Math.ceil(((date.getTime() - onejan.getTime()) / MILLISECONDS_IN_DAY + onejan.getDay() + 1) / DAYS_IN_WEEK)
}
export function daysInMonth (date: Date): number {
export function daysInMonth(date: Date): number {
return 33 - new Date(date.getFullYear(), date.getMonth(), 33).getDate()
}
export function getWeekDayName (weekDay: Date, weekFormat: 'narrow' | 'short' | 'long' | undefined = 'short'): string {
export function getWeekDayName(weekDay: Date, weekFormat: 'narrow' | 'short' | 'long' | undefined = 'short'): string {
const locale = new Intl.NumberFormat().resolvedOptions().locale
return new Intl.DateTimeFormat(locale, {
weekday: weekFormat
}).format(weekDay)
}
export function getWeekDayNames (): Map<number, string> {
export function getWeekDayNames(): Map<number, string> {
const today: Date = new Date()
const offset: number = 0 - today.getDay()
const startDate: number = today.setTime(today.getTime() + MILLISECONDS_IN_DAY * offset)
@@ -59,15 +59,15 @@ export function getWeekDayNames (): Map<number, string> {
return result
}
export function day (firstDay: Date, offset: number): Date {
export function day(firstDay: Date, offset: number): Date {
return new Date(new Date(firstDay).setDate(firstDay.getDate() + offset))
}
export function weekday (firstDay: Date, w: number, d: number): Date {
export function weekday(firstDay: Date, w: number, d: number): Date {
return day(firstDay, w * DAYS_IN_WEEK + d)
}
export function areDatesEqual (firstDate: Date | undefined, secondDate: Date | undefined): boolean {
export function areDatesEqual(firstDate: Date | undefined, secondDate: Date | undefined): boolean {
if (firstDate === undefined || secondDate === undefined) {
return false
}
@@ -78,19 +78,19 @@ export function areDatesEqual (firstDate: Date | undefined, secondDate: Date | u
)
}
export function fromCurrentToTz (date: Date | number, tz: string): Date {
export function fromCurrentToTz(date: Date | number, tz: string): Date {
return utcToZonedTime(zonedTimeToUtc(date, getUserTimezone()), tz)
}
export function fromTzToCurrent (date: Date | number, tz: string): Date {
export function fromTzToCurrent(date: Date | number, tz: string): Date {
return utcToZonedTime(zonedTimeToUtc(date, tz), getUserTimezone())
}
export function isWeekend (date: Date): boolean {
export function isWeekend(date: Date): boolean {
return date.getDay() === 0 || date.getDay() === 6
}
export function getMonthName (date: Date, option: 'narrow' | 'short' | 'long' | 'numeric' | '2-digit' = 'long'): string {
export function getMonthName(date: Date, option: 'narrow' | 'short' | 'long' | 'numeric' | '2-digit' = 'long'): string {
try {
const locale = new Intl.NumberFormat().resolvedOptions().locale
return new Intl.DateTimeFormat(locale, { month: option }).format(date)
@@ -106,24 +106,24 @@ export interface ICell {
classes: TCellStyle
}
export function getLocalWeekStart (): number {
export function getLocalWeekStart(): number {
const locale = new Intl.Locale(navigator.language)
return typeof (locale as any)?.getWeekInfo === 'function'
? (locale as any)?.getWeekInfo()?.firstDay
: ((locale as any).weekInfo?.firstDay ?? 1)
}
export function hasLocalWeekStart (): boolean {
export function hasLocalWeekStart(): boolean {
const locale = new Intl.Locale(navigator.language)
return typeof (locale as any)?.getWeekInfo === 'function' || (locale as any).weekInfo?.firstDay !== undefined
}
export function getWeekStart (date: Date = new Date(), firstDay: number = 1): Date {
export function getWeekStart(date: Date = new Date(), firstDay: number = 1): Date {
date = new Date(new Date(date).setHours(0, 0, 0, 0))
return new Date(date.setDate(date.getDate() - ((date.getDay() - firstDay + 7) % 7)))
}
export function addZero (value: number): string {
export function addZero(value: number): string {
if (value < 10) {
return `0${value}`
}
@@ -155,10 +155,18 @@ export const getDueDateIconModifier = (
return 'normal'
}
export function getFormattedDate (value: number | null, options?: Intl.DateTimeFormatOptions): string {
export function getFormattedDate(value: number | null, options?: Intl.DateTimeFormatOptions): string {
return value === null ? '' : new Date(value).toLocaleString('default', options ?? { month: 'short', day: 'numeric' })
}
export function formatDate(date: Date, showYear: boolean): string {
const locale = new Intl.NumberFormat().resolvedOptions().locale
const options: Intl.DateTimeFormatOptions = showYear
? { year: 'numeric', month: 'short', day: 'numeric' }
: { month: 'short', day: 'numeric' }
return new Intl.DateTimeFormat(locale, options).format(date)
}
export const getTimeZoneName = (
val: string = Intl.DateTimeFormat().resolvedOptions().timeZoneName ?? Intl.DateTimeFormat().resolvedOptions().timeZone
): string => {
@@ -177,7 +185,7 @@ export const convertTimeZone = (tz: string): TimeZone => {
}
}
export function getUserTimezone (): string {
export function getUserTimezone(): string {
if (window.Intl !== undefined) {
return Intl.DateTimeFormat().resolvedOptions().timeZone
} else {