fix: changed dateselector and filter logic

src/app/admin-view/grades/grades.component.html

@@ -1,7 +1,7 @@
 <app-date-selector [(date)]="date" [filter]="filter" (dateChange)="downloadData()"></app-date-selector>
 <app-room-chooser [rooms]="rooms" (room)="roomNumber($event)"/>
 <form [formGroup]="form">
-  <p>Czystość pokoju {{room}} na {{_date.toFormat("cccc, D")}}</p>
+  <p>Czystość pokoju {{room}} na {{date().toFormat("cccc, D")}}</p>
   <p>Ocena: <span [appGradeColor]="grade">{{grade}}</span></p>
   <div id="buttons">
     <button mat-mini-fab (click)="downloadData()" color="accent"><mat-icon>cancel</mat-icon></button>

src/app/admin-view/grades/grades.component.ts

@@ -1,6 +1,6 @@
-import { Component, OnDestroy, OnInit } from '@angular/core'
+import { Component, OnDestroy, OnInit, signal } from '@angular/core'
 import { FormArray, FormBuilder } from '@angular/forms'
-import { weekendFilter } from 'src/app/fd.da'
+import { filterLook, weekendFilter } from 'src/app/util'
 import { MatSnackBar } from '@angular/material/snack-bar'
 import { ToolbarService } from '../toolbar/toolbar.service'
 import { ActivatedRoute, Router } from '@angular/router'
@@ -18,17 +18,11 @@ import { GradesService } from './grades.service'
 export class GradesComponent implements OnInit, OnDestroy {
   rooms!: string[]
   room: string = '0'
-  protected _date: DateTime
-  public get date(): string {
-    return this._date.toISODate()!
-  }
-  public set date(value: string) {
-    this._date = DateTime.fromISO(value)
-  }
   grade: number = 6
   gradeDate?: DateTime
   id?: string
   filter = weekendFilter
+  date = signal<DateTime>(filterLook(this.filter, "behind", DateTime.now(), 7)!)
 
   get notes(): { label: string; weight: number }[] {
     var th = this.things.value as {
@@ -66,7 +60,6 @@ export class GradesComponent implements OnInit, OnDestroy {
     private route: ActivatedRoute,
     private dialog: MatDialog
   ) {
-    this._date = DateTime.now()
     // if (!this.filter(this.date)) this.date.isoWeekday(8);
     this.toolbar.comp = this
     this.toolbar.menu = [
@@ -121,7 +114,7 @@ export class GradesComponent implements OnInit, OnDestroy {
   }
 
   downloadData() {
-    this.ac.getClean(this.date, this.room).subscribe(v => {
+    this.ac.getClean(this.date(), this.room).subscribe(v => {
       if (v) {
         this.notes = v.notes
         this.gradeDate = DateTime.fromISO(v.gradeDate)

src/app/admin-view/grades/grades.service.ts

@@ -18,7 +18,7 @@ export class GradesService {
     )
   }
 
-  getClean(date: string, room: string) {
+  getClean(date: DateTime, room: string) {
     return this.http.get<{
       _id: string
       date: string
@@ -27,7 +27,7 @@ export class GradesService {
       notes: { label: string; weight: number }[]
       room: string
       tips: string
-    } | null>(environment.apiEndpoint + `/admin/clean/${date}/${room}`, {
+    } | null>(environment.apiEndpoint + `/admin/clean/${date.toISODate()}/${room}`, {
       withCredentials: true,
     })
   }

src/app/admin-view/menu-edit/menu-add/menu-add.component.ts

@@ -1,10 +1,11 @@
-import { Component } from '@angular/core'
+import { Component, signal } from '@angular/core'
 import { MenuUploadComponent } from '../menu-upload/menu-upload.component'
 import { MatDialog, MatDialogRef } from '@angular/material/dialog'
-import { FDSelection, weekendFilter } from 'src/app/fd.da'
+import { FDSelection } from 'src/app/fd.da'
 import { FormControl, FormGroup } from '@angular/forms'
 import { MAT_DATE_RANGE_SELECTION_STRATEGY } from '@angular/material/datepicker'
 import { DateTime } from 'luxon'
+import { weekendFilter } from 'src/app/util'
 
 @Component({
   selector: 'app-menu-add',
@@ -19,7 +20,7 @@ export class MenuAddComponent {
   type: string | undefined
   filter = weekendFilter
 
-  day: string = DateTime.now().toISODate()
+  day = signal<DateTime>(DateTime.now())
 
   range = new FormGroup({
     start: new FormControl<DateTime | null>(null),
@@ -34,7 +35,7 @@ export class MenuAddComponent {
   submit() {
     switch (this.type) {
       case 'day':
-        this.dialogRef.close({ type: 'day', value: this.day })
+        this.dialogRef.close({ type: 'day', value: this.day().toISODate() })
         break
       case 'week':
         this.dialogRef.close({

src/app/app-view/menu/menu.component.ts

@@ -1,11 +1,12 @@
-import { Component, OnInit } from '@angular/core'
+import { Component, signal } from '@angular/core'
 import { UpdatesService } from '../../services/updates.service'
 import { Menu } from '../../types/menu'
 import { MatBottomSheet } from '@angular/material/bottom-sheet'
 import { AllergensComponent } from './allergens/allergens.component'
-import { weekendFilter } from '../../fd.da'
+import { filterLook, weekendFilter } from '../../util'
 import { LocalStorageService } from 'src/app/services/local-storage.service'
 import { DateTime } from 'luxon'
+import { toObservable } from '@angular/core/rxjs-interop'
 
 @Component({
   selector: 'app-menu',
@@ -19,20 +20,15 @@ export class MenuComponent {
     readonly bs: MatBottomSheet,
     readonly ls: LocalStorageService
   ) {
-    this._day = DateTime.now().toISODate()
+    toObservable(this.day).subscribe(v => {
+      this.updateMenu()
+    })
   }
   loading = true
 
   public filter = weekendFilter
 
-  private _day: string
-  public get day(): string {
-    return this._day
-  }
-  public set day(value: string) {
-    this._day = value
-    this.updateMenu()
-  }
+  day = signal<DateTime>(filterLook(this.filter, "ahead", DateTime.now(), 7)!)
 
   menu?: Menu
   get getsn() {
@@ -72,10 +68,9 @@ export class MenuComponent {
   updateMenu(silent?: boolean) {
     this.loading = !silent
     if (!silent) this.menu = undefined
-    this.uc.getMenu(this.day).subscribe(m => {
+    this.uc.getMenu(this.day()).subscribe(m => {
       this.loading = false
       this.menu = m
-      console.log(m)
     })
   }
 

src/app/app-view/personal/clean/clean.component.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit } from '@angular/core'
+import { Component, OnInit, signal } from '@angular/core'
+import { toObservable } from "@angular/core/rxjs-interop";
 import { DateTime } from 'luxon'
-import { weekendFilter } from 'src/app/fd.da'
+import { filterLook, weekendFilter } from 'src/app/util'
 import { UpdatesService } from 'src/app/services/updates.service'
 import { CleanNote } from 'src/app/types/clean-note'
 
@@ -11,14 +12,16 @@ import { CleanNote } from 'src/app/types/clean-note'
   standalone: false,
 })
 export class CleanComponent implements OnInit {
-  protected day: string
   grade: number | null = null
   notes: CleanNote[] = []
   tips: string = ''
   filter = weekendFilter
+  protected day = signal<DateTime>(filterLook(this.filter, "behind", DateTime.now(), 7)!)
 
   constructor(private updates: UpdatesService) {
-    this.day = DateTime.now().toISODate()
+    toObservable(this.day).subscribe(v => {
+      this.update()
+    })
   }
 
   ngOnInit(): void {
@@ -26,7 +29,7 @@ export class CleanComponent implements OnInit {
   }
 
   update() {
-    this.updates.getClean(this.day).subscribe(v => {
+    this.updates.getClean(this.day()).subscribe(v => {
       if (v) {
         this.grade = v.grade
         this.notes = v.notes

src/app/commonComponents/date-selector/date-selector.component.html

@@ -1,7 +1,7 @@
 <button mat-icon-button (click)="prevDay()"><mat-icon>chevron_left</mat-icon></button>
-<p (click)="picker.open()">{{_date_1.toFormat('cccc, d.LL') | titlecase }}</p>
+<p (click)="picker.open()">{{date()!.toFormat('cccc, d.LL') | titlecase }}</p>
 <mat-form-field style="display: none;">
     <input #dateinput matInput [matDatepicker]="picker" [formControl]="dateInput" [matDatepickerFilter]="filter">
     <mat-datepicker touchUi #picker></mat-datepicker>
 </mat-form-field>
-<button mat-icon-button (click)="nextDay()"><mat-icon>chevron_right</mat-icon></button>
+<button mat-icon-button (click)="nextDay()"><mat-icon>chevron_right</mat-icon></button>

src/app/commonComponents/date-selector/date-selector.component.ts

@@ -1,10 +1,8 @@
 import {
   Component,
-  EventEmitter,
   Input,
+  model,
   OnChanges,
-  OnInit,
-  Output,
   SimpleChanges,
 } from '@angular/core'
 import { FormControl } from '@angular/forms'
@@ -18,47 +16,38 @@ import { DateTime } from 'luxon'
   standalone: false,
 })
 export class DateSelectorComponent implements OnChanges {
-  protected _date_1: DateTime = DateTime.now()
-  protected set _date(value: DateTime) {
-    this._date_1 = value
-    this.date = value.toISODate()!
-  }
-  @Input()
-  public set date(value: string) {
-    this._date_1 = DateTime.fromISO(value)
-  }
-  @Output() dateChange = new EventEmitter<string>()
+  date = model<DateTime>()
   @Input() filter: DateFilterFn<DateTime | null> = () => true
   protected dateInput: FormControl<DateTime>
 
   constructor() {
-    this.dateInput = new FormControl(this._date_1, { nonNullable: true })
+    this.dateInput = new FormControl(this.date()!, { nonNullable: true })
     this.dateInput.valueChanges.subscribe(v => {
-      this.dateChange.emit(v.toISODate()!)
+      this.date.set(v)
     })
   }
 
   ngOnChanges(changes: SimpleChanges): void {
     if (changes['date']) {
-      this.dateInput.setValue(this._date_1), { emitEvent: false }
+      this.dateInput.setValue(this.date()!), { emitEvent: false }
     }
   }
 
   prevDay(): void {
-    let yesterday = this._date_1.minus({ day: 1 })
+    let yesterday = this.date()!.minus({ day: 1 })
     if (this.filter(yesterday)) {
       this.dateInput.setValue(yesterday)
     } else {
-      this.dateInput.setValue(this._date.set({ weekday: 5 }).minus({ week: 1 }))
+      this.dateInput.setValue(this.date()!.set({ weekday: 5 }).minus({ week: 1 }))
     }
   }
 
   nextDay(): void {
-    let tomorrow = this._date_1.plus({ day: 1 })
+    let tomorrow = this.date()!.plus({ day: 1 })
     if (this.filter(tomorrow)) {
       this.dateInput.setValue(tomorrow)
     } else {
-      this.dateInput.setValue(this._date.set({ weekday: 1 }).plus({ week: 1 }))
+      this.dateInput.setValue(this.date()!.set({ weekday: 1 }).plus({ week: 1 }))
     }
   }
 }

src/app/fd.da.ts

@@ -24,10 +24,3 @@ export class FDSelection implements MatDateRangeSelectionStrategy<DateTime> {
     return new DateRange<DateTime>(null, null)
   }
 }
-
-export const weekendFilter: DateFilterFn<DateTime | null> = (
-  date: DateTime | null
-): boolean => {
-  const day = date?.weekday
-  return day !== 6 && day !== 7
-}

src/app/services/updates.service.ts

@@ -31,11 +31,11 @@ export class UpdatesService {
     )
   }
 
-  getMenu(dom: string) {
+  getMenu(dom: DateTime) {
     const headers = {
       'Content-Type': 'application/json',
     }
-    return this.http.get<Menu>(environment.apiEndpoint + `/app/menu/${dom}`, {
+    return this.http.get<Menu>(environment.apiEndpoint + `/app/menu/${dom.toISODate()}`, {
       headers: headers,
       withCredentials: true,
     })
@@ -71,9 +71,9 @@ export class UpdatesService {
     })
   }
 
-  getClean(date: string) {
+  getClean(date: DateTime) {
     return this.http.get<{ grade: number; notes: CleanNote[]; tips: string }>(
-      environment.apiEndpoint + `/app/clean/${date}`,
+      environment.apiEndpoint + `/app/clean/${date.toISODate()}`,
       { withCredentials: true }
     )
   }

src/app/util.ts

@@ -0,0 +1,29 @@
+import { DateFilterFn } from "@angular/material/datepicker"
+import { DateTime } from "luxon"
+
+export const weekendFilter: DateFilterFn<DateTime | null> = (
+  date: DateTime | null
+): boolean => {
+  const day = date?.weekday
+  return day !== 6 && day !== 7
+}
+
+export function filterLook(filter: DateFilterFn<DateTime | null>, ab: "ahead" | "behind" = "ahead", date: DateTime = DateTime.now(), maxSearchDays: number = 365): DateTime | null {
+  let currentDate = date
+  switch (ab) {
+    case "ahead":
+      for (let i = 0; i < maxSearchDays; i++) {
+        if (filter(currentDate)) return currentDate
+        currentDate = currentDate.plus({day: 1})
+      }
+      return null;
+    case "behind":
+      for (let i = 0; i < maxSearchDays; i++) {
+        if (filter(currentDate)) return currentDate
+        currentDate = currentDate.minus({day: 1})
+      }
+      return null;
+    default:
+      return null;
+  }
+}