diff --git a/src/Vegasco-Web/src/app/modules/entries/edit-entry/edit-entry.component.ts b/src/Vegasco-Web/src/app/modules/entries/edit-entry/edit-entry.component.ts index b36771b..336d49b 100644 --- a/src/Vegasco-Web/src/app/modules/entries/edit-entry/edit-entry.component.ts +++ b/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(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() { diff --git a/src/Vegasco-Web/src/app/modules/entries/entries/entries.component.ts b/src/Vegasco-Web/src/app/modules/entries/entries/entries.component.ts index 93de58e..fd7eace 100644 --- a/src/Vegasco-Web/src/app/modules/entries/entries/entries.component.ts +++ b/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; protected readonly cars$: Observable; @@ -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 { diff --git a/src/Vegasco-Web/src/app/modules/entries/services/selected-car.service.ts b/src/Vegasco-Web/src/app/modules/entries/services/selected-car.service.ts new file mode 100644 index 0000000..e2c66d5 --- /dev/null +++ b/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); + } + } +} \ No newline at end of file