Refactor: create DateCacheService to reduce date duplication

Co-authored-by: THoguet <61246905+THoguet@users.noreply.github.com>

src/app/components/calendar-month/calendar-month.ts

@@ -1,7 +1,8 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, inject } from '@angular/core';
 import { CalendarService, Month, monthNames, SelectedDates } from '../../services/calendar-service';
 import { MatTooltip } from '@angular/material/tooltip';
 import { CalendarSettingsService } from '../../services/calendar-settings-service';
+import { DateCacheService } from '../../services/date-cache.service';
 
 @Component({
 	selector: 'app-calendar-month',
@@ -10,7 +11,8 @@ import { CalendarSettingsService } from '../../services/calendar-settings-servic
 	styleUrl: './calendar-month.scss',
 })
 export class CalendarMonth implements OnInit {
-	constructor(protected calendarSettingsService: CalendarSettingsService) {}
+	protected calendarSettingsService = inject(CalendarSettingsService);
+	private dateCache = inject(DateCacheService);
 
 	@Input({ required: true })
 	monthIndex!: number;
@@ -18,18 +20,9 @@ export class CalendarMonth implements OnInit {
 	@Input({ required: true })
 	year!: number;
 
-	// Cache "now" as a class property to avoid recreating it on every call
-	// Note: This value is cached at component initialization and won't update if the day changes
-	// while the component is still mounted. This is acceptable for this use case since the app
-	// is primarily used within a single day session.
-	private readonly now: Date = (() => {
-		const date = new Date();
-		date.setHours(0, 0, 0, 0);
-		return date;
-	})();
-
+	// Use DateCacheService instead of creating Date objects
 	getNow(): Date {
-		return this.now;
+		return this.dateCache.getNow();
 	}
 
 	currentMonth: Date = new Date();

src/app/components/calendar-year/calendar-year.ts

@@ -1,4 +1,4 @@
-import { Component, effect, signal } from '@angular/core';
+import { Component, effect, signal, inject } from '@angular/core';
 import { UserInputService } from '../../services/user-input-service';
 import { MatCard, MatCardContent } from '@angular/material/card';
 import { CalendarMonth } from '../calendar-month/calendar-month';
@@ -6,6 +6,7 @@ import { CalendarService, SelectedDates } from '../../services/calendar-service'
 import { CommonModule } from '@angular/common';
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
 import { CalendarSettingsService } from '../../services/calendar-settings-service';
+import { DateCacheService } from '../../services/date-cache.service';
 
 @Component({
 	selector: 'app-calendar-year',
@@ -14,17 +15,23 @@ import { CalendarSettingsService } from '../../services/calendar-settings-servic
 	styleUrl: './calendar-year.scss',
 })
 export class CalendarYear {
+	private dateCache = inject(DateCacheService);
+	private userInput = inject(UserInputService);
+	private calendarService = inject(CalendarService);
+	private calendarSettingsService = inject(CalendarSettingsService);
+
 	protected isLoading = signal(true);
 
-	// Cache current month and year to avoid repeated Date object creation
-	private readonly currentMonth = new Date().getMonth();
-	private readonly currentYear = new Date().getFullYear();
+	// Use DateCacheService instead of creating Date objects
+	private get currentMonth() {
+		return this.dateCache.getCurrentMonth();
+	}
 
-	constructor(
-		private userInput: UserInputService,
-		private calendarService: CalendarService,
-		private calendarSettingsService: CalendarSettingsService,
-	) {
+	private get currentYear() {
+		return this.dateCache.getCurrentYear();
+	}
+
+	constructor() {
 		effect(() => {
 			this.selectedDates = this.calendarService.getSelectedDatesForYear();
 			const vacationData = this.userInput.vacationNumberSignal();