Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improves date header localization

Browse source 
Adds locale support to the date header renderer and date service.

This change ensures that the day names are displayed correctly based on the user's configured locale.

The date header now uses the configured locale to display the day name in the correct language.
The day name is now displayed in uppercase.

Additionally, styles the date header to highlight today's date.
This commit is contained in:
Janus C. H. Knudsen 2025-10-09 23:08:33 +02:00
parent 6f79954342
commit 8ca49037e9
4 changed files with 31 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/renderers/HeaderRenderer.ts
View file

@ -29,15 +29,16 @@ export class DateHeaderRenderer implements HeaderRenderer {
render(calendarHeader: HTMLElement, context: HeaderRenderContext): void {
const { currentWeek, config } = context;
// FIRST: Always create all-day container as part of standard header structure
const allDayContainer = document.createElement('swp-allday-container');
calendarHeader.appendChild(allDayContainer);
// Initialize date service with config
// Initialize date service with timezone and locale from config
const timezone = config.getTimezone?.() || 'Europe/Copenhagen';
const locale = config.getLocale?.() || 'da-DK';
this.dateService = new DateService(timezone);
const workWeekSettings = config.getWorkWeekSettings();
const dates = this.dateService.getWorkWeekDates(currentWeek, workWeekSettings.workDays);
const weekDays = config.getDateViewSettings().weekDays;
@ -48,15 +49,15 @@ export class DateHeaderRenderer implements HeaderRenderer {
if (this.dateService.isSameDay(date, new Date())) {
(header as any).dataset.today = 'true';
}
const dayName = this.dateService.getDayName(date, 'short');
const dayName = this.dateService.getDayName(date, 'long', locale).toUpperCase();
header.innerHTML = `
<swp-day-name>${dayName}</swp-day-name>
<swp-day-date>${date.getDate()}</swp-day-date>
`;
(header as any).dataset.date = this.dateService.formatISODate(date);
calendarHeader.appendChild(header);
});
}