Align rent payment dialog validation (#55)

frontend/src/app/components/rent-payment-reversal-dialog/rent-payment-reversal-dialog.html

@@ -18,12 +18,20 @@
 				<textarea
 					matInput
 					rows="4"
-					maxlength="500"
 					formControlName="reason"
 					required
+					(input)="clearFieldError('reason')"
 				></textarea>
-				@if (form.controls.reason.invalid) {
+				@if (
+					form.controls.reason.hasError('required') ||
+					form.controls.reason.hasError('not_blank')
+				) {
 					<mat-error>Le motif est obligatoire.</mat-error>
+				} @else if (
+					form.controls.reason.hasError('maxlength') ||
+					form.controls.reason.hasError('size')
+				) {
+					<mat-error>Le motif ne peut pas dépasser 500 caractères.</mat-error>
 				}
 			</mat-form-field>
 		</fieldset>
@@ -33,12 +41,7 @@
 	</mat-dialog-content>
 	<mat-dialog-actions align="end">
 		<button mat-button mat-dialog-close type="button" [disabled]="saving()">Annuler</button>
-		<button
-			mat-flat-button
-			type="submit"
-			class="danger-action"
-			[disabled]="form.invalid || saving()"
-		>
+		<button mat-flat-button type="submit" class="danger-action" [disabled]="saving()">
 			@if (saving()) {
 				<mat-spinner diameter="18" aria-label="Contrepassation en cours" />
 			}