From dd18c97daff609633700d4ba360d2f6f4440b7d6 Mon Sep 17 00:00:00 2001
From: Kai Moritz <kai@juplo.de>
Date: Sun, 25 Dec 2022 22:53:18 +0100
Subject: [PATCH] feat: A Username must not be empty

---
 src/app/user/user.component.html |  1 +
 src/app/user/user.component.ts   | 10 ++++++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/app/user/user.component.html b/src/app/user/user.component.html
index b640cfd6..3cfc8d3f 100644
--- a/src/app/user/user.component.html
+++ b/src/app/user/user.component.html
@@ -14,6 +14,7 @@
         <div *ngIf="usernameForm.errors?.['required']">
           Name is required.
         </div>
+        <div *ngIf="usernameForm.hasError('whitespace')">The username must not be empty</div>
       </div>
     </div>
     <button type="submit" class="btn btn-primary" (click)="updateName()" [disabled]="usernameForm.invalid">Pick Name</button>
diff --git a/src/app/user/user.component.ts b/src/app/user/user.component.ts
index 0ec30268..23817da3 100644
--- a/src/app/user/user.component.ts
+++ b/src/app/user/user.component.ts
@@ -11,16 +11,22 @@ import { UserService } from "../user.service";
 })
 export class UserComponent {
 
-  usernameForm = new FormControl('', Validators.required);
+  usernameForm = new FormControl('', [ Validators.required, this.noWhitespaceValidator ]);
 
   updateName(): void {
     var input = this.usernameForm.getRawValue();
     if (input !== null) {
-      this.userService.setUser(input);
+      this.userService.setUser(input.trim());
       this.router.navigate(['chatrooms'])
     }
   }
 
+  noWhitespaceValidator(control: FormControl) {
+    const isWhitespace = (control.value || '').trim().length === 0;
+    const isValid = !isWhitespace;
+    return isValid ? null : { 'whitespace': true };
+  }
+
   constructor(
     private userService: UserService,
     private router: Router) {}
-- 
2.20.1