Enhance calendar functionality: display year in month header, highlight past dates, and update date selection logic

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

@@ -2,7 +2,7 @@ import { Component, OnInit, effect, signal } from '@angular/core';
 import { UserInputService } from '../../services/user-input-service';
 import { MatCard, MatCardContent } from '@angular/material/card';
 import { CalendarMonth } from "../calendar-month/calendar-month";
-import { CalendarService, SelectedDates, VacationsNumber } from '../../services/calendar-service';
+import { CalendarService, SelectedDates } from '../../services/calendar-service';
 import { CommonModule } from '@angular/common';
 
 @Component({
@@ -16,7 +16,7 @@ export class CalendarYear implements OnInit {
 
 	constructor(private userInput: UserInputService, private calendarService: CalendarService) {
 		effect(() => {
-			this.selectedDates = this.calendarService.getSelectedDatesForYear(this.year);
+			this.selectedDates = this.calendarService.getSelectedDatesForYear();
 			const vacationData = this.userInput.vacationNumberSignal();
 			this.isLoading.set(true);
 			// Simulate server-side calculation with a small delay
@@ -31,9 +31,15 @@ export class CalendarYear implements OnInit {
 
 	protected selectedDates: SelectedDates = new SelectedDates();
 
-	protected year: number = 2026;
+	getYear(monthIndex: number): number {
+		const offset = new Date().getMonth() <= monthIndex ? 0 : 1;
+		return new Date().getFullYear() + offset;
+	}
+
+	// months starting from actual date
+	protected months: number[] = Array.from({ length: 12 }, (_, i) => (new Date().getMonth() + i) % 12);
 
 	ngOnInit(): void {
-		this.selectedDates = this.calendarService.getSelectedDatesForYear(this.year);
+		this.selectedDates = this.calendarService.getSelectedDatesForYear();
 	}
 }