Event filtering by start date

src/RunnersMeet.Client/src/app/events/event-search-params.ts

@@ -1,8 +1,11 @@
 import { HttpParams } from "@angular/common/http";
+import { DateTime } from "../datetime";
 
 export class EventSearchParams {
 	public owner?: string;
 	public filter?: string;
+	public fromDate?: Date = new Date();
+	public toDate?: Date;
 	public page: number = 0;
 
 	public toHttpParams(): HttpParams {
@@ -13,6 +16,12 @@ export class EventSearchParams {
 		if (this.filter) {
 			result = result.set('filter', this.filter);
 		}
+		if (this.fromDate) {
+			result = result.set('fromDate', new DateTime(this.fromDate).toDateString());
+		}
+		if (this.toDate) {
+			result = result.set('toDate', new DateTime(this.toDate).toDateString());
+		}
 		result = result.set('page', this.page);
 		return result;
 	}

src/RunnersMeet.Client/src/app/pages/events-page/events-page.component.html

@@ -1,5 +1,5 @@
 <p-panel header="Search Events">
-	<form class="vertical-form" (ngSubmit)="search($event)">
+	<form #mainForm="ngForm" class="vertical-form" (ngSubmit)="search(mainForm, $event)">
 		<div class="form-field form-field--full-width">
 			<span class="p-float-label p-input-icon-left">
 				<i class="pi pi-search"></i>
@@ -9,6 +9,25 @@
 			</span>
 		</div>
 
+		<div class="form-field">
+			<span class="p-float-label">
+				<p-calendar
+					inputId="fromDate" name="fromDate" [(ngModel)]="fromDate"
+					dateFormat="yy-mm-dd" [showIcon]="true"
+					[required]="true">
+				</p-calendar>
+				<label for="fromDate">Event Date From</label>
+			</span>
+			<span class="field-text">to</span>
+			<span class="p-float-label">
+				<p-calendar
+					inputId="toDate" name="toDate" [(ngModel)]="toDate"
+					dateFormat="yy-mm-dd" [showIcon]="true">
+				</p-calendar>
+				<label for="toDate">Until</label>
+			</span>
+		</div>
+
 		<div class="form-field">
 			<div class="field-checkbox">
 				<p-checkbox label="Show MY events" [binary]="true"

src/RunnersMeet.Client/src/app/pages/events-page/events-page.component.ts

@@ -1,5 +1,7 @@
 import { Component } from '@angular/core';
+import { NgForm } from '@angular/forms';
 import { Subject } from 'rxjs';
+import { DateTime } from 'src/app/datetime';
 import { EventsApiService } from 'src/app/events-api.service';
 import { EventSearchParams } from 'src/app/events/event-search-params';
 import { GroupEvent } from 'src/app/events/group-event';
@@ -16,6 +18,8 @@ export class EventsPageComponent {
 
 	public showMyEvents: boolean = false;
 	public titleFilter: string = '';
+	public fromDate: Date = new Date();
+	public toDate: Date | null = null;
 
 	private searchParams: EventSearchParams = new EventSearchParams();
 
@@ -25,11 +29,15 @@ export class EventsPageComponent {
 		this.updateEvents();
 	}
 
-	public search(event: SubmitEvent): void {
-		this.searchParams = new EventSearchParams();
-		this.searchParams.owner = this.showMyEvents ? 'me' : undefined;
-		this.searchParams.filter = this.titleFilter ? this.titleFilter : undefined;
-		this.updateEvents();
+	public search(form: NgForm, event: SubmitEvent): void {
+		if (form.valid) {
+			this.searchParams = new EventSearchParams();
+			this.searchParams.owner = this.showMyEvents ? 'me' : undefined;
+			this.searchParams.filter = this.titleFilter ? this.titleFilter : undefined;
+			this.searchParams.fromDate = this.fromDate;
+			this.searchParams.toDate = this.toDate ?? undefined;
+			this.updateEvents();
+		}
 	}
 
 	public loadMore(): void {

src/RunnersMeet.Client/src/styles.scss

@@ -61,6 +61,10 @@ body {
 	}
 }
 
+.field-text {
+	margin-top: 0.5em;
+}
+
 .form-field--full-width > * {
 	flex: 1 0 auto;
 }

src/RunnersMeet.Server/Domain/EventsRequest.cs

@@ -5,4 +5,6 @@ public sealed record EventsRequest
 	public int Page { get; init; }
 	public string? Owner { get; init; }
 	public string? Filter { get; init; }
+	public DateTime? FromDate { get; set; }
+	public DateTime? ToDate { get; set; }
 }

src/RunnersMeet.Server/Persistence/EventsQuery.cs

@@ -23,6 +23,8 @@ public class EventsQuery : IRequestHandler<EventsRequest, QueryPagingConfig, ILi
 		var query = _database.Events.Query().Include(e => e.Track);
 		query.WhereIf(request.Owner != null, e => e.Owner.UserId == request.Owner);
 		query.WhereIf(request.Filter != null, e => e.Title.Contains(request.Filter!));
+		query.WhereIf(request.FromDate != null, e => e.StartTime >= request.FromDate);
+		query.WhereIf(request.ToDate != null, e => e.StartTime < request.ToDate);
 
 		return query
 			.OrderBy(track => track.StartTime)