feat(#21): show current rent schedule

frontend/src/app/components/rent-payments-page/rent-payments-page.ts

@@ -1,8 +1,9 @@
-import { Component, computed, inject } from '@angular/core';
+import { Component, computed, inject, signal } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { RentPayment, RentPaymentStatus } from '../../services/rent-payment.service';
+import { currentRentSchedule, sortRentPayments } from '../../services/rent-payment-schedule';
 import { WorkspaceService } from '../../services/workspace.service';
 import { MatDialog } from '@angular/material/dialog';
 import { RentPaymentValidationDialog } from '../rent-payment-validation-dialog/rent-payment-validation-dialog';
@@ -17,6 +18,12 @@ import { DatePipe } from '@angular/common';
 export class RentPaymentsPage {
   readonly workspace = inject(WorkspaceService);
   private readonly dialog = inject(MatDialog);
+  readonly showFullSchedule = signal(false);
+  readonly displayedPayments = computed(() =>
+    this.showFullSchedule()
+      ? sortRentPayments(this.workspace.rentPayments())
+      : currentRentSchedule(this.workspace.rentPayments()),
+  );
   readonly contentReady = computed(
     () =>
       this.workspace.rentPaymentLoadState().loaded &&
@@ -61,6 +68,10 @@ export class RentPaymentsPage {
     this.workspace.loadApartments();
   }
 
+  toggleSchedule(): void {
+    this.showFullSchedule.update((showFullSchedule) => !showFullSchedule);
+  }
+
   markPaid(payment: RentPayment): void {
     this.dialog
       .open(RentPaymentValidationDialog, {
@@ -74,4 +85,5 @@ export class RentPaymentsPage {
         }
       });
   }
+
 }