Persist and use selected car

src/Vegasco-Web/src/app/modules/entries/edit-entry/edit-entry.component.ts

@@ -19,6 +19,7 @@ import { SelectModule } from 'primeng/select';
 import { SkeletonModule } from 'primeng/skeleton';
 import { catchError, combineLatest, EMPTY, filter, map, Observable, switchMap, tap, throwError } from 'rxjs';
 import { RequiredMarkerComponent } from './components/required-marker.component';
+import { SelectedCarService } from '../services/selected-car.service';
 
 @Component({
   selector: 'app-edit-entry',
@@ -46,6 +47,7 @@ export class EditEntryComponent implements OnInit {
   private readonly routingService = inject(RoutingService);
   private readonly destroyRef = inject(DestroyRef);
   private readonly messageService = inject(MessageService);
+  private readonly selectedCarService = inject(SelectedCarService);
 
   protected readonly id = input<string | undefined>(undefined);
 
@@ -79,13 +81,38 @@ export class EditEntryComponent implements OnInit {
       .getAll()
       .pipe(
         takeUntilDestroyed(),
-        map(response => response.cars)
+        map(response => response.cars),
+        tap(cars => {
+          const selectedCarId = this.selectedCarService.getSelectedCarId();
+
+          if (selectedCarId === null) {
+            const firstCar = cars[0];
+            this.formGroup.controls[this.formFieldNames.car].setValue(firstCar);
+            this.selectedCarService.setSelectedCarId(firstCar?.id ?? null);
+            return;
+          }
+
+          const selectedCar = cars.find(car => car.id === selectedCarId);
+          this.formGroup.controls[this.formFieldNames.car].setValue(selectedCar ?? null);
+          this.selectedCarService.setSelectedCarId(selectedCar?.id ?? null);
+        }),
       );
     this.cars = toSignal(this.cars$);
   }
 
   ngOnInit(): void {
     this.loadEntryDetailsAndEnableControls();
+
+    this.formGroup.controls[this.formFieldNames.car]
+      .valueChanges
+      .pipe(
+        takeUntilDestroyed(this.destroyRef),
+        tap((car) => {
+          console.log('Selected car changed (edit entry):', car);
+          this.selectedCarService.setSelectedCarId(car?.id ?? null);
+        })
+      )
+      .subscribe();
   }
 
   private loadEntryDetailsAndEnableControls() {

src/Vegasco-Web/src/app/modules/entries/entries/entries.component.ts

@@ -1,5 +1,5 @@
 import { AsyncPipe, CommonModule } from '@angular/common';
-import { Component, inject } from '@angular/core';
+import { Component, DestroyRef, inject, OnInit } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FormControl, ReactiveFormsModule } from '@angular/forms';
 import { RouterLink } from '@angular/router';
@@ -17,6 +17,7 @@ import {
   map,
   Observable,
   startWith,
+  tap,
   throwError
 } from 'rxjs';
 import { EntriesOverviewService } from './services/entries-overview.service';
@@ -26,6 +27,7 @@ import {
 } from '@ng-icons/material-icons/sharp';
 import { NgIconComponent, provideIcons } from '@ng-icons/core';
 import { HttpErrorResponse } from '@angular/common/http';
+import { SelectedCarService } from '../services/selected-car.service';
 
 @Component({
   selector: 'app-entries',
@@ -51,9 +53,11 @@ import { HttpErrorResponse } from '@angular/common/http';
   templateUrl: './entries.component.html',
   styleUrl: './entries.component.scss'
 })
-export class EntriesComponent {
+export class EntriesComponent implements OnInit {
   private readonly entriesOverviewService = inject(EntriesOverviewService);
   private readonly messageService = inject(MessageService);
+  private readonly selectedCarService = inject(SelectedCarService);
+  private readonly destroyRef = inject(DestroyRef);
 
   protected readonly consumptionEntries$: Observable<ConsumptionEntry[]>;
   protected readonly cars$: Observable<Car[]>;
@@ -93,7 +97,35 @@ export class EntriesComponent {
       );
 
     this.cars$ = this.entriesOverviewService.getCars()
-      .pipe(takeUntilDestroyed());
+      .pipe(
+        takeUntilDestroyed(),
+        tap((cars) => {
+          const selectedCarId = this.selectedCarService.getSelectedCarId();
+
+          if (selectedCarId === null) {
+            const firstCar = cars[0];
+            this.selectedCar.setValue(firstCar);
+            this.selectedCarService.setSelectedCarId(firstCar?.id ?? null);
+            return;
+          }
+
+          const selectedCar = cars.find(car => car.id === selectedCarId);
+          this.selectedCar.setValue(selectedCar ?? null);
+          this.selectedCarService.setSelectedCarId(selectedCar?.id ?? null);
+        }),
+      );
+  }
+
+  ngOnInit(): void {
+    this.selectedCar.valueChanges
+      .pipe(
+        takeUntilDestroyed(this.destroyRef),
+        tap((car) => {
+          console.log('Selected car changed (entries):', car);
+          this.selectedCarService.setSelectedCarId(car?.id ?? null);
+        })
+      )
+      .subscribe();
   }
 
   onEntryDeleted(entry: ConsumptionEntry): void {

src/Vegasco-Web/src/app/modules/entries/services/selected-car.service.ts

@@ -0,0 +1,33 @@
+import { Injectable } from "@angular/core";
+import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import { BehaviorSubject, tap } from "rxjs";
+
+@Injectable({
+    providedIn: "root",
+})
+export class SelectedCarService {
+    static readonly SELECTED_CAR_ID_KEY = "SELECTED_CAR_ID";
+
+    private selectedCarId: string | null = null;
+
+    constructor() {
+        this.loadStoredCarId();
+    }
+
+    private loadStoredCarId(): void {
+        this.selectedCarId = localStorage.getItem(SelectedCarService.SELECTED_CAR_ID_KEY);
+    }
+
+    getSelectedCarId() {
+        return this.selectedCarId;
+    }
+
+    setSelectedCarId(carId: string | null): void {
+        this.selectedCarId = carId;
+        if (carId === null) {
+            localStorage.removeItem(SelectedCarService.SELECTED_CAR_ID_KEY);
+        } else {
+            localStorage.setItem(SelectedCarService.SELECTED_CAR_ID_KEY, carId);
+        }
+    }
+}